Fix UI bugs, update CI, update gitignore

.forgejo/workflows/build.yml

@@ -16,10 +16,13 @@ jobs:
         run: |
           echo "${{ secrets.FORGEJO_PAT }}" | docker login git.elijahkuntz.com -u "${{ gitea.actor }}" --password-stdin
 
-      - name: Build and Push Image
+      - name: Build and Push Images
         run: |
           # Force the entire image path string to lowercase dynamically
-          IMAGE_PATH=$(echo "git.elijahkuntz.com/${{ gitea.actor }}/${{ github.event.repository.name }}:latest" | tr '[:upper:]' '[:lower:]')
+          BASE_IMAGE_PATH=$(echo "git.elijahkuntz.com/${{ gitea.actor }}/${{ github.event.repository.name }}" | tr '[:upper:]' '[:lower:]')
           
-          docker build -t "$IMAGE_PATH" .
+          docker build -t "${BASE_IMAGE_PATH}-frontend:latest" ./frontend
-          docker push "$IMAGE_PATH"
+          docker push "${BASE_IMAGE_PATH}-frontend:latest"
+
+          docker build -t "${BASE_IMAGE_PATH}-backend:latest" ./backend
+          docker push "${BASE_IMAGE_PATH}-backend:latest"

.gitignore

@@ -11,3 +11,16 @@ build/
 out/
 
 # Local application run data
+backend/storage/
+backend/data/
+.uploads/
+test/
+test*/
+Textbooks/
+*.pdf
+*.jpg
+*.jpeg
+*.png
+*.mp4
+*.mkv
+*.mov

frontend/src/components/FileExplorer.tsx

@@ -115,7 +115,7 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
   const loadMoveFolders = useCallback(async (path: string) => {
     try {
       const data = await api.listDirectory(path);
-      setMoveFolders(data.files?.filter((f: FileItem) => f.is_dir).sort((a: FileItem, b: FileItem) => a.name.localeCompare(b.name)) || []);
+      setMoveFolders(data.files?.filter((f: FileItem) => f.is_dir && f.name !== '.uploads').sort((a: FileItem, b: FileItem) => a.name.localeCompare(b.name)) || []);
     } catch {
       setMoveFolders([]);
     }
@@ -425,27 +425,25 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
       );
     }
     
-    if (isImage) {
-      return (
-        <div className={`${large ? 'w-12 h-12 rounded-lg' : 'w-6 h-6 rounded'} flex items-center justify-center shadow-sm text-white bg-[#3b82f6]`}>
-          <ImageIcon className={large ? "w-6 h-6 text-white" : "w-3.5 h-3.5 text-white"} />
-        </div>
-      );
-    }
-
-    if (isVideo) {
-      return (
-        <div className={`${large ? 'w-12 h-12 rounded-lg' : 'w-6 h-6 rounded'} flex items-center justify-center shadow-sm text-white bg-[#a855f7]`}>
-          <FilmIcon className={large ? "w-6 h-6 text-white" : "w-3.5 h-3.5 text-white"} />
-        </div>
-      );
-    }
-
     const fallbackIcon = (() => {
+      if (isImage) {
+        return (
+          <div className={`${large ? 'w-12 h-12 rounded-lg' : 'w-6 h-6 rounded'} flex items-center justify-center shadow-sm text-white bg-[#3b82f6]`}>
+            <ImageIcon className={large ? "w-6 h-6 text-white" : "w-3.5 h-3.5 text-white"} />
+          </div>
+        );
+      }
+
+      if (isVideo) {
+        return (
+          <div className={`${large ? 'w-12 h-12 rounded-lg' : 'w-6 h-6 rounded'} flex items-center justify-center shadow-sm text-white bg-[#a855f7]`}>
+            <FilmIcon className={large ? "w-6 h-6 text-white" : "w-3.5 h-3.5 text-white"} />
+          </div>
+        );
+      }
+
       let color = 'var(--color-text-tertiary)';
-      if (['jpg', 'jpeg', 'png', 'gif', 'webp', 'svg'].includes(ext)) color = '#f59e0b';
+      if (['mp3', 'wav', 'flac', 'ogg', 'm4a'].includes(ext)) color = '#22c55e';
-      else if (['mp4', 'mkv', 'avi', 'mov', 'webm'].includes(ext)) color = '#ef4444';
-      else if (['mp3', 'wav', 'flac', 'ogg', 'm4a'].includes(ext)) color = '#22c55e';
       else if (['zip', 'tar', 'gz', 'rar', '7z'].includes(ext)) color = '#8b5cf6';
       else if (['js', 'ts', 'py', 'go', 'rs', 'md', 'txt'].includes(ext)) color = '#3b82f6';
       return <File className={`${sizeClass} fallback-icon`} style={{ color }} />;
@@ -789,7 +787,7 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
                     placeholder="Folder name"
                     autoFocus
                     className="flex-1 bg-transparent text-sm outline-none border-none ring-0"
-                    style={{ color: 'var(--color-text-primary)' }}
+                    style={{ color: 'var(--color-text-primary)', outline: 'none', boxShadow: 'none' }}
                   />
                   <button onClick={handleCreateFolder}>
                     <Check className="w-4 h-4" style={{ color: 'var(--color-success)' }} />
@@ -1141,6 +1139,17 @@ export default function FileExplorer({ onLogout }: FileExplorerProps) {
               >
                 <Download className="w-4 h-4" />
               </button>
+              <button
+                className="p-2 hover:bg-white/5 rounded-lg transition-colors flex items-center gap-2 text-sm"
+                style={{ color: 'var(--color-text-primary)' }}
+                onClick={() => {
+                  setMovingFiles(Array.from(selectedFiles));
+                  setMoveModalPath('.');
+                  setShowMoveModal(true);
+                }}
+              >
+                <Move className="w-4 h-4" />
+              </button>
               <button
                 className="p-2 hover:bg-red-500/10 rounded-lg transition-colors flex items-center gap-2 text-sm text-red-500"
                 onClick={async () => {