enable biome lint

subhoghoshX · Jul 23, 2024 · bb10504 · bb10504
1 parent 6f81933
commit bb10504
Show file tree

Hide file tree

Showing 10 changed files with 67 additions and 54 deletions.
diff --git a/biome.json b/biome.json
@@ -8,11 +8,19 @@
     "indentStyle": "space"
   },
   "linter": {
-    "enabled": false
+    "enabled": true,
+    "rules": {
+      "style": {
+        "useTemplate": "off"
+      }
+    }
   },
   "css": {
     "formatter": {
       "enabled": true
     }
+  },
+  "javascript": {
+    "jsxRuntime": "reactClassic"
   }
 }
diff --git a/build.js b/build.js
@@ -80,11 +80,13 @@ function watch_dirs(dir, on_change) {
 
   // watch all subdirectories in dir
   const d = fs.opendirSync(dir);
-  let dirent;
+  let dirent = d.readSync();
 
-  while ((dirent = d.readSync()) !== null) {
+  while (dirent !== null) {
     if (dirent.isDirectory())
       watch_dirs(path.join(dir, dirent.name), on_change);
+
+    dirent = d.readSync();
   }
   d.closeSync();
 }

diff --git a/src/components/FocusMode.tsx b/src/components/FocusMode.tsx
@@ -139,10 +139,10 @@ export default function FocusModeCard() {
         </form>
         <ScrollArea className="h-[163px] mt-5 -mx-6">
           <ul className="px-6">
-            {blockedSites.map((site, i) => (
+            {blockedSites.map((site) => (
               <li
                 className="flex justify-between hover:bg-zinc-50 dark:hover:bg-zinc-900 px-2 -mx-2 py-1 rounded"
-                key={i}
+                key={site}
               >
                 {site}
                 <Button

diff --git a/src/components/TimePicker.tsx b/src/components/TimePicker.tsx
@@ -19,6 +19,7 @@ interface Props {
 }
 
 const weekDays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+const hours = Array.from({ length: 24 }).map((_, i) => i);
 const minutes = [0, 10, 15, 20, 30, 40, 45, 50];
 
 export default function TimePicker({
@@ -75,9 +76,9 @@ export default function TimePicker({
           </SelectTrigger>
           <SelectContent>
             <SelectGroup>
-              {Array.from({ length: 24 }).map((_, i) => (
-                <SelectItem key={i} value={`${i}`}>
-                  {i}
+              {hours.map((hour) => (
+                <SelectItem key={hour} value={`${hour}`}>
+                  {hour}
                 </SelectItem>
               ))}
             </SelectGroup>
@@ -101,8 +102,8 @@ export default function TimePicker({
           </SelectTrigger>
           <SelectContent>
             <SelectGroup>
-              {minutes.map((min, i) => (
-                <SelectItem key={i} value={`${min}`}>
+              {minutes.map((min) => (
+                <SelectItem key={min} value={`${min}`}>
                   {min}
                 </SelectItem>
               ))}
@@ -130,9 +131,9 @@ export default function TimePicker({
           </SelectTrigger>
           <SelectContent>
             <SelectGroup>
-              {Array.from({ length: 24 }).map((_, i) => (
-                <SelectItem key={i} value={`${i}`}>
-                  {i}
+              {hours.map((hour) => (
+                <SelectItem key={hour} value={`${hour}`}>
+                  {hour}
                 </SelectItem>
               ))}
             </SelectGroup>
@@ -156,8 +157,8 @@ export default function TimePicker({
           </SelectTrigger>
           <SelectContent>
             <SelectGroup>
-              {minutes.map((min, i) => (
-                <SelectItem key={i} value={`${min}`}>
+              {minutes.map((min) => (
+                <SelectItem key={min} value={`${min}`}>
                   {min}
                 </SelectItem>
               ))}

diff --git a/src/components/ui/toaster.tsx b/src/components/ui/toaster.tsx
@@ -16,20 +16,16 @@ export function Toaster() {
 
   return (
     <ToastProvider>
-      {toasts.map(function ({ id, title, description, action, ...props }) {
-        return (
-          <Toast key={id} {...props}>
-            <div className="grid gap-1">
-              {title && <ToastTitle>{title}</ToastTitle>}
-              {description && (
-                <ToastDescription>{description}</ToastDescription>
-              )}
-            </div>
-            {action}
-            <ToastClose />
-          </Toast>
-        );
-      })}
+      {toasts.map(({ id, title, description, action, ...props }) => (
+        <Toast key={id} {...props}>
+          <div className="grid gap-1">
+            {title && <ToastTitle>{title}</ToastTitle>}
+            {description && <ToastDescription>{description}</ToastDescription>}
+          </div>
+          {action}
+          <ToastClose />
+        </Toast>
+      ))}
       <ToastViewport />
     </ToastProvider>
   );

diff --git a/src/components/ui/toggle-group.tsx b/src/components/ui/toggle-group.tsx
@@ -2,7 +2,7 @@
 
 import * as React from "react";
 import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
-import { VariantProps } from "class-variance-authority";
+import type { VariantProps } from "class-variance-authority";
 
 import { cn } from "@/lib/utils";
 import { toggleVariants } from "@/components/ui/toggle";

diff --git a/src/components/ui/use-toast.tsx b/src/components/ui/use-toast.tsx
@@ -95,9 +95,9 @@ export const reducer = (state: State, action: Action): State => {
       if (toastId) {
         addToRemoveQueue(toastId);
       } else {
-        state.toasts.forEach((toast) => {
+        for (const toast of state.toasts) {
           addToRemoveQueue(toast.id);
-        });
+        }
       }
 
       return {
@@ -132,9 +132,9 @@ let memoryState: State = { toasts: [] };
 
 function dispatch(action: Action) {
   memoryState = reducer(memoryState, action);
-  listeners.forEach((listener) => {
+  for (const listener of listeners) {
     listener(memoryState);
-  });
+  }
 }
 
 type Toast = Omit<ToasterToast, "id">;
@@ -171,6 +171,7 @@ function toast({ ...props }: Toast) {
 function useToast() {
   const [state, setState] = React.useState<State>(memoryState);
 
+  // biome-ignore lint/correctness/useExhaustiveDependencies: this comes from shadcn-ui, let's not fix it
   React.useEffect(() => {
     listeners.push(setState);
     return () => {

diff --git a/src/lib/utils.ts b/src/lib/utils.ts
@@ -6,8 +6,8 @@ export function cn(...inputs: ClassValue[]) {
   return twMerge(clsx(inputs));
 }
 
-export function getDate(d?: Date) {
-  d = d ?? new Date();
+export function getDate(_d?: Date) {
+  const d = _d ?? new Date();
   const dd = String(d.getDate()).padStart(2, "0");
   const mm = String(d.getMonth() + 1).padStart(2, "0"); //January is 0!
   const yyyy = d.getFullYear();

diff --git a/src/newtab/App.tsx b/src/newtab/App.tsx
@@ -73,24 +73,29 @@ export default function App() {
                       <li
                         key={hostName}
                         className="flex items-center gap-x-8 px-2 py-1 -mx-2 hover:bg-zinc-50 dark:hover:bg-zinc-900 rounded"
-                        onClick={() => setSelectedHost(hostName)}
                       >
-                        <div className="w-44 flex items-center gap-3">
-                          <img
-                            className="size-3.5 rounded"
-                            src={"https://favicone.com/" + hostName}
-                            alt=""
+                        <button
+                          type="button"
+                          onClick={() => setSelectedHost(hostName)}
+                        >
+                          <div className="w-44 flex items-center gap-3">
+                            <img
+                              className="size-3.5 rounded"
+                              src={"https://favicone.com/" + hostName}
+                              alt=""
+                            />
+                            {hostName}
+                          </div>
+                          <span className="w-20 text-right tabular-nums">
+                            {hour ? hour + "h" : ""}{" "}
+                            {minute ? minute + "m" : ""}{" "}
+                            {second ? second + "s" : ""}
+                          </span>
+                          <Progress
+                            value={(timeSpent / totalTime) * 100}
+                            className="w-32 h-1.5"
                           />
-                          {hostName}
-                        </div>
-                        <span className="w-20 text-right tabular-nums">
-                          {hour ? hour + "h" : ""} {minute ? minute + "m" : ""}{" "}
-                          {second ? second + "s" : ""}
-                        </span>
-                        <Progress
-                          value={(timeSpent / totalTime) * 100}
-                          className="w-32 h-1.5"
-                        />
+                        </button>
                       </li>
                     );
                   })}

diff --git a/tailwind.config.ts b/tailwind.config.ts
@@ -49,8 +49,8 @@ module.exports = {
         },
       },
       borderRadius: {
-        lg: `var(--radius)`,
-        md: `calc(var(--radius) - 2px)`,
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
         sm: "calc(var(--radius) - 4px)",
       },
       fontFamily: {