fix linting issues

eisbuk · Dec 12, 2024 · 3d3fe57 · 3d3fe57
1 parent 491c7be
commit 3d3fe57
Show file tree

Hide file tree

Showing 6 changed files with 64 additions and 53 deletions.
diff --git a/packages/client/src/controllers/AdminBar.tsx b/packages/client/src/controllers/AdminBar.tsx
@@ -1,4 +1,4 @@
-import React from "react"
+import React from "react";
 import { useDispatch } from "react-redux";
 
 import { LinkItem, AdminBar } from "@eisbuk/ui";
@@ -13,7 +13,7 @@ import SendBookingEmails from "@/controllers/SendBookingEmails";
 import { signOut } from "@/store/actions/authOperations";
 
 const AdminHeader: React.FC<{ className?: string }> = ({ className = "" }) => {
-  const dispatch = useDispatch()
+  const dispatch = useDispatch();
 
   const additionalAdminContent = (
     <div className="flex gap-x-2 md:gap-x-0">
@@ -23,13 +23,15 @@ const AdminHeader: React.FC<{ className?: string }> = ({ className = "" }) => {
     </div>
   );
 
-  return <AdminBar
-    className={className}
-    adminLinks={adminLinks}
-    additionalContent={additionalAdminContent}
-    onLogout={() => dispatch(signOut)}
-  />
-}
+  return (
+    <AdminBar
+      className={className}
+      adminLinks={adminLinks}
+      additionalContent={additionalAdminContent}
+      onLogout={() => dispatch(signOut)}
+    />
+  );
+};
 
 const adminLinks: LinkItem[] = [
   {
@@ -54,5 +56,4 @@ const adminLinks: LinkItem[] = [
   },
 ];
 
-export default AdminHeader
-
+export default AdminHeader;
diff --git a/packages/client/src/pages/attendance/views/ByDay.tsx b/packages/client/src/pages/attendance/views/ByDay.tsx
@@ -2,8 +2,8 @@ import React from "react";
 import { useSelector } from "react-redux";
 import { Link } from "react-router-dom";
 
-import { Button } from "@eisbuk/ui"
-import { Printer } from "@eisbuk/svg"
+import { Button } from "@eisbuk/ui";
+import { Printer } from "@eisbuk/svg";
 
 import AttendanceCard from "@/controllers/AttendanceCard";
 
@@ -24,12 +24,13 @@ const AttendanceByDayView: React.FC = () => {
           />
         ))}
       </div>
-      <div
-        className="fixed bottom-0 w-full flex justify-end -mx-4 px-2 py-1.5 bg-ice-300 z-40 border-t border-gray-300 md:hidden"
-      >
+      <div className="fixed bottom-0 w-full flex justify-end -mx-4 px-2 py-1.5 bg-ice-300 z-40 border-t border-gray-300 md:hidden">
         <Link to="/attendance_printable">
           <Button className="h-11 text-gray-600">
-            <span className="text-md">Print</span> <span className="w-8 h-8"><Printer /></span>
+            <span className="text-md">Print</span>{" "}
+            <span className="w-8 h-8">
+              <Printer />
+            </span>
           </Button>
         </Link>
       </div>

diff --git a/packages/client/src/pages/slots/index.tsx b/packages/client/src/pages/slots/index.tsx
@@ -26,7 +26,7 @@ import { LocalStore, SlotsWeek } from "@/types/store";
 
 import { getOrganization } from "@/lib/getters";
 
-import AdminBar from "@/controllers/AdminBar"
+import AdminBar from "@/controllers/AdminBar";
 import { NotificationsContainer } from "@/features/notifications/components/index";
 import SlotOperationButtons, {
   CopyButton,
@@ -118,13 +118,13 @@ const SlotsPage: React.FC = () => {
     weekToPaste && weekToPaste.weekStart.toMillis() === date.toMillis();
   const handleSlotClick =
     ({ slot, selected }: { slot: SlotInterface; selected: boolean }) =>
-      () => {
-        if (selected) {
-          dispatch(deleteSlotFromClipboard(slot.id));
-        } else {
-          dispatch(addSlotToClipboard(slot));
-        }
-      };
+    () => {
+      if (selected) {
+        dispatch(deleteSlotFromClipboard(slot.id));
+      } else {
+        dispatch(addSlotToClipboard(slot));
+      }
+    };
 
   return (
     <div className="absolute top-0 right-0 left-0 flex flex-col pt-[141px] md:pt-[272px]">
@@ -190,7 +190,13 @@ const SlotsPage: React.FC = () => {
               <SlotsDayContainer
                 key={dateISO}
                 date={dateISO}
-                additionalContent={canEdit ? additionalButtons : <div className="h-11 md:h-auto" />}
+                additionalContent={
+                  canEdit ? (
+                    additionalButtons
+                  ) : (
+                    <div className="h-11 md:h-auto" />
+                  )
+                }
                 stickyOffset="top-[141px] md:top-[272px]"
               >
                 <div className="grid gap-4 grid-cols-2">
@@ -226,9 +232,7 @@ const SlotsPage: React.FC = () => {
           })}
         </ErrorBoundary>
 
-        <div
-          className="fixed bottom-0 w-full flex justify-end -mx-4 px-2 py-1.5 bg-ice-300 z-40 border-t border-gray-300 md:hidden"
-        >
+        <div className="fixed bottom-0 w-full flex justify-end -mx-4 px-2 py-1.5 bg-ice-300 z-40 border-t border-gray-300 md:hidden">
           {canEdit ? (
             <SlotOperationButtons
               slotsToCopy={{ week: Boolean(weekToPaste) }}
@@ -252,7 +256,10 @@ const SlotsPage: React.FC = () => {
               className="h-11 text-gray-600"
               aria-label={t(SlotsAria.EnableEdit)}
             >
-              <span className="text-md">Edit</span> <span className="w-8 h-8"><Pencil /></span>
+              <span className="text-md">Edit</span>{" "}
+              <span className="w-8 h-8">
+                <Pencil />
+              </span>
             </Button>
           )}
         </div>

diff --git a/packages/ui/src/CalendarNav/CalendarNav.stories.tsx b/packages/ui/src/CalendarNav/CalendarNav.stories.tsx
@@ -2,11 +2,11 @@ import React, { useState } from "react";
 import { ComponentMeta } from "@storybook/react";
 import { DateTime } from "luxon";
 
-import { Printer, PlusCircle, Copy, XCircle, Pencil } from "@eisbuk/svg"
+import { Printer, PlusCircle, Copy } from "@eisbuk/svg";
 
 import CalendarNav from "./CalendarNav";
 import EmptySpace from "../EmptySpace";
-import Button, { ButtonColor } from "../Button"
+import Button, { ButtonColor } from "../Button";
 
 export default {
   title: "Calendar Nav",
@@ -53,8 +53,8 @@ const countdown = (
 );
 
 export const WithAdditionalContent = (): JSX.Element => {
-  const [canEdit, setCanEdit] = useState(false)
-  const toggleEdit = () => setCanEdit(!canEdit)
+  const [canEdit, setCanEdit] = useState(false);
+  const toggleEdit = () => setCanEdit(!canEdit);
 
   return (
     <>
@@ -89,15 +89,19 @@ export const WithAdditionalContent = (): JSX.Element => {
             <Button
               onClick={toggleEdit}
               color={canEdit ? ButtonColor.Primary : undefined}
-              className={!canEdit ? "!text-black outline outline-gray-300 border-box" : ""}
+              className={
+                !canEdit
+                  ? "!text-black outline outline-gray-300 border-box"
+                  : ""
+              }
             >
               Enable edit
             </Button>
           </div>
         }
       />
     </>
-  )
+  );
 };
 
 export const WithCountdown = (): JSX.Element => (
@@ -107,4 +111,3 @@ export const WithCountdown = (): JSX.Element => (
     additionalContent={countdown}
   />
 );
-
diff --git a/packages/ui/src/SlotCard/SlotCard.stories.tsx b/packages/ui/src/SlotCard/SlotCard.stories.tsx
@@ -54,8 +54,8 @@ export const PackedWithContent = (): JSX.Element => (
 );
 
 export const ButtonsToggle = (): JSX.Element => {
-  const [canEdit, setCanEdit] = React.useState(false)
-  const toggleEdit = () => setCanEdit(!canEdit)
+  const [canEdit, setCanEdit] = React.useState(false);
+  const toggleEdit = () => setCanEdit(!canEdit);
 
   return (
     <>
@@ -69,14 +69,15 @@ export const ButtonsToggle = (): JSX.Element => {
       <Button
         onClick={toggleEdit}
         color={canEdit ? ButtonColor.Primary : undefined}
-        className={
-          ["my-4", !canEdit ? "!text-black outline outline-gray-300 border-box" : ""].join(" ")
-        }
+        className={[
+          "my-4",
+          !canEdit ? "!text-black outline outline-gray-300 border-box" : "",
+        ].join(" ")}
       >
         Enable Edit
       </Button>
     </>
-  )
+  );
 };
 
 export const Selected = (): JSX.Element => {

diff --git a/packages/ui/src/SlotsDayContainer/SlotsDayContainer.stories.tsx b/packages/ui/src/SlotsDayContainer/SlotsDayContainer.stories.tsx
@@ -89,7 +89,7 @@ export const WithButtons = (): JSX.Element => (
 );
 
 export const PrototypeSlotsPage = (): JSX.Element => {
-  const [canEdit, setCanEdit] = React.useState(false)
+  const [canEdit, setCanEdit] = React.useState(false);
 
   return (
     <div className="relative content-container">
@@ -99,19 +99,17 @@ export const PrototypeSlotsPage = (): JSX.Element => {
           <SlotsDayContainer
             key={i}
             date={DateTime.fromISO(date).plus({ days: i }).toISODate()}
-            additionalContent={canEdit ? additionalContent : <div className="h-12 md:h-auto" />}
+            additionalContent={
+              canEdit ? additionalContent : <div className="h-12 md:h-auto" />
+            }
           >
             <div className="content-container h-80 w-full bg-gray-100 rounded-md border-gray-200" />
           </SlotsDayContainer>
         ))}
 
-      <div
-        className="fixed bottom-0 left-4 right-4 flex justify-end p-2 bg-ice-300 z-40 border-t border-gray-300"
-      >
+      <div className="fixed bottom-0 left-4 right-4 flex justify-end p-2 bg-ice-300 z-40 border-t border-gray-300">
         {canEdit ? (
-          <div
-            className="flex justify-end items-center gap-1"
-          >
+          <div className="flex justify-end items-center gap-1">
             <Button className="w-12 h-12 !p-1 text-gray-600 rounded-full overflow-hidden">
               <Copy />
             </Button>
@@ -134,6 +132,6 @@ export const PrototypeSlotsPage = (): JSX.Element => {
           </Button>
         )}
       </div>
-    </div >
-  )
+    </div>
+  );
 };