fix: prettier

.prettierrc

@@ -2,5 +2,6 @@
   "endOfLine": "auto",
   "importOrder": ["^@core/(.*)$", "^@server/(.*)$", "^@ui/(.*)$", "^[./]"],
   "importOrderSeparation": true,
-  "importOrderSortSpecifiers": true
+  "importOrderSortSpecifiers": true,
+  "trailingComma" : "none"
 }

package.json

@@ -64,17 +64,17 @@
     "@testing-library/react-hooks": "^8.0.1",
     "@trivago/prettier-plugin-sort-imports": "^4.2.0",
     "@types/react-test-renderer": "^18.0.0",
-    "@types/validator": "^13.7.12",
-    "@typescript-eslint/eslint-plugin": "^5.40.1",
-    "@typescript-eslint/parser": "^5.61.0",
+    "@types/validator": "^13.11.1",
+    "@typescript-eslint/eslint-plugin": "^6.7.0",
+    "@typescript-eslint/parser": "^6.7.0",
     "autoprefixer": "^10.4.13",
-    "eslint": "^8.31.0",
-    "eslint-config-prettier": "^8.3.0",
+    "eslint": "^8.49.0",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-config-standard": "^16.0.3",
     "eslint-plugin-import": "^2.23.4",
     "eslint-plugin-jest-dom": "^4.0.2",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-prettier": "5.0.0",
     "eslint-plugin-promise": "^5.1.0",
     "eslint-plugin-react": "^7.31.8",
     "eslint-plugin-react-hooks": "^4.6.0",

src/components/about/__tests__/about.test.tsx

@@ -22,7 +22,7 @@ describe("<About/>", () => {
     );
     const errorTitle = screen.getByRole("heading", {
       name: /Error Loading/i,
-      level: 1,
+      level: 1
     });
 
     expect(errorTitle).toBeInTheDocument();

src/components/accounts/ForgotPassword.tsx

@@ -11,7 +11,7 @@ type ForgotPasswordType = {
 };
 
 const initState: ForgotPasswordType = {
-  email: "",
+  email: ""
 };
 
 const ForgotPassword = () => {

src/components/accounts/Register.tsx

@@ -46,7 +46,7 @@ const Register = () => {
                         className=" flex min-w-[10px] "
                         {...register("email", {
                           required: true,
-                          maxLength: 45,
+                          maxLength: 45
                         })}
                       />
                     )}

src/components/accounts/SLogin.tsx

@@ -46,7 +46,7 @@ const SLogin = () => {
                       className=" flex min-w-[10px] "
                       {...register("email", {
                         required: true,
-                        maxLength: 45,
+                        maxLength: 45
                       })}
                     />
                   )}

src/components/accounts/__tests__/Profile.test.tsx

@@ -27,7 +27,7 @@ describe("Profile Page", () => {
     expect(
       screen.getByRole("heading", {
         level: 4,
-        name: /You have not marked a pet as a favorite yet/i,
+        name: /You have not marked a pet as a favorite yet/i
       })
     );
   });

src/components/accounts/__tests__/Register.test.tsx

@@ -1,7 +1,7 @@
 import {
   render,
   screen,
-  waitForElementToBeRemoved,
+  waitForElementToBeRemoved
 } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import React from "react";
@@ -30,7 +30,7 @@ describe("<Register/>", () => {
 
     await waitForElementToBeRemoved(() => screen.queryByText(/submit/i));
     const LoadingButton = screen.getByRole("button", {
-      name: /Loading.../i,
+      name: /Loading.../i
     });
     expect(LoadingButton).toBeDisabled();
     await waitForElementToBeRemoved(screen.queryByText(/Loading.../i));
@@ -65,7 +65,7 @@ describe("<Register/>", () => {
     await waitForElementToBeRemoved(() => screen.queryByText(/submit/i));
 
     const LoadingButton = screen.getByRole("button", {
-      name: /Loading.../i,
+      name: /Loading.../i
     });
     expect(LoadingButton).toBeDisabled();
 

src/components/accounts/__tests__/SLogin.test.tsx

@@ -34,7 +34,7 @@ describe("<SLogin/>", () => {
         return res(
           ctx.status(401),
           ctx.json({
-            message: "Unable to validate email address: invalid format",
+            message: "Unable to validate email address: invalid format"
           })
         );
       })
@@ -62,7 +62,7 @@ describe("<SLogin/>", () => {
     await user.click(submitButton);
 
     const LoadingButton = await screen.findByRole("button", {
-      name: /Loading.../i,
+      name: /Loading.../i
     });
     expect(LoadingButton).toBeDisabled();
 
@@ -80,14 +80,14 @@ describe("<SLogin/>", () => {
           return res(
             ctx.status(401),
             ctx.json({
-              message: "Wrong Password",
+              message: "Wrong Password"
             })
           );
         } else {
           return res(
             ctx.status(200),
             ctx.json({
-              message: "Success",
+              message: "Success"
             })
           );
         }
@@ -110,7 +110,7 @@ describe("<SLogin/>", () => {
 
     await user.click(screen.getByText(/submit/i));
     const LoadingButton = await screen.findByRole("button", {
-      name: /Loading.../i,
+      name: /Loading.../i
     });
     expect(LoadingButton).toBeDisabled();
 
@@ -133,7 +133,7 @@ describe("<SLogin/>", () => {
             refresh_token: "cute_doggo",
             token_type: "bearer",
             user: { id: "1234" },
-            message: "No message",
+            message: "No message"
           })
         );
       })
@@ -156,12 +156,12 @@ describe("<SLogin/>", () => {
     await user.click(screen.getByText(/submit/i));
 
     const LoadingButton = await screen.findByRole("button", {
-      name: /Loading.../i,
+      name: /Loading.../i
     });
     expect(LoadingButton).toBeDisabled();
 
     const submitPostButton = await screen.findByRole("button", {
-      name: /submit/i,
+      name: /submit/i
     });
     expect(submitPostButton).toBeInTheDocument();
     expect(submitPostButton).toBeEnabled();

src/components/accounts/profile/Profile.tsx

@@ -1,5 +1,5 @@
 import PetCardFlex, {
-  PawHubContainer,
+  PawHubContainer
 } from "components/layout/Grid/PetCardFlex";
 import PetCard from "components/layout/PetCard";
 import { usePetAuth } from "context/TokenContext";

src/components/accounts/settings/Settings.tsx

@@ -36,7 +36,7 @@ export default function Settings() {
       .from("profiles")
       .update({
         description: data.description,
-        username: data.username,
+        username: data.username
       })
       .match({ id: user?.id });
   };
@@ -64,7 +64,7 @@ export default function Settings() {
                       {...register("username", {
                         required: true,
                         minLength: 4,
-                        maxLength: 45,
+                        maxLength: 45
                       })}
                     />
                   )}

src/components/contact/Contact.tsx

@@ -17,7 +17,7 @@ const Contact = () => {
     register,
     handleSubmit,
     reset,
-    formState: { errors },
+    formState: { errors }
   } = useForm<FormData>();
 
   const onSubmit: SubmitHandler<FormData> = (data) => {
@@ -44,7 +44,7 @@ const Contact = () => {
       closeOnClick: true,
       pauseOnHover: false,
       draggable: true,
-      progress: undefined,
+      progress: undefined
     });
 
   const errorNotification = () =>
@@ -55,7 +55,7 @@ const Contact = () => {
       closeOnClick: true,
       pauseOnHover: false,
       draggable: true,
-      progress: undefined,
+      progress: undefined
     });
 
   return (

src/components/contact/Inputs.tsx

@@ -16,7 +16,7 @@ export const NameInput = ({ inputClasses, register, errors }: InputProps) => {
         {...register("names", {
           required: "This field is required.",
           maxLength: 50,
-          minLength: 6,
+          minLength: 6
         })}
         className={inputClasses}
       />
@@ -37,7 +37,7 @@ export const EmailInput = ({ inputClasses, register, errors }: InputProps) => {
         placeholder="Email"
         {...register("email", {
           required: "This field is required.",
-          pattern: /^\S+@\S+$/i,
+          pattern: /^\S+@\S+$/i
         })}
         className={inputClasses}
       />

src/components/home/Home.tsx

@@ -1,5 +1,5 @@
 import PetCardFlex, {
-  PawHubContainer,
+  PawHubContainer
 } from "components/layout/Grid/PetCardFlex";
 import PetCard from "components/layout/PetCard";
 import { Button, Hero } from "react-daisyui";
@@ -50,9 +50,9 @@ const LoadingPetCards = () => {
   const {
     error,
     data: petList,
-    mutate,
+    mutate
   } = useSWR(tokenHeaders ? [randomPetsList, tokenHeaders] : null, fetcher, {
-    revalidateOnFocus: false,
+    revalidateOnFocus: false
   });
   const mutatePetlist = async () => mutate({} as PetSearchType);
   const isLoading = !error && !petList?.animals;

src/components/home/__tests__/home.test.tsx

@@ -80,7 +80,7 @@ describe("<Home/>", () => {
     expect(
       screen.getByRole("heading", {
         level: 5,
-        name: /Oops! An Error Occurred Getting The Pets/i,
+        name: /Oops! An Error Occurred Getting The Pets/i
       })
     );
   });

src/components/layout/Buttons/FetchingButton.tsx

@@ -10,7 +10,7 @@ type FetchingButtonType = {
 export const FetchingButton = ({
   fetching,
   className = "",
-  action,
+  action
 }: FetchingButtonType) => (
   <Button
     className={className}

src/components/layout/FavoriteButton/index.tsx

@@ -16,7 +16,7 @@ const FavoriteButton = ({
   add,
   remove,
   loading,
-  favoritedCount,
+  favoritedCount
 }: FavoriteButtonType) => {
   if (loading)
     return (

src/components/layout/Grid/PetCardFlex.tsx

@@ -5,7 +5,7 @@ const PetCardFlex = ({ children }: { children: React.ReactNode }) => {
 };
 
 export const PawHubContainer = ({
-  children,
+  children
 }: {
   children: React.ReactNode;
 }) => <div className="container mx-auto px-4 md:px-12 pt-6   ">{children}</div>;

src/components/layout/NavigationBar.tsx

@@ -110,7 +110,7 @@ export default function NavigationBar() {
 
 const DropdownNavLink = ({
   children,
-  route,
+  route
 }: {
   children: React.ReactNode;
   route: string;

src/components/layout/PetCard.tsx

@@ -17,7 +17,7 @@ export default function PetCard(
     type,
     primary_photo_cropped: link,
     breeds,
-    children,
+    children
   } = props;
 
   let myInterval: ReturnType<typeof setTimeout>;

src/components/organizations/Organizations.tsx

@@ -1,5 +1,5 @@
 import PetCardFlex, {
-  PawHubContainer,
+  PawHubContainer
 } from "components/layout/Grid/PetCardFlex";
 import React, { useState } from "react";
 
@@ -59,7 +59,7 @@ const Donate = () => {
             >
               <option value="All">All</option>
               {[
-                ...new Set(charity.map((item) => item.location.toLowerCase())),
+                ...new Set(charity.map((item) => item.location.toLowerCase()))
               ].map((cha, idx) => (
                 <option value={cha.toLowerCase()} key={idx + cha}>
                   {cha}

src/components/organizations/__tests__/organizations.test.tsx

@@ -20,15 +20,15 @@ describe("Organizations", () => {
     expect(
       (
         screen.getByRole("option", {
-          name: "united states",
+          name: "united states"
         }) as HTMLOptionElement
       ).selected
     ).toBeTruthy();
 
     expect(
       (
         screen.queryByRole("option", {
-          name: "india",
+          name: "india"
         }) as HTMLOptionElement
       ).selected
     ).toBe(false);

src/components/pets/Favorites.tsx

@@ -1,5 +1,5 @@
 import PetCardFlex, {
-  PawHubContainer,
+  PawHubContainer
 } from "components/layout/Grid/PetCardFlex";
 import React, { useEffect } from "react";
 import { Button } from "react-daisyui";
@@ -83,7 +83,7 @@ export default function Favorites() {
     )[0];
     await executeDelete((query) => query.eq("id", removedPet.id), {
       returning: "minimal",
-      count: "estimated",
+      count: "estimated"
     });
     dispatch(removeFavoritePet(removedPet.id));
   };

src/components/pets/Favorites/FavoriteSection.tsx

@@ -14,22 +14,22 @@ const FavoriteSection = ({ id }: { id: string }) => {
   const filter = useFilter((query) => query.eq("pet", id), [id, favoritePets]);
   const [{ count: favoritedCount }] = useSelect("favoritepets", {
     filter,
-    options: { count: "exact" },
+    options: { count: "exact" }
   });
   const [{ fetching: deleteFetching }, executeDelete] =
     useDelete("favoritepets");
   const addFav = async () => {
     const { data } = await execute({
       favoriter: user?.id,
-      pet: id,
+      pet: id
     });
     dispatch(AddNewFav(data[0]));
   };
 
   const removeFav = async () => {
     await executeDelete((query) => query.eq("id", removalId), {
       returning: "minimal",
-      count: "estimated",
+      count: "estimated"
     });
     dispatch(removeFavoritePet(removalId));
   };