Lint

simonkellly · May 29, 2024 · fe88ceb · fe88ceb
1 parent e3edd7d
commit fe88ceb
Show file tree

Hide file tree

Showing 9 changed files with 106 additions and 66 deletions.
diff --git a/src/components/ui/table.tsx b/src/components/ui/table.tsx
@@ -1,6 +1,5 @@
-import * as React from "react"
-
-import { cn } from "@/lib/utils"
+import * as React from 'react';
+import { cn } from '@/lib/utils';
 
 const Table = React.forwardRef<
   HTMLTableElement,
@@ -9,32 +8,32 @@ const Table = React.forwardRef<
   <div className="relative w-full overflow-auto">
     <table
       ref={ref}
-      className={cn("w-full caption-bottom text-sm", className)}
+      className={cn('w-full caption-bottom text-sm', className)}
       {...props}
     />
   </div>
-))
-Table.displayName = "Table"
+));
+Table.displayName = 'Table';
 
 const TableHeader = React.forwardRef<
   HTMLTableSectionElement,
   React.HTMLAttributes<HTMLTableSectionElement>
 >(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
-))
-TableHeader.displayName = "TableHeader"
+  <thead ref={ref} className={cn('[&_tr]:border-b', className)} {...props} />
+));
+TableHeader.displayName = 'TableHeader';
 
 const TableBody = React.forwardRef<
   HTMLTableSectionElement,
   React.HTMLAttributes<HTMLTableSectionElement>
 >(({ className, ...props }, ref) => (
   <tbody
     ref={ref}
-    className={cn("[&_tr:last-child]:border-0", className)}
+    className={cn('[&_tr:last-child]:border-0', className)}
     {...props}
   />
-))
-TableBody.displayName = "TableBody"
+));
+TableBody.displayName = 'TableBody';
 
 const TableFooter = React.forwardRef<
   HTMLTableSectionElement,
@@ -43,13 +42,13 @@ const TableFooter = React.forwardRef<
   <tfoot
     ref={ref}
     className={cn(
-      "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
+      'border-t bg-muted/50 font-medium [&>tr]:last:border-b-0',
       className
     )}
     {...props}
   />
-))
-TableFooter.displayName = "TableFooter"
+));
+TableFooter.displayName = 'TableFooter';
 
 const TableRow = React.forwardRef<
   HTMLTableRowElement,
@@ -58,13 +57,13 @@ const TableRow = React.forwardRef<
   <tr
     ref={ref}
     className={cn(
-      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
+      'border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted',
       className
     )}
     {...props}
   />
-))
-TableRow.displayName = "TableRow"
+));
+TableRow.displayName = 'TableRow';
 
 const TableHead = React.forwardRef<
   HTMLTableCellElement,
@@ -73,37 +72,37 @@ const TableHead = React.forwardRef<
   <th
     ref={ref}
     className={cn(
-      "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
+      'h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0',
       className
     )}
     {...props}
   />
-))
-TableHead.displayName = "TableHead"
+));
+TableHead.displayName = 'TableHead';
 
 const TableCell = React.forwardRef<
   HTMLTableCellElement,
   React.TdHTMLAttributes<HTMLTableCellElement>
 >(({ className, ...props }, ref) => (
   <td
     ref={ref}
-    className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
+    className={cn('p-4 align-middle [&:has([role=checkbox])]:pr-0', className)}
     {...props}
   />
-))
-TableCell.displayName = "TableCell"
+));
+TableCell.displayName = 'TableCell';
 
 const TableCaption = React.forwardRef<
   HTMLTableCaptionElement,
   React.HTMLAttributes<HTMLTableCaptionElement>
 >(({ className, ...props }, ref) => (
   <caption
     ref={ref}
-    className={cn("mt-4 text-sm text-muted-foreground", className)}
+    className={cn('mt-4 text-sm text-muted-foreground', className)}
     {...props}
   />
-))
-TableCaption.displayName = "TableCaption"
+));
+TableCaption.displayName = 'TableCaption';
 
 export {
   Table,
@@ -114,4 +113,4 @@ export {
   TableRow,
   TableCell,
   TableCaption,
-}
+};
diff --git a/src/lib/analysis/dnfAnalyser.ts b/src/lib/analysis/dnfAnalyser.ts
@@ -15,9 +15,10 @@ export enum AnalysisResult {
   SOLVED = 'Solved',
   PLUS_TWO = '+2',
   UNKNOWN = 'Unknown',
-  ONE_MOVE = 'One Move Mistake',
-  MISSED_TWIST_FLIP = 'Missed Twist or Flip',
-  INVERSE_ALG = 'Inverse Alg',
+  NO_MOVES = 'No recorded moves',
+  ONE_MOVE = 'One move mistake',
+  MISSED_TWIST_FLIP = 'Missed twist or flip',
+  INVERSE_ALG = 'Inverse alg',
 }
 
 function check1MoveOff(
@@ -158,6 +159,8 @@ export async function analyseSolve(
   const parsedSolution = await extractAlgs(solutionMoves);
   const actualComms = parsedSolution.map(s => makeAlgToComm(s, puzzle));
 
+  if (solutionMoves.length == 0) return [AnalysisResult.NO_MOVES, actualComms];
+
   if (checkIsSolved(solvedState.toKPattern()))
     return [AnalysisResult.SOLVED, actualComms];
 

diff --git a/src/lib/analysis/solutionParser.ts b/src/lib/analysis/solutionParser.ts
@@ -448,15 +448,16 @@ export async function extractAlgs(
     ];
   });
 
-
   let startingIdx = solutionLength - 1 - (inverseAlgs.at(-1)?.[2] ?? 0);
 
   let last = 0;
-  const lengths = inverseAlgs.map(val => {
-    const ret = val[2] - last;
-    last = val[2];
-    return ret;
-  }).reverse();
+  const lengths = inverseAlgs
+    .map(val => {
+      const ret = val[2] - last;
+      last = val[2];
+      return ret;
+    })
+    .reverse();
 
   inverseAlgs = inverseAlgs.reverse().map((val, idx) => {
     const actualAlg = new Alg(val[0]).invert().toString();

diff --git a/src/lib/db.ts b/src/lib/db.ts
@@ -1,7 +1,7 @@
 import Dexie, { Table } from 'dexie';
 import { GanCubeMove } from 'gan-web-bluetooth';
-import { ExtractedAlg } from './analysis/solutionParser';
 import { AnalysisResult } from './analysis/dnfAnalyser';
+import { ExtractedAlg } from './analysis/solutionParser';
 
 export enum Penalty {
   SOLVED = 0,

diff --git a/src/main.tsx b/src/main.tsx
@@ -36,12 +36,12 @@ if (!rootElement.innerHTML) {
   const root = ReactDOM.createRoot(rootElement);
   root.render(
     // <StrictMode>
-      <ThemeProvider>
-        <TooltipProvider>
-          <RouterProvider router={router} />
-          <Toaster />
-        </TooltipProvider>
-      </ThemeProvider>
+    <ThemeProvider>
+      <TooltipProvider>
+        <RouterProvider router={router} />
+        <Toaster />
+      </TooltipProvider>
+    </ThemeProvider>
     // </StrictMode>
   );
 }
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
@@ -12,6 +12,7 @@ import {
   CardTitle,
 } from '@/components/ui/card';
 import { Checkbox } from '@/components/ui/checkbox';
+import { db } from '@/lib/db';
 import bldNinjaLogo from '/bldninja-logo-v1.svg';
 
 export const Route = createFileRoute('/')({
@@ -67,6 +68,12 @@ function ThemeToggle() {
   );
 }
 
+function resetData() {
+  db.delete();
+  db.open();
+  localStorage.clear();
+}
+
 function Index() {
   return (
     <main className="flex flex-col h-dvh w-screen items-center justify-center container">
@@ -91,6 +98,14 @@ function Index() {
             .
           </p>
           <br />
+          <p>
+            If you want to reset all data then click{' '}
+            <button className="underline" onClick={resetData}>
+              <span>here</span>
+            </button>
+            .
+          </p>
+          <br />
           <p>
             This project is open source! The source is hosted on our{' '}
             <a

diff --git a/src/timer/algTable.tsx b/src/timer/algTable.tsx
@@ -1,29 +1,32 @@
-import DrawScramble from "@/components/cubing/drawScramble";
-import { ScrollArea } from "@/components/ui/scroll-area"
+import DrawScramble from '@/components/cubing/drawScramble';
+import { ScrollArea } from '@/components/ui/scroll-area';
 import {
   Table,
   TableBody,
   TableCell,
   TableHead,
   TableHeader,
   TableRow,
-} from "@/components/ui/table"
-import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
-import { Solve } from "@/lib/db"
+} from '@/components/ui/table';
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from '@/components/ui/tooltip';
+import { Solve } from '@/lib/db';
 
 export function AlgTable({ solve }: { solve: Solve }) {
   const solutionStr = solve.solution.map(s => s.move).join(' ');
 
-  if (!solve.algs) return (
-    <ul className="rounded-md border p-2">
-      <li className="font-medium">Algs in solve:</li>
-      <ScrollArea className="h-64">
-        {solutionStr}
-      </ScrollArea>
-    </ul>
-  );
+  if (!solve.algs)
+    return (
+      <ul className="rounded-md border p-2">
+        <li className="font-medium">Algs in solve:</li>
+        <ScrollArea className="h-64">{solutionStr}</ScrollArea>
+      </ul>
+    );
 
-  let time = solve.solution[0].cubeTimestamp;
+  let time = solve.solution[0]?.cubeTimestamp ?? 0;
 
   return (
     <ScrollArea className="h-64 w-full rounded-md border">
@@ -36,9 +39,10 @@ export function AlgTable({ solve }: { solve: Solve }) {
           </TableRow>
         </TableHeader>
         <TableBody>
-          {solve.algs.map((alg) => {
+          {solve.algs.map(alg => {
             const moveIdx = alg[2];
-            const algTime = (solve.solution[moveIdx]?.cubeTimestamp - time) / 1000;
+            const algTime =
+              (solve.solution[moveIdx]?.cubeTimestamp - time) / 1000;
             time = solve.solution[moveIdx]?.cubeTimestamp;
 
             return (
@@ -63,5 +67,5 @@ export function AlgTable({ solve }: { solve: Solve }) {
         </TableBody>
       </Table>
     </ScrollArea>
-  )
+  );
 }
diff --git a/src/timer/resultsCard.tsx b/src/timer/resultsCard.tsx
@@ -74,17 +74,27 @@ function SolveDialog({
       alg: solve.algs?.join('\n') || solutionStr,
     }).toString();
 
+  const exec = solve.solution[0]?.localTimestamp
+    ? solve.now - solve.solution[0].localTimestamp
+    : undefined;
+  const memo = exec ? solve.time - exec : undefined;
+
   return (
     <Dialog open={true} onOpenChange={close}>
-      <DialogContent className="sm:mgax-w-[425px]">
+      <DialogContent>
         <DialogHeader>
           <DialogTitle>Solve #{idx + 1}</DialogTitle>
           <DialogDescription>
             {new Date(solve.timeStamp).toLocaleString()}
           </DialogDescription>
         </DialogHeader>
         <h2 className="text-3xl font-bold">{timeText}</h2>
-        <h2 className="text-l font-bold">{solve.scramble}</h2>
+        {exec && memo && (
+          <h4 className="text-m text-muted-foreground">
+            {convertTimeToText(memo)} + {convertTimeToText(exec)} = {timeText}
+          </h4>
+        )}
+        <h3 className="text-l font-bold">{solve.scramble}</h3>
         <div className="flex">
           <DrawScramble
             scramble={solve.scramble}
@@ -96,10 +106,16 @@ function SolveDialog({
           />
         </div>
         <AlgTable solve={solve} />
-        <p className="font-medium">{solve.dnfReason || ' '}</p>
+        {solve.penalty == Penalty.DNF && (
+          <p className="font-medium">
+            DNF Reason: {solve.dnfReason || 'Not analysed'}
+          </p>
+        )}
         <DialogFooter>
           <Button type="submit" asChild>
-            <a href={twistyUrl} target="_blank" rel="noopener noreferrer">Recon</a>
+            <a href={twistyUrl} target="_blank" rel="noopener noreferrer">
+              Recon
+            </a>
           </Button>
           <Button variant="secondary" type="button" onClick={analyse}>
             Re-Analyse

diff --git a/src/timer/useCubeTimer.tsx b/src/timer/useCubeTimer.tsx
@@ -128,7 +128,9 @@ export default function useCubeTimer() {
     const solutionMoves = fullMoves
       ? moves.current.length > fullMoves.length
         ? moves.current
-        : cubeTimestampLinearFit(fullMoves).slice(-moves.current.length)
+        : moves.current.length > 0
+          ? cubeTimestampLinearFit(fullMoves).slice(-moves.current.length)
+          : moves.current
       : moves.current;
 
     const solve = {