diff --git a/.github/ISSUE_TEMPLATE/bug-report.md b/.github/ISSUE_TEMPLATE/bug-report.md
index d325e134..dc5b3c35 100644
--- a/.github/ISSUE_TEMPLATE/bug-report.md
+++ b/.github/ISSUE_TEMPLATE/bug-report.md
@@ -1,29 +1,36 @@
 ---
 name: Bug report
 about: Um modelo exemplo para você relatar algum defeito que tenha encontrado no site.
-title: "[BUG] Título do problema"
+title: '[BUG] Título do problema'
 labels: bug
 assignees: ''
-
 ---
+
 # Descrição
+
 Aqui você escreve sobre o que é o defeito.
 
 # Problema encontrado
+
 Aqui você dá detalhes sobre o problema, incluíndo os passos para reproduzir, se necessário.
 
 # Prioridade
+
 Registre apenas a prioridade ou seriedade do defeito. Um guia:
+
 - Crítico: site fora do ar, erros fatas que impedem utilização por completo, página em branco
 - Grave: site online, mas com defeito sério que impedem o uso de forma considerável
-- Média: defeito não tão sério, mas que dificulta o uso da aplicação de modo geral 
+- Média: defeito não tão sério, mas que dificulta o uso da aplicação de modo geral
 - Baixa: coisas poucas, sistema pode ser usado. Problemas de grafia são incluídos aqui
 
 # Solução proposta
+
 Como deveria ser o comportamento sem o defeito?
 
 # Ambiente
+
 Aqui você escreve o tipo de dispositivo (Modelo do celular ou sistema operacional do computador) e o navegador que utilizou para o teste.
 
 # Evidência
-Adicione o que for possível, como captura de tela ou vídeo evidenciando o problema.
\ No newline at end of file
+
+Adicione o que for possível, como captura de tela ou vídeo evidenciando o problema.
diff --git a/.gitignore b/.gitignore
index 3b0b4037..65f61907 100644
--- a/.gitignore
+++ b/.gitignore
@@ -23,4 +23,6 @@ dist-ssr
 *.sln
 *.sw?
 
-.env
\ No newline at end of file
+.env
+
+bun.lockb
\ No newline at end of file
diff --git a/.husky/pre-commit b/.husky/pre-commit
new file mode 100644
index 00000000..b28c372e
--- /dev/null
+++ b/.husky/pre-commit
@@ -0,0 +1 @@
+npm run lint-staged
\ No newline at end of file
diff --git a/.lintstagedrc b/.lintstagedrc
new file mode 100644
index 00000000..fdbc4303
--- /dev/null
+++ b/.lintstagedrc
@@ -0,0 +1,4 @@
+{
+  "!(*.ts)": "prettier --write",
+  "*.ts": ["eslint . --fix", "prettier --write"]
+}
diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 00000000..e5382a2c
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1,6 @@
+node_modules
+.husky
+.github
+bun.lockb
+.prettierignore
+.gitignore
\ No newline at end of file
diff --git a/.prettierrc b/.prettierrc
index 544138be..4b7d5b71 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,3 +1,10 @@
 {
-  "singleQuote": true
+  "arrowParens": "always",
+  "printWidth": 80,
+  "singleQuote": true,
+  "jsxSingleQuote": false,
+  "semi": true,
+  "trailingComma": "all",
+  "tabWidth": 2,
+  "plugins": ["prettier-plugin-tailwindcss"]
 }
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 9d44effa..2557942e 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -79,10 +79,10 @@ de forma desnecessária.
 5. Faça um push para o seu repositório com `git push`.
 6. [Sincronize seu repositório](#-sincronizando).
 7. [Abra um pull request](https://docs.github.com/pt/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/creating-a-pull-request).
-  Não deixe de informar, no seu pull request, qual a issue que está fechando.
-  Idealmente coloque um comentário no PR que já fechará a issue, como
-  `fixes #xxxx` ou `closes #xxxx` (onde `xxxx` é o número do issue). Veja
-  [como isso funciona](https://docs.github.com/pt/get-started/writing-on-github/working-with-advanced-formatting/using-keywords-in-issues-and-pull-requests).
+   Não deixe de informar, no seu pull request, qual a issue que está fechando.
+   Idealmente coloque um comentário no PR que já fechará a issue, como
+   `fixes #xxxx` ou `closes #xxxx` (onde `xxxx` é o número do issue). Veja
+   [como isso funciona](https://docs.github.com/pt/get-started/writing-on-github/working-with-advanced-formatting/using-keywords-in-issues-and-pull-requests).
 8. Acompanhe a revisão do PR. Algumas verificações automáticas serão feitas (o
    Github Actions rodará o build do Vite, por exemplo). Se uma delas falhar, corrija-a, a
    revisão humana só começa quando estas checagem estão passando. Após abrir o
diff --git a/bun.lockb b/bun.lockb
new file mode 100755
index 00000000..db3340e3
Binary files /dev/null and b/bun.lockb differ
diff --git a/components.json b/components.json
index 46f4379c..b67a3e09 100644
--- a/components.json
+++ b/components.json
@@ -14,4 +14,4 @@
     "components": "@/components",
     "utils": "@/lib/utils"
   }
-}
\ No newline at end of file
+}
diff --git a/index.html b/index.html
index eea57e14..34a99b8e 100644
--- a/index.html
+++ b/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="pt-br">
   <head>
     <script
diff --git a/package.json b/package.json
index c1f22314..b9ca5b21 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     "dev": "vite",
     "build": "tsc && vite build",
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "lint-staged": "lint-staged . && tsc --noEmit",
     "preview": "vite preview"
   },
   "dependencies": {
@@ -55,8 +56,12 @@
     "eslint": "^8.57.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.6",
+    "husky": "^9.0.11",
     "javascript-obfuscator": "^4.1.0",
+    "lint-staged": "^15.2.7",
     "postcss": "^8.4.38",
+    "prettier": "^3.3.2",
+    "prettier-plugin-tailwindcss": "^0.6.4",
     "tailwindcss": "^3.4.3",
     "typescript": "^5.2.2",
     "vite": "^5.2.0"
diff --git a/postcss.config.js b/postcss.config.js
index 2e7af2b7..2aa7205d 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -3,4 +3,4 @@ export default {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};
diff --git a/public/site.webmanifest b/public/site.webmanifest
index 45dc8a20..fa99de77 100644
--- a/public/site.webmanifest
+++ b/public/site.webmanifest
@@ -1 +1,19 @@
-{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
\ No newline at end of file
+{
+  "name": "",
+  "short_name": "",
+  "icons": [
+    {
+      "src": "/android-chrome-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/android-chrome-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}
diff --git a/src/api/api.ts b/src/api/api.ts
index 9f1c03fd..b36fc82b 100644
--- a/src/api/api.ts
+++ b/src/api/api.ts
@@ -46,7 +46,7 @@ api.interceptors.response.use(
       localStorage.removeItem('token');
     }
     return Promise.reject(error);
-  }
+  },
 );
 
 export { api };
diff --git a/src/api/cache.ts b/src/api/cache.ts
index 8b97e9d6..2cb6796b 100644
--- a/src/api/cache.ts
+++ b/src/api/cache.ts
@@ -11,7 +11,7 @@ function log(...args: any[]) {
 
 function checkCacheHasExpired(
   timestamp: number,
-  ttl: number = defaultTtl
+  ttl: number = defaultTtl,
 ): boolean {
   return new Date().getTime() - timestamp >= ttl;
 }
@@ -20,7 +20,7 @@ function clearCache(onlyExpired: boolean = true) {
   log(
     onlyExpired
       ? 'cache - checando caches expirados...'
-      : 'cache - limpando cache...'
+      : 'cache - limpando cache...',
   );
   Object.keys(localStorage)
     .filter((key: string) => key.startsWith('cache:'))
@@ -73,7 +73,7 @@ function handleCacheResponse(resp: AxiosResponse<any, any>) {
       JSON.stringify({
         data: { data, headers, status, statusText },
         timestamp: new Date().getTime(),
-      })
+      }),
     );
   }
 }
diff --git a/src/api/hmac.ts b/src/api/hmac.ts
index 19516e06..b024d545 100644
--- a/src/api/hmac.ts
+++ b/src/api/hmac.ts
@@ -14,7 +14,7 @@ function getHmacHeaders(props: Partial<IHmacProps>) {
 
   const signature = CryptoJS.HmacSHA256(
     payload,
-    import.meta.env.VITE_HMAC_SECRET_KEY
+    import.meta.env.VITE_HMAC_SECRET_KEY,
   ).toString(CryptoJS.enc.Hex);
 
   return {
diff --git a/src/api/index.ts b/src/api/index.ts
index 471fafee..da693490 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -1,3 +1,3 @@
-import { api } from "./api";
+import { api } from './api';
 
 export { api };
diff --git a/src/components/Alert/Alert.tsx b/src/components/Alert/Alert.tsx
index 34c34b7c..0c261e35 100644
--- a/src/components/Alert/Alert.tsx
+++ b/src/components/Alert/Alert.tsx
@@ -5,7 +5,7 @@ const Alert = (props: IAlert) => {
   const { description, startAdornment } = props;
 
   return (
-    <Card className="p-3 flex gap-3 border-zinc-200 border-[1px] rounded-md select-none w-full items-center text-justify">
+    <Card className="flex w-full select-none items-center gap-3 rounded-md border-[1px] border-zinc-200 p-3 text-justify">
       <div>{startAdornment}</div>
       <span className="text-sm text-zinc-600">{description}</span>
     </Card>
diff --git a/src/components/Alert/index.ts b/src/components/Alert/index.ts
index 7de745c0..ebc7a23c 100644
--- a/src/components/Alert/index.ts
+++ b/src/components/Alert/index.ts
@@ -1,3 +1,3 @@
-import { Alert } from "./Alert";
+import { Alert } from './Alert';
 
 export { Alert };
diff --git a/src/components/BackToTop/BackToTop.tsx b/src/components/BackToTop/BackToTop.tsx
index e1c418de..ada4d9a0 100644
--- a/src/components/BackToTop/BackToTop.tsx
+++ b/src/components/BackToTop/BackToTop.tsx
@@ -30,10 +30,7 @@ const BackToTop = () => {
   return (
     isVisible && (
       <button
-        className=" fixed ease-in-out hidden sm:flex justify-center items-center duration-300 
-    bg-red-600/75 focus:bg-red-700 hover:bg-red-700 z-[100] shadow-slate-600/75
-    right-6 bottom-6 rounded-full shadow-md
-    w-12 h-12 "
+        className="fixed bottom-6 right-6 z-[100] hidden h-12 w-12 items-center justify-center rounded-full bg-red-600/75 shadow-md shadow-slate-600/75 duration-300 ease-in-out hover:bg-red-700 focus:bg-red-700 sm:flex"
         onClick={scrollToTop}
       >
         <ArrowUp color="white" />
diff --git a/src/components/BackToTop/index.ts b/src/components/BackToTop/index.ts
index 2e570724..fc03ad51 100644
--- a/src/components/BackToTop/index.ts
+++ b/src/components/BackToTop/index.ts
@@ -1,3 +1,3 @@
-import { BackToTop } from "./BackToTop";
+import { BackToTop } from './BackToTop';
 
 export { BackToTop };
diff --git a/src/components/BurgerMenu/BurgerMenu.tsx b/src/components/BurgerMenu/BurgerMenu.tsx
index b2f732c7..5d1fe0a5 100644
--- a/src/components/BurgerMenu/BurgerMenu.tsx
+++ b/src/components/BurgerMenu/BurgerMenu.tsx
@@ -41,8 +41,8 @@ const BurgerMenu = () => {
       <SheetTrigger>
         <Menu color="white" className="ml-2 mr-2" />
       </SheetTrigger>
-      <SheetContent side="left" className="pt-[96px] flex flex-col z-[90]">
-        <DialogFooter className="absolute top-16 right-4">
+      <SheetContent side="left" className="z-[90] flex flex-col pt-[96px]">
+        <DialogFooter className="absolute right-4 top-16">
           <DialogClose asChild>
             <Button type="button" variant="ghost">
               <X className="stroke-muted-foreground" />
@@ -52,7 +52,7 @@ const BurgerMenu = () => {
         <div className="flex flex-col gap-4">
           {session && (
             <Fragment>
-              <div className="inline-flex items-center text-semibold">
+              <div className="text-semibold inline-flex items-center">
                 Olá, {session.name}
               </div>
               <Separator />
@@ -61,46 +61,46 @@ const BurgerMenu = () => {
           <BurguerMenuItem
             label="Sobre nós"
             link="/sobre-nos"
-            icon={<Info className="w-5 h-5" />}
+            icon={<Info className="h-5 w-5" />}
           />
           <BurguerMenuItem
             label="Minhas Doações"
             link="/doacoes"
-            icon={<HeartHandshake className="w-5 h-5" />}
+            icon={<HeartHandshake className="h-5 w-5" />}
             className={clsx({ hidden: !session })}
           />
           <BurguerMenuItem
             label="Cadastrar abrigo"
             link="https://forms.gle/2S7L2gR529Dc8P3T9"
-            icon={<CirclePlus className="w-5 h-5" />}
+            icon={<CirclePlus className="h-5 w-5" />}
             openExternal={true}
           />
           <BurguerMenuItem
             label="Canal de Denúncias"
             link="https://contatoseguro.com.br/sos_rs"
-            icon={<ShieldAlert className="w-5 h-5" />}
+            icon={<ShieldAlert className="h-5 w-5" />}
             openExternal={true}
           />
           <BurguerMenuItem
             label="Como Ajudar"
             link="https://www.instagram.com/reel/C613CfGuh4b"
-            icon={<CircleHelp className="w-5 h-5" />}
+            icon={<CircleHelp className="h-5 w-5" />}
             openExternal={true}
           />
           <BurguerMenuItem
             label="Política de Privacidade"
             link="/politica-de-privacidade"
-            icon={<Info className="w-5 h-5" />}
+            icon={<Info className="h-5 w-5" />}
           />
           <BurguerMenuItem
             label="Apoiadores"
             link="/apoiadores"
-            icon={<HeartHandshake className="w-5 h-5" />}
+            icon={<HeartHandshake className="h-5 w-5" />}
           />
           <BurguerMenuItem
             label="Visão Geral"
             link="/dashboard"
-            icon={<Info className="w-4 h-4" />}
+            icon={<Info className="h-4 w-4" />}
           />
           <Separator />
           {partners.length > 0 && (
@@ -111,7 +111,7 @@ const BurgerMenu = () => {
                   key={idx}
                   label={partner.name}
                   link={partner.link}
-                  icon={<LinkIcon className="w-4 h-4" />}
+                  icon={<LinkIcon className="h-4 w-4" />}
                 />
               ))}
             </Fragment>
@@ -120,7 +120,7 @@ const BurgerMenu = () => {
         {session && (
           <div className="mt-auto">
             <span
-              className="inline-flex items-center hover:font-semibold cursor-pointer"
+              className="inline-flex cursor-pointer items-center hover:font-semibold"
               onClick={logout}
             >
               <DoorOpen className="mr-2" /> Sair
diff --git a/src/components/BurgerMenu/components/BurguerMenuItem/BurguerMenuItem.tsx b/src/components/BurgerMenu/components/BurguerMenuItem/BurguerMenuItem.tsx
index 6f42570f..f404bc08 100644
--- a/src/components/BurgerMenu/components/BurguerMenuItem/BurguerMenuItem.tsx
+++ b/src/components/BurgerMenu/components/BurguerMenuItem/BurguerMenuItem.tsx
@@ -23,8 +23,8 @@ const BurguerMenuItem = React.forwardRef<
       ref={ref}
       href={link}
       className={cn(
-        'hover:font-semibold flex gap-2 items-center text-zinc-600 [&_svg]:stroke-zinc-500',
-        className
+        'flex items-center gap-2 text-zinc-600 hover:font-semibold [&_svg]:stroke-zinc-500',
+        className,
       )}
       onClick={onClick}
       {...rest}
@@ -32,7 +32,7 @@ const BurguerMenuItem = React.forwardRef<
     >
       {icon}
       {label}
-      {openExternal && <ExternalLink className="w-3 h-3" />}
+      {openExternal && <ExternalLink className="h-3 w-3" />}
     </a>
   );
 });
diff --git a/src/components/BurgerMenu/index.ts b/src/components/BurgerMenu/index.ts
index 4355a097..46db83b0 100644
--- a/src/components/BurgerMenu/index.ts
+++ b/src/components/BurgerMenu/index.ts
@@ -1,3 +1,3 @@
-import { BurgerMenu } from "./BurgerMenu";
+import { BurgerMenu } from './BurgerMenu';
 
 export { BurgerMenu };
diff --git a/src/components/CardAboutShelter/CardAboutShelter.tsx b/src/components/CardAboutShelter/CardAboutShelter.tsx
index 6c65543a..6fe3b599 100644
--- a/src/components/CardAboutShelter/CardAboutShelter.tsx
+++ b/src/components/CardAboutShelter/CardAboutShelter.tsx
@@ -21,7 +21,7 @@ import { useEffect, useState } from 'react';
 
 const CardAboutShelter = (props: ICardAboutShelter) => {
   const { shelter } = props;
-  const [ petsRsShelterUrl, setPetsRsShelterUrl ] = useState('');
+  const [petsRsShelterUrl, setPetsRsShelterUrl] = useState('');
 
   const check = (v?: string | number | boolean | null) => {
     return v !== undefined && v !== null;
@@ -29,21 +29,23 @@ const CardAboutShelter = (props: ICardAboutShelter) => {
 
   const getPetsRsShelterUrl = async (name: string) => {
     const cleanShelterName = getShelterNameBeforeSeparator(name);
-    const data  = await PetsRsShelterServices.getByName(cleanShelterName);
-    const petsRsShelterUrl = data?.id ? `https://petsrs.com.br/abrigo/${data.id}` : 'https://petsrs.com.br/abrigos';
+    const data = await PetsRsShelterServices.getByName(cleanShelterName);
+    const petsRsShelterUrl = data?.id
+      ? `https://petsrs.com.br/abrigo/${data.id}`
+      : 'https://petsrs.com.br/abrigos';
     return petsRsShelterUrl;
   };
 
   useEffect(() => {
-      if(shelter.petFriendly) {
-        getPetsRsShelterUrl(shelter.name).then((url) => setPetsRsShelterUrl(url) );
-      }
-  },[shelter.petFriendly, shelter.name]);
+    if (shelter.petFriendly) {
+      getPetsRsShelterUrl(shelter.name).then((url) => setPetsRsShelterUrl(url));
+    }
+  }, [shelter.petFriendly, shelter.name]);
 
   const formatAddress = checkAndFormatAddress(shelter, false);
   return (
-    <Card className="flex flex-col gap-2 p-4 bg-[#E8F0F8] text-sm">
-      <div className="text-[#646870] font-medium">Sobre o abrigo</div>
+    <Card className="flex flex-col gap-2 bg-[#E8F0F8] p-4 text-sm">
+      <div className="font-medium text-[#646870]">Sobre o abrigo</div>
       <div className="flex flex-col flex-wrap gap-3">
         <InfoRow icon={<Home />} label={formatAddress} />
         {Boolean(shelter.city) && (
@@ -106,16 +108,22 @@ const CardAboutShelter = (props: ICardAboutShelter) => {
           value={check(shelter.pix) ? `${shelter.pix}` : 'Não informado'}
           clipboardButton={check(shelter.pix)}
         />
-      {(petsRsShelterUrl != '') ? (
+        {petsRsShelterUrl != '' ? (
           <InfoRow
             icon={<Link />}
             label={
-              <a target="_blank" href={petsRsShelterUrl} className="font-semibold text-blue-600">
+              <a
+                target="_blank"
+                href={petsRsShelterUrl}
+                className="font-semibold text-blue-600"
+              >
                 Confira o abrigo em petsrs.com.br
               </a>
             }
           />
-        ) : ''}
+        ) : (
+          ''
+        )}
       </div>
     </Card>
   );
diff --git a/src/components/CardAboutShelter/components/InfoRow/InfoRow.tsx b/src/components/CardAboutShelter/components/InfoRow/InfoRow.tsx
index 9b70fb2a..dcd7bf5b 100644
--- a/src/components/CardAboutShelter/components/InfoRow/InfoRow.tsx
+++ b/src/components/CardAboutShelter/components/InfoRow/InfoRow.tsx
@@ -18,7 +18,7 @@ const InfoRow = React.forwardRef<HTMLDivElement, IInfoRowProps>(
     ) : isLink ? (
       <a
         href={value}
-        className="text-blue-500 break-all cursor-pointer hover:underline"
+        className="cursor-pointer break-all text-blue-500 hover:underline"
       >
         {value}
       </a>
@@ -30,16 +30,16 @@ const InfoRow = React.forwardRef<HTMLDivElement, IInfoRowProps>(
       <div
         ref={ref}
         className={cn(
-          'flex items-start gap-2 font-medium w-full',
+          'flex w-full items-start gap-2 font-medium',
           'md:flex',
-          className
+          className,
         )}
         {...rest}
       >
         {React.cloneElement(icon as any, {
           className: 'min-w-5 min-h-5 w-5 h-5 stroke-muted-foreground',
         })}
-        <div className={cn('flex flex-col gap-2 items-start', 'sm:flex-row')}>
+        <div className={cn('flex flex-col items-start gap-2', 'sm:flex-row')}>
           <span className={cn('font-normal', value ? 'text-nowrap' : '')}>
             {label}
           </span>
@@ -47,7 +47,7 @@ const InfoRow = React.forwardRef<HTMLDivElement, IInfoRowProps>(
             {ValueComp}
             {clipboardButton && value && (
               <div
-                className="text-blue-600 mx-2 hover:cursor-pointer active:text-blue-800"
+                className="mx-2 text-blue-600 hover:cursor-pointer active:text-blue-800"
                 onClick={() => navigator.clipboard.writeText(value)}
               >
                 copiar
@@ -57,7 +57,7 @@ const InfoRow = React.forwardRef<HTMLDivElement, IInfoRowProps>(
         </div>
       </div>
     );
-  }
+  },
 );
 
 export { InfoRow };
diff --git a/src/components/CardAboutShelter/utils.ts b/src/components/CardAboutShelter/utils.ts
index 39b013a0..a4f0ca93 100644
--- a/src/components/CardAboutShelter/utils.ts
+++ b/src/components/CardAboutShelter/utils.ts
@@ -3,7 +3,7 @@ import { IUseShelterData } from '@/hooks/useShelter/types';
 const formatShelterAddressFields = (
   payload: Partial<
     Pick<IUseShelterData, 'street' | 'streetNumber' | 'neighbourhood'>
-  >
+  >,
 ): string => {
   const { street, streetNumber, neighbourhood } = payload;
   return [street, streetNumber, neighbourhood].filter(Boolean).join(', ');
@@ -16,7 +16,7 @@ const checkAndFormatAddress = (
       'address' | 'city' | 'street' | 'streetNumber' | 'neighbourhood'
     >
   >,
-  showCity = true
+  showCity = true,
 ): string => {
   const { address, city, ...rest } = payload;
   return (
diff --git a/src/components/Chip/Chip.tsx b/src/components/Chip/Chip.tsx
index af3e3777..ca91d6ef 100644
--- a/src/components/Chip/Chip.tsx
+++ b/src/components/Chip/Chip.tsx
@@ -21,7 +21,7 @@ const Chip = React.forwardRef<HTMLDivElement, IChipProps>((props, ref) => {
       defaultVariants: {
         variant: 'info',
       },
-    }
+    },
   );
 
   return (
diff --git a/src/components/CircleStatus/CircleStatus.tsx b/src/components/CircleStatus/CircleStatus.tsx
index 0f1290c6..00f0fd11 100644
--- a/src/components/CircleStatus/CircleStatus.tsx
+++ b/src/components/CircleStatus/CircleStatus.tsx
@@ -11,15 +11,15 @@ const CircleStatus = React.forwardRef<HTMLDivElement, ICircleStatus>(
       <div
         ref={ref}
         className={cn(
-          `w-${size} h-${size} bg-orange-500 rounded-md`,
-          className
+          `w-${size} h-${size} rounded-md bg-orange-500`,
+          className,
         )}
         {...rest}
       >
         <span></span>
       </div>
     );
-  }
+  },
 );
 
 export { CircleStatus };
diff --git a/src/components/DialogSelector/DialogSelector.tsx b/src/components/DialogSelector/DialogSelector.tsx
index 5f23c2e8..a4ecb240 100644
--- a/src/components/DialogSelector/DialogSelector.tsx
+++ b/src/components/DialogSelector/DialogSelector.tsx
@@ -51,7 +51,7 @@ const DialogSelector = (props: IDialogSelectorProps) => {
           <label htmlFor="quantity" className="text-muted-foreground">
             Quantidade
           </label>
-          <div className="flex gap-2 items-center justify-center py-2">
+          <div className="flex items-center justify-center gap-2 py-2">
             <Input
               type="number"
               name="quantity"
@@ -62,7 +62,7 @@ const DialogSelector = (props: IDialogSelectorProps) => {
             />
           </div>
         </div>
-        <div className="px-2 max-h-[50vh] overflow-y-auto">
+        <div className="max-h-[50vh] overflow-y-auto px-2">
           <RadioGroup
             value={selectedItem}
             onValueChange={(v) => setSelectedItem(v)}
diff --git a/src/components/DonationCart/DonationCart.tsx b/src/components/DonationCart/DonationCart.tsx
index 9fd7e3b8..caa714db 100644
--- a/src/components/DonationCart/DonationCart.tsx
+++ b/src/components/DonationCart/DonationCart.tsx
@@ -29,7 +29,7 @@ const DonationCart = (props: IDonationCart) => {
     <Sheet open={opened} onOpenChange={onClose}>
       <SheetContent
         side="right"
-        className="z-[120] flex flex-col pb-0 px-0 overflow-y-auto"
+        className="z-[120] flex flex-col overflow-y-auto px-0 pb-0"
       >
         {donationOrderId ? (
           <DonationSuccess donationOrderId={donationOrderId} />
diff --git a/src/components/DonationCart/components/DonationCartForm/DonationCartForm.tsx b/src/components/DonationCart/components/DonationCartForm/DonationCartForm.tsx
index 98b90f80..afa2d578 100644
--- a/src/components/DonationCart/components/DonationCartForm/DonationCartForm.tsx
+++ b/src/components/DonationCart/components/DonationCartForm/DonationCartForm.tsx
@@ -49,7 +49,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
         }));
         updateItem(shelterId, item.id, { quantity });
       },
-      [shelterId, updateItem]
+      [shelterId, updateItem],
     );
 
     // const verifyCartItems = useCallback(
@@ -110,7 +110,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
 
         return true;
       },
-      [refreshSession, verifyAccountExists]
+      [refreshSession, verifyAccountExists],
     );
 
     const handleDonate = useCallback(
@@ -126,7 +126,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
           if (ok) {
             const items = Object.entries(rest).reduce(
               (prev, [key, value]) => [...prev, { id: key, quantity: +value }],
-              [] as IDonateItem[]
+              [] as IDonateItem[],
             );
             //TODO: discutir produto se vai e como será verificado os "erros" do carrinho
             // const errorsData = await verifyCartItems(shelterId, items);
@@ -146,7 +146,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
           setLoading(false);
         }
       },
-      [clearCart, handleCreateAccount, onSuccess, shelterId]
+      [clearCart, handleCreateAccount, onSuccess, shelterId],
     );
 
     return (
@@ -164,7 +164,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
             Ajuste a quantidade que gostaria de doar em cada item
           </SheetDescription>
         </SheetHeader>
-        <div className="px-4 flex flex-col gap-3 mt-4 flex-1">
+        <div className="mt-4 flex flex-1 flex-col gap-3 px-4">
           <div className="flex justify-between">
             <small className="font-semibold">Item</small>
             <small className="font-semibold">Quantidade</small>
@@ -173,14 +173,14 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
             const { className } = getSupplyPriorityProps(item.priority);
             return (
               <div key={item.id} className="flex flex-col gap-2">
-                <div className="flex justify-between gap-2 flex-nowrap">
-                  <div className="flex flex-1 gap-1 items-center">
+                <div className="flex flex-nowrap justify-between gap-2">
+                  <div className="flex flex-1 items-center gap-1">
                     <CircleStatus
-                      className={cn(className, 'rounded-full w-3 h-3')}
+                      className={cn(className, 'h-3 w-3 rounded-full')}
                     />
                     <span className="text-sm font-medium">{item.name}</span>
                   </div>
-                  <div className="flex flex-1 gap-2 items-center justify-end">
+                  <div className="flex flex-1 items-center justify-end gap-2">
                     <div className="relative w-3/5">
                       <Input
                         min={1}
@@ -191,7 +191,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
                           handleChangeQuantity(item, +ev.target.value)
                         }
                       />
-                      <span className="absolute top-[50%] -translate-y-1/2 right-2 text-muted-foreground text-xs -z-10">
+                      <span className="absolute right-2 top-[50%] -z-10 -translate-y-1/2 text-xs text-muted-foreground">
                         {SupplyMeasureMap[item.measure]}
                       </span>
                     </div>
@@ -201,12 +201,12 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
                       className="w-auto"
                       onClick={() => removeItem(shelterId, item.id)}
                     >
-                      <Trash2 className="w-5 h-5 stroke-red-600" />
+                      <Trash2 className="h-5 w-5 stroke-red-600" />
                     </Button>
                   </div>
                 </div>
                 {errors[item.id] && (
-                  <span className="border border-red-200 bg-red-100 text-red-500 p-2 rounded-md">
+                  <span className="rounded-md border border-red-200 bg-red-100 p-2 text-red-500">
                     <p className="text-xs font-light">{errors[item.id]}</p>
                   </span>
                 )}
@@ -216,12 +216,12 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
           <Separator className="my-4" />
           {!session && (
             <div className="flex flex-col gap-2">
-              <h3 className="font-bold text-lg">Comunique sua doação</h3>
+              <h3 className="text-lg font-bold">Comunique sua doação</h3>
               <p className="text-sm font-medium text-muted-foreground">
                 Utilizaremos seus dados apenas para comunicar ao abrigo que sua
                 doação esta a caminho.
               </p>
-              <div className="flex flex-col gap-4 mt-4">
+              <div className="mt-4 flex flex-col gap-4">
                 <TextField
                   label="Nome"
                   placeholder="Insira seu nome"
@@ -250,7 +250,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
           )}
         </div>
         <SheetFooter className="border-t-[1px] border-border">
-          <div className="w-full flex justify-between p-4">
+          <div className="flex w-full justify-between p-4">
             <Button size="sm" variant="ghost" onClick={handleCancelCart}>
               Cancelar
             </Button>
@@ -267,7 +267,7 @@ const DonationCartForm = React.forwardRef<HTMLFormElement, IDonationCartForm>(
         </SheetFooter>
       </form>
     );
-  }
+  },
 );
 
 export { DonationCartForm };
diff --git a/src/components/DonationCart/components/DonationSuccess/DonationSuccess.tsx b/src/components/DonationCart/components/DonationSuccess/DonationSuccess.tsx
index 8ca82675..47381ef7 100644
--- a/src/components/DonationCart/components/DonationSuccess/DonationSuccess.tsx
+++ b/src/components/DonationCart/components/DonationSuccess/DonationSuccess.tsx
@@ -26,7 +26,7 @@ const DonationSuccess = React.forwardRef<HTMLDivElement, IDonationSuccessProps>(
     });
 
     if (loading)
-      return <Loader className="stroke-gray-500 w-6 h-6 animate-spin" />;
+      return <Loader className="h-6 w-6 animate-spin stroke-gray-500" />;
 
     return (
       <div ref={ref} className={cn('contents', className)} {...rest}>
@@ -37,12 +37,12 @@ const DonationSuccess = React.forwardRef<HTMLDivElement, IDonationSuccessProps>(
         />
         <SheetHeader className="px-4">
           <SheetTitle>O RS agradece sua doação</SheetTitle>
-          <SheetDescription className="flex justify-center items-center">
+          <SheetDescription className="flex items-center justify-center">
             <HeartHandshake className="h-24 w-24" strokeWidth={0.5} />
           </SheetDescription>
         </SheetHeader>
-        <div className="px-4 flex flex-col gap-2 mt-4 flex-1">
-          <div className="flex flex-col text-md font-medium">
+        <div className="mt-4 flex flex-1 flex-col gap-2 px-4">
+          <div className="text-md flex flex-col font-medium">
             <small className="text-muted-foreground">
               Cada doação importa.
             </small>
@@ -50,13 +50,13 @@ const DonationSuccess = React.forwardRef<HTMLDivElement, IDonationSuccessProps>(
               Juntos somos mais fortes!
             </small>
           </div>
-          <div className="flex flex-col items-start bg-slate-100 rounded-md p-4">
+          <div className="flex flex-col items-start rounded-md bg-slate-100 p-4">
             <div className="flex flex-col gap-1">
-              <small className="text-muted-foreground font-medium">
+              <small className="font-medium text-muted-foreground">
                 Doação para
               </small>
               <h3 className="font-semibold">{donation.shelter.name}</h3>
-              <small className="text-xs text-semibold">
+              <small className="text-semibold text-xs">
                 às{' '}
                 {format(new Date(donation.createdAt), "HH'h'mm 'de' dd/MM/yy")}
               </small>
@@ -65,9 +65,9 @@ const DonationSuccess = React.forwardRef<HTMLDivElement, IDonationSuccessProps>(
               {donation.donationOrderSupplies.map((s, idx) => (
                 <li
                   key={idx}
-                  className="pl-2 text-sm font-medium flex gap-2 items-center"
+                  className="flex items-center gap-2 pl-2 text-sm font-medium"
                 >
-                  <Circle className="w-1 h-1 fill-muted-foreground" />
+                  <Circle className="h-1 w-1 fill-muted-foreground" />
                   {s.quantity}
                   {SupplyMeasureMap[s.supply.measure]} de {s.supply.name}
                 </li>
@@ -76,7 +76,7 @@ const DonationSuccess = React.forwardRef<HTMLDivElement, IDonationSuccessProps>(
             <Button
               variant="ghost"
               size="sm"
-              className="text-red-600 font-semibold hover:bg-red-50 active:bg-red-100 px-4 py-1 rounded-md flex gap-2 mt-2 hover:text-red-700 [&>svg]:hover:stroke-red-700"
+              className="mt-2 flex gap-2 rounded-md px-4 py-1 font-semibold text-red-600 hover:bg-red-50 hover:text-red-700 active:bg-red-100 [&>svg]:hover:stroke-red-700"
               onClick={() => handlePrint(null, () => divRef.current)}
             >
               <Printer className="stroke-red-600" />
@@ -84,7 +84,7 @@ const DonationSuccess = React.forwardRef<HTMLDivElement, IDonationSuccessProps>(
             </Button>
           </div>
         </div>
-        <div className="px-4 py-6 flex justify-center items-center border-t-[1px] border-border">
+        <div className="flex items-center justify-center border-t-[1px] border-border px-4 py-6">
           <Button
             className="w-full"
             variant="destructive"
@@ -95,7 +95,7 @@ const DonationSuccess = React.forwardRef<HTMLDivElement, IDonationSuccessProps>(
         </div>
       </div>
     );
-  }
+  },
 );
 
 export { DonationSuccess };
diff --git a/src/components/DonationCartIcon/DonationCartIcon.tsx b/src/components/DonationCartIcon/DonationCartIcon.tsx
index 478e7959..28ea7815 100644
--- a/src/components/DonationCartIcon/DonationCartIcon.tsx
+++ b/src/components/DonationCartIcon/DonationCartIcon.tsx
@@ -13,12 +13,12 @@ const DonationCartIcon = (props: IDonationCartIconProps) => {
     <Button
       variant="ghost"
       size="sm"
-      className="disabled:bg-red-500 hover:bg-red-400 relative"
+      className="relative hover:bg-red-400 disabled:bg-red-500"
       onClick={toggleOpened}
     >
-      <HandHeart className="w-6 h-6 stroke-white" />
+      <HandHeart className="h-6 w-6 stroke-white" />
       {!!quantity && (
-        <span className="absolute right-0 top-0 w-4 h-4 flex justify-center items-center rounded-full p-2 bg-red-700 text-xs text-white border-red-600 border-[1px]">
+        <span className="absolute right-0 top-0 flex h-4 w-4 items-center justify-center rounded-full border-[1px] border-red-600 bg-red-700 p-2 text-xs text-white">
           {quantity}
         </span>
       )}
diff --git a/src/components/DonationVoucher/DonationVoucher.tsx b/src/components/DonationVoucher/DonationVoucher.tsx
index b4aa7871..aef6723b 100644
--- a/src/components/DonationVoucher/DonationVoucher.tsx
+++ b/src/components/DonationVoucher/DonationVoucher.tsx
@@ -12,46 +12,46 @@ const DonationVoucher = React.forwardRef<HTMLDivElement, IDonationVoucher>(
     return (
       <div
         ref={ref}
-        className={cn('h-screen p-8 m-0 flex flex-col gap-4', className)}
+        className={cn('m-0 flex h-screen flex-col gap-4 p-8', className)}
         {...rest}
       >
         <div className="flex items-center gap-4">
           <img src="/logo-sos.png" className="h-12 w-auto" />
-          <h1 className="font-bold text-2xl">Doação feita em sos-rs.com</h1>
+          <h1 className="text-2xl font-bold">Doação feita em sos-rs.com</h1>
         </div>
         <div className="flex flex-col">
-          <h4 className="font-medium text-lg">De:</h4>
-          <div className="flex flex-col border-black border-2 rounded-lg p-2">
-            <h3 className="font-bold text-2xl">
+          <h4 className="text-lg font-medium">De:</h4>
+          <div className="flex flex-col rounded-lg border-2 border-black p-2">
+            <h3 className="text-2xl font-bold">
               {data.user.name} {data.user.lastName}
             </h3>
-            <h4 className="font-medium text-lg">{data.user.phone}</h4>
+            <h4 className="text-lg font-medium">{data.user.phone}</h4>
           </div>
         </div>
         <div className="flex flex-col">
-          <h4 className="font-medium text-lg">Para:</h4>
-          <div className="flex flex-col border-black border-2 rounded-lg p-2">
-            <h3 className="font-bold text-2xl">{data.shelter.name}</h3>
-            <h4 className="font-medium text-lg">{data.shelter.address}</h4>
+          <h4 className="text-lg font-medium">Para:</h4>
+          <div className="flex flex-col rounded-lg border-2 border-black p-2">
+            <h3 className="text-2xl font-bold">{data.shelter.name}</h3>
+            <h4 className="text-lg font-medium">{data.shelter.address}</h4>
           </div>
         </div>
         <p>
           Status da doação: <b>{DonationStatusMap[data.status]}</b>
         </p>
-        <h3 className="font-bold text-2xl">Itens da doação</h3>
+        <h3 className="text-2xl font-bold">Itens da doação</h3>
         <ul>
           {data.donationOrderSupplies.map((s, idx) => (
             <li
               key={idx}
-              className="pl-2 text-md font-medium flex gap-2 items-center"
+              className="text-md flex items-center gap-2 pl-2 font-medium"
             >
-              <Circle className="w-1 h-1 fill-muted-foreground" />
+              <Circle className="h-1 w-1 fill-muted-foreground" />
               {s.quantity}
               {SupplyMeasureMap[s.supply.measure]} de {s.supply.name}
             </li>
           ))}
         </ul>
-        <div className="flex-1 flex items-end justify-center">
+        <div className="flex flex-1 items-end justify-center">
           <p className="text-lg">
             Criada às{' '}
             {format(new Date(data.createdAt), "HH'h'mm 'de' dd/MM/yy")} pela
@@ -60,7 +60,7 @@ const DonationVoucher = React.forwardRef<HTMLDivElement, IDonationVoucher>(
         </div>
       </div>
     );
-  }
+  },
 );
 
 export { DonationVoucher };
diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx
index bc15d221..d9c6e4ac 100644
--- a/src/components/Footer/Footer.tsx
+++ b/src/components/Footer/Footer.tsx
@@ -13,8 +13,8 @@ const Footer = React.forwardRef<
       ref={ref}
       {...rest}
       className={cn(
-        'flex w-full flex-col md:flex-row py-8 md:py-4 px-2 md-p4 gap-3 justify-center flex-wrap items-center bg-red-600',
-        className
+        'md-p4 flex w-full flex-col flex-wrap items-center justify-center gap-3 bg-red-600 px-2 py-8 md:flex-row md:py-4',
+        className,
       )}
     >
       <p className="text-white">
@@ -27,17 +27,17 @@ const Footer = React.forwardRef<
           aqui
         </a>
       </p>
-      <span className="text-white hidden md:block">•</span>
-      <span className="text-white flex flex-nowrap gap-2 items-center">
+      <span className="hidden text-white md:block">•</span>
+      <span className="flex flex-nowrap items-center gap-2 text-white">
         Projeto Open Source disponível em{' '}
         <a
-          className="underline hover:text-gray-300 flex"
+          className="flex underline hover:text-gray-300"
           href="https://github.com/SOS-RS"
           target="_blank"
         >
           Github
         </a>
-        <Heart className="h-3 w-3 stroke-white fill-white" />
+        <Heart className="h-3 w-3 fill-white stroke-white" />
       </span>
     </footer>
   );
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index b3255f6d..8effaa0a 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -17,12 +17,12 @@ const Header = React.forwardRef<HTMLDivElement, IHeader>((props, ref) => {
     <header
       ref={ref}
       className={cn(
-        'bg-red-600 flex h-[56px] justify-between items-center text-white p-3 gap-2 w-full z-[100]',
-        className
+        'z-[100] flex h-[56px] w-full items-center justify-between gap-2 bg-red-600 p-3 text-white',
+        className,
       )}
       {...rest}
     >
-      <div className="flex gap-1 items-center">
+      <div className="flex items-center gap-1">
         {startAdornment}
         <Link className="font-medium text-white" to="/">
           {title}
diff --git a/src/components/Header/index.ts b/src/components/Header/index.ts
index 68850c77..822e1726 100644
--- a/src/components/Header/index.ts
+++ b/src/components/Header/index.ts
@@ -1,3 +1,3 @@
-import { Header } from "./Header";
+import { Header } from './Header';
 
 export { Header };
diff --git a/src/components/Loader/Loader.tsx b/src/components/Loader/Loader.tsx
index 9c9ca74c..e92ed0ab 100644
--- a/src/components/Loader/Loader.tsx
+++ b/src/components/Loader/Loader.tsx
@@ -4,7 +4,7 @@ import { ILoader } from './types';
 const Loader = (props: ILoader) => {
   const { loading, children } = props;
 
-  if (loading) return <Loader2 className="w-5 h-5 animate-spin" />;
+  if (loading) return <Loader2 className="h-5 w-5 animate-spin" />;
 
   return children;
 };
diff --git a/src/components/LoadingScreen/LoadingScreen.tsx b/src/components/LoadingScreen/LoadingScreen.tsx
index 11a2993e..7b513868 100644
--- a/src/components/LoadingScreen/LoadingScreen.tsx
+++ b/src/components/LoadingScreen/LoadingScreen.tsx
@@ -18,12 +18,12 @@ const LoadingScreen = (props: ILoadingScreen) => {
       defaultVariants: {
         variant: 'full',
       },
-    }
+    },
   );
 
   return (
     <div {...rest} className={variants({ className, variant })}>
-      <Loader className="animate-spin h-15 w-15 stroke-white" />
+      <Loader className="h-15 w-15 animate-spin stroke-white" />
     </div>
   );
 };
diff --git a/src/components/LoadingScreen/index.ts b/src/components/LoadingScreen/index.ts
index a36a8a55..64fe397f 100644
--- a/src/components/LoadingScreen/index.ts
+++ b/src/components/LoadingScreen/index.ts
@@ -1,3 +1,3 @@
-import { LoadingScreen } from "./LoadingScreen";
+import { LoadingScreen } from './LoadingScreen';
 
 export { LoadingScreen };
diff --git a/src/components/LoadingScreen/types.ts b/src/components/LoadingScreen/types.ts
index e0618c14..934c3c42 100644
--- a/src/components/LoadingScreen/types.ts
+++ b/src/components/LoadingScreen/types.ts
@@ -1,3 +1,3 @@
-export interface ILoadingScreen extends React.ComponentPropsWithoutRef<"div"> {
-  variant?: "full" | "content";
+export interface ILoadingScreen extends React.ComponentPropsWithoutRef<'div'> {
+  variant?: 'full' | 'content';
 }
diff --git a/src/components/LoadingSkeleton/LoadingSkeleton.tsx b/src/components/LoadingSkeleton/LoadingSkeleton.tsx
index b4e02128..59245788 100644
--- a/src/components/LoadingSkeleton/LoadingSkeleton.tsx
+++ b/src/components/LoadingSkeleton/LoadingSkeleton.tsx
@@ -1,46 +1,49 @@
 type LoadingSkeletonProps = {
-    amountItems: number
-}
+  amountItems: number;
+};
 
 const LoadingSkeleton = ({ amountItems }: LoadingSkeletonProps) => {
-    return (
-        <div className="w-full">
-            <ul className="grid grid-cols-1 gap-5 mt-4">
-                {Array.from({length: amountItems,}).map((_, index) => (
-                    <li key={index} className="p-4 w-full border-2 border-border rounded-md space-y-3">
-                        <div className="flex justify-between items-center space-x-2">
-                            <div className="animate-pulse h-10 bg-[#ccc] rounded-md w-full max-w-sm" />
-                            <div className="animate-pulse h-10 bg-[#ccc] rounded-md w-10" />
-                        </div>
+  return (
+    <div className="w-full">
+      <ul className="mt-4 grid grid-cols-1 gap-5">
+        {Array.from({ length: amountItems }).map((_, index) => (
+          <li
+            key={index}
+            className="w-full space-y-3 rounded-md border-2 border-border p-4"
+          >
+            <div className="flex items-center justify-between space-x-2">
+              <div className="h-10 w-full max-w-sm animate-pulse rounded-md bg-[#ccc]" />
+              <div className="h-10 w-10 animate-pulse rounded-md bg-[#ccc]" />
+            </div>
 
-                        <div className="animate-pulse h-10 bg-[#ccc] rounded-md w-full max-w-xs" />
+            <div className="h-10 w-full max-w-xs animate-pulse rounded-md bg-[#ccc]" />
 
-                        <div className="border-b border-[#ccc] opacity-25"/>
+            <div className="border-b border-[#ccc] opacity-25" />
 
-                        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 md:grid-cols-4 gap-4 mt-5">
-                            {Array.from({length: 7}).map((_, index) => (
-                                <div
-                                    key={index}
-                                    className="animate-pulse h-8 bg-[#ccc] rounded-full w-full"
-                                />
-                            ))}
-                        </div>
+            <div className="mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-3">
+              {Array.from({ length: 7 }).map((_, index) => (
+                <div
+                  key={index}
+                  className="h-8 w-full animate-pulse rounded-full bg-[#ccc]"
+                />
+              ))}
+            </div>
 
-                        <div className="border-b border-[#ccc] opacity-25"/>
+            <div className="border-b border-[#ccc] opacity-25" />
 
-                        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 md:grid-cols-4 gap-4 mt-5">
-                            {Array.from({length: 7}).map((_, index) => (
-                                <div
-                                    key={index}
-                                    className="animate-pulse h-8 bg-[#ccc] rounded-full w-full"
-                                />
-                            ))}
-                        </div>
-                    </li>
-                ))}
-            </ul>
-        </div>
-    )
-}
+            <div className="mt-5 grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-3">
+              {Array.from({ length: 7 }).map((_, index) => (
+                <div
+                  key={index}
+                  className="h-8 w-full animate-pulse rounded-full bg-[#ccc]"
+                />
+              ))}
+            </div>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+};
 
-export { LoadingSkeleton }
\ No newline at end of file
+export { LoadingSkeleton };
diff --git a/src/components/LoadingSkeleton/index.ts b/src/components/LoadingSkeleton/index.ts
index df34651b..6de7b93a 100644
--- a/src/components/LoadingSkeleton/index.ts
+++ b/src/components/LoadingSkeleton/index.ts
@@ -1,3 +1,3 @@
-import { LoadingSkeleton } from "./LoadingSkeleton";
+import { LoadingSkeleton } from './LoadingSkeleton';
 
-export { LoadingSkeleton }
\ No newline at end of file
+export { LoadingSkeleton };
diff --git a/src/components/NoFoundSearch/NoFoundSearch.tsx b/src/components/NoFoundSearch/NoFoundSearch.tsx
index 1c38e59e..63d0fbe8 100644
--- a/src/components/NoFoundSearch/NoFoundSearch.tsx
+++ b/src/components/NoFoundSearch/NoFoundSearch.tsx
@@ -2,14 +2,14 @@ import { SearchX } from 'lucide-react';
 
 const NoFoundSearch = () => {
   return (
-    <div className="flex flex-col justify-center items-center text-center p-8 gap-2">
+    <div className="flex flex-col items-center justify-center gap-2 p-8 text-center">
       <SearchX size={64} className="text-[#677183]" />
 
-      <h1 className="text-[#2f2f2f] font-semibold text-[18px]">
+      <h1 className="text-[18px] font-semibold text-[#2f2f2f]">
         A sua busca não encontrou nenhum resultado{' '}
       </h1>
 
-      <h1 className="font-medium text-[#677183] text-[14px]">
+      <h1 className="text-[14px] font-medium text-[#677183]">
         Verifique os termos buscados e tente novamente
       </h1>
     </div>
diff --git a/src/components/SearchInput/SearchInput.tsx b/src/components/SearchInput/SearchInput.tsx
index cbd723d2..672abb2c 100644
--- a/src/components/SearchInput/SearchInput.tsx
+++ b/src/components/SearchInput/SearchInput.tsx
@@ -20,8 +20,8 @@ const SearchInput = React.forwardRef<HTMLDivElement, ISearchInputProps>(
           value={value}
           placeholder={placeholder}
           className={cn(
-            'h-12 text-md font-medium text-zinc-600 pl-10 pr-4',
-            inputClassName
+            'text-md h-12 pl-10 pr-4 font-medium text-zinc-600',
+            inputClassName,
           )}
           onChange={(ev) =>
             onChange ? onChange(ev.target.value ?? '') : undefined
@@ -33,7 +33,7 @@ const SearchInput = React.forwardRef<HTMLDivElement, ISearchInputProps>(
         </div>
       </div>
     );
-  }
+  },
 );
 
 export { SearchInput };
diff --git a/src/components/SelectField/SelectField.tsx b/src/components/SelectField/SelectField.tsx
index ae38104c..3fabf29c 100644
--- a/src/components/SelectField/SelectField.tsx
+++ b/src/components/SelectField/SelectField.tsx
@@ -43,7 +43,7 @@ const SelectField = React.forwardRef<HTMLDivElement, ISelectComponentProps>(
         </Select>
       </div>
     );
-  }
+  },
 );
 
 export { SelectField };
diff --git a/src/components/TextField/TextField.tsx b/src/components/TextField/TextField.tsx
index 43a2adf0..7b6f677d 100644
--- a/src/components/TextField/TextField.tsx
+++ b/src/components/TextField/TextField.tsx
@@ -19,7 +19,7 @@ const TextField = forwardRef<React.ElementRef<'input'>, TextFieldProps>(
     } = props;
 
     return (
-      <div className={cn('flex flex-col gap-2 w-full', containerClassName)}>
+      <div className={cn('flex w-full flex-col gap-2', containerClassName)}>
         <label
           htmlFor={name}
           className={cn('text-muted-foreground', labelClassName)}
@@ -34,13 +34,13 @@ const TextField = forwardRef<React.ElementRef<'input'>, TextFieldProps>(
           {...rest}
         />
         {helperText && (
-          <p className={cn(error ? 'text-red-600 text-sm' : '', className)}>
+          <p className={cn(error ? 'text-sm text-red-600' : '', className)}>
             {helperText}
           </p>
         )}
       </div>
     );
-  }
+  },
 );
 
 export { TextField };
diff --git a/src/components/VerifiedBadge/VerifiedBadge.tsx b/src/components/VerifiedBadge/VerifiedBadge.tsx
index 48629be7..f0f30619 100644
--- a/src/components/VerifiedBadge/VerifiedBadge.tsx
+++ b/src/components/VerifiedBadge/VerifiedBadge.tsx
@@ -6,7 +6,7 @@ const VerifiedBadge = () => {
     <WithTooltip content="Abrigo verificado">
       <BadgeCheck className="h-5 w-5 stroke-white" fill="#1D61C8" />
     </WithTooltip>
-  )
-}
+  );
+};
 
-export { VerifiedBadge };
\ No newline at end of file
+export { VerifiedBadge };
diff --git a/src/components/ui/accordion.tsx b/src/components/ui/accordion.tsx
index e6a723d0..4778f084 100644
--- a/src/components/ui/accordion.tsx
+++ b/src/components/ui/accordion.tsx
@@ -1,10 +1,10 @@
-import * as React from "react"
-import * as AccordionPrimitive from "@radix-ui/react-accordion"
-import { ChevronDown } from "lucide-react"
+import * as React from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { ChevronDown } from 'lucide-react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
-const Accordion = AccordionPrimitive.Root
+const Accordion = AccordionPrimitive.Root;
 
 const AccordionItem = React.forwardRef<
   React.ElementRef<typeof AccordionPrimitive.Item>,
@@ -12,11 +12,11 @@ const AccordionItem = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <AccordionPrimitive.Item
     ref={ref}
-    className={cn("border-b", className)}
+    className={cn('border-b', className)}
     {...props}
   />
-))
-AccordionItem.displayName = "AccordionItem"
+));
+AccordionItem.displayName = 'AccordionItem';
 
 const AccordionTrigger = React.forwardRef<
   React.ElementRef<typeof AccordionPrimitive.Trigger>,
@@ -26,8 +26,8 @@ const AccordionTrigger = React.forwardRef<
     <AccordionPrimitive.Trigger
       ref={ref}
       className={cn(
-        "flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180",
-        className
+        'flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180',
+        className,
       )}
       {...props}
     >
@@ -35,8 +35,8 @@ const AccordionTrigger = React.forwardRef<
       <ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200" />
     </AccordionPrimitive.Trigger>
   </AccordionPrimitive.Header>
-))
-AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
+));
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
 
 const AccordionContent = React.forwardRef<
   React.ElementRef<typeof AccordionPrimitive.Content>,
@@ -47,10 +47,10 @@ const AccordionContent = React.forwardRef<
     className="overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
     {...props}
   >
-    <div className={cn("pb-4 pt-0", className)}>{children}</div>
+    <div className={cn('pb-4 pt-0', className)}>{children}</div>
   </AccordionPrimitive.Content>
-))
+));
 
-AccordionContent.displayName = AccordionPrimitive.Content.displayName
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
 
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
diff --git a/src/components/ui/badge-variants.tsx b/src/components/ui/badge-variants.tsx
index bee7c587..ff3eb80b 100644
--- a/src/components/ui/badge-variants.tsx
+++ b/src/components/ui/badge-variants.tsx
@@ -1,23 +1,23 @@
-import { cva } from "class-variance-authority";
+import { cva } from 'class-variance-authority';
 
 const badgeVariants = cva(
-  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
   {
     variants: {
       variant: {
         default:
-          "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+          'border-transparent bg-primary text-primary-foreground hover:bg-primary/80',
         secondary:
-          "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+          'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
         destructive:
-          "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
-        outline: "text-foreground",
+          'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80',
+        outline: 'text-foreground',
       },
     },
     defaultVariants: {
-      variant: "default",
+      variant: 'default',
     },
-  }
+  },
 );
 
 export { badgeVariants };
diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx
index aeaf8fb0..581b5c44 100644
--- a/src/components/ui/badge.tsx
+++ b/src/components/ui/badge.tsx
@@ -1,8 +1,8 @@
-import * as React from "react";
-import { type VariantProps } from "class-variance-authority";
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
 
-import { cn } from "@/lib/utils";
-import { badgeVariants } from "./badge-variants";
+import { cn } from '@/lib/utils';
+import { badgeVariants } from './badge-variants';
 
 export interface BadgeProps
   extends React.HTMLAttributes<HTMLDivElement>,
diff --git a/src/components/ui/button-variants.tsx b/src/components/ui/button-variants.tsx
index d997ddee..e6e61037 100644
--- a/src/components/ui/button-variants.tsx
+++ b/src/components/ui/button-variants.tsx
@@ -26,7 +26,7 @@ const buttonVariants = cva(
       variant: 'default',
       size: 'default',
     },
-  }
+  },
 );
 
 export { buttonVariants };
diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
index 70280b11..3abac98c 100644
--- a/src/components/ui/button.tsx
+++ b/src/components/ui/button.tsx
@@ -25,7 +25,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
       asChild = false,
       ...props
     },
-    ref
+    ref,
   ) => {
     const Comp = asChild ? Slot : 'button';
     return (
@@ -35,10 +35,10 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
         disabled={loading || disabled}
         {...props}
       >
-        {loading ? <Loader className="w-4 h-4 animate-spin" /> : children}
+        {loading ? <Loader className="h-4 w-4 animate-spin" /> : children}
       </Comp>
     );
-  }
+  },
 );
 Button.displayName = 'Button';
 
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
index afa13ecf..3028066c 100644
--- a/src/components/ui/card.tsx
+++ b/src/components/ui/card.tsx
@@ -1,6 +1,6 @@
-import * as React from "react"
+import * as React from 'react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 const Card = React.forwardRef<
   HTMLDivElement,
@@ -9,13 +9,13 @@ const Card = React.forwardRef<
   <div
     ref={ref}
     className={cn(
-      "rounded-lg border bg-card text-card-foreground shadow-sm",
-      className
+      'rounded-lg border bg-card text-card-foreground shadow-sm',
+      className,
     )}
     {...props}
   />
-))
-Card.displayName = "Card"
+));
+Card.displayName = 'Card';
 
 const CardHeader = React.forwardRef<
   HTMLDivElement,
@@ -23,11 +23,11 @@ const CardHeader = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <div
     ref={ref}
-    className={cn("flex flex-col space-y-1.5 p-6", className)}
+    className={cn('flex flex-col space-y-1.5 p-6', className)}
     {...props}
   />
-))
-CardHeader.displayName = "CardHeader"
+));
+CardHeader.displayName = 'CardHeader';
 
 const CardTitle = React.forwardRef<
   HTMLParagraphElement,
@@ -36,13 +36,13 @@ const CardTitle = React.forwardRef<
   <h3
     ref={ref}
     className={cn(
-      "text-2xl font-semibold leading-none tracking-tight",
-      className
+      'text-2xl font-semibold leading-none tracking-tight',
+      className,
     )}
     {...props}
   />
-))
-CardTitle.displayName = "CardTitle"
+));
+CardTitle.displayName = 'CardTitle';
 
 const CardDescription = React.forwardRef<
   HTMLParagraphElement,
@@ -50,19 +50,19 @@ const CardDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <p
     ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
+    className={cn('text-sm text-muted-foreground', className)}
     {...props}
   />
-))
-CardDescription.displayName = "CardDescription"
+));
+CardDescription.displayName = 'CardDescription';
 
 const CardContent = React.forwardRef<
   HTMLDivElement,
   React.HTMLAttributes<HTMLDivElement>
 >(({ className, ...props }, ref) => (
-  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
-))
-CardContent.displayName = "CardContent"
+  <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />
+));
+CardContent.displayName = 'CardContent';
 
 const CardFooter = React.forwardRef<
   HTMLDivElement,
@@ -70,10 +70,17 @@ const CardFooter = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <div
     ref={ref}
-    className={cn("flex items-center p-6 pt-0", className)}
+    className={cn('flex items-center p-6 pt-0', className)}
     {...props}
   />
-))
-CardFooter.displayName = "CardFooter"
+));
+CardFooter.displayName = 'CardFooter';
 
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
+export {
+  Card,
+  CardHeader,
+  CardFooter,
+  CardTitle,
+  CardDescription,
+  CardContent,
+};
diff --git a/src/components/ui/checkbox.tsx b/src/components/ui/checkbox.tsx
index ddbdd01d..e498e80f 100644
--- a/src/components/ui/checkbox.tsx
+++ b/src/components/ui/checkbox.tsx
@@ -1,8 +1,8 @@
-import * as React from "react"
-import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
-import { Check } from "lucide-react"
+import * as React from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { Check } from 'lucide-react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 const Checkbox = React.forwardRef<
   React.ElementRef<typeof CheckboxPrimitive.Root>,
@@ -11,18 +11,18 @@ const Checkbox = React.forwardRef<
   <CheckboxPrimitive.Root
     ref={ref}
     className={cn(
-      "peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
-      className
+      'peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',
+      className,
     )}
     {...props}
   >
     <CheckboxPrimitive.Indicator
-      className={cn("flex items-center justify-center text-current")}
+      className={cn('flex items-center justify-center text-current')}
     >
       <Check className="h-4 w-4" />
     </CheckboxPrimitive.Indicator>
   </CheckboxPrimitive.Root>
-))
-Checkbox.displayName = CheckboxPrimitive.Root.displayName
+));
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
 
-export { Checkbox }
+export { Checkbox };
diff --git a/src/components/ui/dialog.tsx b/src/components/ui/dialog.tsx
index c23630eb..7c393c06 100644
--- a/src/components/ui/dialog.tsx
+++ b/src/components/ui/dialog.tsx
@@ -1,16 +1,16 @@
-import * as React from "react"
-import * as DialogPrimitive from "@radix-ui/react-dialog"
-import { X } from "lucide-react"
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { X } from 'lucide-react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
-const Dialog = DialogPrimitive.Root
+const Dialog = DialogPrimitive.Root;
 
-const DialogTrigger = DialogPrimitive.Trigger
+const DialogTrigger = DialogPrimitive.Trigger;
 
-const DialogPortal = DialogPrimitive.Portal
+const DialogPortal = DialogPrimitive.Portal;
 
-const DialogClose = DialogPrimitive.Close
+const DialogClose = DialogPrimitive.Close;
 
 const DialogOverlay = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Overlay>,
@@ -19,13 +19,13 @@ const DialogOverlay = React.forwardRef<
   <DialogPrimitive.Overlay
     ref={ref}
     className={cn(
-      "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
+      'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
+      className,
     )}
     {...props}
   />
-))
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 
 const DialogContent = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Content>,
@@ -36,8 +36,8 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
-        className
+        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',
+        className,
       )}
       {...props}
     >
@@ -48,8 +48,8 @@ const DialogContent = React.forwardRef<
       </DialogPrimitive.Close>
     </DialogPrimitive.Content>
   </DialogPortal>
-))
-DialogContent.displayName = DialogPrimitive.Content.displayName
+));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
 
 const DialogHeader = ({
   className,
@@ -57,13 +57,13 @@ const DialogHeader = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col space-y-1.5 text-center sm:text-left",
-      className
+      'flex flex-col space-y-1.5 text-center sm:text-left',
+      className,
     )}
     {...props}
   />
-)
-DialogHeader.displayName = "DialogHeader"
+);
+DialogHeader.displayName = 'DialogHeader';
 
 const DialogFooter = ({
   className,
@@ -71,13 +71,13 @@ const DialogFooter = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
+      'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
+      className,
     )}
     {...props}
   />
-)
-DialogFooter.displayName = "DialogFooter"
+);
+DialogFooter.displayName = 'DialogFooter';
 
 const DialogTitle = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Title>,
@@ -86,13 +86,13 @@ const DialogTitle = React.forwardRef<
   <DialogPrimitive.Title
     ref={ref}
     className={cn(
-      "text-lg font-semibold leading-none tracking-tight",
-      className
+      'text-lg font-semibold leading-none tracking-tight',
+      className,
     )}
     {...props}
   />
-))
-DialogTitle.displayName = DialogPrimitive.Title.displayName
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
 
 const DialogDescription = React.forwardRef<
   React.ElementRef<typeof DialogPrimitive.Description>,
@@ -100,11 +100,11 @@ const DialogDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <DialogPrimitive.Description
     ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
+    className={cn('text-sm text-muted-foreground', className)}
     {...props}
   />
-))
-DialogDescription.displayName = DialogPrimitive.Description.displayName
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 export {
   Dialog,
@@ -117,4 +117,4 @@ export {
   DialogFooter,
   DialogTitle,
   DialogDescription,
-}
+};
diff --git a/src/components/ui/form.tsx b/src/components/ui/form.tsx
index 1f88c34a..ee4038d3 100644
--- a/src/components/ui/form.tsx
+++ b/src/components/ui/form.tsx
@@ -17,18 +17,18 @@ const Form = FormProvider;
 
 type FormFieldContextValue<
   TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
 > = {
   name: TName;
 };
 
 const FormFieldContext = React.createContext<FormFieldContextValue>(
-  {} as FormFieldContextValue
+  {} as FormFieldContextValue,
 );
 
 const FormField = <
   TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
+  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
 >({
   ...props
 }: ControllerProps<TFieldValues, TName>) => {
@@ -67,7 +67,7 @@ type FormItemContextValue = {
 };
 
 const FormItemContext = React.createContext<FormItemContextValue>(
-  {} as FormItemContextValue
+  {} as FormItemContextValue,
 );
 
 const FormItem = React.forwardRef<
diff --git a/src/components/ui/input.tsx b/src/components/ui/input.tsx
index 677d05fd..36d26595 100644
--- a/src/components/ui/input.tsx
+++ b/src/components/ui/input.tsx
@@ -1,6 +1,6 @@
-import * as React from "react"
+import * as React from 'react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 export interface InputProps
   extends React.InputHTMLAttributes<HTMLInputElement> {}
@@ -11,15 +11,15 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
       <input
         type={type}
         className={cn(
-          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-          className
+          'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+          className,
         )}
         ref={ref}
         {...props}
       />
-    )
-  }
-)
-Input.displayName = "Input"
+    );
+  },
+);
+Input.displayName = 'Input';
 
-export { Input }
+export { Input };
diff --git a/src/components/ui/label.tsx b/src/components/ui/label.tsx
index 683faa79..cebc5114 100644
--- a/src/components/ui/label.tsx
+++ b/src/components/ui/label.tsx
@@ -1,12 +1,12 @@
-import * as React from "react"
-import * as LabelPrimitive from "@radix-ui/react-label"
-import { cva, type VariantProps } from "class-variance-authority"
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { cva, type VariantProps } from 'class-variance-authority';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 const labelVariants = cva(
-  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-)
+  'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
+);
 
 const Label = React.forwardRef<
   React.ElementRef<typeof LabelPrimitive.Root>,
@@ -18,7 +18,7 @@ const Label = React.forwardRef<
     className={cn(labelVariants(), className)}
     {...props}
   />
-))
-Label.displayName = LabelPrimitive.Root.displayName
+));
+Label.displayName = LabelPrimitive.Root.displayName;
 
-export { Label }
+export { Label };
diff --git a/src/components/ui/radio-group.tsx b/src/components/ui/radio-group.tsx
index 43b43b48..25ee290b 100644
--- a/src/components/ui/radio-group.tsx
+++ b/src/components/ui/radio-group.tsx
@@ -1,8 +1,8 @@
-import * as React from "react"
-import * as RadioGroupPrimitive from "@radix-ui/react-radio-group"
-import { Circle } from "lucide-react"
+import * as React from 'react';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import { Circle } from 'lucide-react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 const RadioGroup = React.forwardRef<
   React.ElementRef<typeof RadioGroupPrimitive.Root>,
@@ -10,13 +10,13 @@ const RadioGroup = React.forwardRef<
 >(({ className, ...props }, ref) => {
   return (
     <RadioGroupPrimitive.Root
-      className={cn("grid gap-2", className)}
+      className={cn('grid gap-2', className)}
       {...props}
       ref={ref}
     />
-  )
-})
-RadioGroup.displayName = RadioGroupPrimitive.Root.displayName
+  );
+});
+RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
 
 const RadioGroupItem = React.forwardRef<
   React.ElementRef<typeof RadioGroupPrimitive.Item>,
@@ -26,8 +26,8 @@ const RadioGroupItem = React.forwardRef<
     <RadioGroupPrimitive.Item
       ref={ref}
       className={cn(
-        "aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-        className
+        'aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+        className,
       )}
       {...props}
     >
@@ -35,8 +35,8 @@ const RadioGroupItem = React.forwardRef<
         <Circle className="h-2.5 w-2.5 fill-current text-current" />
       </RadioGroupPrimitive.Indicator>
     </RadioGroupPrimitive.Item>
-  )
-})
-RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName
+  );
+});
+RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
 
-export { RadioGroup, RadioGroupItem }
+export { RadioGroup, RadioGroupItem };
diff --git a/src/components/ui/select.tsx b/src/components/ui/select.tsx
index fe56d4d3..ada940f4 100644
--- a/src/components/ui/select.tsx
+++ b/src/components/ui/select.tsx
@@ -1,14 +1,14 @@
-import * as React from "react"
-import * as SelectPrimitive from "@radix-ui/react-select"
-import { Check, ChevronDown, ChevronUp } from "lucide-react"
+import * as React from 'react';
+import * as SelectPrimitive from '@radix-ui/react-select';
+import { Check, ChevronDown, ChevronUp } from 'lucide-react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
-const Select = SelectPrimitive.Root
+const Select = SelectPrimitive.Root;
 
-const SelectGroup = SelectPrimitive.Group
+const SelectGroup = SelectPrimitive.Group;
 
-const SelectValue = SelectPrimitive.Value
+const SelectValue = SelectPrimitive.Value;
 
 const SelectTrigger = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Trigger>,
@@ -17,8 +17,8 @@ const SelectTrigger = React.forwardRef<
   <SelectPrimitive.Trigger
     ref={ref}
     className={cn(
-      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
-      className
+      'flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
+      className,
     )}
     {...props}
   >
@@ -27,8 +27,8 @@ const SelectTrigger = React.forwardRef<
       <ChevronDown className="h-4 w-4 opacity-50" />
     </SelectPrimitive.Icon>
   </SelectPrimitive.Trigger>
-))
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
+));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
 
 const SelectScrollUpButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
@@ -37,15 +37,15 @@ const SelectScrollUpButton = React.forwardRef<
   <SelectPrimitive.ScrollUpButton
     ref={ref}
     className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
+      'flex cursor-default items-center justify-center py-1',
+      className,
     )}
     {...props}
   >
     <ChevronUp className="h-4 w-4" />
   </SelectPrimitive.ScrollUpButton>
-))
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
 
 const SelectScrollDownButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
@@ -54,29 +54,29 @@ const SelectScrollDownButton = React.forwardRef<
   <SelectPrimitive.ScrollDownButton
     ref={ref}
     className={cn(
-      "flex cursor-default items-center justify-center py-1",
-      className
+      'flex cursor-default items-center justify-center py-1',
+      className,
     )}
     {...props}
   >
     <ChevronDown className="h-4 w-4" />
   </SelectPrimitive.ScrollDownButton>
-))
+));
 SelectScrollDownButton.displayName =
-  SelectPrimitive.ScrollDownButton.displayName
+  SelectPrimitive.ScrollDownButton.displayName;
 
 const SelectContent = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
->(({ className, children, position = "popper", ...props }, ref) => (
+>(({ className, children, position = 'popper', ...props }, ref) => (
   <SelectPrimitive.Portal>
     <SelectPrimitive.Content
       ref={ref}
       className={cn(
-        "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-        position === "popper" &&
-          "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-        className
+        'relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
+        position === 'popper' &&
+          'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
+        className,
       )}
       position={position}
       {...props}
@@ -84,9 +84,9 @@ const SelectContent = React.forwardRef<
       <SelectScrollUpButton />
       <SelectPrimitive.Viewport
         className={cn(
-          "p-1",
-          position === "popper" &&
-            "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+          'p-1',
+          position === 'popper' &&
+            'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]',
         )}
       >
         {children}
@@ -94,8 +94,8 @@ const SelectContent = React.forwardRef<
       <SelectScrollDownButton />
     </SelectPrimitive.Content>
   </SelectPrimitive.Portal>
-))
-SelectContent.displayName = SelectPrimitive.Content.displayName
+));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
 
 const SelectLabel = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Label>,
@@ -103,11 +103,11 @@ const SelectLabel = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.Label
     ref={ref}
-    className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
+    className={cn('py-1.5 pl-8 pr-2 text-sm font-semibold', className)}
     {...props}
   />
-))
-SelectLabel.displayName = SelectPrimitive.Label.displayName
+));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
 
 const SelectItem = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Item>,
@@ -116,8 +116,8 @@ const SelectItem = React.forwardRef<
   <SelectPrimitive.Item
     ref={ref}
     className={cn(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+      'relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+      className,
     )}
     {...props}
   >
@@ -129,8 +129,8 @@ const SelectItem = React.forwardRef<
 
     <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
   </SelectPrimitive.Item>
-))
-SelectItem.displayName = SelectPrimitive.Item.displayName
+));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
 
 const SelectSeparator = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Separator>,
@@ -138,11 +138,11 @@ const SelectSeparator = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.Separator
     ref={ref}
-    className={cn("-mx-1 my-1 h-px bg-muted", className)}
+    className={cn('-mx-1 my-1 h-px bg-muted', className)}
     {...props}
   />
-))
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
 
 export {
   Select,
@@ -155,4 +155,4 @@ export {
   SelectSeparator,
   SelectScrollUpButton,
   SelectScrollDownButton,
-}
+};
diff --git a/src/components/ui/separator.tsx b/src/components/ui/separator.tsx
index 6d7f1226..d60f7f60 100644
--- a/src/components/ui/separator.tsx
+++ b/src/components/ui/separator.tsx
@@ -1,29 +1,29 @@
-import * as React from "react"
-import * as SeparatorPrimitive from "@radix-ui/react-separator"
+import * as React from 'react';
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
 const Separator = React.forwardRef<
   React.ElementRef<typeof SeparatorPrimitive.Root>,
   React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
 >(
   (
-    { className, orientation = "horizontal", decorative = true, ...props },
-    ref
+    { className, orientation = 'horizontal', decorative = true, ...props },
+    ref,
   ) => (
     <SeparatorPrimitive.Root
       ref={ref}
       decorative={decorative}
       orientation={orientation}
       className={cn(
-        "shrink-0 bg-border",
-        orientation === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]",
-        className
+        'shrink-0 bg-border',
+        orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',
+        className,
       )}
       {...props}
     />
-  )
-)
-Separator.displayName = SeparatorPrimitive.Root.displayName
+  ),
+);
+Separator.displayName = SeparatorPrimitive.Root.displayName;
 
-export { Separator }
+export { Separator };
diff --git a/src/components/ui/sheet.tsx b/src/components/ui/sheet.tsx
index d64a6fa7..ecaf9762 100644
--- a/src/components/ui/sheet.tsx
+++ b/src/components/ui/sheet.tsx
@@ -1,17 +1,17 @@
-import * as React from "react"
-import * as SheetPrimitive from "@radix-ui/react-dialog"
-import { cva, type VariantProps } from "class-variance-authority"
-import { X } from "lucide-react"
+import * as React from 'react';
+import * as SheetPrimitive from '@radix-ui/react-dialog';
+import { cva, type VariantProps } from 'class-variance-authority';
+import { X } from 'lucide-react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
-const Sheet = SheetPrimitive.Root
+const Sheet = SheetPrimitive.Root;
 
-const SheetTrigger = SheetPrimitive.Trigger
+const SheetTrigger = SheetPrimitive.Trigger;
 
-const SheetClose = SheetPrimitive.Close
+const SheetClose = SheetPrimitive.Close;
 
-const SheetPortal = SheetPrimitive.Portal
+const SheetPortal = SheetPrimitive.Portal;
 
 const SheetOverlay = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Overlay>,
@@ -19,33 +19,33 @@ const SheetOverlay = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Overlay
     className={cn(
-      "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
+      'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
+      className,
     )}
     {...props}
     ref={ref}
   />
-))
-SheetOverlay.displayName = SheetPrimitive.Overlay.displayName
+));
+SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
 
 const sheetVariants = cva(
-  "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
+  'fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500',
   {
     variants: {
       side: {
-        top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
+        top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
         bottom:
-          "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
-        left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
+          'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
+        left: 'inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',
         right:
-          "inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
+          'inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',
       },
     },
     defaultVariants: {
-      side: "right",
+      side: 'right',
     },
-  }
-)
+  },
+);
 
 interface SheetContentProps
   extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,
@@ -54,7 +54,7 @@ interface SheetContentProps
 const SheetContent = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Content>,
   SheetContentProps
->(({ side = "right", className, children, ...props }, ref) => (
+>(({ side = 'right', className, children, ...props }, ref) => (
   <SheetPortal>
     <SheetOverlay />
     <SheetPrimitive.Content
@@ -69,8 +69,8 @@ const SheetContent = React.forwardRef<
       </SheetPrimitive.Close>
     </SheetPrimitive.Content>
   </SheetPortal>
-))
-SheetContent.displayName = SheetPrimitive.Content.displayName
+));
+SheetContent.displayName = SheetPrimitive.Content.displayName;
 
 const SheetHeader = ({
   className,
@@ -78,13 +78,13 @@ const SheetHeader = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
-      className
+      'flex flex-col space-y-2 text-center sm:text-left',
+      className,
     )}
     {...props}
   />
-)
-SheetHeader.displayName = "SheetHeader"
+);
+SheetHeader.displayName = 'SheetHeader';
 
 const SheetFooter = ({
   className,
@@ -92,13 +92,13 @@ const SheetFooter = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
+      'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
+      className,
     )}
     {...props}
   />
-)
-SheetFooter.displayName = "SheetFooter"
+);
+SheetFooter.displayName = 'SheetFooter';
 
 const SheetTitle = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Title>,
@@ -106,11 +106,11 @@ const SheetTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Title
     ref={ref}
-    className={cn("text-lg font-semibold text-foreground", className)}
+    className={cn('text-lg font-semibold text-foreground', className)}
     {...props}
   />
-))
-SheetTitle.displayName = SheetPrimitive.Title.displayName
+));
+SheetTitle.displayName = SheetPrimitive.Title.displayName;
 
 const SheetDescription = React.forwardRef<
   React.ElementRef<typeof SheetPrimitive.Description>,
@@ -118,11 +118,11 @@ const SheetDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SheetPrimitive.Description
     ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
+    className={cn('text-sm text-muted-foreground', className)}
     {...props}
   />
-))
-SheetDescription.displayName = SheetPrimitive.Description.displayName
+));
+SheetDescription.displayName = SheetPrimitive.Description.displayName;
 
 export {
   Sheet,
@@ -135,4 +135,4 @@ export {
   SheetFooter,
   SheetTitle,
   SheetDescription,
-}
+};
diff --git a/src/components/ui/tabs.tsx b/src/components/ui/tabs.tsx
index f57fffdb..737a81c4 100644
--- a/src/components/ui/tabs.tsx
+++ b/src/components/ui/tabs.tsx
@@ -1,9 +1,9 @@
-import * as React from "react"
-import * as TabsPrimitive from "@radix-ui/react-tabs"
+import * as React from 'react';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
-const Tabs = TabsPrimitive.Root
+const Tabs = TabsPrimitive.Root;
 
 const TabsList = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.List>,
@@ -12,13 +12,13 @@ const TabsList = React.forwardRef<
   <TabsPrimitive.List
     ref={ref}
     className={cn(
-      "inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
-      className
+      'inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground',
+      className,
     )}
     {...props}
   />
-))
-TabsList.displayName = TabsPrimitive.List.displayName
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
 
 const TabsTrigger = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Trigger>,
@@ -27,13 +27,13 @@ const TabsTrigger = React.forwardRef<
   <TabsPrimitive.Trigger
     ref={ref}
     className={cn(
-      "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
-      className
+      'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm',
+      className,
     )}
     {...props}
   />
-))
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
 
 const TabsContent = React.forwardRef<
   React.ElementRef<typeof TabsPrimitive.Content>,
@@ -42,12 +42,12 @@ const TabsContent = React.forwardRef<
   <TabsPrimitive.Content
     ref={ref}
     className={cn(
-      "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-      className
+      'mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
+      className,
     )}
     {...props}
   />
-))
-TabsContent.displayName = TabsPrimitive.Content.displayName
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
 
-export { Tabs, TabsList, TabsTrigger, TabsContent }
+export { Tabs, TabsList, TabsTrigger, TabsContent };
diff --git a/src/components/ui/toast.tsx b/src/components/ui/toast.tsx
index a8224775..ffe252a0 100644
--- a/src/components/ui/toast.tsx
+++ b/src/components/ui/toast.tsx
@@ -1,11 +1,11 @@
-import * as React from "react"
-import * as ToastPrimitives from "@radix-ui/react-toast"
-import { cva, type VariantProps } from "class-variance-authority"
-import { X } from "lucide-react"
+import * as React from 'react';
+import * as ToastPrimitives from '@radix-ui/react-toast';
+import { cva, type VariantProps } from 'class-variance-authority';
+import { X } from 'lucide-react';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
-const ToastProvider = ToastPrimitives.Provider
+const ToastProvider = ToastPrimitives.Provider;
 
 const ToastViewport = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Viewport>,
@@ -14,29 +14,29 @@ const ToastViewport = React.forwardRef<
   <ToastPrimitives.Viewport
     ref={ref}
     className={cn(
-      "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
-      className
+      'fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]',
+      className,
     )}
     {...props}
   />
-))
-ToastViewport.displayName = ToastPrimitives.Viewport.displayName
+));
+ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
 
 const toastVariants = cva(
-  "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
+  'group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full',
   {
     variants: {
       variant: {
-        default: "border bg-background text-foreground",
+        default: 'border bg-background text-foreground',
         destructive:
-          "destructive group border-destructive bg-destructive text-destructive-foreground",
+          'destructive group border-destructive bg-destructive text-destructive-foreground',
       },
     },
     defaultVariants: {
-      variant: "default",
+      variant: 'default',
     },
-  }
-)
+  },
+);
 
 const Toast = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Root>,
@@ -49,9 +49,9 @@ const Toast = React.forwardRef<
       className={cn(toastVariants({ variant }), className)}
       {...props}
     />
-  )
-})
-Toast.displayName = ToastPrimitives.Root.displayName
+  );
+});
+Toast.displayName = ToastPrimitives.Root.displayName;
 
 const ToastAction = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Action>,
@@ -60,13 +60,13 @@ const ToastAction = React.forwardRef<
   <ToastPrimitives.Action
     ref={ref}
     className={cn(
-      "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
-      className
+      'inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive',
+      className,
     )}
     {...props}
   />
-))
-ToastAction.displayName = ToastPrimitives.Action.displayName
+));
+ToastAction.displayName = ToastPrimitives.Action.displayName;
 
 const ToastClose = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Close>,
@@ -75,16 +75,16 @@ const ToastClose = React.forwardRef<
   <ToastPrimitives.Close
     ref={ref}
     className={cn(
-      "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
-      className
+      'absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
+      className,
     )}
     toast-close=""
     {...props}
   >
     <X className="h-4 w-4" />
   </ToastPrimitives.Close>
-))
-ToastClose.displayName = ToastPrimitives.Close.displayName
+));
+ToastClose.displayName = ToastPrimitives.Close.displayName;
 
 const ToastTitle = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Title>,
@@ -92,11 +92,11 @@ const ToastTitle = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <ToastPrimitives.Title
     ref={ref}
-    className={cn("text-sm font-semibold", className)}
+    className={cn('text-sm font-semibold', className)}
     {...props}
   />
-))
-ToastTitle.displayName = ToastPrimitives.Title.displayName
+));
+ToastTitle.displayName = ToastPrimitives.Title.displayName;
 
 const ToastDescription = React.forwardRef<
   React.ElementRef<typeof ToastPrimitives.Description>,
@@ -104,15 +104,15 @@ const ToastDescription = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <ToastPrimitives.Description
     ref={ref}
-    className={cn("text-sm opacity-90", className)}
+    className={cn('text-sm opacity-90', className)}
     {...props}
   />
-))
-ToastDescription.displayName = ToastPrimitives.Description.displayName
+));
+ToastDescription.displayName = ToastPrimitives.Description.displayName;
 
-type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>
+type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
 
-type ToastActionElement = React.ReactElement<typeof ToastAction>
+type ToastActionElement = React.ReactElement<typeof ToastAction>;
 
 export {
   type ToastProps,
@@ -124,4 +124,4 @@ export {
   ToastDescription,
   ToastClose,
   ToastAction,
-}
+};
diff --git a/src/components/ui/toaster.tsx b/src/components/ui/toaster.tsx
index a2209ba5..544056ec 100644
--- a/src/components/ui/toaster.tsx
+++ b/src/components/ui/toaster.tsx
@@ -5,11 +5,11 @@ import {
   ToastProvider,
   ToastTitle,
   ToastViewport,
-} from "@/components/ui/toast"
-import { useToast } from "@/components/ui/use-toast"
+} from '@/components/ui/toast';
+import { useToast } from '@/components/ui/use-toast';
 
 export function Toaster() {
-  const { toasts } = useToast()
+  const { toasts } = useToast();
 
   return (
     <ToastProvider>
@@ -25,9 +25,9 @@ export function Toaster() {
             {action}
             <ToastClose />
           </Toast>
-        )
+        );
       })}
       <ToastViewport />
     </ToastProvider>
-  )
+  );
 }
diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx
index e121f0ae..109dc845 100644
--- a/src/components/ui/tooltip.tsx
+++ b/src/components/ui/tooltip.tsx
@@ -1,13 +1,13 @@
-import * as React from "react"
-import * as TooltipPrimitive from "@radix-ui/react-tooltip"
+import * as React from 'react';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
 
-const TooltipProvider = TooltipPrimitive.Provider
+const TooltipProvider = TooltipPrimitive.Provider;
 
-const Tooltip = TooltipPrimitive.Root
+const Tooltip = TooltipPrimitive.Root;
 
-const TooltipTrigger = TooltipPrimitive.Trigger
+const TooltipTrigger = TooltipPrimitive.Trigger;
 
 const TooltipContent = React.forwardRef<
   React.ElementRef<typeof TooltipPrimitive.Content>,
@@ -17,12 +17,12 @@ const TooltipContent = React.forwardRef<
     ref={ref}
     sideOffset={sideOffset}
     className={cn(
-      "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
+      'z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
+      className,
     )}
     {...props}
   />
-))
-TooltipContent.displayName = TooltipPrimitive.Content.displayName
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
diff --git a/src/components/ui/use-toast.ts b/src/components/ui/use-toast.ts
index 16713070..99d1e551 100644
--- a/src/components/ui/use-toast.ts
+++ b/src/components/ui/use-toast.ts
@@ -1,104 +1,101 @@
 // Inspired by react-hot-toast library
-import * as React from "react"
+import * as React from 'react';
 
-import type {
-  ToastActionElement,
-  ToastProps,
-} from "@/components/ui/toast"
+import type { ToastActionElement, ToastProps } from '@/components/ui/toast';
 
-const TOAST_LIMIT = 1
-const TOAST_REMOVE_DELAY = 1000000
+const TOAST_LIMIT = 1;
+const TOAST_REMOVE_DELAY = 1000000;
 
 type ToasterToast = ToastProps & {
-  id: string
-  title?: React.ReactNode
-  description?: React.ReactNode
-  action?: ToastActionElement
-}
+  id: string;
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  action?: ToastActionElement;
+};
 
 const actionTypes = {
-  ADD_TOAST: "ADD_TOAST",
-  UPDATE_TOAST: "UPDATE_TOAST",
-  DISMISS_TOAST: "DISMISS_TOAST",
-  REMOVE_TOAST: "REMOVE_TOAST",
-} as const
+  ADD_TOAST: 'ADD_TOAST',
+  UPDATE_TOAST: 'UPDATE_TOAST',
+  DISMISS_TOAST: 'DISMISS_TOAST',
+  REMOVE_TOAST: 'REMOVE_TOAST',
+} as const;
 
-let count = 0
+let count = 0;
 
 function genId() {
-  count = (count + 1) % Number.MAX_SAFE_INTEGER
-  return count.toString()
+  count = (count + 1) % Number.MAX_SAFE_INTEGER;
+  return count.toString();
 }
 
-type ActionType = typeof actionTypes
+type ActionType = typeof actionTypes;
 
 type Action =
   | {
-      type: ActionType["ADD_TOAST"]
-      toast: ToasterToast
+      type: ActionType['ADD_TOAST'];
+      toast: ToasterToast;
     }
   | {
-      type: ActionType["UPDATE_TOAST"]
-      toast: Partial<ToasterToast>
+      type: ActionType['UPDATE_TOAST'];
+      toast: Partial<ToasterToast>;
     }
   | {
-      type: ActionType["DISMISS_TOAST"]
-      toastId?: ToasterToast["id"]
+      type: ActionType['DISMISS_TOAST'];
+      toastId?: ToasterToast['id'];
     }
   | {
-      type: ActionType["REMOVE_TOAST"]
-      toastId?: ToasterToast["id"]
-    }
+      type: ActionType['REMOVE_TOAST'];
+      toastId?: ToasterToast['id'];
+    };
 
 interface State {
-  toasts: ToasterToast[]
+  toasts: ToasterToast[];
 }
 
-const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>()
+const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
 
 const addToRemoveQueue = (toastId: string) => {
   if (toastTimeouts.has(toastId)) {
-    return
+    return;
   }
 
   const timeout = setTimeout(() => {
-    toastTimeouts.delete(toastId)
+    toastTimeouts.delete(toastId);
     dispatch({
-      type: "REMOVE_TOAST",
+      type: 'REMOVE_TOAST',
       toastId: toastId,
-    })
-  }, TOAST_REMOVE_DELAY)
+    });
+  }, TOAST_REMOVE_DELAY);
 
-  toastTimeouts.set(toastId, timeout)
-}
+  toastTimeouts.set(toastId, timeout);
+};
 
 export const reducer = (state: State, action: Action): State => {
   switch (action.type) {
-    case "ADD_TOAST":
+    case 'ADD_TOAST':
       return {
         ...state,
         toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
-      }
+      };
 
-    case "UPDATE_TOAST":
+    case 'UPDATE_TOAST':
       return {
         ...state,
         toasts: state.toasts.map((t) =>
-          t.id === action.toast.id ? { ...t, ...action.toast } : t
+          t.id === action.toast.id ? { ...t, ...action.toast } : t,
         ),
-      }
+      };
 
-    case "DISMISS_TOAST": {
-      const { toastId } = action
+    case 'DISMISS_TOAST': {
+      const { toastId } = action;
 
       // ! Side effects ! - This could be extracted into a dismissToast() action,
       // but I'll keep it here for simplicity
       if (toastId) {
-        addToRemoveQueue(toastId)
+        addToRemoveQueue(toastId);
       } else {
         state.toasts.forEach((toast) => {
-          addToRemoveQueue(toast.id)
-        })
+          addToRemoveQueue(toast.id);
+        });
       }
 
       return {
@@ -109,84 +106,84 @@ export const reducer = (state: State, action: Action): State => {
                 ...t,
                 open: false,
               }
-            : t
+            : t,
         ),
-      }
+      };
     }
-    case "REMOVE_TOAST":
+    case 'REMOVE_TOAST':
       if (action.toastId === undefined) {
         return {
           ...state,
           toasts: [],
-        }
+        };
       }
       return {
         ...state,
         toasts: state.toasts.filter((t) => t.id !== action.toastId),
-      }
+      };
   }
-}
+};
 
-const listeners: Array<(state: State) => void> = []
+const listeners: Array<(state: State) => void> = [];
 
-let memoryState: State = { toasts: [] }
+let memoryState: State = { toasts: [] };
 
 function dispatch(action: Action) {
-  memoryState = reducer(memoryState, action)
+  memoryState = reducer(memoryState, action);
   listeners.forEach((listener) => {
-    listener(memoryState)
-  })
+    listener(memoryState);
+  });
 }
 
-type Toast = Omit<ToasterToast, "id">
+type Toast = Omit<ToasterToast, 'id'>;
 
 function toast({ ...props }: Toast) {
-  const id = genId()
+  const id = genId();
 
   const update = (props: ToasterToast) =>
     dispatch({
-      type: "UPDATE_TOAST",
+      type: 'UPDATE_TOAST',
       toast: { ...props, id },
-    })
-  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id })
+    });
+  const dismiss = () => dispatch({ type: 'DISMISS_TOAST', toastId: id });
 
   dispatch({
-    type: "ADD_TOAST",
+    type: 'ADD_TOAST',
     toast: {
       ...props,
       id,
       open: true,
       onOpenChange: (open) => {
-        if (!open) dismiss()
+        if (!open) dismiss();
       },
     },
-  })
+  });
 
   return {
     id: id,
     dismiss,
     update,
-  }
+  };
 }
 
 function useToast() {
-  const [state, setState] = React.useState<State>(memoryState)
+  const [state, setState] = React.useState<State>(memoryState);
 
   React.useEffect(() => {
-    listeners.push(setState)
+    listeners.push(setState);
     return () => {
-      const index = listeners.indexOf(setState)
+      const index = listeners.indexOf(setState);
       if (index > -1) {
-        listeners.splice(index, 1)
+        listeners.splice(index, 1);
       }
-    }
-  }, [state])
+    };
+  }, [state]);
 
   return {
     ...state,
     toast,
-    dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
-  }
+    dismiss: (toastId?: string) => dispatch({ type: 'DISMISS_TOAST', toastId }),
+  };
 }
 
-export { useToast, toast }
+export { useToast, toast };
diff --git a/src/components/ui/with-tooltip.tsx b/src/components/ui/with-tooltip.tsx
index 6f62b108..5ad9b1c9 100644
--- a/src/components/ui/with-tooltip.tsx
+++ b/src/components/ui/with-tooltip.tsx
@@ -16,7 +16,7 @@ const WithTooltip = ({ children, content }: WithTooltipProps) => {
           {children}
         </Tooltip.Trigger>
         <Tooltip.Portal>
-          <Tooltip.Content className="text-white bg-gray-950 data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade text-violet11 select-none rounded-[4px] px-[15px] py-[10px] text-[12px] leading-none shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] will-change-[transform,opacity]">
+          <Tooltip.Content className="text-violet11 select-none rounded-[4px] bg-gray-950 px-[15px] py-[10px] text-[12px] leading-none text-white shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade">
             {content}
           </Tooltip.Content>
         </Tooltip.Portal>
@@ -25,4 +25,4 @@ const WithTooltip = ({ children, content }: WithTooltipProps) => {
   );
 };
 
-export default WithTooltip;
\ No newline at end of file
+export default WithTooltip;
diff --git a/src/contexts/DonationCartContext/DonationCartContext.tsx b/src/contexts/DonationCartContext/DonationCartContext.tsx
index 138bf9f6..9e156a1b 100644
--- a/src/contexts/DonationCartContext/DonationCartContext.tsx
+++ b/src/contexts/DonationCartContext/DonationCartContext.tsx
@@ -12,9 +12,8 @@ const DonationCartContext = createContext({} as IDonationCartContext);
 
 const DonationCartProvider = ({ children }: { children?: React.ReactNode }) => {
   const [opened, setOpened] = useState<boolean>(false);
-  const [carts, setCarts] = useState<Record<string, IDonationCartItem[]>>(
-    getDonationCart()
-  );
+  const [carts, setCarts] =
+    useState<Record<string, IDonationCartItem[]>>(getDonationCart());
 
   const addItem = useCallback((shelterId: string, item: IDonationCartItem) => {
     setCarts((state) => {
@@ -25,7 +24,7 @@ const DonationCartProvider = ({ children }: { children?: React.ReactNode }) => {
           [shelterId]: prev.map((p) =>
             p.id === item.id
               ? { ...p, quantity: p.quantity + item.quantity }
-              : p
+              : p,
           ),
         };
       else return { ...state, [shelterId]: [...prev, item] };
@@ -36,7 +35,7 @@ const DonationCartProvider = ({ children }: { children?: React.ReactNode }) => {
     (
       shelterId: string,
       supplyId: string,
-      payload: Partial<Omit<IDonationCartItem, 'id'>>
+      payload: Partial<Omit<IDonationCartItem, 'id'>>,
     ) => {
       setCarts((state) => {
         const prev = state[shelterId] ?? [];
@@ -44,13 +43,13 @@ const DonationCartProvider = ({ children }: { children?: React.ReactNode }) => {
           return {
             ...state,
             [shelterId]: prev.map((p) =>
-              p.id === supplyId ? { ...p, ...payload } : p
+              p.id === supplyId ? { ...p, ...payload } : p,
             ),
           };
         else return state;
       });
     },
-    []
+    [],
   );
 
   const removeItem = useCallback((shelterId: string, supplyId: string) => {
@@ -64,14 +63,14 @@ const DonationCartProvider = ({ children }: { children?: React.ReactNode }) => {
 
   const clearCart = useCallback(
     (shelterId: string) => setCarts((state) => ({ ...state, [shelterId]: [] })),
-    []
+    [],
   );
 
   const updateCart = useCallback(
     (shelterId: string, items: IDonationCartItem[]) => {
       setCarts((prev) => ({ ...prev, [shelterId]: items }));
     },
-    []
+    [],
   );
 
   useEffect(() => {
diff --git a/src/contexts/DonationCartContext/types.ts b/src/contexts/DonationCartContext/types.ts
index 14539cb7..34f21a03 100644
--- a/src/contexts/DonationCartContext/types.ts
+++ b/src/contexts/DonationCartContext/types.ts
@@ -18,7 +18,7 @@ export interface IDonationCartContext {
   updateItem: (
     shelterId: string,
     supplyId: string,
-    payload: Partial<Omit<IDonationCartItem, 'id'>>
+    payload: Partial<Omit<IDonationCartItem, 'id'>>,
   ) => void;
   clearCart: (shelterId: string) => void;
   updateCart: (shelterId: string, items: IDonationCartItem[]) => void;
diff --git a/src/contexts/SessionContext/SessionContext.tsx b/src/contexts/SessionContext/SessionContext.tsx
index 75a8b03f..2b68f08e 100644
--- a/src/contexts/SessionContext/SessionContext.tsx
+++ b/src/contexts/SessionContext/SessionContext.tsx
@@ -8,7 +8,7 @@ const SessionContext = createContext({} as ISessionContext);
 
 const SessionProvider = ({ children }: { children: React.ReactNode }) => {
   const [loading, setLoading] = useState<boolean>(
-    !!window.localStorage.getItem('token')
+    !!window.localStorage.getItem('token'),
   );
   const [session, setSession] = useState<ISession | null>(null);
 
diff --git a/src/contexts/SessionContext/index.ts b/src/contexts/SessionContext/index.ts
index 2d3ea5bd..100e3f3e 100644
--- a/src/contexts/SessionContext/index.ts
+++ b/src/contexts/SessionContext/index.ts
@@ -1,3 +1,3 @@
-import { SessionContext, SessionProvider } from "./SessionContext";
+import { SessionContext, SessionProvider } from './SessionContext';
 
 export { SessionContext, SessionProvider };
diff --git a/src/hocs/index.ts b/src/hocs/index.ts
index 1facf653..ebd3ba78 100644
--- a/src/hocs/index.ts
+++ b/src/hocs/index.ts
@@ -1,4 +1,4 @@
-import { withGuest } from "./withGuest";
-import { withAuth } from "./withAuth";
+import { withGuest } from './withGuest';
+import { withAuth } from './withAuth';
 
 export { withGuest, withAuth };
diff --git a/src/hocs/withAuth/index.ts b/src/hocs/withAuth/index.ts
index 90fb9fe9..35598f23 100644
--- a/src/hocs/withAuth/index.ts
+++ b/src/hocs/withAuth/index.ts
@@ -1,3 +1,3 @@
-import { withAuth } from "./withAuth";
+import { withAuth } from './withAuth';
 
 export { withAuth };
diff --git a/src/hocs/withAuth/withAuth.tsx b/src/hocs/withAuth/withAuth.tsx
index 1551ef0a..30f38a80 100644
--- a/src/hocs/withAuth/withAuth.tsx
+++ b/src/hocs/withAuth/withAuth.tsx
@@ -1,8 +1,8 @@
-import React, { useContext } from "react";
-import { Navigate } from "react-router-dom";
+import React, { useContext } from 'react';
+import { Navigate } from 'react-router-dom';
 
-import { LoadingScreen } from "@/components";
-import { SessionContext } from "@/contexts";
+import { LoadingScreen } from '@/components';
+import { SessionContext } from '@/contexts';
 
 const withAuth = (WrappedComponent: React.ElementType) => {
   const WithAuth = ({ ...props }) => {
diff --git a/src/hocs/withGuest/index.ts b/src/hocs/withGuest/index.ts
index ad49bffa..2ecc57d8 100644
--- a/src/hocs/withGuest/index.ts
+++ b/src/hocs/withGuest/index.ts
@@ -1,3 +1,3 @@
-import { withGuest } from "./withGest";
+import { withGuest } from './withGest';
 
 export { withGuest };
diff --git a/src/hocs/withGuest/withGest.tsx b/src/hocs/withGuest/withGest.tsx
index 6261655b..69a0e487 100644
--- a/src/hocs/withGuest/withGest.tsx
+++ b/src/hocs/withGuest/withGest.tsx
@@ -1,8 +1,8 @@
-import React, { useContext } from "react";
-import { Navigate } from "react-router-dom";
+import React, { useContext } from 'react';
+import { Navigate } from 'react-router-dom';
 
-import { SessionContext } from "@/contexts";
-import { LoadingScreen } from "@/components";
+import { SessionContext } from '@/contexts';
+import { LoadingScreen } from '@/components';
 
 const withGuest = (WrappedComponent: React.ElementType) => {
   const WithGuest = ({ ...props }) => {
diff --git a/src/hooks/useDashboard/useDashboard.tsx b/src/hooks/useDashboard/useDashboard.tsx
index 515e3cb0..b489d418 100644
--- a/src/hooks/useDashboard/useDashboard.tsx
+++ b/src/hooks/useDashboard/useDashboard.tsx
@@ -45,7 +45,7 @@ const useDashboard = (options: IUseDashboardOptions = {}) => {
           if (!append) setLoading(false);
         });
     },
-    [cache]
+    [cache],
   );
 
   useEffect(() => {
diff --git a/src/hooks/useFetch/useFetch.tsx b/src/hooks/useFetch/useFetch.tsx
index 887833bd..f5cc9868 100644
--- a/src/hooks/useFetch/useFetch.tsx
+++ b/src/hooks/useFetch/useFetch.tsx
@@ -26,7 +26,7 @@ function useFetch<T = any>(path?: string, options: IUseFetchOptions<T> = {}) {
         setLoading(false);
       }
     },
-    [cache, path]
+    [cache, path],
   );
 
   useEffect(() => {
diff --git a/src/hooks/useGithubContributors/useGithubContributors.tsx b/src/hooks/useGithubContributors/useGithubContributors.tsx
index 71f7d46c..3d18a6d3 100644
--- a/src/hooks/useGithubContributors/useGithubContributors.tsx
+++ b/src/hooks/useGithubContributors/useGithubContributors.tsx
@@ -13,12 +13,12 @@ function useGithubContributors(owner: string, repo: string) {
       axios
         .get(
           `https://api.github.com/repos/${owner}/${repo}/contributors`,
-          config
+          config,
         )
         .then(({ data }) => setData(data))
         .finally(() => setLoading(false));
     },
-    [owner, repo]
+    [owner, repo],
   );
 
   useEffect(() => {
diff --git a/src/hooks/usePaginatedQuery/types.ts b/src/hooks/usePaginatedQuery/types.ts
index 62d14a04..7710fa8c 100644
--- a/src/hooks/usePaginatedQuery/types.ts
+++ b/src/hooks/usePaginatedQuery/types.ts
@@ -3,5 +3,5 @@ export interface IPaginatedResponse<T = any> {
   page: number;
   perPage: number;
   results: T[];
-  filters?: any
+  filters?: any;
 }
diff --git a/src/hooks/usePaginatedQuery/usePaginatedQuery.tsx b/src/hooks/usePaginatedQuery/usePaginatedQuery.tsx
index 4229807e..e59e2a99 100644
--- a/src/hooks/usePaginatedQuery/usePaginatedQuery.tsx
+++ b/src/hooks/usePaginatedQuery/usePaginatedQuery.tsx
@@ -8,7 +8,7 @@ import { IServerResponse } from '@/types';
 
 function usePaginatedQuery<T = any>(
   path: string | PaginatedQueryPath,
-  defaultConfig: AxiosRequestConfig<any> = {}
+  defaultConfig: AxiosRequestConfig<any> = {},
 ) {
   const [loading, setLoading] = useState<boolean>(false);
   const [data, setData] = useState<IPaginatedResponse<T>>({
@@ -29,7 +29,7 @@ function usePaginatedQuery<T = any>(
         .then(({ data }) => setData(data.data))
         .finally(() => setLoading(false));
     },
-    [defaultConfig, path]
+    [defaultConfig, path],
   );
 
   useEffect(() => {
diff --git a/src/hooks/useShelter/useShelter.tsx b/src/hooks/useShelter/useShelter.tsx
index 2a8f5f46..f42d925d 100644
--- a/src/hooks/useShelter/useShelter.tsx
+++ b/src/hooks/useShelter/useShelter.tsx
@@ -4,7 +4,7 @@ import { IUseShelterData } from './types';
 
 const useShelter = (shelterId: string) => {
   return useFetch<IUseShelterData>(
-    `${PaginatedQueryPath.Shelters}/${shelterId}`
+    `${PaginatedQueryPath.Shelters}/${shelterId}`,
   );
 };
 
diff --git a/src/hooks/useShelters/useShelters.tsx b/src/hooks/useShelters/useShelters.tsx
index eb56c44a..92e52953 100644
--- a/src/hooks/useShelters/useShelters.tsx
+++ b/src/hooks/useShelters/useShelters.tsx
@@ -47,7 +47,7 @@ const useShelters = (options: IUseShelterOptions = {}) => {
           setLoading(!append);
         });
     },
-    [cache]
+    [cache],
   );
 
   useEffect(() => {
diff --git a/src/hooks/useThrottle/useThrottle.tsx b/src/hooks/useThrottle/useThrottle.tsx
index 044f5f0a..01456bf4 100644
--- a/src/hooks/useThrottle/useThrottle.tsx
+++ b/src/hooks/useThrottle/useThrottle.tsx
@@ -4,7 +4,7 @@ import { ThrottleOptions } from './types';
 
 function useThrottle<T>(
   options: ThrottleOptions<T>,
-  deps: any[]
+  deps: any[],
 ): [T | null, React.Dispatch<React.SetStateAction<T | null>>] {
   const { throttle = 400, callback } = options;
   const [value, setValue] = useState<T | null>(null);
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 3d161d9e..92023c45 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -81,20 +81,23 @@ function getObjectValue<T>(obj: T, path: string, sep = '.'): any {
     .split(sep)
     .reduce(
       (acc, key) => (acc && acc[key] !== 'undefined' ? acc[key] : undefined),
-      obj as Record<string, any>
+      obj as Record<string, any>,
     );
 }
 
 function group<T extends Record<string, any>>(
   arr: Array<T>,
   groupBy: string,
-  sep = '.'
+  sep = '.',
 ): { [key: string]: Array<T> } {
-  const data = arr.reduce((prev, current) => {
-    const key: string = getObjectValue(current, groupBy, sep);
-    if (prev[key]) return { ...prev, [key]: [...prev[key], current] };
-    return { ...prev, [key]: [current] };
-  }, {} as { [key: string]: Array<T> });
+  const data = arr.reduce(
+    (prev, current) => {
+      const key: string = getObjectValue(current, groupBy, sep);
+      if (prev[key]) return { ...prev, [key]: [...prev[key], current] };
+      return { ...prev, [key]: [current] };
+    },
+    {} as { [key: string]: Array<T> },
+  );
 
   return data;
 }
@@ -144,7 +147,7 @@ function normalizedCompare(a: string, b: string): boolean {
       b
         .toLowerCase()
         .normalize('NFD')
-        .replace(/[\u0300-\u036f]/g, '')
+        .replace(/[\u0300-\u036f]/g, ''),
     );
 }
 
diff --git a/src/main.tsx b/src/main.tsx
index cfc80cbd..91cbcf9e 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -4,7 +4,7 @@ import './global.css';
 
 document.documentElement.style.setProperty(
   '--vh',
-  `${window.innerHeight * 0.01}px`
+  `${window.innerHeight * 0.01}px`,
 );
 
 ReactDOM.createRoot(document.getElementById('root')!).render(<App />);
diff --git a/src/pages/AboutUs/AboutUs.tsx b/src/pages/AboutUs/AboutUs.tsx
index efeffa9d..5a83778a 100644
--- a/src/pages/AboutUs/AboutUs.tsx
+++ b/src/pages/AboutUs/AboutUs.tsx
@@ -56,32 +56,32 @@ const AboutUs = () => {
 
   const loading = useMemo(
     () => loadingBackendContributors || loadingFrontendContributors,
-    [loadingBackendContributors, loadingFrontendContributors]
+    [loadingBackendContributors, loadingFrontendContributors],
   );
   const contributors = useMemo(
     () =>
       removeDuplicatesByField(
         'login',
         frontendContributors,
-        backendContributors
+        backendContributors,
       ),
-    [frontendContributors, backendContributors]
+    [frontendContributors, backendContributors],
   );
 
   return (
-    <div className="flex flex-col h-screen items-center">
+    <div className="flex h-screen flex-col items-center">
       <Header title="SOS Rio Grande do Sul" startAdornment={<BurgerMenu />} />
-      <div className="flex flex-col gap-4 p-4 max-w-4xl pb-8 w-full">
-        <h2 className="text-4xl pt-4 font-semibold !text-zinc-900">
+      <div className="flex w-full max-w-4xl flex-col gap-4 p-4 pb-8">
+        <h2 className="pt-4 text-4xl font-semibold !text-zinc-900">
           Sobre nós
         </h2>
-        <h4 className="text-lg text-muted-foreground font-medium">
+        <h4 className="text-lg font-medium text-muted-foreground">
           Conheça a história do projeto SOS RS
         </h4>
-        <h3 className="text-2xl font-medium text-muted-foreground mt-8">
+        <h3 className="mt-8 text-2xl font-medium text-muted-foreground">
           Como tudo começou
         </h3>
-        <p className="text-justify text-md md:text-lg font-medium [&>a]:text-blue-500 [&>a]:hover:text-blue-600 [&>a]:active:text-blue-700">
+        <p className="text-md text-justify font-medium md:text-lg [&>a]:text-blue-500 [&>a]:hover:text-blue-600 [&>a]:active:text-blue-700">
           Iniciado no domingo (04/05) e concluído na segunda (05/05), após 18
           horas seguidas de desenvolvimento, nosso webapp <b>SOS RS 🛟</b>,
           idealizado e desenvolvido por{' '}
@@ -103,7 +103,7 @@ const AboutUs = () => {
           </a>
           , atingiu resultados verdadeiramente inspiradores.
         </p>
-        <p className="text-justify font-medium text-md md:text-lg">
+        <p className="text-md text-justify font-medium md:text-lg">
           O SOS RS rapidamente ganhou destaque nos grupos de WhatsApp, graças ao
           seu modelo colaborativo. Alcançamos rapidamente o nível de todas as
           outras iniciativas de gestão de demanda combinadas e lançamos nossa
@@ -111,14 +111,14 @@ const AboutUs = () => {
           nosso projeto alcançou <b>600 estrelas no GitHub</b> e foi{' '}
           <b>forkeado mais de 350 vezes!</b>
         </p>
-        <h3 className="text-2xl font-medium text-muted-foreground mt-8">
+        <h3 className="mt-8 text-2xl font-medium text-muted-foreground">
           Nossos parceiros
         </h3>
-        <p className="text-justify font-medium text-md md:text-lg">
+        <p className="text-md text-justify font-medium md:text-lg">
           Formamos parcerias sólidas com mais de 1400 voluntários, fortalecendo
           ainda mais nossa missão. Hoje, comemoramos números que falam por si.
         </p>
-        <div className="flex gap-2 flex-wrap mt-4">
+        <div className="mt-4 flex flex-wrap gap-2">
           <AboutCardInfo
             icon={<Home />}
             topLabel="mais de"
@@ -141,16 +141,16 @@ const AboutUs = () => {
             className="w-full"
           />
         </div>
-        <p className="text-justify font-medium text-md md:text-lg leading-10">
+        <p className="text-md text-justify font-medium leading-10 md:text-lg">
           Atualmente, o <b>SOS RS </b>
           <LifeBuoy
-            className="align-middle inline-block relative max-h-6 padding pb-0.5"
+            className="padding relative inline-block max-h-6 pb-0.5 align-middle"
             size={18}
           />{' '}
           apoia a gestão das demandas e necessidades dos abrigos do Rio Grande
           do Sul com informações públicas, atualizadas, confiáveis e auditáveis.
         </p>
-        <h3 className="text-2xl font-medium text-muted-foreground mt-4">
+        <h3 className="mt-4 text-2xl font-medium text-muted-foreground">
           Frentes atendidas
         </h3>
         <div className="flex flex-col gap-6">
@@ -158,22 +158,22 @@ const AboutUs = () => {
             <ServicedFrontInfo key={idx} {...item} />
           ))}
         </div>
-        <p className="text-justify font-medium text-md md:text-lg mt-4">
+        <p className="text-md mt-4 text-justify font-medium md:text-lg">
           O grupo de voluntários do SOS RS já soma mais de 2100 pessoas e cerca
           de 126 mil horas de trabalho desde a criação da iniciativa.
         </p>
-        <h3 className="text-2xl font-medium text-muted-foreground mt-4">
+        <h3 className="mt-4 text-2xl font-medium text-muted-foreground">
           Contribuidores da plataforma ({contributors.length})
         </h3>
         <div className="flex flex-wrap gap-2">
           {loading ? (
-            <Loader className="w-5 h-5 animate-spin" />
+            <Loader className="h-5 w-5 animate-spin" />
           ) : (
             contributors.map((contributor, idx) => (
               <WithTooltip key={idx} content={contributor.login}>
                 <a href={contributor.html_url} target="_blank">
                   <img
-                    className="rounded-full w-10 h-10 md:w-12 md:h-12"
+                    className="h-10 w-10 rounded-full md:h-12 md:w-12"
                     src={contributor.avatar_url}
                   />
                 </a>
@@ -182,13 +182,13 @@ const AboutUs = () => {
           )}
         </div>
       </div>
-      <div className="bg-black [&>p]:text-white p-8 w-full flex justify-center mt-4">
-        <p className="text-justify text-md md:text-lg">
+      <div className="mt-4 flex w-full justify-center bg-black p-8 [&>p]:text-white">
+        <p className="text-md text-justify md:text-lg">
           Agradecemos a todos que têm tornado este impacto possível! Vamos
           continuar trabalhando juntos para fazer a diferença. Acesse:{' '}
           <a
             href="https://sos-rs.com"
-            className="hover:underline text-blue-500 hover:text-blue-600 active:text-blue-700"
+            className="text-blue-500 hover:text-blue-600 hover:underline active:text-blue-700"
           >
             sos-rs.com
           </a>
diff --git a/src/pages/AboutUs/components/AboutCardInfo/AboutCardInfo.tsx b/src/pages/AboutUs/components/AboutCardInfo/AboutCardInfo.tsx
index 99ac8b8a..e72f98b4 100644
--- a/src/pages/AboutUs/components/AboutCardInfo/AboutCardInfo.tsx
+++ b/src/pages/AboutUs/components/AboutCardInfo/AboutCardInfo.tsx
@@ -18,8 +18,8 @@ const AboutCardInfo = React.forwardRef<HTMLDivElement, IAboutCardInfoProps>(
       <div
         ref={ref}
         className={cn(
-          'flex gap-4 p-4 bg-[#E8F0F8] border-border rounded-xl',
-          className
+          'flex gap-4 rounded-xl border-border bg-[#E8F0F8] p-4',
+          className,
         )}
         {...rest}
       >
@@ -29,14 +29,14 @@ const AboutCardInfo = React.forwardRef<HTMLDivElement, IAboutCardInfoProps>(
             className: 'w-4 h-4 md:w-6 md:h-6',
           })}
         </div>
-        <div className="flex-1 flex justify-evenly flex-col gap-1 md:[&_*]:text-md">
+        <div className="md:[&_*]:text-md flex flex-1 flex-col justify-evenly gap-1">
           <span className="font-normal md:font-medium">{topLabel}</span>
           <b className="text-2xl md:text-4xl">{centerLabel}</b>
           <span className="font-normal md:font-medium">{bottomLabel}</span>
         </div>
       </div>
     );
-  }
+  },
 );
 
 export { AboutCardInfo };
diff --git a/src/pages/AboutUs/components/ServicedFrontInfo/ServicedFrontInfo.tsx b/src/pages/AboutUs/components/ServicedFrontInfo/ServicedFrontInfo.tsx
index 6c4e82a5..10525b6f 100644
--- a/src/pages/AboutUs/components/ServicedFrontInfo/ServicedFrontInfo.tsx
+++ b/src/pages/AboutUs/components/ServicedFrontInfo/ServicedFrontInfo.tsx
@@ -11,10 +11,10 @@ const ServicedFrontInfo = React.forwardRef<
 
   return (
     <div ref={ref} {...rest} className={cn(className, 'flex gap-2')}>
-      <div className="w-12 h-12 rounded-full bg-[#F6F8FC] flex items-center justify-center">
+      <div className="flex h-12 w-12 items-center justify-center rounded-full bg-[#F6F8FC]">
         {icon}
       </div>
-      <div className="flex flex-col flex-1">
+      <div className="flex flex-1 flex-col">
         <b>{title}</b>
         <p>{description}</p>
       </div>
diff --git a/src/pages/CreateShelter/CreateShelter.tsx b/src/pages/CreateShelter/CreateShelter.tsx
index 6003b603..d6a95288 100644
--- a/src/pages/CreateShelter/CreateShelter.tsx
+++ b/src/pages/CreateShelter/CreateShelter.tsx
@@ -112,10 +112,10 @@ const CreateShelterComponent = () => {
   }, [cepData, setFieldValue, setErrors]);
 
   return (
-    <div className="flex flex-col h-screen items-center">
+    <div className="flex h-screen flex-col items-center">
       <Header
         title="Cadastrar novo abrigo"
-        className="bg-white [&_*]:text-zinc-800 border-b-[1px] border-b-border"
+        className="border-b-[1px] border-b-border bg-white [&_*]:text-zinc-800"
         startAdornment={
           <Button
             variant="ghost"
@@ -126,13 +126,13 @@ const CreateShelterComponent = () => {
           </Button>
         }
       />
-      <div className="p-4 flex flex-col max-w-5xl w-full gap-3 items-start h-full">
+      <div className="flex h-full w-full max-w-5xl flex-col items-start gap-3 p-4">
         <form className="contents" onSubmit={handleSubmit}>
           <h6 className="text-2xl font-semibold">Cadastrar novo abrigo</h6>
           <p className="text-muted-foreground">
             Adicione as informações necessarias para o cadastro do novo abrigo.
           </p>
-          <div className=" flex flex-col max-w-5xl w-full gap-2 items-start">
+          <div className="flex w-full max-w-5xl flex-col items-start gap-2">
             <TextField
               label="Nome do abrigo"
               {...getFieldProps('name')}
@@ -146,7 +146,7 @@ const CreateShelterComponent = () => {
               helperText={errors.zipCode}
             />
             {Boolean(isLoadingZipCodeData) && (
-              <Loader className="animate-spin h-15 w-15 stroke-black" />
+              <Loader className="h-15 w-15 animate-spin stroke-black" />
             )}
             <TextField
               label="Logradouro (Rua/avenida)"
@@ -166,7 +166,7 @@ const CreateShelterComponent = () => {
               error={!!errors.neighbourhood}
               helperText={errors.neighbourhood}
             />
-            <div className="flex flex-col gap-1 w-full">
+            <div className="flex w-full flex-col gap-1">
               <label className="text-muted-foreground" htmlFor="city">
                 Cidade
               </label>
@@ -185,11 +185,11 @@ const CreateShelterComponent = () => {
                   setFieldValue('city', v?.value);
                 }}
                 className={cn('w-full', {
-                  'border-[1px] border-red-600 rounded-md': errors.city,
+                  'rounded-md border-[1px] border-red-600': errors.city,
                 })}
               />
               {errors.city && (
-                <p className={'text-red-600 text-sm'}>{errors.city}</p>
+                <p className={'text-sm text-red-600'}>{errors.city}</p>
               )}
             </div>
             <TextField
@@ -238,11 +238,11 @@ const CreateShelterComponent = () => {
               helperText={errors.pix}
             />
           </div>
-          <div className="flex flex-1 flex-col justify-end md:justify-start w-full py-6">
+          <div className="flex w-full flex-1 flex-col justify-end py-6 md:justify-start">
             <Button
               loading={isSubmitting}
               type="submit"
-              className="flex gap-2 text-white font-medium text-lg bg-blue-500 hover:bg-blue-600 w-full"
+              className="flex w-full gap-2 bg-blue-500 text-lg font-medium text-white hover:bg-blue-600"
             >
               Cadastrar
             </Button>
diff --git a/src/pages/CreateSupply/CreateSupply.tsx b/src/pages/CreateSupply/CreateSupply.tsx
index 78f8025c..9ee07bb2 100644
--- a/src/pages/CreateSupply/CreateSupply.tsx
+++ b/src/pages/CreateSupply/CreateSupply.tsx
@@ -55,11 +55,18 @@ const CreateSupply = () => {
     validationSchema: Yup.object().shape({
       shelterId: Yup.string().required('Este campo deve ser preenchido'),
       name: Yup.string()
-      .matches(/^[a-zA-ZÀ-ÿ0-9\s]*$/, "O nome não deve conter caracteres especiais")
-      .test('min-letters', 'O nome deve conter pelo menos 3 letras', value => {
-        const letterCount = (value?.match(/[a-zA-ZÀ-ÿ]/g) || []).length;
-        return letterCount >= 3;
-      })
+        .matches(
+          /^[a-zA-ZÀ-ÿ0-9\s]*$/,
+          'O nome não deve conter caracteres especiais',
+        )
+        .test(
+          'min-letters',
+          'O nome deve conter pelo menos 3 letras',
+          (value) => {
+            const letterCount = (value?.match(/[a-zA-ZÀ-ÿ]/g) || []).length;
+            return letterCount >= 3;
+          },
+        )
         .min(3, 'Insira no mínimo 3 caracteres')
         .required('Este campo deve ser preenchido'),
       quantity: Yup.number()
@@ -113,12 +120,12 @@ const CreateSupply = () => {
       : [];
 
   const renderSupplies = (element: IUseSuppliesData, key: number) => {
-        if (values.name.length < 3 || key > 30) return <></>;
+    if (values.name.length < 3 || key > 30) return <></>;
 
     return (
       <Fragment key={key}>
         <div
-          className="flex cursor-pointer border m-1 p-2 rounded hover:scale-105"
+          className="m-1 flex cursor-pointer rounded border p-2 hover:scale-105"
           onClick={() => {
             setSupplyId(element.id);
             setModalOpened(true);
@@ -162,10 +169,10 @@ const CreateSupply = () => {
           onClose={() => setModalOpened(false)}
         />
       )}
-      <div className="flex flex-col h-screen items-center">
+      <div className="flex h-screen flex-col items-center">
         <Header
           title="Cadastrar novo item"
-          className="bg-white [&_*]:text-zinc-800 border-b-[1px] border-b-border"
+          className="border-b-[1px] border-b-border bg-white [&_*]:text-zinc-800"
           startAdornment={
             <Button
               variant="ghost"
@@ -176,14 +183,14 @@ const CreateSupply = () => {
             </Button>
           }
         />
-        <div className="p-4 flex flex-col max-w-5xl w-full gap-3 items-start h-full">
+        <div className="flex h-full w-full max-w-5xl flex-col items-start gap-3 p-4">
           <form className="contents" onSubmit={handleSubmit}>
             <h6 className="text-2xl font-semibold">Cadastrar novo item</h6>
             <p className="text-muted-foreground">
               Informe o nome do item que você deseja cadastrar, a categoria e a
               prioridade
             </p>
-            <div className="flex flex-col gap-6 w-full mt-6">
+            <div className="mt-6 flex w-full flex-col gap-6">
               <TextField
                 label="Nome do item"
                 {...getFieldProps('name')}
@@ -192,7 +199,7 @@ const CreateSupply = () => {
               />
               <div className="flex flex-wrap">
                 {filteredSupplies.length > 0 && (
-                  <div className="border p-2 rounded bg-amber-200 text-gray-700">
+                  <div className="rounded border bg-amber-200 p-2 text-gray-700">
                     Foram encontrados registros com as informações fornecidas.
                     Para evitar registros duplicados, pedimos a gentileza de
                     verificar se alguns dos registros abaixo lhe atende:
@@ -200,7 +207,7 @@ const CreateSupply = () => {
                 )}
                 {filteredSupplies.map(renderSupplies)}
               </div>
-              <div className="flex flex-col w-full">
+              <div className="flex w-full flex-col">
                 <label className="text-muted-foreground">Categoria</label>
                 <Select
                   onValueChange={(v) => setFieldValue('supplyCategoryId', v)}
@@ -227,7 +234,7 @@ const CreateSupply = () => {
                     ))}
                   </SelectContent>
                 </Select>
-                <div className="text-red-600 text-sm mt-0">
+                <div className="mt-0 text-sm text-red-600">
                   {errors.supplyCategoryId}
                 </div>
               </div>
@@ -237,7 +244,7 @@ const CreateSupply = () => {
                 error={!!errors.quantity}
                 helperText={errors.quantity}
               />
-              <div className="flex flex-col w-full">
+              <div className="flex w-full flex-col">
                 <label className="text-muted-foreground">Prioridade</label>
                 <Select
                   onValueChange={(v) => {
@@ -265,7 +272,7 @@ const CreateSupply = () => {
                           value={`${priority}`}
                           className="text-muted-foreground"
                         >
-                          <div className="flex gap-2 p-2 items-center">
+                          <div className="flex items-center gap-2 p-2">
                             <CircleStatus className={className} />
                             {label}
                           </div>
@@ -275,14 +282,14 @@ const CreateSupply = () => {
                   </SelectContent>
                 </Select>
               </div>
-              <div className="text-red-600 text-sm mt-0">{errors.priority}</div>
+              <div className="mt-0 text-sm text-red-600">{errors.priority}</div>
             </div>
-            <div className="flex flex-1 flex-col justify-end md:justify-start w-full py-6">
+            <div className="flex w-full flex-1 flex-col justify-end py-6 md:justify-start">
               <Button
                 loading={isSubmitting}
                 type="submit"
                 disabled={filteredSupplies.length > 0}
-                className="flex gap-2 text-white font-medium text-lg bg-blue-500 hover:bg-blue-600 w-full"
+                className="flex w-full gap-2 bg-blue-500 text-lg font-medium text-white hover:bg-blue-600"
               >
                 Salvar
               </Button>
diff --git a/src/pages/CreateSupply/components/modal.tsx b/src/pages/CreateSupply/components/modal.tsx
index ce4a838e..0a7378d3 100644
--- a/src/pages/CreateSupply/components/modal.tsx
+++ b/src/pages/CreateSupply/components/modal.tsx
@@ -71,8 +71,8 @@ const ModalCreateSupply = (props: IProps) => {
         })
         .catch(() =>
           alert(
-            'Ocorreu um erro. Por favor, tente novamente ou entre em contato com o suporte.'
-          )
+            'Ocorreu um erro. Por favor, tente novamente ou entre em contato com o suporte.',
+          ),
         );
     } else {
       ShelterSupplyServices.update(shelterId, supplyId, {
@@ -88,8 +88,8 @@ const ModalCreateSupply = (props: IProps) => {
         })
         .catch(() =>
           alert(
-            'Ocorreu um erro. Por favor, tente novamente ou entre em contato com o suporte.'
-          )
+            'Ocorreu um erro. Por favor, tente novamente ou entre em contato com o suporte.',
+          ),
         );
     }
   };
@@ -99,7 +99,7 @@ const ModalCreateSupply = (props: IProps) => {
       <DialogContent className="rounded-md">
         {message.successSub ? (
           <>
-            <div className="border rounded bg-green-600 p-2 text-white mt-5">
+            <div className="mt-5 rounded border bg-green-600 p-2 text-white">
               {message.message}
             </div>
             <DialogFooter>
@@ -124,7 +124,7 @@ const ModalCreateSupply = (props: IProps) => {
               )}
             </DialogHeader>
             {message.message && (
-              <div className="border rounded bg-green-600 p-2 text-white">
+              <div className="rounded border bg-green-600 p-2 text-white">
                 {message.message}
               </div>
             )}
@@ -132,7 +132,7 @@ const ModalCreateSupply = (props: IProps) => {
               <label htmlFor="quantity" className="text-muted-foreground">
                 Quantidade
               </label>
-              <div className="flex gap-2 items-center justify-center py-2">
+              <div className="flex items-center justify-center gap-2 py-2">
                 <Input
                   type="number"
                   name="quantity"
@@ -148,7 +148,7 @@ const ModalCreateSupply = (props: IProps) => {
                 />
               </div>
             </div>
-            <div className="px-2 max-h-[50vh] overflow-y-auto">
+            <div className="max-h-[50vh] overflow-y-auto px-2">
               <RadioGroup
                 value={data.priority}
                 onValueChange={(v) =>
diff --git a/src/pages/CreateSupply/components/types.ts b/src/pages/CreateSupply/components/types.ts
index 27af8ed0..391feaa5 100644
--- a/src/pages/CreateSupply/components/types.ts
+++ b/src/pages/CreateSupply/components/types.ts
@@ -13,7 +13,7 @@ export interface IProps {
       };
       quantity: number;
       priority: string;
-    }
+    },
   ];
   supplyId: string;
   shelterId: string;
diff --git a/src/pages/Dashboard/Dashboard.tsx b/src/pages/Dashboard/Dashboard.tsx
index 324c9871..90551620 100644
--- a/src/pages/Dashboard/Dashboard.tsx
+++ b/src/pages/Dashboard/Dashboard.tsx
@@ -5,25 +5,23 @@ import { NeedsSuppliesCard, ShelterOverview } from './components';
 import { RotateCw } from 'lucide-react';
 import { useDashboard } from '@/hooks/useDashboard/useDashboard';
 
-
-
 const Dashboard = () => {
   const { data, loading, refresh } = useDashboard({ cache: false });
 
   if (loading) return null;
   return (
-    <div className="flex flex-col h-screen items-center">
+    <div className="flex h-screen flex-col items-center">
       <Header
         title="SOS Rio Grande do Sul"
         startAdornment={<BurgerMenu />}
         endAdornment={
-          <div className="flex gap-2 items-center">
+          <div className="flex items-center gap-2">
             <Button
               loading={loading}
               variant="ghost"
               size="sm"
               onClick={() => refresh()}
-              className="disabled:bg-red-500 hover:bg-red-400"
+              className="hover:bg-red-400 disabled:bg-red-500"
             >
               <RotateCw size={20} className="stroke-white" />
             </Button>
@@ -31,7 +29,7 @@ const Dashboard = () => {
         }
       />
       <div className="flex flex-col">
-        <h1 className="font-bold text-2xl justify-self-start mb-8 mt-4">
+        <h1 className="mb-8 mt-4 justify-self-start text-2xl font-bold">
           Visão Geral
         </h1>
         <ShelterOverview
@@ -40,7 +38,7 @@ const Dashboard = () => {
         />
       </div>
       <div className="flex flex-col">
-        <h1 className="font-bold text-2xl justify-self-start mt-8 mb-4">
+        <h1 className="mb-4 mt-8 justify-self-start text-2xl font-bold">
           Visão geral das necessidades
         </h1>
         <NeedsSuppliesCard catergories={data.categoriesWithPriorities} />
diff --git a/src/pages/Dashboard/components/InfoCard.tsx b/src/pages/Dashboard/components/InfoCard.tsx
index cda0b575..91729427 100644
--- a/src/pages/Dashboard/components/InfoCard.tsx
+++ b/src/pages/Dashboard/components/InfoCard.tsx
@@ -16,21 +16,21 @@ const InfoCard = ({
     'flex flex-col gap-2 justify-center text-center w-64 h-auto box-border border-2 rounded-xl border-gray-200 p-5';
   return (
     <div className={cardClass}>
-      <p className="font-bold text-md">Disponibilidade dos abrigos</p>
+      <p className="text-md font-bold">Disponibilidade dos abrigos</p>
 
-      <div className="box-border border-2 rounded-xl ">
+      <div className="box-border rounded-xl border-2">
         <Link to={'/?search=&shelterStatus%5B0%5D=available'}>
-          <div className="bg-green-300 flex justify-between pl-2">
+          <div className="flex justify-between bg-green-300 pl-2">
             Disponíveis {totalAvaliable} <ChevronRight />
           </div>
         </Link>
         <Link to={'/?search=&shelterStatus%5B0%5D=unavailable'}>
-          <div className="bg-red-300 flex justify-between pl-2">
+          <div className="flex justify-between bg-red-300 pl-2">
             Lotados {totalCrowded} <ChevronRight />
           </div>
         </Link>
         <Link to={'/?search=&shelterStatus%5B0%5D=waiting'}>
-          <div className="bg-gray-300 flex justify-between pl-2">
+          <div className="flex justify-between bg-gray-300 pl-2">
             Sem informação {totalNoInformation} <ChevronRight />
           </div>
         </Link>
diff --git a/src/pages/Dashboard/components/NeedsSupliesCard.tsx b/src/pages/Dashboard/components/NeedsSupliesCard.tsx
index d5b108c2..a84d8037 100644
--- a/src/pages/Dashboard/components/NeedsSupliesCard.tsx
+++ b/src/pages/Dashboard/components/NeedsSupliesCard.tsx
@@ -9,19 +9,19 @@ const NeedsSuppliesCard = ({ catergories }: INeedsSupliesCard) => {
   const cardClass =
     'flex flex-col justify-between text-center w-56 h-auto box-border border-2 rounded-xl border-gray-200';
   return (
-    <div className="grid gap-4 grid-cols-4 p-6">
+    <div className="grid grid-cols-4 gap-4 p-6">
       {catergories?.map((categorie) => (
         <div className={cardClass}>
           <Link
             to={`/?search=&supplyCategoryIds%5B0%5D=${categorie.categoryId}`}
           >
-            <p className="font-bold text-md py-8  px-2">
+            <p className="text-md px-2 py-8 font-bold">
               {categorie.categoryName}
             </p>
           </Link>
 
-          <div className="flex box-border border-2 rounded-xl">
-            <div className="w-full h-10 border-r-2 flex justify-center items-center">
+          <div className="box-border flex rounded-xl border-2">
+            <div className="flex h-10 w-full items-center justify-center border-r-2">
               <Link to={'/?search=&priority=100'}>
                 <p className="text-center text-red-300">
                   {categorie.priority100}
@@ -29,7 +29,7 @@ const NeedsSuppliesCard = ({ catergories }: INeedsSupliesCard) => {
               </Link>
             </div>
 
-            <div className="w-full h-10 border-r-2 flex justify-center items-center">
+            <div className="flex h-10 w-full items-center justify-center border-r-2">
               <Link to={'/?search=&priority=10'}>
                 <p className="text-center text-orange-300">
                   {categorie.priority10}
@@ -37,7 +37,7 @@ const NeedsSuppliesCard = ({ catergories }: INeedsSupliesCard) => {
               </Link>
             </div>
 
-            <div className="w-full h-10 flex justify-center items-center">
+            <div className="flex h-10 w-full items-center justify-center">
               <Link to={'/?search=&priority=1'}>
                 <p className="text-center text-green-300">
                   {categorie.priority1}
diff --git a/src/pages/Dashboard/components/ShelterOverview.tsx b/src/pages/Dashboard/components/ShelterOverview.tsx
index b79c72e8..c4a0d00f 100644
--- a/src/pages/Dashboard/components/ShelterOverview.tsx
+++ b/src/pages/Dashboard/components/ShelterOverview.tsx
@@ -16,7 +16,7 @@ const ShelterOverview = ({
 }: IShelterOverview) => {
   return (
     <section className="overview flex gap-2">
-      <div className="flex flex-col gap-2 justify-center align-center">
+      <div className="align-center flex flex-col justify-center gap-2">
         <TotalItemsCard
           total={totalShelters as number}
           text="Total de abrigos"
diff --git a/src/pages/Dashboard/components/TotalItemsCard.tsx b/src/pages/Dashboard/components/TotalItemsCard.tsx
index b9bd6415..9909a973 100644
--- a/src/pages/Dashboard/components/TotalItemsCard.tsx
+++ b/src/pages/Dashboard/components/TotalItemsCard.tsx
@@ -8,8 +8,8 @@ const TotalItemsCard = ({ total, text }: ITotalItemsCard) => {
     'flex flex-col gap-2 justify-center text-center w-64 h-24 box-border border-2 rounded-xl border-gray-200';
   return (
     <div className={cardClass}>
-      <p className="font-bold text-4xl">{total}</p>
-      <p className="font-bold text-md">{text}</p>
+      <p className="text-4xl font-bold">{total}</p>
+      <p className="text-md font-bold">{text}</p>
     </div>
   );
 };
diff --git a/src/pages/DonationsHistory/DonationsHistory.tsx b/src/pages/DonationsHistory/DonationsHistory.tsx
index 6c0193c3..2ea27702 100644
--- a/src/pages/DonationsHistory/DonationsHistory.tsx
+++ b/src/pages/DonationsHistory/DonationsHistory.tsx
@@ -29,7 +29,7 @@ const DonationsHistoryComponent = () => {
         },
       });
     },
-    [refresh]
+    [refresh],
   );
 
   const handleUpdateDonationStatus = useCallback(
@@ -49,7 +49,7 @@ const DonationsHistoryComponent = () => {
           setLoading((prev) => ({ ...prev, [shelterId]: false }));
         });
     },
-    [refresh, selectedTab, toast]
+    [refresh, selectedTab, toast],
   );
 
   const tabsVariants = cva('font-semibold text-lg border-b-2 !text-black', {
@@ -65,10 +65,10 @@ const DonationsHistoryComponent = () => {
   });
 
   return (
-    <div className="flex flex-col h-screen items-center">
+    <div className="flex h-screen flex-col items-center">
       <Header title="SOS Rio Grande do Sul" startAdornment={<BurgerMenu />} />
-      <div className="w-full flex flex-col gap-4 p-4 max-w-4xl [&_*]:text-zinc-500 pb-8">
-        <h3 className="text-3xl pt-4 font-bold !text-zinc-900">Suas Doações</h3>
+      <div className="flex w-full max-w-4xl flex-col gap-4 p-4 pb-8 [&_*]:text-zinc-500">
+        <h3 className="pt-4 text-3xl font-bold !text-zinc-900">Suas Doações</h3>
         <Tabs value={selectedTab} className="space-y-4">
           <TabsList className="space-x-4">
             <TabsTrigger
@@ -103,13 +103,13 @@ const DonationsHistoryComponent = () => {
                     onCancel={() =>
                       handleUpdateDonationStatus(
                         donation.id,
-                        DonateOrderStatus.Canceled
+                        DonateOrderStatus.Canceled,
                       )
                     }
                     onConfirm={() =>
                       handleUpdateDonationStatus(
                         donation.id,
-                        DonateOrderStatus.Complete
+                        DonateOrderStatus.Complete,
                       )
                     }
                   />
@@ -130,13 +130,13 @@ const DonationsHistoryComponent = () => {
                     onCancel={() =>
                       handleUpdateDonationStatus(
                         donation.id,
-                        DonateOrderStatus.Canceled
+                        DonateOrderStatus.Canceled,
                       )
                     }
                     onConfirm={() =>
                       handleUpdateDonationStatus(
                         donation.id,
-                        DonateOrderStatus.Complete
+                        DonateOrderStatus.Complete,
                       )
                     }
                   />
diff --git a/src/pages/DonationsHistory/components/DonationHistoryListItem/DonationHistoryListItem.tsx b/src/pages/DonationsHistory/components/DonationHistoryListItem/DonationHistoryListItem.tsx
index a3cfe065..1a828f25 100644
--- a/src/pages/DonationsHistory/components/DonationHistoryListItem/DonationHistoryListItem.tsx
+++ b/src/pages/DonationsHistory/components/DonationHistoryListItem/DonationHistoryListItem.tsx
@@ -37,11 +37,11 @@ const DonationHistoryListItem = React.forwardRef<
   });
   const accordeonLabel = useMemo(
     () => (visible ? 'Ocultar itens doados' : 'Mostrar itens doados'),
-    [visible]
+    [visible],
   );
   const AccordeonIcon = useMemo(
     () => (visible ? ChevronUp : ChevronDown),
-    [visible]
+    [visible],
   );
 
   if (!donation) return <Fragment />;
@@ -50,8 +50,8 @@ const DonationHistoryListItem = React.forwardRef<
     <div
       ref={ref}
       className={cn(
-        'flex flex-col gap-2 items-start bg-slate-100 rounded-md p-4',
-        className
+        'flex flex-col items-start gap-2 rounded-md bg-slate-100 p-4',
+        className,
       )}
       {...rest}
     >
@@ -60,14 +60,14 @@ const DonationHistoryListItem = React.forwardRef<
         data={donation}
         className="hidden print:flex"
       />
-      <div className="flex flex-col gap-1 relative w-full">
+      <div className="relative flex w-full flex-col gap-1">
         <DonationHistoryStatus
           status={donation.status}
-          className="absolute top-0 right-0 flex items-center justify-center gap-2"
+          className="absolute right-0 top-0 flex items-center justify-center gap-2"
         >
           <Printer
             onClick={() => handlePrint(null, () => divRef.current)}
-            className="stroke-gray-900 hover:stroke-gray-700 active:stroke-gray-800 h-5 w-5 cursor-pointer"
+            className="h-5 w-5 cursor-pointer stroke-gray-900 hover:stroke-gray-700 active:stroke-gray-800"
           />
         </DonationHistoryStatus>
         <small className="font-medium !text-muted-foreground">Doação de</small>
@@ -78,14 +78,14 @@ const DonationHistoryListItem = React.forwardRef<
         <h3 className="font-semibold !text-black">
           {donation.shelter.name} em {donation.shelter.address}
         </h3>
-        <small className="text-xs text-semibold">
+        <small className="text-semibold text-xs">
           às {format(new Date(donation.createdAt), "HH'h'mm 'de' dd/MM/yy")}
         </small>
       </div>
       <Button
         variant="ghost"
         size="sm"
-        className="!text-red-500 font-medium hover:bg-transparent active:bg-transparent px-0 py-0 rounded-md flex gap-2 mt-2 hover:!text-red-400 [&_svg]:hover:stroke-red-400"
+        className="mt-2 flex gap-2 rounded-md px-0 py-0 font-medium !text-red-500 hover:bg-transparent hover:!text-red-400 active:bg-transparent [&_svg]:hover:stroke-red-400"
         onClick={() => setVisible((prev) => !prev)}
       >
         {accordeonLabel}
@@ -95,43 +95,43 @@ const DonationHistoryListItem = React.forwardRef<
         {donation.donationOrderSupplies.map((s, idx) => (
           <li
             key={idx}
-            className="pl-2 text-sm font-medium flex gap-2 items-center"
+            className="flex items-center gap-2 pl-2 text-sm font-medium"
           >
-            <Circle className="w-1 h-1 fill-muted-foreground" />
+            <Circle className="h-1 w-1 fill-muted-foreground" />
             {s.quantity}
             {SupplyMeasureMap[s.supply.measure]} de {s.supply.name}
           </li>
         ))}
       </ul>
-      <div className="flex gap-2 justify-between w-full md:justify-end flex-wrap">
+      <div className="flex w-full flex-wrap justify-between gap-2 md:justify-end">
         <Button
           variant="ghost"
           size="sm"
           className={clsx(
-            '!text-red-500 font-medium hover:bg-red-50 active:bg-red-100 px-4 py-1 rounded-md flex gap-2 mt-2 hover:!text-red-400 [&_svg]:hover:stroke-red-400',
+            'mt-2 flex gap-2 rounded-md px-4 py-1 font-medium !text-red-500 hover:bg-red-50 hover:!text-red-400 active:bg-red-100 [&_svg]:hover:stroke-red-400',
             {
               hidden: donation.status !== DonateOrderStatus.Pending,
-            }
+            },
           )}
           onClick={onCancel}
           disabled={loading}
         >
-          <CircleX className="stroke-red-500 h-4 w-4 md:h-5 md:w-5" />
+          <CircleX className="h-4 w-4 stroke-red-500 md:h-5 md:w-5" />
           Cancelar doação
         </Button>
         <Button
           variant="ghost"
           size="sm"
           className={clsx(
-            '!text-green-600 font-medium hover:bg-green-100 active:bg-green-200 px-4 py-1 rounded-md flex gap-2 mt-2 hover:!text-green-500 [&_svg]:hover:stroke-green-500',
+            'mt-2 flex gap-2 rounded-md px-4 py-1 font-medium !text-green-600 hover:bg-green-100 hover:!text-green-500 active:bg-green-200 [&_svg]:hover:stroke-green-500',
             {
               hidden: donation.status !== DonateOrderStatus.Pending,
-            }
+            },
           )}
           onClick={onConfirm}
           disabled={loading}
         >
-          <PackageCheck className="stroke-green-600 h-4 w-4 md:h-5 md:w-5" />
+          <PackageCheck className="h-4 w-4 stroke-green-600 md:h-5 md:w-5" />
           Confirmar entrega
         </Button>
       </div>
diff --git a/src/pages/EditShelterSupply/EditShelterSupply.tsx b/src/pages/EditShelterSupply/EditShelterSupply.tsx
index fb06726b..713f98dd 100644
--- a/src/pages/EditShelterSupply/EditShelterSupply.tsx
+++ b/src/pages/EditShelterSupply/EditShelterSupply.tsx
@@ -23,25 +23,25 @@ const EditShelterSupply = () => {
   const { data: shelter, loading, refresh } = useShelter(shelterId);
   const { data: supplies } = useSupplies();
   const [filteredSupplies, setFilteredSupplies] = useState<IUseSuppliesData[]>(
-    []
+    [],
   );
   const [searchedSupplies, setSearchedSupplies] = useState<IUseSuppliesData[]>(
-    []
+    [],
   );
   const shelterSupplyData = useMemo(() => {
     return (shelter?.shelterSupplies ?? []).reduce(
       (prev, current) => ({ ...prev, [current.supply.id]: current }),
-      {} as Record<string, IUseShelterDataSupply>
+      {} as Record<string, IUseShelterDataSupply>,
     );
   }, [shelter?.shelterSupplies]);
-  
+
   const [, setSearchSupplies] = useThrottle<string>(
     {
       throttle: 200,
       callback: (value) => {
         if (value) {
           const filteredSupplies = supplies.filter((s) =>
-            normalizedCompare(s.name, value)
+            normalizedCompare(s.name, value),
           );
           setSearchedSupplies(filteredSupplies);
         } else {
@@ -50,7 +50,7 @@ const EditShelterSupply = () => {
         }
       },
     },
-    [supplies]
+    [supplies],
   );
 
   const [, setSearch] = useThrottle<string>(
@@ -59,16 +59,18 @@ const EditShelterSupply = () => {
       callback: (value) => {
         if (value) {
           const filteredSupplies = supplies.filter((s) =>
-            normalizedCompare(s.name, value)
+            normalizedCompare(s.name, value),
           );
           setFilteredSupplies(filteredSupplies);
         } else {
-          const storedSupplies = supplies.filter((s) => !!shelterSupplyData[s.id]);
+          const storedSupplies = supplies.filter(
+            (s) => !!shelterSupplyData[s.id],
+          );
           setFilteredSupplies(storedSupplies);
         }
       },
     },
-    [supplies, shelterSupplyData]
+    [supplies, shelterSupplyData],
   );
   const [modalOpened, setModalOpened] = useState<boolean>(false);
   const [loadingSave, setLoadingSave] = useState<boolean>(false);
@@ -80,7 +82,7 @@ const EditShelterSupply = () => {
   const supplyGroups = useMemo(
     () =>
       group<IUseSuppliesData>(filteredSupplies ?? [], 'supplyCategory.name'),
-    [filteredSupplies]
+    [filteredSupplies],
   );
 
   const handleClickSupplyRow = useCallback(
@@ -134,7 +136,7 @@ const EditShelterSupply = () => {
         },
       });
     },
-    [refresh, shelterId, toast]
+    [refresh, shelterId, toast],
   );
 
   useEffect(() => {
@@ -173,10 +175,10 @@ const EditShelterSupply = () => {
           {...modalData}
         />
       )}
-      <div className="flex flex-col h-screen items-center">
+      <div className="flex h-screen flex-col items-center">
         <Header
           title="Editar Itens"
-          className="bg-white [&_*]:text-zinc-800 border-b-[1px] border-b-border"
+          className="border-b-[1px] border-b-border bg-white [&_*]:text-zinc-800"
           startAdornment={
             <Button
               variant="ghost"
@@ -187,30 +189,32 @@ const EditShelterSupply = () => {
             </Button>
           }
         />
-        <div className="p-4 flex flex-col max-w-5xl w-full gap-3 items-start">
+        <div className="flex w-full max-w-5xl flex-col items-start gap-3 p-4">
           <h6 className="text-2xl font-semibold">Editar itens do abrigo</h6>
           <p className="text-muted-foreground">
-            Antes de adicionar um novo item, confira na busca abaixo se ele já não foi cadastrado.
+            Antes de adicionar um novo item, confira na busca abaixo se ele já
+            não foi cadastrado.
           </p>
-          <div className="w-full my-2">
+          <div className="my-2 w-full">
             <SupplySearch
               supplyItems={searchedSupplies}
               limit={5}
-              onSearch={(value) => 
-                setSearchSupplies(value)
-              }
-              onSelectItem={(item) =>  {
+              onSearch={(value) => setSearchSupplies(value)}
+              onSelectItem={(item) => {
                 setSearch(item.name);
                 setSearchedSupplies([]);
               }}
-              onAddNewItem={() => navigate(`/abrigo/${shelterId}/item/cadastrar`)}
+              onAddNewItem={() =>
+                navigate(`/abrigo/${shelterId}/item/cadastrar`)
+              }
             />
           </div>
 
-          <p className="text-muted-foreground mt-3">
-            Para cada item da lista abaixo, informe a disponibilidade no abrigo selecionado. 
+          <p className="mt-3 text-muted-foreground">
+            Para cada item da lista abaixo, informe a disponibilidade no abrigo
+            selecionado.
           </p>
-          <div className="flex flex-col gap-2 w-full my-4">
+          <div className="my-4 flex w-full flex-col gap-2">
             {Object.entries(supplyGroups).map(([key, values], idx) => {
               const items: ISupplyRowItemProps[] = values
                 .map((v) => {
diff --git a/src/pages/EditShelterSupply/components/SupplyRow/SupplyRow.tsx b/src/pages/EditShelterSupply/components/SupplyRow/SupplyRow.tsx
index 9aba6cd4..0896a441 100644
--- a/src/pages/EditShelterSupply/components/SupplyRow/SupplyRow.tsx
+++ b/src/pages/EditShelterSupply/components/SupplyRow/SupplyRow.tsx
@@ -7,9 +7,9 @@ const SupplyRow = (props: ISupplyRowProps) => {
   const { name, items, onClick } = props;
 
   return (
-    <div className={`${name !== '' ? 'gap-4 flex flex-col pb-6' : 'hidden'}`}>
+    <div className={`${name !== '' ? 'flex flex-col gap-4 pb-6' : 'hidden'}`}>
       <div className="flex w-full">
-        <h3 className="font-semibold text-lg border rounded p-2 flex items-center">
+        <h3 className="flex items-center rounded border p-2 text-lg font-semibold">
           <Archive className="mr-2 size-5" />
           {name.toUpperCase()}
         </h3>
diff --git a/src/pages/EditShelterSupply/components/SupplyRowInfo/SupplyRowInfo.tsx b/src/pages/EditShelterSupply/components/SupplyRowInfo/SupplyRowInfo.tsx
index 50d78b87..84826aac 100644
--- a/src/pages/EditShelterSupply/components/SupplyRowInfo/SupplyRowInfo.tsx
+++ b/src/pages/EditShelterSupply/components/SupplyRowInfo/SupplyRowInfo.tsx
@@ -10,18 +10,18 @@ const SupplyRowInfo = (props: ISupplyRowInfoProps) => {
 
   const { className, label } = useMemo(
     () => getSupplyPriorityProps(priority),
-    [priority]
+    [priority],
   );
 
   return (
     <div
       onClick={onClick}
-      className="flex w-full justify-between content-end border-b-[1px] border-b-border py-4 hover:cursor-pointer hover:bg-slate-50 px-1 rounded-sm"
+      className="flex w-full content-end justify-between rounded-sm border-b-[1px] border-b-border px-1 py-4 hover:cursor-pointer hover:bg-slate-50"
     >
       <h2 className="font-medium">{name}</h2>
-      <div className="flex justify-end items-center gap-2">
+      <div className="flex items-center justify-end gap-2">
         <CircleStatus className={className} />
-        <p className="text-muted-foreground text-nowrap pl-1">{label}</p>
+        <p className="text-nowrap pl-1 text-muted-foreground">{label}</p>
         {Boolean(quantity) && <Badge variant="secondary">{quantity}</Badge>}
       </div>
     </div>
diff --git a/src/pages/EditShelterSupply/components/SupplySearch/SupplySearch.tsx b/src/pages/EditShelterSupply/components/SupplySearch/SupplySearch.tsx
index b63aa36e..9627c893 100644
--- a/src/pages/EditShelterSupply/components/SupplySearch/SupplySearch.tsx
+++ b/src/pages/EditShelterSupply/components/SupplySearch/SupplySearch.tsx
@@ -14,7 +14,7 @@ export const SupplySearch = ({
 }: ISupplySearchProps) => {
   const [searchValue, setSearchValue] = useState<string>('');
   const [selectedItem, setSelectedItem] = useState<IUseSuppliesData | null>(
-    null
+    null,
   );
 
   function onChangeInputHandler(event: React.ChangeEvent<HTMLInputElement>) {
@@ -42,42 +42,42 @@ export const SupplySearch = ({
   return (
     <Fragment>
       <div
-        className="flex items-center rounded-md border border-input px-3 h-10"
+        className="flex h-10 items-center rounded-md border border-input px-3"
         cmdk-input-wrapper=""
       >
         <Search className="mr-2 h-4 w-4 shrink-0 opacity-50" />
         <Input
           type="text"
-          className="outline-none border-none focus-visible:ring-transparent h-8"
+          className="h-8 border-none outline-none focus-visible:ring-transparent"
           placeholder="Buscar itens..."
           value={searchValue}
           onChange={onChangeInputHandler}
         />
         <X
-          className="h-4 w-4 ml-2 hover:cursor-pointer"
+          className="ml-2 h-4 w-4 hover:cursor-pointer"
           onClick={onClearClickHandler}
         />
       </div>
 
       {!!searchValue && !selectedItem ? (
-        <div className="flex-col items-center rounded-md border border-input p-3 bg-slate-50 mt-1">
+        <div className="mt-1 flex-col items-center rounded-md border border-input bg-slate-50 p-3">
           {supplyItems
             .sort((a, b) => a.name.length - b.name.length)
             .slice(0, limit)
             .map((item) => (
               <div
                 key={item.id}
-                className="h-10 flex items-center rounded-md p-2 hover:bg-slate-100 hover:cursor-pointer"
+                className="flex h-10 items-center rounded-md p-2 hover:cursor-pointer hover:bg-slate-100"
                 onClick={() => onSelectItemHandler(item)}
               >
                 <span className="text-sm">{item.name}</span>
               </div>
             ))}
           <div
-            className="h-10 flex items-center rounded-md p-2 hover:bg-slate-100 hover:cursor-pointer"
+            className="flex h-10 items-center rounded-md p-2 hover:cursor-pointer hover:bg-slate-100"
             onClick={onAddNewItemHandler}
           >
-            <div className="flex gap-2 items-center">
+            <div className="flex items-center gap-2">
               <PlusCircle size={16} color="#0284c7" />
               <span className="text-sm text-sky-600">Cadastrar novo item</span>
             </div>
diff --git a/src/pages/EditShelterSupply/components/SupplySearch/types.ts b/src/pages/EditShelterSupply/components/SupplySearch/types.ts
index c91a92f6..f26cf313 100644
--- a/src/pages/EditShelterSupply/components/SupplySearch/types.ts
+++ b/src/pages/EditShelterSupply/components/SupplySearch/types.ts
@@ -1,4 +1,4 @@
-import { IUseSuppliesData } from "@/hooks/useSupplies/types";
+import { IUseSuppliesData } from '@/hooks/useSupplies/types';
 
 export interface ISupplySearchProps {
   supplyItems: IUseSuppliesData[];
@@ -6,4 +6,4 @@ export interface ISupplySearchProps {
   onSearch: (value: string) => void;
   onSelectItem: (item: IUseSuppliesData) => void;
   onAddNewItem: () => void;
-}
\ No newline at end of file
+}
diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx
index ad4343f0..b6f377b1 100644
--- a/src/pages/Home/Home.tsx
+++ b/src/pages/Home/Home.tsx
@@ -20,7 +20,7 @@ const initialFilterData: IFilterFormProps = {
 
 const loadFilterData = (): IFilterFormProps => {
   const storedFilterData = JSON.parse(
-    localStorage.getItem('filter-data') || '{}'
+    localStorage.getItem('filter-data') || '{}',
   );
   return {
     ...initialFilterData,
@@ -37,9 +37,8 @@ const Home = () => {
   const { data: shelters, loading, refresh } = useShelters({ cache: true });
   const [isModalOpen, setOpenModal] = useState<boolean>(false);
   const [, setSearchParams] = useSearchParams();
-  const [filterData, setFilterData] = useState<IFilterFormProps>(
-    loadFilterData()
-  );
+  const [filterData, setFilterData] =
+    useState<IFilterFormProps>(loadFilterData());
 
   const [, setSearch] = useThrottle<string>(
     {
@@ -50,7 +49,7 @@ const Home = () => {
         refresh({ params });
       },
     },
-    [filterData]
+    [filterData],
   );
 
   const clearSearch = useCallback(() => {
@@ -63,7 +62,7 @@ const Home = () => {
 
   const hasMore = useMemo(
     () => shelters.page * shelters.perPage < shelters.count,
-    [shelters.page, shelters.perPage, shelters.count]
+    [shelters.page, shelters.perPage, shelters.count],
   );
 
   const factorySearchArgs = useCallback((values: IFilterFormProps) => {
@@ -87,7 +86,7 @@ const Home = () => {
       saveFilterData(values);
       refresh({ params: { search: searchQuery } });
     },
-    [refresh, setSearchParams, factorySearchArgs]
+    [refresh, setSearchParams],
   );
 
   const handleFetchMore = useCallback(() => {
@@ -123,7 +122,7 @@ const Home = () => {
   }, [filterData, refresh, setSearchParams]);
 
   return (
-    <div className="flex flex-col h-screen items-center">
+    <div className="flex h-screen flex-col items-center">
       {isModalOpen && (
         <Filter
           open={isModalOpen}
@@ -136,13 +135,13 @@ const Home = () => {
         title="SOS Rio Grande do Sul"
         startAdornment={<BurgerMenu />}
         endAdornment={
-          <div className="flex gap-2 items-center">
+          <div className="flex items-center gap-2">
             <Button
               loading={loading}
               variant="ghost"
               size="sm"
               onClick={() => refresh()}
-              className="disabled:bg-red-500 hover:bg-red-400"
+              className="hover:bg-red-400 disabled:bg-red-500"
             >
               <RotateCw size={20} className="stroke-white" />
             </Button>
@@ -166,7 +165,7 @@ const Home = () => {
             { ...filterData, cities: v },
             {
               skipNulls: true,
-            }
+            },
           );
           setSearchParams(searchQuery);
           refresh({
@@ -178,7 +177,7 @@ const Home = () => {
         hasMoreItems={hasMore}
         onOpenModal={() => setOpenModal(true)}
         onClearSearch={clearSearch}
-        className="flex-1 p-4 max-w-4xl"
+        className="max-w-4xl flex-1 p-4"
       />
       <Footer />
     </div>
diff --git a/src/pages/Home/components/Filter/CitiesFilter.tsx b/src/pages/Home/components/Filter/CitiesFilter.tsx
index c4b8d821..117b69f0 100644
--- a/src/pages/Home/components/Filter/CitiesFilter.tsx
+++ b/src/pages/Home/components/Filter/CitiesFilter.tsx
@@ -26,10 +26,10 @@ export const CitiesFilter = ({
   }));
 
   return (
-    <div className="flex flex-col w-full gap-2">
-      <div className="flex flex-col gap-2 w-full my-4">
-        <p className="text-sm md:text-lg font-medium">Cidades</p>
-        <p className="text-muted-foreground text-sm md:text-md font-medium">
+    <div className="flex w-full flex-col gap-2">
+      <div className="my-4 flex w-full flex-col gap-2">
+        <p className="text-sm font-medium md:text-lg">Cidades</p>
+        <p className="md:text-md text-sm font-medium text-muted-foreground">
           Selecione uma ou mais cidades para pesquisar.
         </p>
 
diff --git a/src/pages/Home/components/Filter/Filter.tsx b/src/pages/Home/components/Filter/Filter.tsx
index b8cfab6e..6e7c85fb 100644
--- a/src/pages/Home/components/Filter/Filter.tsx
+++ b/src/pages/Home/components/Filter/Filter.tsx
@@ -31,7 +31,7 @@ const priorityOpts = Object.entries(priorityOptions).reduce(
     priority === `${SupplyPriority.NotNeeded}`
       ? prev
       : { ...prev, [priority]: label },
-  {} as Record<SupplyPriority, string>
+  {} as Record<SupplyPriority, string>,
 );
 
 const Filter = (props: IFilterProps) => {
@@ -42,13 +42,13 @@ const Filter = (props: IFilterProps) => {
   const mappedSupplyCategories = useMemo(() => {
     return supplyCategories.reduce(
       (prev, current) => ({ ...prev, [current.id]: current }),
-      {} as Record<string, ISupplyCategory>
+      {} as Record<string, ISupplyCategory>,
     );
   }, [supplyCategories]);
   const mappedSupplies = useMemo(() => {
     return supplies.reduce(
       (prev, current) => ({ ...prev, [current.id]: current }),
-      {} as Record<string, IUseSuppliesData>
+      {} as Record<string, IUseSuppliesData>,
     );
   }, [supplies]);
 
@@ -99,7 +99,7 @@ const Filter = (props: IFilterProps) => {
           cities,
         });
       },
-    }
+    },
   );
 
   const supplyOptions = useMemo(() => {
@@ -107,7 +107,7 @@ const Filter = (props: IFilterProps) => {
       .filter((v) => {
         return values.supplyCategories.length > 0
           ? values.supplyCategories.some(
-              (categoryItem) => categoryItem.value === v.supplyCategory.id
+              (categoryItem) => categoryItem.value === v.supplyCategory.id,
             )
           : true;
       })
@@ -127,25 +127,25 @@ const Filter = (props: IFilterProps) => {
               ...values.shelterStatus,
               { label: ShelterAvailabilityStatusMap[status], value: status },
             ]
-          : values.shelterStatus.filter((s) => s.value !== status)
+          : values.shelterStatus.filter((s) => s.value !== status),
       );
     },
-    [setFieldValue, values.shelterStatus]
+    [setFieldValue, values.shelterStatus],
   );
 
   if (loadingSupplies || loadingSupplyCategories) return <LoadingScreen />;
 
   return (
     <Dialog open={open} onOpenChange={onClose}>
-      <DialogContent className="rounded-md overflow-y-scroll max-h-[85vh] mt-8">
+      <DialogContent className="mt-8 max-h-[85vh] overflow-y-scroll rounded-md">
         <DialogHeader>
           <DialogTitle className="text-base font-medium">
             Faça sua busca:
           </DialogTitle>
         </DialogHeader>
         <form onSubmit={handleSubmit}>
-          <div className="pl-4 pr-4 pb-4 flex flex-col max-w-5xl w-full items-start">
-            <div className="flex flex-col gap-2 w-full my-4">
+          <div className="flex w-full max-w-5xl flex-col items-start pb-4 pl-4 pr-4">
+            <div className="my-4 flex w-full flex-col gap-2">
               <SearchInput
                 value={values.search}
                 onChange={(v) => setFieldValue('search', v)}
@@ -159,15 +159,15 @@ const Filter = (props: IFilterProps) => {
               }}
             />
             <Separator className="mt-2" />
-            <div className="flex flex-col gap-2 w-full my-4">
-              <p className="text-sm md:text-lg font-medium">Busca avançada</p>
-              <p className="text-muted-foreground text-sm md:text-lg font-medium">
+            <div className="my-4 flex w-full flex-col gap-2">
+              <p className="text-sm font-medium md:text-lg">Busca avançada</p>
+              <p className="text-sm font-medium text-muted-foreground md:text-lg">
                 Você pode buscar pelo item que os abrigos precisam com urgência
                 de doação ou por itens que os abrigos tem disponibilidade para
                 doar.
               </p>
-              <div className="flex flex-col gap-1 w-full">
-                <label className="text-muted-foreground text-sm md:text-lg font-medium">
+              <div className="flex w-full flex-col gap-1">
+                <label className="text-sm font-medium text-muted-foreground md:text-lg">
                   Status do item no abrigo
                 </label>
                 <Select
@@ -178,13 +178,13 @@ const Filter = (props: IFilterProps) => {
                     ([priority, label]) => ({
                       label,
                       value: priority,
-                    })
+                    }),
                   )}
                   onChange={(v) => setFieldValue('priorities', v)}
                 />
               </div>
-              <div className="flex flex-col gap-1 w-full">
-                <label className="text-muted-foreground text-sm md:text-lg font-medium">
+              <div className="flex w-full flex-col gap-1">
+                <label className="text-sm font-medium text-muted-foreground md:text-lg">
                   Categoria
                 </label>
                 <Select
@@ -200,8 +200,8 @@ const Filter = (props: IFilterProps) => {
                   onChange={(v) => setFieldValue('supplyCategories', v)}
                 />
               </div>
-              <div className="flex flex-col w-full">
-                <label className="text-muted-foreground text-sm md:text-lg font-medium">
+              <div className="flex w-full flex-col">
+                <label className="text-sm font-medium text-muted-foreground md:text-lg">
                   Itens
                 </label>
                 <Select
@@ -214,53 +214,53 @@ const Filter = (props: IFilterProps) => {
               </div>
             </div>
             <Separator className="mt-2" />
-            <div className="flex flex-col gap-2 w-full my-4">
-              <p className="text-muted-foreground text-sm md:text-lg font-medium">
+            <div className="my-4 flex w-full flex-col gap-2">
+              <p className="text-sm font-medium text-muted-foreground md:text-lg">
                 Status do abrigo
               </p>
               <div>
-                <label className="flex items-center mb-4">
+                <label className="mb-4 flex items-center">
                   <input
                     type="checkbox"
-                    className="mr-2 w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
+                    className="mr-2 h-4 w-4 rounded border-gray-300 bg-gray-100 text-blue-600 focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-700 dark:ring-offset-gray-800 dark:focus:ring-blue-600"
                     onChange={(ev) =>
                       handleToggleShelterStatus(ev.target.checked, 'available')
                     }
                     defaultChecked={values.shelterStatus.some(
-                      (s) => s.value === 'available'
+                      (s) => s.value === 'available',
                     )}
                   />
                   Abrigo Disponivel
                 </label>
               </div>
               <div>
-                <label className="flex items-center mb-4">
+                <label className="mb-4 flex items-center">
                   <input
                     type="checkbox"
-                    className="mr-2 w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
+                    className="mr-2 h-4 w-4 rounded border-gray-300 bg-gray-100 text-blue-600 focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-700 dark:ring-offset-gray-800 dark:focus:ring-blue-600"
                     onChange={(ev) =>
                       handleToggleShelterStatus(
                         ev.target.checked,
-                        'unavailable'
+                        'unavailable',
                       )
                     }
                     defaultChecked={values.shelterStatus.some(
-                      (s) => s.value === 'unavailable'
+                      (s) => s.value === 'unavailable',
                     )}
                   />
                   Abrigo Indisponível
                 </label>
               </div>
               <div>
-                <label className="flex items-center mb-4">
+                <label className="mb-4 flex items-center">
                   <input
                     type="checkbox"
-                    className="mr-2 w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
+                    className="mr-2 h-4 w-4 rounded border-gray-300 bg-gray-100 text-blue-600 focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-700 dark:ring-offset-gray-800 dark:focus:ring-blue-600"
                     onChange={(ev) =>
                       handleToggleShelterStatus(ev.target.checked, 'waiting')
                     }
                     defaultChecked={values.shelterStatus.some(
-                      (s) => s.value === 'waiting'
+                      (s) => s.value === 'waiting',
                     )}
                   />
                   Sem informação de disponibilidade
@@ -268,11 +268,11 @@ const Filter = (props: IFilterProps) => {
               </div>
             </div>
           </div>
-          <DialogFooter className="sticky bg-white -bottom-6">
-            <div className="flex flex-1 flex-col justify-end md:justify-start w-full py-6">
+          <DialogFooter className="sticky -bottom-6 bg-white">
+            <div className="flex w-full flex-1 flex-col justify-end py-6 md:justify-start">
               <Button
                 type="submit"
-                className="flex gap-2 text-white font-medium text-lg bg-blue-500 hover:bg-blue-600 w-full"
+                className="flex w-full gap-2 bg-blue-500 text-lg font-medium text-white hover:bg-blue-600"
               >
                 Filtrar resultados
               </Button>
diff --git a/src/pages/Home/components/Filter/types.ts b/src/pages/Home/components/Filter/types.ts
index e1e554ee..b4bc1388 100644
--- a/src/pages/Home/components/Filter/types.ts
+++ b/src/pages/Home/components/Filter/types.ts
@@ -1,35 +1,36 @@
-export type ShelterAvailabilityStatus = 'available' | 'unavailable' | 'waiting';
-
-export interface ISelectField<T = string> {
-  label: string;
-  value: T;
-}
-
-export interface IFilterFormProps {
-  search: string;
-  priorities: string[];
-  supplyCategoryIds: string[];
-  supplyIds: string[];
-  shelterStatus: ShelterAvailabilityStatus[];
-  cities: string[];
-}
-
-export interface IFilterSubmittionForm extends Omit<IFilterFormProps, 'priority'>{
-  priority: string;
-}
-
-export interface IFilterFormikProps {
-  search: string;
-  priorities: ISelectField[];
-  supplyCategories: ISelectField[];
-  supplies: ISelectField[];
-  shelterStatus: ISelectField<ShelterAvailabilityStatus>[];
-  cities: string[];
-}
-
-export interface IFilterProps {
-  onSubmit: (values: IFilterFormProps) => void;
-  data: IFilterFormProps;
-  open: boolean;
-  onClose: () => void;
-}
+export type ShelterAvailabilityStatus = 'available' | 'unavailable' | 'waiting';
+
+export interface ISelectField<T = string> {
+  label: string;
+  value: T;
+}
+
+export interface IFilterFormProps {
+  search: string;
+  priorities: string[];
+  supplyCategoryIds: string[];
+  supplyIds: string[];
+  shelterStatus: ShelterAvailabilityStatus[];
+  cities: string[];
+}
+
+export interface IFilterSubmittionForm
+  extends Omit<IFilterFormProps, 'priority'> {
+  priority: string;
+}
+
+export interface IFilterFormikProps {
+  search: string;
+  priorities: ISelectField[];
+  supplyCategories: ISelectField[];
+  supplies: ISelectField[];
+  shelterStatus: ISelectField<ShelterAvailabilityStatus>[];
+  cities: string[];
+}
+
+export interface IFilterProps {
+  onSubmit: (values: IFilterFormProps) => void;
+  data: IFilterFormProps;
+  open: boolean;
+  onClose: () => void;
+}
diff --git a/src/pages/Home/components/ShelterListItem/ShelterListItem.tsx b/src/pages/Home/components/ShelterListItem/ShelterListItem.tsx
index 4bcdd86a..9bead33d 100644
--- a/src/pages/Home/components/ShelterListItem/ShelterListItem.tsx
+++ b/src/pages/Home/components/ShelterListItem/ShelterListItem.tsx
@@ -31,7 +31,7 @@ const Wrapper = ({
   if (active) return <Link to={link}>{children}</Link>;
   else
     return (
-      <div className="[&>div]:hover:bg-white [&_*]:text-muted-foreground [&>div]:blur-[1px]">
+      <div className="[&>div]:blur-[1px] [&>div]:hover:bg-white [&_*]:text-muted-foreground">
         {children}
       </div>
     );
@@ -48,7 +48,7 @@ const ShelterListItem = (props: IShelterListItemProps) => {
           shelteredPeople,
           category: data.category,
         }),
-      [capacity, shelteredPeople, data.category]
+      [capacity, shelteredPeople, data.category],
     );
 
   const tags: ShelterTagInfo<IUseSheltersDataSupplyData[]> = useMemo(() => {
@@ -69,10 +69,10 @@ const ShelterListItem = (props: IShelterListItemProps) => {
 
   return (
     <Wrapper link={`/abrigo/${data.id}`} active={data.actived}>
-      <div className="flex flex-col p-4 w-full border-2 border-border rounded-md gap-1 relative hover:bg-accent">
+      <div className="relative flex w-full flex-col gap-1 rounded-md border-2 border-border p-4 hover:bg-accent">
         <div className="inline-flex justify-between">
           <div className="flex flex-row items-center gap-1">
-            <h3 className="font-semibold text-lg h-full hover:cursor-pointer hover:text-slate-500">
+            <h3 className="h-full text-lg font-semibold hover:cursor-pointer hover:text-slate-500">
               {data.name}
             </h3>
             {data.verified && (
@@ -87,10 +87,10 @@ const ShelterListItem = (props: IShelterListItemProps) => {
             </Button>
           )}
         </div>
-        <h6 className={cn('font-semibold text-md', availabilityClassName)}>
+        <h6 className={cn('text-md font-semibold', availabilityClassName)}>
           {availability}
         </h6>
-        <h6 className="text-muted-foreground text-sm md:text-lg font-medium">
+        <h6 className="text-sm font-medium text-muted-foreground md:text-lg">
           {data.address}
         </h6>
         {data.shelterSupplies.length > 0 && (
@@ -109,7 +109,7 @@ const ShelterListItem = (props: IShelterListItemProps) => {
             />
           </>
         )}
-        <small className="text-sm md:text-md font-light text-muted-foreground mt-2">
+        <small className="md:text-md mt-2 text-sm font-light text-muted-foreground">
           Atualizado em {updatedAtDate}
         </small>
       </div>
diff --git a/src/pages/Home/components/ShelterListView/ShelterListView.tsx b/src/pages/Home/components/ShelterListView/ShelterListView.tsx
index f1c3ddd7..637f058c 100644
--- a/src/pages/Home/components/ShelterListView/ShelterListView.tsx
+++ b/src/pages/Home/components/ShelterListView/ShelterListView.tsx
@@ -35,11 +35,10 @@ const ShelterListView = React.forwardRef<HTMLDivElement, IShelterListViewProps>(
 
     return (
       <div className={cn(className, 'flex flex-col gap-2')}>
-        <h1 className="text-[#2f2f2f] font-semibold text-2xl">
+        <h1 className="text-2xl font-semibold text-[#2f2f2f]">
           {searchParams.toString()
             ? `Abrigos encontrados (${count})`
-            : `Total de abrigos  (${count})`
-          }
+            : `Total de abrigos  (${count})`}
         </h1>
         <Alert
           description="Você pode consultar a lista de abrigos disponíveis. Ver e editar os itens que necessitam de doações."
@@ -53,10 +52,10 @@ const ShelterListView = React.forwardRef<HTMLDivElement, IShelterListViewProps>(
             onSearchValueChange ? onSearchValueChange(value) : undefined
           }
         />
-        <div className="flex flex-wrap gap-1 items-center">
+        <div className="flex flex-wrap items-center gap-1">
           {filterData.cities?.map((item) => (
             <div
-              className="flex items-center px-4 py-1 font-normal text-sm md:text-md rounded-3xl bg-gray-300 justify-center cursor-pointer hover:opacity-80 transition-all duration-200"
+              className="md:text-md flex cursor-pointer items-center justify-center rounded-3xl bg-gray-300 px-4 py-1 text-sm font-normal transition-all duration-200 hover:opacity-80"
               key={item}
               onClick={() =>
                 onCitiesChange?.(filterData.cities.filter((it) => it !== item))
@@ -70,7 +69,7 @@ const ShelterListView = React.forwardRef<HTMLDivElement, IShelterListViewProps>(
           <Button
             variant="ghost"
             size="sm"
-            className="flex gap-2 items-center text-blue-500 hover:text-blue-600 active:text-blue-700"
+            className="flex items-center gap-2 text-blue-500 hover:text-blue-600 active:text-blue-700"
             onClick={onOpenModal}
           >
             <ListFilter className="h-5 w-5 stroke-blue-500" />
@@ -80,7 +79,7 @@ const ShelterListView = React.forwardRef<HTMLDivElement, IShelterListViewProps>(
             <Button
               variant="ghost"
               size="sm"
-              className="flex gap-2 items-center text-blue-500 hover:text-blue-600 active:text-blue-700"
+              className="flex items-center gap-2 text-blue-500 hover:text-blue-600 active:text-blue-700"
               onClick={onClearSearch}
             >
               <CircleAlert className="h-5 w-5 stroke-blue-500" />
@@ -108,7 +107,7 @@ const ShelterListView = React.forwardRef<HTMLDivElement, IShelterListViewProps>(
                   Carregar mais
                 </Button>
               ) : (
-                <p className="text-muted-foreground font-semibold">
+                <p className="font-semibold text-muted-foreground">
                   Não há mais registros
                 </p>
               )}
@@ -117,7 +116,7 @@ const ShelterListView = React.forwardRef<HTMLDivElement, IShelterListViewProps>(
         </main>
       </div>
     );
-  }
+  },
 );
 
 export { ShelterListView };
diff --git a/src/pages/Home/components/ShelterSupplyCategoryRow/ShelterSupplyCategoryRow.tsx b/src/pages/Home/components/ShelterSupplyCategoryRow/ShelterSupplyCategoryRow.tsx
index f8f3aa79..6b86f436 100644
--- a/src/pages/Home/components/ShelterSupplyCategoryRow/ShelterSupplyCategoryRow.tsx
+++ b/src/pages/Home/components/ShelterSupplyCategoryRow/ShelterSupplyCategoryRow.tsx
@@ -20,11 +20,11 @@ const ShelterSupplyCategoryRow = React.forwardRef<
   return (
     <div className={cn('flex flex-col gap-3', className)} ref={ref} {...rest}>
       <Separator className="mt-2" />
-      <p className="text-muted-foreground text-sm md:text-lg font-medium">
+      <p className="text-sm font-medium text-muted-foreground md:text-lg">
         {title}
       </p>
       {description && <p>{description}</p>}
-      <div className="flex gap-2 flex-wrap">
+      <div className="flex flex-wrap gap-2">
         {tags.slice(0, 10).map((s, idx) => (
           <Chip key={idx} {...s} />
         ))}
diff --git a/src/pages/Home/index.ts b/src/pages/Home/index.ts
index 6ee46bc4..646ca119 100644
--- a/src/pages/Home/index.ts
+++ b/src/pages/Home/index.ts
@@ -1,3 +1,3 @@
-import { Home } from "./Home";
+import { Home } from './Home';
 
 export { Home };
diff --git a/src/pages/PrivacyPolicy/PrivacyPolicy.tsx b/src/pages/PrivacyPolicy/PrivacyPolicy.tsx
index ed82a0c1..c66c4a14 100644
--- a/src/pages/PrivacyPolicy/PrivacyPolicy.tsx
+++ b/src/pages/PrivacyPolicy/PrivacyPolicy.tsx
@@ -3,16 +3,16 @@ import { LifeBuoy } from 'lucide-react';
 
 const PrivacyPolicy = () => {
   return (
-    <div className="flex flex-col h-screen items-center">
+    <div className="flex h-screen flex-col items-center">
       <Header title="SOS Rio Grande do Sul" startAdornment={<BurgerMenu />} />
-      <div className="w-full flex flex-col gap-4 p-4 max-w-4xl [&_*]:text-zinc-500 pb-8">
-        <h3 className="text-4xl pt-4 font-bold !text-zinc-900">
+      <div className="flex w-full max-w-4xl flex-col gap-4 p-4 pb-8 [&_*]:text-zinc-500">
+        <h3 className="pt-4 text-4xl font-bold !text-zinc-900">
           Política de privacidade
         </h3>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Ao entrar para o <b>SOS RS </b>
           <LifeBuoy
-            className="align-middle inline-block relative max-h-6 padding pb-0.5"
+            className="padding relative inline-block max-h-6 pb-0.5 align-middle"
             size={18}
           />{' '}
           , você nos confia uma série de informações. E nós cuidamos e
@@ -20,7 +20,7 @@ const PrivacyPolicy = () => {
           informações coletamos e o porquê de fazermos isso. E, ainda, como você
           pode atualizar, acompanhar ou, até mesmo, excluir esses dados.
         </p>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Desenvolvemos um mapa dinâmico que consolida diversas informações
           sobre as enchentes, incluindo localização de abrigos e suas demandas,
           o que ajuda diariamente as vítimas das enchentes no RS. Nossas
@@ -28,10 +28,10 @@ const PrivacyPolicy = () => {
           disponibilidade dos abrigos e as necessidades de doação para cada um
           deles.
         </p>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           O <b>SOS RS </b>
           <LifeBuoy
-            className="align-middle inline-block relative max-h-6 padding pb-0.5"
+            className="padding relative inline-block max-h-6 pb-0.5 align-middle"
             size={18}
           />{' '}
           declara manter sigilo e confidencialidade sobre os dados pessoais
@@ -43,39 +43,39 @@ const PrivacyPolicy = () => {
           <li>2. Qualidades de eventuais itens doados;</li>
           <li>3. Correção das necessidades apontadas;</li>
         </ul>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Declaramos seguir os princípios de proteção de dados consolidados nas
           legislações vigentes no Brasil, especialmente, a Resolução{' '}
           <b>CFM Nº 2299 DE 30/09/2021</b>.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Coleta de informações
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Coletamos apenas informações imprescindíveis para desempenhar nosso
           propósito. As informações coletadas e como essas informações são
           utilizadas dependem de como e do quanto você utiliza o <b>SOS RS </b>
           <LifeBuoy
-            className="align-middle inline-block relative max-h-6 padding pb-0.5"
+            className="padding relative inline-block max-h-6 pb-0.5 align-middle"
             size={18}
           />{' '}
           . Armazenamos as informações que coletamos.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Itens que você cria ou nos fornece
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Ao cadastrar um abrigo, você nos fornece, inicialmente, informações
           pessoais, como seu nome e CPF. Ao alimentar nosso aplicativo, você
           fornece dados sobre os abrigos, os quais você, usuário, se
           responsabiliza integralmente, e que também são fornecidos para a
           comunidade, após alimentação, e podem ser armazenados pelo SOS-RS.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Informações que coletamos automaticamente quando você utiliza nossos
           serviços
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Utilizamos apenas cookies temporários, com ID de sessão do servidor e
           dados de localização, quando autorizados, para otimizar sua
           experiência na plataforma. É possível redefinir seu navegador da web
@@ -83,41 +83,41 @@ const PrivacyPolicy = () => {
           não funcionar corretamente, se a sua capacidade de aceitar cookies
           estiver desabilitada.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Por que o SOS RS coleta dados
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Usamos as informações coletadas para auxiliar a fornecer, manter e
           melhorar a logística de suprimentos e disponibilidade em abrigos.
           Também para:
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Entrar em contato com você
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Se você for um abrigo, usamos as informações que coletamos para
           interagir diretamente com você.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Compartilhamento de suas informações
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Podemos compartilhar os dados com a comunidade e outras soluções do
           mesmo grupo e segmento, para cumprimento do nosso propósito e outros
           fins que julgarmos pertinente.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Por motivos legais
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Talvez precisemos compartilhar informações pessoais suas para fora do
           SOS, se isso for absolutamente necessário para cumprir a lei ou
           solicitação governamental ou judicial não abusiva.
         </p>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Se o <b>SOS RS </b>
           <LifeBuoy
-            className="align-middle inline-block relative max-h-6 padding pb-0.5"
+            className="padding relative inline-block max-h-6 pb-0.5 align-middle"
             size={18}
           />{' '}
           realizar fusão, aquisição ou venda, continuará a garantir a
@@ -125,46 +125,46 @@ const PrivacyPolicy = () => {
           antes que as informações sejam transferidas ou submetidas a uma
           política de privacidade diferente.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Mantemos suas informações seguras
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Possuímos segurança que protege continuamente suas informações, o que
           inclui:
         </p>
         <ul className="space-y-2">
-          <li className="text-justify text-md">
+          <li className="text-md text-justify">
             1. A utilização de criptografia para manter os seus dados pessoais
             privados enquanto estão em trânsito. Seus dados são, portanto,
             transferidos por uma conexão segura.
           </li>
-          <li className="text-justify text-md">
+          <li className="text-md text-justify">
             2. A restrição ao acesso a informações personalíssimas de pessoas
             físicas por parte de outros usuários e desenvolvedores. E ainda, o
             rigoroso treinamento e cumprimento de obrigações de
             confidencialidade para os que possuem acesso total aos dados.
           </li>
         </ul>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Exportar e excluir informações
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Nossos desenvolvedores permitem solicitar a exclusão dos seus dados
           pessoais, enviando um e-mail para <b>contato@sos-rs.com</b>.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Retenção de suas informações e compliance
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Reteremos suas informações por quanto tempo for necessário para
           satisfazer as finalidades para as quais elas foram coletadas ou para
           cumprir com os requerimentos legais aplicáveis.
         </p>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Eventualmente os dados serão descartados após o encerramento do
           propósito do <b>SOS RS </b>
           <LifeBuoy
-            className="align-middle inline-block relative max-h-6 padding pb-0.5"
+            className="padding relative inline-block max-h-6 pb-0.5 align-middle"
             size={18}
           />{' '}
           . A nossa política de exclusão garante que os dados fornecidos sejam
@@ -174,29 +174,29 @@ const PrivacyPolicy = () => {
           excluir ou exclui algo e o momento em que as cópias são
           definitivamente excluídas dos nossos sistemas ativos e de backup.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Você pode, a qualquer momento:
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Atualizar, inativar e corrigir, remover e solicitar acesso às suas
           informações.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Dados de contato
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Entre em contato conosco em caso de dúvidas, pelo e-mail{' '}
           <b>contato@sos-rs.com</b>. Você também pode travar contato com a
           autoridade local de proteção de dados, se possuir dúvidas sobre seus
           direitos de acordo com a legislação brasileira.
         </p>
-        <h5 className="text-2xl pt-4 font-bold !text-zinc-900">
+        <h5 className="pt-4 text-2xl font-bold !text-zinc-900">
           Quando esta política se aplica e alterações
         </h5>
-        <p className="text-justify text-md">
+        <p className="text-md text-justify">
           Esta Política de Privacidade se aplica ao <b>SOS RS </b>
           <LifeBuoy
-            className="align-middle inline-block relative max-h-6 padding pb-0.5"
+            className="padding relative inline-block max-h-6 pb-0.5 align-middle"
             size={18}
           />{' '}
           . Nos reservamos ao direito de alterar este documento periodicamente,
diff --git a/src/pages/Shelter/Shelter.tsx b/src/pages/Shelter/Shelter.tsx
index e8e64f66..4dc1c671 100644
--- a/src/pages/Shelter/Shelter.tsx
+++ b/src/pages/Shelter/Shelter.tsx
@@ -54,7 +54,7 @@ const Shelter = () => {
           shelteredPeople: shelter?.shelteredPeople,
           category: shelter?.category,
         }),
-      [shelter?.capacity, shelter?.shelteredPeople, shelter?.category]
+      [shelter?.capacity, shelter?.shelteredPeople, shelter?.category],
     );
   const [priorities, setPriorities] =
     useState<SupplyPriority[]>(defaultPriorities);
@@ -63,22 +63,25 @@ const Shelter = () => {
   const supplyGroups = useMemo(() => {
     if (!shelter?.shelterSupplies) return {};
     const groups = group(shelter.shelterSupplies, 'supply.supplyCategory.name');
-    return Object.entries(groups).reduce((prev, [name, list]) => {
-      const filtered = list.filter(
-        (l) =>
-          priorities.includes(l.priority) &&
-          (!search || normalizedCompare(l.supply.name, search))
-      );
-      if (filtered.length > 0) return { [name]: filtered, ...prev };
-      else return prev;
-    }, {} as Record<string, IUseShelterDataSupply[]>);
+    return Object.entries(groups).reduce(
+      (prev, [name, list]) => {
+        const filtered = list.filter(
+          (l) =>
+            priorities.includes(l.priority) &&
+            (!search || normalizedCompare(l.supply.name, search)),
+        );
+        if (filtered.length > 0) return { [name]: filtered, ...prev };
+        else return prev;
+      },
+      {} as Record<string, IUseShelterDataSupply[]>,
+    );
   }, [shelter, priorities, search]);
 
   const handleSelectPriority = (priority: SupplyPriority) => {
     setPriorities((prev) =>
       prev.includes(priority)
         ? prev.filter((p) => p !== priority)
-        : [...prev, priority]
+        : [...prev, priority],
     );
   };
 
@@ -97,7 +100,7 @@ const Shelter = () => {
         quantity: item.quantity || 1,
       });
     },
-    [addItem, opened, shelterId, toggleOpened]
+    [addItem, opened, shelterId, toggleOpened],
   );
 
   if (loading) return <LoadingScreen />;
@@ -109,14 +112,14 @@ const Shelter = () => {
         opened={opened}
         onClose={toggleOpened}
       />
-      <div className="flex flex-col h-screen items-center">
+      <div className="flex h-screen flex-col items-center">
         <Header
           title={shelter.name}
           startAdornment={
             <Button
               size="sm"
               variant="ghost"
-              className="[&_svg]:stroke-white disabled:bg-red-500 hover:bg-red-400"
+              className="hover:bg-red-400 disabled:bg-red-500 [&_svg]:stroke-white"
               onClick={() => navigate('/')}
             >
               <ChevronLeft size={20} />
@@ -126,9 +129,9 @@ const Shelter = () => {
             <DonationCartIcon quantity={carts[shelterId]?.length} />
           }
         />
-        <div className="p-4 flex flex-col max-w-5xl w-full h-full gap-2">
+        <div className="flex h-full w-full max-w-5xl flex-col gap-2 p-4">
           <div className="flex items-center gap-1">
-            <h1 className="text-[#2f2f2f] font-semibold text-2xl">
+            <h1 className="text-2xl font-semibold text-[#2f2f2f]">
               {shelter.name}
             </h1>
             {shelter.verified && <VerifiedBadge />}
@@ -143,7 +146,7 @@ const Shelter = () => {
             >
               <Button
                 variant="ghost"
-                className="font-medium text-[16px] text-blue-600 flex gap-2 items-center hover:text-blue-500 active:text-blue-700"
+                className="flex items-center gap-2 text-[16px] font-medium text-blue-600 hover:text-blue-500 active:text-blue-700"
                 onClick={() => navigate(`/abrigo/${shelterId}/atualizar`)}
               >
                 Editar
@@ -154,12 +157,12 @@ const Shelter = () => {
           <div>
             <CardAboutShelter shelter={shelter} />
           </div>
-          <div className="flex justify-between items-center">
-            <h1 className="font-semibold text-[18px]">Itens do abrigo</h1>
-            <div className="flex gap-2 items-center ">
+          <div className="flex items-center justify-between">
+            <h1 className="text-[18px] font-semibold">Itens do abrigo</h1>
+            <div className="flex items-center gap-2">
               <Button
                 variant="ghost"
-                className="font-medium text-[16px] text-blue-600 flex gap-2 items-center hover:text-blue-500 active:text-blue-700"
+                className="flex items-center gap-2 text-[16px] font-medium text-blue-600 hover:text-blue-500 active:text-blue-700"
                 onClick={() => navigate(`/abrigo/${shelterId}/items`)}
               >
                 Editar itens
@@ -176,7 +179,7 @@ const Shelter = () => {
               }}
             />
           </div>
-          <div className="flex gap-2 mt-2 flex-wrap">
+          <div className="mt-2 flex flex-wrap gap-2">
             {defaultPriorities.map((priority, idx) => {
               const { label, className } = getSupplyPriorityProps(priority);
               return (
@@ -184,17 +187,17 @@ const Shelter = () => {
                   key={idx}
                   label={label}
                   className={cn(
-                    'bg-transparent border-[1px] border-border cursor-pointer',
+                    'cursor-pointer border-[1px] border-border bg-transparent',
                     priorities.includes(priority)
                       ? className
-                      : 'hover:bg-gray-100'
+                      : 'hover:bg-gray-100',
                   )}
                   onClick={() => handleSelectPriority(priority)}
                 />
               );
             })}
           </div>
-          <div className="flex flex-col gap-4 mt-4">
+          <div className="mt-4 flex flex-col gap-4">
             {Object.entries(supplyGroups)
               .sort((a, b) => (a[0] > b[0] ? 1 : -1))
               .map(([name, list], idx, arr) => {
diff --git a/src/pages/Shelter/components/ShelterCategoryList/ShelterCategoryList.tsx b/src/pages/Shelter/components/ShelterCategoryList/ShelterCategoryList.tsx
index 7a0f14a2..375cb0ab 100644
--- a/src/pages/Shelter/components/ShelterCategoryList/ShelterCategoryList.tsx
+++ b/src/pages/Shelter/components/ShelterCategoryList/ShelterCategoryList.tsx
@@ -13,11 +13,11 @@ const ShelterCategoryList = (props: ShelterCategoryListProps) => {
   const { carts } = useContext(DonationCartContext);
   const cart: IDonationCartItem[] = useMemo(
     () => carts[shelterId] ?? [],
-    [carts, shelterId]
+    [carts, shelterId],
   );
 
   return (
-    <div className="flex flex-col gap-4 w-full">
+    <div className="flex w-full flex-col gap-4">
       <h6 className="font-medium">
         {name} ({items.length} items)
       </h6>
@@ -29,13 +29,13 @@ const ShelterCategoryList = (props: ShelterCategoryListProps) => {
             return (
               <div
                 key={item.id}
-                className="flex gap-2 items-center justify-between p-1 hover:bg-gray-50"
+                className="flex items-center justify-between gap-2 p-1 hover:bg-gray-50"
               >
-                <div className="flex gap-2 items-center">
+                <div className="flex items-center gap-2">
                   <CircleStatus className={cn('rounded-full', className)} />
                   <span className="font-semibold">{item.name}</span>
                 </div>
-                <div className="flex gap-4 items-center">
+                <div className="flex items-center gap-4">
                   {item.quantity && (
                     <span className="font-semibold text-muted-foreground">{`${
                       item.quantity
@@ -46,10 +46,10 @@ const ShelterCategoryList = (props: ShelterCategoryListProps) => {
                     onClick={() => onDonate(item)}
                     disabled={cart.some((c) => c.id === item.id)}
                     className={clsx(
-                      'text-red-600 font-semibold hover:bg-red-50 active:bg-red-100 px-4 py-1 rounded-md disabled:bg-gray-50 disabled:text-gray-300 disabled:hover:bg-gray-50 disabled:active:bg-gray-100 disabled:cursor-not-allowed',
+                      'rounded-md px-4 py-1 font-semibold text-red-600 hover:bg-red-50 active:bg-red-100 disabled:cursor-not-allowed disabled:bg-gray-50 disabled:text-gray-300 disabled:hover:bg-gray-50 disabled:active:bg-gray-100',
                       {
                         invisible: item.priority === SupplyPriority.Remaining,
-                      }
+                      },
                     )}
                   >
                     doar
diff --git a/src/pages/Shelter/index.ts b/src/pages/Shelter/index.ts
index 82076475..18b9fe8a 100644
--- a/src/pages/Shelter/index.ts
+++ b/src/pages/Shelter/index.ts
@@ -1,3 +1,3 @@
-import { Shelter } from "./Shelter";
+import { Shelter } from './Shelter';
 
 export { Shelter };
diff --git a/src/pages/SignIn/SignIn.tsx b/src/pages/SignIn/SignIn.tsx
index 9536b816..933d9232 100644
--- a/src/pages/SignIn/SignIn.tsx
+++ b/src/pages/SignIn/SignIn.tsx
@@ -46,11 +46,11 @@ const SignInComponent = () => {
     });
 
   return (
-    <div className="flex h-screen justify-center items-center bg-slate-50 p-4">
-      <div className="flex flex-col justify-center gap-4 max-w-lg w-full p-10 bg-white max-h-[600px] rounded-md shadow-sm">
+    <div className="flex h-screen items-center justify-center bg-slate-50 p-4">
+      <div className="flex max-h-[600px] w-full max-w-lg flex-col justify-center gap-4 rounded-md bg-white p-10 shadow-sm">
         <form onSubmit={handleSubmit} className="contents">
-          <div className="justify-center flex flex-col md:justify-normal">
-            <h1 className="font-bold text-lg md:text-2xl text-red-600">
+          <div className="flex flex-col justify-center md:justify-normal">
+            <h1 className="text-lg font-bold text-red-600 md:text-2xl">
               SOS Rio Grande do Sul
             </h1>
             <span className="text-muted-foreground">
@@ -73,7 +73,7 @@ const SignInComponent = () => {
           <Button
             loading={isSubmitting}
             type="submit"
-            className="bg-blue-500 hover:bg-blue-600 active:bg-blue-400 w-full"
+            className="w-full bg-blue-500 hover:bg-blue-600 active:bg-blue-400"
           >
             Entrar
           </Button>
diff --git a/src/pages/SignIn/index.ts b/src/pages/SignIn/index.ts
index e380d427..dfe9f1bd 100644
--- a/src/pages/SignIn/index.ts
+++ b/src/pages/SignIn/index.ts
@@ -1,3 +1,3 @@
-import { SignIn } from "./SignIn";
+import { SignIn } from './SignIn';
 
 export { SignIn };
diff --git a/src/pages/Supporters/Supporters.tsx b/src/pages/Supporters/Supporters.tsx
index a24d9102..32e584f2 100644
--- a/src/pages/Supporters/Supporters.tsx
+++ b/src/pages/Supporters/Supporters.tsx
@@ -9,24 +9,24 @@ const Supporters = () => {
   if (loading) return <LoadingScreen />;
 
   return (
-    <div className="flex flex-col h-screen items-center bg-gray-50 overflow-auto">
+    <div className="flex h-screen flex-col items-center overflow-auto bg-gray-50">
       <Header title="SOS Rio Grande do Sul" startAdornment={<BurgerMenu />} />
-      <div className="flex flex-col gap-4 p-4 max-w-5xl pb-8 w-full">
-        <h2 className="text-4xl pt-4 font-semibold !text-zinc-900">
+      <div className="flex w-full max-w-5xl flex-col gap-4 p-4 pb-8">
+        <h2 className="pt-4 text-4xl font-semibold !text-zinc-900">
           Apoiadores do projeto
         </h2>
-        <div className="grid grid-cols-2 md:grid-cols-4 w-full gap-4 md:gap-8 mt-8">
+        <div className="mt-8 grid w-full grid-cols-2 gap-4 md:grid-cols-4 md:gap-8">
           {supporters
             .sort((a, b) => a.createdAt.localeCompare(b.createdAt))
             .map((supporter, idx) => (
               <Link key={idx} to={supporter.link}>
                 <WithTooltip content={supporter.name}>
-                  <div className="bg-white flex flex-col gap-2 w-full aspect-square p-4 justify-between shadow-sm rounded-md hover:border-text hover:cursor-pointer">
+                  <div className="flex aspect-square w-full flex-col justify-between gap-2 rounded-md bg-white p-4 shadow-sm hover:cursor-pointer hover:border-text">
                     <div
                       style={{
                         backgroundImage: `url('${supporter.imageUrl}')`,
                       }}
-                      className="flex-1 bg-center w-full bg-contain bg-no-repeat"
+                      className="w-full flex-1 bg-contain bg-center bg-no-repeat"
                     />
                   </div>
                 </WithTooltip>
diff --git a/src/pages/UpdateShelter/UpdateShelter.tsx b/src/pages/UpdateShelter/UpdateShelter.tsx
index 3a428f42..40543a34 100644
--- a/src/pages/UpdateShelter/UpdateShelter.tsx
+++ b/src/pages/UpdateShelter/UpdateShelter.tsx
@@ -85,7 +85,7 @@ const UpdateShelter = () => {
 
   const debouncedZipcode = useDebouncedValue(
     touched?.zipCode ? values?.zipCode ?? '' : '',
-    500
+    500,
   );
 
   const { data: cepData, loading: isLoadingZipCodeData } =
@@ -102,10 +102,10 @@ const UpdateShelter = () => {
   if (loading) return <LoadingScreen />;
 
   return (
-    <div className="flex flex-col items-center h-[calc(var(--vh,1vh)*100)] md:h-screen">
+    <div className="flex h-[calc(var(--vh,1vh)*100)] flex-col items-center md:h-screen">
       <Header
         title="Atualização cadastral"
-        className="bg-white [&_*]:text-zinc-800 border-b-[1px] border-b-border"
+        className="border-b-[1px] border-b-border bg-white [&_*]:text-zinc-800"
         startAdornment={
           <Button
             variant="ghost"
@@ -116,13 +116,13 @@ const UpdateShelter = () => {
           </Button>
         }
       />
-      <div className="p-4 flex flex-col max-w-5xl w-full gap-3 items-start h-full">
+      <div className="flex h-full w-full max-w-5xl flex-col items-start gap-3 p-4">
         <form className="contents" onSubmit={handleSubmit}>
           <h6 className="text-2xl font-semibold">Atualização cadastral</h6>
           <p className="text-muted-foreground">
             Atualize as informações desejadas.
           </p>
-          <div className=" flex flex-col max-w-5xl w-full gap-6 items-start">
+          <div className="flex w-full max-w-5xl flex-col items-start gap-6">
             <Authenticated role="Staff">
               <TextField
                 label="Nome do abrigo"
@@ -137,7 +137,7 @@ const UpdateShelter = () => {
                 helperText={errors.zipCode}
               />
               {Boolean(isLoadingZipCodeData) && (
-                <Loader className="animate-spin h-15 w-15 stroke-black" />
+                <Loader className="h-15 w-15 animate-spin stroke-black" />
               )}
               <TextField
                 label="Logradouro (Rua/avenida)"
@@ -157,7 +157,7 @@ const UpdateShelter = () => {
                 error={!!errors.neighbourhood}
                 helperText={errors.neighbourhood}
               />
-              <div className="flex flex-col gap-1 w-full">
+              <div className="flex w-full flex-col gap-1">
                 <label className="text-muted-foreground" htmlFor="city">
                   Cidade
                 </label>
@@ -176,11 +176,11 @@ const UpdateShelter = () => {
                     setFieldValue('city', v?.value);
                   }}
                   className={cn('w-full', {
-                    'border-[1px] border-red-600 rounded-md': errors.city,
+                    'rounded-md border-[1px] border-red-600': errors.city,
                   })}
                 />
                 {errors.city && (
-                  <p className={'text-red-600 text-sm'}>{errors.city}</p>
+                  <p className={'text-sm text-red-600'}>{errors.city}</p>
                 )}
               </div>
               <TextField
@@ -249,11 +249,11 @@ const UpdateShelter = () => {
               />
             </Authenticated>
           </div>
-          <div className="flex flex-1 flex-col justify-end md:justify-start w-full py-6">
+          <div className="flex w-full flex-1 flex-col justify-end py-6 md:justify-start">
             <Button
               loading={isSubmitting}
               type="submit"
-              className="flex gap-2 text-white font-medium text-lg bg-blue-500 hover:bg-blue-600 w-full"
+              className="flex w-full gap-2 bg-blue-500 text-lg font-medium text-white hover:bg-blue-600"
             >
               Atualizar
             </Button>
diff --git a/src/routes/index.ts b/src/routes/index.ts
index 18d938e7..2ccd114d 100644
--- a/src/routes/index.ts
+++ b/src/routes/index.ts
@@ -1,3 +1,3 @@
-import { Routes } from "./Routes";
+import { Routes } from './Routes';
 
 export { Routes };
diff --git a/src/service/donationOrder/donationOrder.service.ts b/src/service/donationOrder/donationOrder.service.ts
index 7483e407..a1b5b5f3 100644
--- a/src/service/donationOrder/donationOrder.service.ts
+++ b/src/service/donationOrder/donationOrder.service.ts
@@ -12,7 +12,7 @@ const DonationOrderServices = {
   store: async (payload: ICreateDonationOrderProps) => {
     const { data } = await api.post<IServerResponse<ICreateDonateResponse>>(
       '/donation/order',
-      payload
+      payload,
     );
     return data;
   },
@@ -26,14 +26,14 @@ const DonationOrderServices = {
   },
   find: async (id: string) => {
     const { data } = await api.get<IServerResponse<IDonationsData>>(
-      `/donation/order/${id}`
+      `/donation/order/${id}`,
     );
     return data;
   },
   update: async (id: string, payload: { status: DonateOrderStatus }) => {
     const { data } = await api.put<IServerResponse>(
       `/donation/order/${id}`,
-      payload
+      payload,
     );
     return data;
   },
diff --git a/src/service/petsRsShelter/petsRsShelter.service.ts b/src/service/petsRsShelter/petsRsShelter.service.ts
index c5de3871..f5552651 100644
--- a/src/service/petsRsShelter/petsRsShelter.service.ts
+++ b/src/service/petsRsShelter/petsRsShelter.service.ts
@@ -4,9 +4,11 @@ import { IPetsRsShelter } from './types';
 
 const PetsRsShelterServices = {
   getByName: async (name: string): Promise<IPetsRsShelter> => {
-    const { data } = await axios.get(`https://cms.petsrs.com.br/api/abrigos?filters[Nome][$containsi]=${name}`);
+    const { data } = await axios.get(
+      `https://cms.petsrs.com.br/api/abrigos?filters[Nome][$containsi]=${name}`,
+    );
     return data?.data[0];
   },
-}
+};
 
 export { PetsRsShelterServices };
diff --git a/src/service/sessions/session.service.ts b/src/service/sessions/session.service.ts
index 63b7a415..8f358b36 100644
--- a/src/service/sessions/session.service.ts
+++ b/src/service/sessions/session.service.ts
@@ -6,7 +6,7 @@ const SessionServices = {
   auth: async (payload: IAuthRequest): Promise<IAuthResponse> => {
     const { data } = await api.post<IServerResponse<IAuthResponse>>(
       '/sessions',
-      payload
+      payload,
     );
     return data.data;
   },
diff --git a/src/service/shelter/shelter.service.ts b/src/service/shelter/shelter.service.ts
index 4e94f5ed..3a6ebf6b 100644
--- a/src/service/shelter/shelter.service.ts
+++ b/src/service/shelter/shelter.service.ts
@@ -14,24 +14,24 @@ const ShelterServices = {
   },
   getOne: async (id: string): Promise<IShelter> => {
     const { data } = await api.get<IServerResponse<IShelter>>(
-      `/shelters/${id}`
+      `/shelters/${id}`,
     );
     return data.data;
   },
   update: async (
     id: string,
-    payload: IUpdateShelter
+    payload: IUpdateShelter,
   ): Promise<IServerResponse> => {
     const { data } = await api.put<IServerResponse>(`/shelters/${id}`, payload);
     return data;
   },
   adminUpdate: async (
     id: string,
-    payload: IUpdateShelter
+    payload: IUpdateShelter,
   ): Promise<IServerResponse> => {
     const { data } = await api.put<IServerResponse>(
       `/shelters/${id}/admin`,
-      payload
+      payload,
     );
     return data;
   },
diff --git a/src/service/shelterSupply/shelter-supply.service.ts b/src/service/shelterSupply/shelter-supply.service.ts
index 04c617f6..8cc7fd45 100644
--- a/src/service/shelterSupply/shelter-supply.service.ts
+++ b/src/service/shelterSupply/shelter-supply.service.ts
@@ -10,11 +10,11 @@ const ShelterSupplyServices = {
   update: async (
     shelterId: string,
     supplyId: string,
-    payload: IUpdateShelterSupply
+    payload: IUpdateShelterSupply,
   ): Promise<IServerResponse> => {
     const { data } = await api.put(
       `/shelter/supplies/${shelterId}/${supplyId}`,
-      payload
+      payload,
     );
     return data;
   },
@@ -23,10 +23,10 @@ const ShelterSupplyServices = {
     return data;
   },
   getAll: async (
-    shelterId: string
+    shelterId: string,
   ): Promise<IServerResponse<IShelterSupplyData[]>> => {
     const { data } = await api.get<IServerResponse<IShelterSupplyData[]>>(
-      `/shelter/supplies/${shelterId}`
+      `/shelter/supplies/${shelterId}`,
     );
     return data;
   },
diff --git a/src/service/supply/index.ts b/src/service/supply/index.ts
index 3ba93598..87936431 100644
--- a/src/service/supply/index.ts
+++ b/src/service/supply/index.ts
@@ -1,3 +1,3 @@
-import { SupplyServices } from "./supply.service";
+import { SupplyServices } from './supply.service';
 
 export { SupplyServices };
diff --git a/src/service/users/index.ts b/src/service/users/index.ts
index 1556f648..a2790933 100644
--- a/src/service/users/index.ts
+++ b/src/service/users/index.ts
@@ -1,3 +1,3 @@
-import { UserServices } from "./user.service";
+import { UserServices } from './user.service';
 
 export { UserServices };
diff --git a/src/service/users/user.service.ts b/src/service/users/user.service.ts
index 5e29658a..920b576e 100644
--- a/src/service/users/user.service.ts
+++ b/src/service/users/user.service.ts
@@ -10,20 +10,20 @@ const UserServices = {
   },
   update: async (
     userId: string,
-    payload: IUpdateUser
+    payload: IUpdateUser,
   ): Promise<IServerResponse> => {
     const { data } = await api.put<IServerResponse>(
       `/users/${userId}`,
-      payload
+      payload,
     );
     return data;
   },
   find: async (
     field: keyof IUser,
-    value: string
+    value: string,
   ): Promise<IServerResponse<IFindUserResponse>> => {
     const { data } = await api.get<IServerResponse<IFindUserResponse>>(
-      `/users/find/${field}/${value}`
+      `/users/find/${field}/${value}`,
     );
     return data;
   },
diff --git a/tailwind.config.js b/tailwind.config.js
index 43874aca..da8274ed 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,3 +1,5 @@
+/* eslint-disable no-undef */
+
 /** @type {import('tailwindcss').Config} */
 module.exports = {
   darkMode: ['class'],