fix: linting errors for storybook compilation

src/api/axios.js

@@ -47,7 +47,13 @@ export const Config = axios.create({
   }
 });
 
-for (const client of [IncidentCommander, Logs, CanaryChecker, Config, ConfigDB]) {
+for (const client of [
+  IncidentCommander,
+  Logs,
+  CanaryChecker,
+  Config,
+  ConfigDB
+]) {
   client.interceptors.response.use(
     (response) => response,
     (error) => {

src/components/HypothesisBuilder/evidence-section.js

@@ -29,7 +29,7 @@ export function EvidenceItem({ evidence }) {
 export function EvidenceAccordion({ title, date, children, ...rest }) {
   const [expanded, setExpanded] = useState(false);
   return (
-    <div className="border-b last:border-b-0 flex flex-col">
+    <div className="border-b last:border-b-0 flex flex-col" {...rest}>
       <button
         className={`${
           expanded && "border-b"

src/components/Incidents/IncidentCreate/index.js

@@ -2,7 +2,7 @@ import { yupResolver } from "@hookform/resolvers/yup";
 import React from "react";
 import { Controller, useForm } from "react-hook-form";
 
-import { useLocation, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 import { v4 as uuidv4 } from "uuid";
 import * as yup from "yup";
 import { createEvidence } from "../../../api/services/evidence";
@@ -30,7 +30,6 @@ const validationSchema = yup
 export function IncidentCreate({ callback, evidence, ...rest }) {
   const navigate = useNavigate();
   const user = useUser();
-  const location = useLocation();
   const {
     control,
     formState: { errors },

src/components/TextInputClearable/index.js

@@ -1,5 +1,5 @@
 import { SearchIcon } from "@heroicons/react/solid";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { IoCloseCircle } from "react-icons/io5";
 
 export function TextInputClearable({

src/pages/Examples/topology-dropdown.js

@@ -1,7 +1,6 @@
 import React, { useCallback, useState } from "react";
 import { MinimalLayout } from "../../components/Layout";
 import { TypologyDropdown } from "../../components/TopologyDropdown";
-import { getTopology } from "../../api/services/topology";
 import { topologiesFactory } from "../../data/topologies";
 
 const topologies = topologiesFactory(22);
@@ -10,11 +9,17 @@ export const TypologyDropdownDemo = () => {
   const [selectTopology, setSelectTopology] = useState(null);
   const [isMulti, setIsMulti] = useState(false);
   const searchTopology = useCallback(
-    (name) =>
-      new Promise((resolve, reject) => {
-        resolve(topologies); // todo remove this if getTopology works
-        // getTopology({ name }).then(({ data }) => resolve(data));
-      }),
+    // (name) =>
+    () =>
+      new Promise(
+        (
+          resolve
+          // , reject
+        ) => {
+          resolve(topologies); // todo remove this if getTopology works
+          // getTopology({ name }).then(({ data }) => resolve(data));
+        }
+      ),
     []
   );
 

src/pages/config/config-details.js

@@ -31,7 +31,7 @@ export function ConfigDetailsPage() {
       .finally(() => {
         setIsLoading(false);
       });
-  }, []);
+  }, [id]);
 
   useEffect(() => {
     const json = configDetails?.config;