Improve/start analysis

package.json

@@ -17,9 +17,10 @@
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@hookform/resolvers": "^3.9.0",
+    "@radix-ui/react-accordion": "^1.2.3",
     "@radix-ui/react-avatar": "^1.1.1",
     "@radix-ui/react-checkbox": "^1.1.2",
-    "@radix-ui/react-dialog": "^1.1.2",
+    "@radix-ui/react-dialog": "^1.1.6",
     "@radix-ui/react-dropdown-menu": "^2.1.2",
     "@radix-ui/react-label": "^2.1.0",
     "@radix-ui/react-navigation-menu": "^1.2.1",

src/api/database.ts

@@ -1,5 +1,6 @@
-import { apiAuthenticated } from '@/api/index.ts';
+// import { apiAuthenticated } from '@/api/index.ts';
+import axios from 'axios';
 
 export const queryPosition = async (fen: string) => {
-  return await apiAuthenticated.get(`/pos?fen=${fen}`);
+  return await axios.get(`http://127.0.0.1:3001/pos?fen=${fen}`);
 };

src/components/ui/accordion.tsx

@@ -0,0 +1,53 @@
+import * as React from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { ChevronDown } from 'lucide-react';
+
+import { cn } from '@/lib/utils';
+
+const Accordion = AccordionPrimitive.Root;
+
+const AccordionItem = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
+>(({ className, ...props }, ref) => <AccordionPrimitive.Item ref={ref} className={cn(className)} {...props} />);
+AccordionItem.displayName = 'AccordionItem';
+
+const AccordionTrigger = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Header className="flex">
+    <AccordionPrimitive.Trigger
+      ref={ref}
+      className={cn(
+        'flex flex-1 items-center justify-between bg-gradient-to-br from-castled-secondary/30 to-castled-secondary rounded-t-xl [&[data-state=closed]]:rounded-b-xl  p-3 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180',
+        className,
+      )}
+      {...props}
+    >
+      {children}
+      <ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200" />
+    </AccordionPrimitive.Trigger>
+  </AccordionPrimitive.Header>
+));
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
+
+const AccordionContent = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Content
+    ref={ref}
+    className={cn(
+      'overflow-hidden border rounded-b-xl p-3 space-y-3 py-3 text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down',
+      className,
+    )}
+    {...props}
+  >
+    {children}
+  </AccordionPrimitive.Content>
+));
+
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
+
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

src/i18n/locales/en/analysis.json

@@ -9,7 +9,15 @@
     "startAnalysis": "Go!",
     "searchPlayer": "Search player...",
     "noResults": "No results found",
-    "noGameSelected": "No game selected"
+    "noGameSelected": "No game selected",
+    "hashSizeTitle": "Hash Size",
+    "hashSizeDescription": "The amount of memory the engine should use for its hash table (more memory = better performance).",
+    "timePerMove": "Time per move",
+    "timePerMoveDescription": "The amount of time the engine should spend on each move.",
+    "depthPerMove": "Depth per move",
+    "depthPerMoveDescription": "The maximum depth the engine should search for each move.",
+    "advancedOptions": "Advanced Options",
+    "advancedOptionsDescription": "Configure the analysis engine's settings."
   },
   "flipBoard": "Flip board"
 }

src/i18n/locales/fr/analysis.json

@@ -9,7 +9,15 @@
     "startAnalysis": "Go!",
     "searchPlayer": "Rechercher un joueur...",
     "noResults": "Aucun résultat trouvé",
-    "noGameSelected": "Aucune partie sélectionnée"
+    "noGameSelected": "Aucune partie sélectionnée",
+    "hashSizeTitle": "Taille du hash",
+    "hashSizeDescription": "La quantité de mémoire que le moteur doit utiliser pour sa table de hash (plus de mémoire = meilleures performances).",
+    "timePerMove": "Temps par coup",
+    "timePerMoveDescription": "La quantité de temps que le moteur doit passer sur chaque.",
+    "depthPerMove": "Profondeur par coup",
+    "depthPerMoveDescription": "La profondeur maximale que le moteur doit rechercher pour chaque coup.",
+    "advancedOptions": "Options avancées",
+    "advancedOptionsDescription": "Configurer les paramètres du moteur d'analyse."
   },
   "flipBoard": "Retourner l'échiquier"
 }

src/lib/analysis.ts

@@ -1,6 +1,6 @@
 import { z } from 'zod';
 import { AnalysisMove, AnalysisMoveClassification, InfoResult } from '@/types/analysis.ts';
-import { StartAnalysisFormSchema } from '@/schema/analysis.ts';
+import { AnalysisMethod, StartAnalysisFormSchema } from '@/schema/analysis.ts';
 import { Move } from 'chess.js';
 import { StockfishService } from '@/services/stockfish/stockfish.service.ts';
 import { UciParserService } from '@/services/stockfish/uci-parser.service.ts';
@@ -72,8 +72,17 @@ export const analyseMovesLocal = ({
   data,
   reportProgress,
 }: AnalyseMovesLocalParams): Promise<AnalysisMove>[] => {
-  const stockfish = new StockfishService({ engine: data.engine, threads: data.threads });
+  const stockfish = new StockfishService({
+    engine: data.engine,
+    threads: data.threads,
+    hashSize: data.analysisSettings.hashSize,
+    enableLogs: true,
+  });
   const parser = new UciParserService();
+  const goCommand =
+    data.analysisSettings.method === AnalysisMethod.TIME_PER_MOVE
+      ? `go movetime ${data.analysisSettings.time * 1000}`
+      : `go depth ${data.analysisSettings.depth}`;
 
   return moves.map(
     async ({ move, fen }) =>
@@ -85,7 +94,7 @@ export const analyseMovesLocal = ({
         });
 
         stockfish.pushCommand({
-          command: `go movetime 100`,
+          command: goCommand,
           callback: (data) => {
             const result = parser.parse(data, move.color === 'w');
 

src/pages/dashboard/dashboard.tsx

@@ -24,9 +24,11 @@ export const Dashboard = () => {
   }
 
   return (
-    <div className="container h-full p-16 flex flex-col gap-4 content-center">
-      <p className="text-4xl">{t('title')}</p>
-      <DataTable columns={columns} data={data || []} />
+    <div className="w-full h-full p-16 flex content-center">
+      <div className="container flex flex-col gap-4 overflow-y-auto">
+        <p className="text-4xl">{t('title')}</p>
+        <DataTable columns={columns} data={data || []} />
+      </div>
     </div>
   );
 };

src/pages/start-analysis/chesscom-select.tsx

@@ -23,6 +23,7 @@ import { CaptionLabelProps, DateRange } from 'react-day-picker';
 import { useTranslation } from 'react-i18next';
 
 type ChesscomSelectProps = {
+  isLoading: boolean;
   form: UseFormReturn<z.infer<typeof StartAnalysisFormSchema>>;
 };
 
@@ -80,7 +81,7 @@ const CustomDateCaptionLabel = ({
 
 const MAX_RANGE_DAYS = 31;
 
-export const ChesscomSelect = ({ form }: ChesscomSelectProps) => {
+export const ChesscomSelect = ({ form, isLoading }: ChesscomSelectProps) => {
   const { t } = useTranslation('analysis', { keyPrefix: 'newAnalysis' });
   const [games, setGames] = useState<ChessComGame[]>([]);
   const [seachOpen, setSearchOpen] = useState(false);
@@ -147,7 +148,7 @@ export const ChesscomSelect = ({ form }: ChesscomSelectProps) => {
   return (
     <>
       <Popover open={seachOpen} onOpenChange={setSearchOpen}>
-        <PopoverTrigger id="chesscom-search" asChild>
+        <PopoverTrigger disabled={isLoading} id="chesscom-search" asChild>
           <Button variant="secondary" role="combobox" aria-expanded={seachOpen} className="justify-between w-full">
             <ChesscomGame game={games.find((game) => game.uuid === selectedGame)} />
             <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
@@ -159,10 +160,10 @@ export const ChesscomSelect = ({ form }: ChesscomSelectProps) => {
             onChange={(e: React.ChangeEvent<HTMLInputElement>) => debouncedSearchGames(e.target.value)}
             shouldFilter={false}
           >
-            <CommandInput placeholder={t('searchPlayer')} />
+            <CommandInput disabled={isLoading} placeholder={t('searchPlayer')} />
 
             <Popover open={dateOpen} onOpenChange={setDateOpen}>
-              <PopoverTrigger id="chesscom-search-date" asChild>
+              <PopoverTrigger disabled={isLoading} id="chesscom-search-date" asChild>
                 <Button variant="ghost" role="combobox" aria-expanded={seachOpen} className="justify-between w-full">
                   From {dateRange?.from?.toLocaleDateString()} to {dateRange?.to?.toLocaleDateString()}
                   <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
@@ -213,7 +214,7 @@ export const ChesscomSelect = ({ form }: ChesscomSelectProps) => {
           disabled
           spellCheck="false"
           id="pgn"
-          className="h-56 resize-none custom-scrollbar"
+          className="h-full resize-none custom-scrollbar"
           value={games.find((g) => g.uuid === selectedGame)?.pgn}
         />
       )}

src/pages/start-analysis/lichessorg-select.tsx

@@ -23,6 +23,7 @@ import { Calendar } from '@/components/ui/calendar.tsx';
 import { useTranslation } from 'react-i18next';
 
 type ChesscomSelectProps = {
+  isLoading: boolean;
   form: UseFormReturn<z.infer<typeof StartAnalysisFormSchema>>;
 };
 
@@ -108,7 +109,7 @@ const CustomDateCaptionLabel = ({
 
 const MAX_RANGE_DAYS = 31;
 
-export const LichessorgSelect = ({ form }: ChesscomSelectProps) => {
+export const LichessorgSelect = ({ form, isLoading }: ChesscomSelectProps) => {
   const { t } = useTranslation('analysis', { keyPrefix: 'newAnalysis' });
   const [games, setGames] = useState<LichessOrgGame[]>([]);
   const [seachOpen, setSearchOpen] = useState(false);
@@ -189,7 +190,7 @@ export const LichessorgSelect = ({ form }: ChesscomSelectProps) => {
   return (
     <>
       <Popover open={seachOpen} onOpenChange={setSearchOpen}>
-        <PopoverTrigger id="lichessorg-search" asChild>
+        <PopoverTrigger disabled={isLoading} id="lichessorg-search" asChild>
           <Button variant="secondary" role="combobox" aria-expanded={seachOpen} className="justify-between w-full">
             <LichessorgGame game={games.find((game) => game.id === selectedGame)} />
             <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
@@ -218,7 +219,7 @@ export const LichessorgSelect = ({ form }: ChesscomSelectProps) => {
                 />
 
                 <Popover open={dateOpen} onOpenChange={setDateOpen}>
-                  <PopoverTrigger id="lichessorg-search-date" asChild>
+                  <PopoverTrigger disabled={isLoading} id="lichessorg-search-date" asChild>
                     <Button
                       variant="ghost"
                       role="combobox"
@@ -270,7 +271,7 @@ export const LichessorgSelect = ({ form }: ChesscomSelectProps) => {
               </>
             ) : (
               <>
-                <CommandInput placeholder={t('searchPlayer')} />
+                <CommandInput disabled={isLoading} placeholder={t('searchPlayer')} />
                 <CommandList className="custom-scrollbar">
                   <CommandGroup>
                     {autoCompletedUsernames.map((username) => (
@@ -299,7 +300,7 @@ export const LichessorgSelect = ({ form }: ChesscomSelectProps) => {
           disabled
           spellCheck="false"
           id="pgn"
-          className="h-56 resize-none custom-scrollbar"
+          className="h-full resize-none custom-scrollbar"
           value={games.find((g) => g.id === selectedGame)?.pgn}
         />
       )}