import grouping and sorting with Prettier plugin

hooks/tailwind.ts

@@ -1,11 +1,15 @@
-import { useLayoutEffect, useEffect, useState, useRef, useMemo } from "react";
+import { useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
+
 import resolveConfig from "tailwindcss/resolveConfig";
 
 import tailwindConfig from "@/tailwind.config.js";
+
 const config = resolveConfig(tailwindConfig);
 
 const isSSR =
-  typeof window === "undefined" || !window.navigator || /ServerSideRendering|^Deno\//.test(window.navigator.userAgent);
+  typeof window === "undefined" ||
+  !window.navigator ||
+  /ServerSideRendering|^Deno\//.test(window.navigator.userAgent);
 
 const isBrowser = !isSSR;
 const useIsomorphicEffect = isBrowser ? useLayoutEffect : useEffect;
@@ -18,7 +22,9 @@ export type CreatorReturnType = {
 
 function create(screens: object | undefined) {
   if (!screens) {
-    throw new Error("Failed to create breakpoint hooks, given `screens` value is invalid.");
+    throw new Error(
+      "Failed to create breakpoint hooks, given `screens` value is invalid.",
+    );
   }
 
   function useBreakpoint(breakpoint: string, defaultValue: boolean = false) {
@@ -46,15 +52,25 @@ function create(screens: object | undefined) {
     return match;
   }
 
-  function useBreakpointEffect<Breakpoint extends string>(breakpoint: Breakpoint, effect: (match: boolean) => void) {
+  function useBreakpointEffect<Breakpoint extends string>(
+    breakpoint: Breakpoint,
+    effect: (match: boolean) => void,
+  ) {
     const match = useBreakpoint(breakpoint);
     useEffect(() => effect(match));
     return null;
   }
 
-  function useBreakpointValue<Breakpoint extends string, T, U>(breakpoint: Breakpoint, valid: T, invalid: U) {
+  function useBreakpointValue<Breakpoint extends string, T, U>(
+    breakpoint: Breakpoint,
+    valid: T,
+    invalid: U,
+  ) {
     const match = useBreakpoint(breakpoint);
-    const value = useMemo(() => (match ? valid : invalid), [invalid, match, valid]);
+    const value = useMemo(
+      () => (match ? valid : invalid),
+      [invalid, match, valid],
+    );
     return value;
   }
 
@@ -65,4 +81,5 @@ function create(screens: object | undefined) {
   } as CreatorReturnType;
 }
 
-export const { useBreakpoint, useBreakpointEffect, useBreakpointValue } = create(config.theme!.screens);
+export const { useBreakpoint, useBreakpointEffect, useBreakpointValue } =
+  create(config.theme!.screens);

hooks/useDynamicViewportUnits.ts

@@ -1,31 +1,36 @@
 export const useDynamicViewportUnits = () => {
   const setVh = function () {
     var svh = document.documentElement.clientHeight * 0.01;
-    document.documentElement.style.setProperty('--1svh', (svh + "px"));
+    document.documentElement.style.setProperty("--1svh", svh + "px");
     var dvh = window.innerHeight * 0.01;
-    document.documentElement.style.setProperty('--1dvh', (dvh + "px"));
+    document.documentElement.style.setProperty("--1dvh", dvh + "px");
   };
 
-  const isMobile = function() {
-    if(/Android|iPhone|iPad|iPod/i.test(navigator.userAgent) || (navigator.userAgent.match(/Mac/) && navigator.maxTouchPoints && navigator.maxTouchPoints > 2)) {
-        return true;
+  const isMobile = function () {
+    if (
+      /Android|iPhone|iPad|iPod/i.test(navigator.userAgent) ||
+      (navigator.userAgent.match(/Mac/) &&
+        navigator.maxTouchPoints &&
+        navigator.maxTouchPoints > 2)
+    ) {
+      return true;
     }
 
     return false;
-  }
-
+  };
 
   // SSR support
-  if (typeof window === 'undefined') {
+  if (typeof window === "undefined") {
     return;
   }
 
   // Don't run polyfill if browser supports the units natively
-  if ('CSS' in window &&
-    'supports' in window.CSS &&
-    window.CSS.supports('height: 100svh') &&
-    window.CSS.supports('height: 100dvh') &&
-    window.CSS.supports('height: 100lvh')
+  if (
+    "CSS" in window &&
+    "supports" in window.CSS &&
+    window.CSS.supports("height: 100svh") &&
+    window.CSS.supports("height: 100dvh") &&
+    window.CSS.supports("height: 100lvh")
   ) {
     return;
   }
@@ -35,10 +40,10 @@ export const useDynamicViewportUnits = () => {
     return;
   }
 
-  window.addEventListener('resize', setVh);
+  window.addEventListener("resize", setVh);
   setVh();
 
   return () => {
-    window.removeEventListener('resize', setVh);
-  }
-}
+    window.removeEventListener("resize", setVh);
+  };
+};

hooks/useHamburgerClose.ts

@@ -1,3 +1,5 @@
+import { Dispatch, RefObject, SetStateAction, useEffect } from "react";
+
 interface HamburgerClose {
   menuVisible: boolean;
   setMenuVisible: Dispatch<SetStateAction<boolean>>;
@@ -9,8 +11,6 @@ interface HamburgerClose {
   menuTimeout: () => void;
 }
 
-import { Dispatch, RefObject, SetStateAction, useEffect } from "react";
-
 const useHamburgerClose = ({
   menuVisible,
   setMenuVisible,

hooks/useTournamentForm.ts

@@ -1,8 +1,10 @@
-import { TournamentFormProps } from "@/types";
 import { useRef, useState } from "react";
-import { LatLngLiteral } from "leaflet";
+
 import { useAtomValue } from "jotai";
+import { LatLngLiteral } from "leaflet";
+
 import { franceCenterAtom } from "@/app/atoms";
+import { TournamentFormProps } from "@/types";
 
 export const useTournamentForm = (): TournamentFormProps => {
   const center = useAtomValue(franceCenterAtom);