enable Biome rule noUnusedVariables (#5239)

* update biome to 1.9.4 * enable noUnusedVariables rule
opsmill · Dec 18, 2024 · dad6de9 · dad6de9
1 parent 567a815
commit dad6de9
Show file tree

Hide file tree

Showing 25 changed files with 79 additions and 65 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -102,7 +102,7 @@ jobs:
       - name: Setup Biome
         uses: biomejs/setup-biome@v2
         with:
-          version: 1.9.3
+          version: 1.9.4
       - name: Run Biome
         working-directory: ./frontend/app
         run: biome ci .

diff --git a/frontend/app/biome.json b/frontend/app/biome.json
@@ -1,6 +1,10 @@
 {
-  "$schema": "https://biomejs.dev/schemas/1.9.3/schema.json",
-  "vcs": { "enabled": false, "clientKind": "git", "useIgnoreFile": false },
+  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
+  "vcs": {
+    "clientKind": "git",
+    "enabled": true,
+    "useIgnoreFile": true
+  },
   "files": {
     "ignoreUnknown": false,
     "ignore": [
@@ -54,7 +58,7 @@
         "noUndeclaredVariables": "off",
         "noUnusedFunctionParameters": "off",
         "noUnusedImports": "error",
-        "noUnusedVariables": "off",
+        "noUnusedVariables": "error",
         "useExhaustiveDependencies": "off",
         "useHookAtTopLevel": "off",
         "useImportExtensions": "off"

diff --git a/frontend/app/package-lock.json b/frontend/app/package-lock.json
diff --git a/frontend/app/package.json b/frontend/app/package.json
@@ -102,7 +102,7 @@
     "vite-tsconfig-paths": "^4.3.2"
   },
   "devDependencies": {
-    "@biomejs/biome": "1.9.3",
+    "@biomejs/biome": "1.9.4",
     "@graphql-codegen/cli": "^5.0.2",
     "@graphql-codegen/typescript": "^4.0.9",
     "@playwright/test": "^1.47.2",

diff --git a/frontend/app/src/api/client.ts b/frontend/app/src/api/client.ts
@@ -37,7 +37,8 @@ const authMiddleware: Middleware = {
 
         request.headers.set("Authorization", `Bearer ${newToken.access_token}`);
         return fetch(request);
-      } catch (e) {
+      } catch (error) {
+        console.error(error);
         return response;
       }
     }

diff --git a/frontend/app/src/components/display/password-display.tsx b/frontend/app/src/components/display/password-display.tsx
@@ -34,7 +34,7 @@ export const PasswordDisplay = (props: tPasswordDisplayProps) => {
 
   const passwordCircles = Array.from(
     Array(value.length < MAX_PASSWORD_DOTS_DISPLAY ? value.length : MAX_PASSWORD_DOTS_DISPLAY)
-  ).map((value: null, index: number) => (
+  ).map((_, index: number) => (
     <Icon key={index} icon={"mdi:circle-medium"} className="text-gray-900" />
   ));
 

diff --git a/frontend/app/src/components/form/fields/json.field.tsx b/frontend/app/src/components/form/fields/json.field.tsx
@@ -45,7 +45,8 @@ const JsonField = ({
                     // Store the value as JSON
                     const newValue = JSON.parse(value);
                     field.onChange(updateFormFieldValue(newValue, defaultValue));
-                  } catch (e) {
+                  } catch (error) {
+                    console.error(error);
                     field.onChange(updateFormFieldValue(value, defaultValue));
                   }
                 }}

diff --git a/frontend/app/src/components/inputs/input.tsx b/frontend/app/src/components/inputs/input.tsx
@@ -57,6 +57,7 @@ export const Input = forwardRef((props: any, ref: any) => {
           props.type === "password" ? "pr-14" : ""
         )}
         type={type === "password" && display ? "text" : type}
+        ref={ref}
         {...propsToPass}
       />
 

diff --git a/frontend/app/src/components/inputs/multiple-input.tsx b/frontend/app/src/components/inputs/multiple-input.tsx
@@ -47,6 +47,7 @@ export const MultipleInput = React.forwardRef((props: MultipleInputProps, ref: a
             error && error?.message ? "ring-red-500 focus:ring-red-600" : ""
           )}
           data-testid="multi-select-input"
+          ref={ref}
         >
           Empty list
         </div>
@@ -75,6 +76,7 @@ export const MultipleInput = React.forwardRef((props: MultipleInputProps, ref: a
         disabled ? "cursor-not-allowed bg-gray-100" : ""
       )}
       data-testid="multi-select-input"
+      ref={ref}
     >
       {value?.map((item: string | SelectOption, index: number) => (
         <Badge

diff --git a/frontend/app/src/components/inputs/select.tsx b/frontend/app/src/components/inputs/select.tsx
@@ -412,7 +412,8 @@ export const Select = forwardRef<HTMLDivElement, SelectProps>((props, ref) => {
         setIsLoading(false);
 
         checkSchemaUpdate();
-      } catch (e) {
+      } catch (error) {
+        console.error(error);
         setIsLoading(false);
       }
     };
@@ -500,7 +501,8 @@ export const Select = forwardRef<HTMLDivElement, SelectProps>((props, ref) => {
         setOpen(false);
 
         setIsLoading(false);
-      } catch (e) {
+      } catch (error) {
+        console.error(error);
         setIsLoading(false);
       }
     };
@@ -563,6 +565,7 @@ export const Select = forwardRef<HTMLDivElement, SelectProps>((props, ref) => {
 
       setIsLoading(false);
     } catch (error) {
+      console.error(error);
       setIsLoading(false);
     }
   };
@@ -602,6 +605,7 @@ export const Select = forwardRef<HTMLDivElement, SelectProps>((props, ref) => {
 
       setIsLoading(false);
     } catch (error) {
+      console.error(error);
       setIsLoading(false);
     }
   };

diff --git a/frontend/app/src/components/notifications.tsx b/frontend/app/src/components/notifications.tsx
@@ -11,6 +11,7 @@ export const Notifications = (props: any) => {
     ${queryString}
   `;
 
+  // biome-ignore lint/correctness/noUnusedVariables: to have an example component using subscriptions
   const { data } = useSubscription(query);
 
   return <div className="absolute">OK</div>;

diff --git a/frontend/app/src/screens/diff/artifact-diff/artifacts-diff.tsx b/frontend/app/src/screens/diff/artifact-diff/artifacts-diff.tsx
@@ -13,7 +13,7 @@ import { toast } from "react-toastify";
 import { StringParam, useQueryParam } from "use-query-params";
 import { ArtifactRepoDiff } from "./artifact-repo-diff";
 
-export const ArtifactsDiff = forwardRef((props, ref) => {
+export const ArtifactsDiff = forwardRef((_, ref) => {
   const [artifactsDiff, setArtifactsDiff] = useState({});
   const { "*": branchName } = useParams();
   const [branchOnly] = useQueryParam(QSP.BRANCH_FILTER_BRANCH_ONLY, StringParam);

diff --git a/frontend/app/src/screens/diff/checks/checks.tsx b/frontend/app/src/screens/diff/checks/checks.tsx
@@ -6,7 +6,7 @@ import { useParams } from "react-router-dom";
 import { ChecksSummary } from "./checks-summary";
 import { Validator } from "./validator";
 
-export const Checks = forwardRef((props, ref) => {
+export const Checks = forwardRef((_, ref) => {
   const { proposedChangeId } = useParams();
 
   const { loading, error, data, refetch } = useQuery(GET_VALIDATORS, {

diff --git a/frontend/app/src/screens/diff/file-diff/files-diff.tsx b/frontend/app/src/screens/diff/file-diff/files-diff.tsx
@@ -12,7 +12,7 @@ import { useParams } from "react-router-dom";
 import { StringParam, useQueryParam } from "use-query-params";
 import { FileRepoDiff } from "./file-repo-diff";
 
-export const FilesDiff = forwardRef((props, ref) => {
+export const FilesDiff = forwardRef((_, ref) => {
   const [filesDiff, setFilesDiff] = useState({});
   const { "*": branchName } = useParams();
   const [branchOnly] = useQueryParam(QSP.BRANCH_FILTER_BRANCH_ONLY, StringParam);
@@ -45,7 +45,8 @@ export const FilesDiff = forwardRef((props, ref) => {
       if (filesResult[branch]) {
         setFilesDiff(filesResult[branch]);
       }
-    } catch (err) {
+    } catch (error) {
+      console.error(error);
       setError(true);
     }
 

diff --git a/frontend/app/src/screens/ipam/ip-addresses/ipam-ip-address-list.tsx b/frontend/app/src/screens/ipam/ip-addresses/ipam-ip-address-list.tsx
@@ -34,7 +34,7 @@ import { useParams } from "react-router-dom";
 import { toast } from "react-toastify";
 import { StringParam, useQueryParam } from "use-query-params";
 
-const IpamIPAddressesList = forwardRef((props, ref) => {
+const IpamIPAddressesList = forwardRef((_, ref) => {
   const { prefix } = useParams();
   const [namespace] = useQueryParam(IPAM_QSP.NAMESPACE, StringParam);
   const [isLoading, setIsLoading] = useState(false);

diff --git a/frontend/app/src/screens/ipam/ip-addresses/ipam-ip-address.tsx b/frontend/app/src/screens/ipam/ip-addresses/ipam-ip-address.tsx
@@ -3,7 +3,7 @@ import { useParams } from "react-router-dom";
 import IpAddressSummary from "./ip-address-summary";
 import IpamIPAddressesList from "./ipam-ip-address-list";
 
-const IpamIPAddresses = forwardRef((props, ref) => {
+const IpamIPAddresses = forwardRef((_, ref) => {
   const { ip_address } = useParams();
 
   if (ip_address) {

diff --git a/frontend/app/src/screens/ipam/prefixes/ipam-prefix-details.tsx b/frontend/app/src/screens/ipam/prefixes/ipam-prefix-details.tsx
@@ -30,7 +30,7 @@ import { useParams } from "react-router-dom";
 import { toast } from "react-toastify";
 import { StringParam, useQueryParam } from "use-query-params";
 
-const IpamIPPrefixDetails = forwardRef((props, ref) => {
+const IpamIPPrefixDetails = forwardRef((_, ref) => {
   const { prefix } = useParams();
   const branch = useAtomValue(currentBranchAtom);
   const date = useAtomValue(datetimeAtom);

diff --git a/frontend/app/src/screens/ipam/prefixes/ipam-prefixes-summary-list.tsx b/frontend/app/src/screens/ipam/prefixes/ipam-prefixes-summary-list.tsx
@@ -28,7 +28,7 @@ import { useParams } from "react-router-dom";
 import { toast } from "react-toastify";
 import { StringParam, useQueryParam } from "use-query-params";
 
-const IpamIPPrefixesSummaryList = forwardRef((props, ref) => {
+const IpamIPPrefixesSummaryList = forwardRef((_, ref) => {
   const { prefix } = useParams();
   const branch = useAtomValue(currentBranchAtom);
   const date = useAtomValue(datetimeAtom);

diff --git a/frontend/app/src/screens/ipam/prefixes/ipam-prefixes-summary.tsx b/frontend/app/src/screens/ipam/prefixes/ipam-prefixes-summary.tsx
@@ -3,7 +3,7 @@ import { useParams } from "react-router-dom";
 import IpamIPPrefixesSummaryDetails from "./ipam-prefixes-summary-details";
 import IpamIPPrefixesSummaryList from "./ipam-prefixes-summary-list";
 
-const IpamIPPrefixesSummary = forwardRef((props, ref) => {
+const IpamIPPrefixesSummary = forwardRef((_, ref) => {
   const { prefix } = useParams();
 
   if (prefix) {

diff --git a/frontend/app/src/screens/ipam/prefixes/ipam-prefixes.tsx b/frontend/app/src/screens/ipam/prefixes/ipam-prefixes.tsx
@@ -5,7 +5,7 @@ import { StringParam, useQueryParam } from "use-query-params";
 import IpamIPPrefixDetails from "./ipam-prefix-details";
 import IpamIPPrefixesSummary from "./ipam-prefixes-summary";
 
-const IpamIPPrefixes = forwardRef((props, ref) => {
+const IpamIPPrefixes = forwardRef((_, ref) => {
   const [qspTab] = useQueryParam(IPAM_QSP.TAB, StringParam);
 
   switch (qspTab) {

diff --git a/frontend/app/src/screens/proposed-changes/action-button/pc-merge-button.tsx b/frontend/app/src/screens/proposed-changes/action-button/pc-merge-button.tsx
@@ -59,7 +59,9 @@ export const PcMergeButton = ({
 
       await graphqlClient.reFetchObservableQueries();
       toast(<Alert type={ALERT_TYPES.SUCCESS} message={"Proposed changes merged successfully!"} />);
-    } catch (error: any) {
+    } catch (error) {
+      console.error(error);
+
       toast(
         <Alert
           type={ALERT_TYPES.SUCCESS}