Merge pull request #163 from agrawalshreyansh/main

Initially 0 albums loading error fixed
AOSSIE-Org · Jan 3, 2025 · f59149b · f59149b
2 parents ca49e1b + 4da1029
commit f59149b
Show file tree

Hide file tree

Showing 5 changed files with 74 additions and 48 deletions.
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -48,7 +48,7 @@
     "postcss": "^8.4.39",
     "prettier": "^3.3.3",
     "prettier-plugin-tailwindcss": "^0.6.8",
-    "tailwindcss": "^3.4.4",
+    "tailwindcss": "^3.4.17",
     "typescript": "^5.1.6",
     "vite": "^5.0.0",
     "vite-plugin-eslint": "^1.8.1"

diff --git a/frontend/src/components/AITagging/AIgallery.tsx b/frontend/src/components/AITagging/AIgallery.tsx
@@ -174,3 +174,4 @@ const [pageNo,setpageNo] = useState<number>(20);
     </div>
   );
 }
+
diff --git a/frontend/src/components/Album/Album.tsx b/frontend/src/components/Album/Album.tsx
@@ -7,20 +7,26 @@ import ErrorDialog from './Error';
 import AlbumView from './Albumview';
 import { Album } from '@/types/Album';
 import { SquarePlus } from 'lucide-react';
+import { LoadingScreen } from '@/components/ui/LoadingScreen/LoadingScreen';
 import { usePictoMutation, usePictoQuery } from '@/hooks/useQueryExtensio';
 import {
   deleteAlbums,
   fetchAllAlbums,
 } from '../../../api/api-functions/albums';
+
 const AlbumsView: React.FC = () => {
-  const { successData: albums, isLoading} = usePictoQuery({
+
+  const { successData: albums, isLoading, error } = usePictoQuery({
+
     queryFn: fetchAllAlbums,
     queryKey: ['all-albums'],
   });
+
   const { mutate: deleteAlbum } = usePictoMutation({
     mutationFn: deleteAlbums,
     autoInvalidateTags: ['all-albums'],
   });
+
   const [isCreateFormOpen, setIsCreateFormOpen] = useState(false);
   const [editingAlbum, setEditingAlbum] = useState<Album | null>(null);
   const [currentAlbum, setCurrentAlbum] = useState<string | null>(null);
@@ -29,16 +35,13 @@ const AlbumsView: React.FC = () => {
     description: string;
   } | null>(null);
 
+
   if (isLoading) {
-    return <div>Loading albums...</div>;
+    return <LoadingScreen/>;
   }
-  const showErrorDialog = (title: string, err: unknown) => {
-    setErrorDialogContent({
-      title,
-      description: err instanceof Error ? err.message : 'An unknown error occurred',
-    });
-  };
-  if ( !albums || albums.length === 0) {
+
+  if (!albums || albums.length === 0) {
+
     return (
       <div className="container mx-auto pb-4">
         <div className="mb-4 flex items-center justify-between">
@@ -58,7 +61,10 @@ const AlbumsView: React.FC = () => {
           onSuccess={() => {
             setIsCreateFormOpen(false);
           }}
-          onError={(err)=>showErrorDialog("Error",err)}
+
+          onError={(err) => showErrorDialog("Error", err)}
+
+
         />
         <ErrorDialog
           content={errorDialogContent}
@@ -87,6 +93,32 @@ const AlbumsView: React.FC = () => {
     }
   };
 
+  const showErrorDialog = (title: string, err: unknown) => {
+    setErrorDialogContent({
+      title,
+      description: err instanceof Error ? err.message : 'An unknown error occurred',
+    });
+  };
+
+  const transformedAlbums = albums.map((album: Album) => ({
+    id: album.album_name,
+    title: album.album_name,
+    coverImage: album.image_paths[0] || '',
+    imageCount: album.image_paths.length,
+  }));
+
+  const handleAlbumClick = (albumId: string) => {
+    setCurrentAlbum(albumId);
+  };
+
+  const handleDeleteAlbum = async (albumId: string) => {
+    try {
+      await deleteAlbum({ name: albumId });
+    } catch (err) {
+      showErrorDialog('Error Deleting Album', err);
+    }
+  };
+
   return (
     <div className="mx-auto w-full px-2 pb-4">
       {currentAlbum ? (
@@ -131,7 +163,7 @@ const AlbumsView: React.FC = () => {
         onSuccess={() => {
           setIsCreateFormOpen(false);
         }}
-        onError={showErrorDialog}
+        onError={(err) => showErrorDialog("Error", err)}
       />
 
       <EditAlbumDialog
@@ -152,3 +184,4 @@ const AlbumsView: React.FC = () => {
 };
 
 export default AlbumsView;
+
diff --git a/frontend/src/components/Navigation/Navbar/Navbar.tsx b/frontend/src/components/Navigation/Navbar/Navbar.tsx
@@ -6,7 +6,8 @@ export function Navbar(props: { title?: string }) {
       <div className="bg-theme-light mb-4 mt-3 flex h-16 items-center justify-between rounded-2xl border border-gray-200 px-4 sm:px-8 md:px-16 shadow-md backdrop-blur-md backdrop-saturate-150 dark:border-white/10 dark:bg-white/5 w-[90%] sm:w-[70%] md:w-[55%]">
         <div className="flex items-center gap-2 sm:gap-4">
           <div className="flex items-center gap-2">
-            <img src="/PictoPy_Logo.png" className="h-7" alt="PictoPy Logo" />
+            <img src="/public/PictoPy_Logo.png" className="h-7" alt="PictoPy Logo" />
+
             <span className="text-theme-dark dark:text-theme-light font-sans text-base sm:text-lg font-bold drop-shadow-sm">
               PictoPy
             </span>
Original file line number	Diff line number	Diff line change
Expand Up		@@ -174,3 +174,4 @@ const [pageNo,setpageNo] = useState<number>(20);
		</div>
		);
		}