chroe:lint

frontend/src/App.tsx

@@ -58,7 +58,10 @@ const App = () => {
                           />
                         }
                       />
-                      <Route path="/collection/:id" element={<CollectionPage />}/>
+                      <Route
+                        path="/collection/:id"
+                        element={<CollectionPage />}
+                      />
                       <Route
                         path="/subscription"
                         element={

frontend/src/components/Audio.tsx

@@ -94,8 +94,8 @@ const AudioPlayer: React.FC<AudioPlayerProps> = ({
 
       // Clean up the event listeners on component unmount
       return () => {
-        audio.removeEventListener("timeupdate", () => { });
-        audio.removeEventListener("ended", () => { });
+        audio.removeEventListener("timeupdate", () => {});
+        audio.removeEventListener("ended", () => {});
       };
     }
   }, [handleTranscriptionNext]);
@@ -108,7 +108,7 @@ const AudioPlayer: React.FC<AudioPlayerProps> = ({
   }, [currentImage, index]);
 
   const handleKey = (event: KeyboardEvent) => {
-    if (event.key === ' ' || event.code === 'Space') {
+    if (event.key === " " || event.code === "Space") {
       // Prevent default action, e.g., scrolling
       event.preventDefault();
       togglePlayPause();
@@ -136,10 +136,11 @@ const AudioPlayer: React.FC<AudioPlayerProps> = ({
       <div className="flex items-center justify-center mt-4 space-x-6">
         <div className="flex gap-3">
           <button
-            className={`flex-1 flex justify-center p-2 rounded-full ${index === 0
+            className={`flex-1 flex justify-center p-2 rounded-full ${
+              index === 0
                 ? "bg-gray-300 text-gray-600 cursor-not-allowed"
                 : "bg-gray-500 text-white hover:bg-gray-400"
-              }`}
+            }`}
             onClick={handleTranscriptionPrev}
             disabled={index === 0}
           >
@@ -159,11 +160,12 @@ const AudioPlayer: React.FC<AudioPlayerProps> = ({
             <FaStop />
           </button>
           <button
-            className={`flex justify-center p-2 rounded-full ${index === currentImage.transcriptions.length - 1 ||
-                currentImage.transcriptions.length === 0
+            className={`flex justify-center p-2 rounded-full ${
+              index === currentImage.transcriptions.length - 1 ||
+              currentImage.transcriptions.length === 0
                 ? "bg-gray-300 text-gray-600 cursor-not-allowed"
                 : "bg-gray-500 text-white hover:bg-gray-400"
-              }`}
+            }`}
             onClick={handleTranscriptionNext}
             disabled={
               index === currentImage.transcriptions.length - 1 ||

frontend/src/components/collection/Edit.tsx

@@ -229,16 +229,16 @@ const CollectionEdit: React.FC<CollectionEditProps> = ({
               required
             />
           </div>
-          {collection &&
+          {collection && (
             <Book
               title={title}
               description={description}
               id={collection.id}
               featured_image={featured_image}
-            />}
+            />
+          )}
         </div>
-        {
-          collection &&
+        {collection && (
           <div className="flex justify-content-end w-full gap-2">
             <button
               className="bg-blue-500 text-white w-35 p-2 rounded hover:bg-blue-600"
@@ -268,7 +268,7 @@ const CollectionEdit: React.FC<CollectionEditProps> = ({
               {collection.publish_flag ? "Unpublish" : "Publish"}
             </button>
           </div>
-        }
+        )}
       </form>
       {/* <div className="flex gap-4">
           <button

frontend/src/components/collection/View.tsx

@@ -162,7 +162,11 @@ const CollectionView: React.FC<CollectionViewProps> = ({ collection }) => {
                 src={currentImage.image_url}
                 alt="Collection Image"
                 className="w-full select-none"
-                style={currentImage.transcriptions.length != 0 ? { marginBottom: "230px" } : {}}
+                style={
+                  currentImage.transcriptions.length != 0
+                    ? { marginBottom: "230px" }
+                    : {}
+                }
                 onClick={handlePhotoClick}
               />
             </div>
@@ -209,7 +213,9 @@ const CollectionView: React.FC<CollectionViewProps> = ({ collection }) => {
                       />
                     </>
                   ) : (
-                    <div className="h-8 flex flex-col items-center justify-center text-md"><span>No transcript</span></div>
+                    <div className="h-8 flex flex-col items-center justify-center text-md">
+                      <span>No transcript</span>
+                    </div>
                   )}
                 </div>
               </Container>

frontend/src/hooks/theme.tsx

@@ -1,11 +1,11 @@
+import throttle from "lodash/throttle";
 import {
   createContext,
   ReactNode,
   useContext,
   useEffect,
   useState,
 } from "react";
-import throttle from "lodash/throttle";
 
 type Theme = "light" | "dark";
 
@@ -62,7 +62,7 @@ export const ThemeProvider = (props: ThemeProviderProps) => {
     setThemeWithLocalStorage(theme);
   };
 
-  const scrollSpeed = 200; // Increase this value to make scrolling faster
+  // const scrollSpeed = 200; // Increase this value to make scrolling faster
 
   // useEffect(() => {
   //   const handleWheel = (event: WheelEvent) => {
@@ -82,40 +82,39 @@ export const ThemeProvider = (props: ThemeProviderProps) => {
   //   };
   // }, []); // Empty dependency array ensures this runs only on mount and unmount
 
-const handleKey = throttle((event: KeyboardEvent) => {
-  switch (event.key) {
-    case "ArrowUp":
-      window.scrollBy({
-        top: -600,
-        left: 0,
-        behavior: "smooth",
-      });
-      break;
-    case "ArrowDown":
-      window.scrollBy({
-        top: 600,
-        left: 0,
-        behavior: "smooth",
-      });
-      break;
-  }
-}, 300);
-
-useEffect(() => {
-  const throttledHandleKey = (event: KeyboardEvent) => {
-    if (event.key === "ArrowUp" || event.key === "ArrowDown") {
-      event.preventDefault(); // Prevent the default behavior for arrow keys.
-      handleKey(event);
+  const handleKey = throttle((event: KeyboardEvent) => {
+    switch (event.key) {
+      case "ArrowUp":
+        window.scrollBy({
+          top: -600,
+          left: 0,
+          behavior: "smooth",
+        });
+        break;
+      case "ArrowDown":
+        window.scrollBy({
+          top: 600,
+          left: 0,
+          behavior: "smooth",
+        });
+        break;
     }
-  }; // Adjust the throttle delay (200ms here) as needed.
-
-  window.addEventListener("keydown", throttledHandleKey);
-  return () => {
-    window.removeEventListener("keydown", throttledHandleKey);
-    handleKey.cancel(); // Clean up the throttling
-  };
-}, []);
+  }, 300);
 
+  useEffect(() => {
+    const throttledHandleKey = (event: KeyboardEvent) => {
+      if (event.key === "ArrowUp" || event.key === "ArrowDown") {
+        event.preventDefault(); // Prevent the default behavior for arrow keys.
+        handleKey(event);
+      }
+    }; // Adjust the throttle delay (200ms here) as needed.
+
+    window.addEventListener("keydown", throttledHandleKey);
+    return () => {
+      window.removeEventListener("keydown", throttledHandleKey);
+      handleKey.cancel(); // Clean up the throttling
+    };
+  }, []);
 
   useEffect(() => {
     document.body.setAttribute("data-bs-theme", theme);

frontend/src/pages/Collection.tsx

@@ -2,7 +2,6 @@ import CollectionEdit from "components/collection/Edit";
 import CollectionNew from "components/collection/New";
 import CollectionView from "components/collection/View";
 import { useAuth } from "contexts/AuthContext";
-import { useLoading } from "contexts/LoadingContext";
 import { useAlertQueue } from "hooks/alerts";
 import React, { useEffect, useMemo, useState } from "react";
 import { useLocation, useParams } from "react-router-dom";
@@ -14,9 +13,8 @@ const CollectionPage: React.FC = () => {
   const [collection, setCollection] = useState<Collection | undefined>(
     undefined,
   );
-  const { auth, client } = useAuth();
+  const { client } = useAuth();
   const { addAlert } = useAlertQueue();
-  const { startLoading, stopLoading } = useLoading();
   // Helper to check if it's an edit action
   const isEditAction = useMemo(
     () => location.search.includes("Action=edit"),

linguaphoto/api/collection.py

@@ -35,9 +35,7 @@ async def create(
 
 
 @router.get("/get_collection", response_model=Collection)
-async def getcollection(
-    id: str, collection_crud: CollectionCrud = Depends()
-) -> Collection:
+async def getcollection(id: str, collection_crud: CollectionCrud = Depends()) -> Collection:
     async with collection_crud:
         collection = await collection_crud.get_collection(id)
         if collection is None:

linguaphoto/api/image.py

@@ -43,9 +43,7 @@ async def upload_image(
 
 
 @router.get("/get_images", response_model=List[Image])
-async def get_images(
-    collection_id: str, image_crud: ImageCrud = Depends()
-) -> List[Image]:
+async def get_images(collection_id: str, image_crud: ImageCrud = Depends()) -> List[Image]:
     async with image_crud:
         images = await image_crud.get_images(collection_id=collection_id)
         return images

linguaphoto/crud/image.py

@@ -6,7 +6,6 @@
 from typing import List
 
 import requests
-from boto3.dynamodb.conditions import Key
 from fastapi import HTTPException, UploadFile
 from openai import AsyncOpenAI
 
@@ -70,7 +69,6 @@ async def create_audio(self, audio_source: BytesIO) -> str:
         return s3_url
 
     async def get_images(self, collection_id: str) -> List[Image]:
-        # images = await self._get_items_from_secondary_index("user", user_id, Image, Key("collection").eq(collection_id))
         images = await self._list_items(
             item_class=Image,
             filter_expression="#collection=:collection",

linguaphoto/main.py

@@ -4,7 +4,6 @@
 import uvicorn
 from fastapi import FastAPI
 from fastapi.middleware.cors import CORSMiddleware
-import socketio
 
 from linguaphoto.api.api import router
 from linguaphoto.socket_manager import (

linguaphoto/socket_manager.py

@@ -7,9 +7,7 @@
 # Create a new Socket.IO server with CORS enabled
 sio = socketio.AsyncServer(
     async_mode="asgi",
-    cors_allowed_origins=[
-        settings.homepage_url
-    ],  # Update this to match your frontend URL
+    cors_allowed_origins=[settings.homepage_url],  # Update this to match your frontend URL
 )
 # Dictionary to store connected users by their socket ID
 connected_users: dict[str, str] = {}