feat: add city/state/country to complex, new settings page with sidebar, and Biome linting

- Added city, state, and country optional fields to Complex model
- Updated onboarding to include optional location fields
- Created new settings page with sidebar navigation (Datos del Complejo, Canchas)
- Replaced ESLint with Biome for frontend and backend linting
- Added parallel dev script with concurrently
- Migrated register-routes to use direct app.route() pattern

apps/frontend/src/lib/theme.tsx

@@ -1,68 +1,63 @@
 import {
+  type PropsWithChildren,
   createContext,
   useContext,
   useEffect,
   useMemo,
   useState,
-  type PropsWithChildren,
-} from 'react'
+} from 'react';
 
-type Theme = 'light' | 'dark' | 'system'
-type ResolvedTheme = 'light' | 'dark'
+type Theme = 'light' | 'dark' | 'system';
+type ResolvedTheme = 'light' | 'dark';
 
 type ThemeContextValue = {
-  theme: Theme
-  resolvedTheme: ResolvedTheme
-  setTheme: (theme: Theme) => void
-}
+  theme: Theme;
+  resolvedTheme: ResolvedTheme;
+  setTheme: (theme: Theme) => void;
+};
 
-const THEME_STORAGE_KEY = 'theme'
-const ThemeContext = createContext<ThemeContextValue | null>(null)
+const THEME_STORAGE_KEY = 'theme';
+const ThemeContext = createContext<ThemeContextValue | null>(null);
 
 function getSystemTheme(): ResolvedTheme {
-  return window.matchMedia('(prefers-color-scheme: dark)').matches
-    ? 'dark'
-    : 'light'
+  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
 }
 
 function applyResolvedTheme(theme: ResolvedTheme) {
-  document.documentElement.classList.toggle('dark', theme === 'dark')
+  document.documentElement.classList.toggle('dark', theme === 'dark');
 }
 
 export function ThemeProvider({ children }: PropsWithChildren) {
-  const [theme, setThemeState] = useState<Theme>('system')
-  const [resolvedTheme, setResolvedTheme] = useState<ResolvedTheme>('light')
+  const [theme, setThemeState] = useState<Theme>('system');
+  const [resolvedTheme, setResolvedTheme] = useState<ResolvedTheme>('light');
 
   useEffect(() => {
-    const saved = localStorage.getItem(THEME_STORAGE_KEY)
+    const saved = localStorage.getItem(THEME_STORAGE_KEY);
     const initialTheme: Theme =
-      saved === 'light' || saved === 'dark' || saved === 'system'
-        ? saved
-        : 'system'
+      saved === 'light' || saved === 'dark' || saved === 'system' ? saved : 'system';
 
-    setThemeState(initialTheme)
-  }, [])
+    setThemeState(initialTheme);
+  }, []);
 
   useEffect(() => {
-    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')
+    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
 
     const updateTheme = () => {
-      const nextResolvedTheme =
-        theme === 'system' ? getSystemTheme() : theme
-      setResolvedTheme(nextResolvedTheme)
-      applyResolvedTheme(nextResolvedTheme)
-    }
+      const nextResolvedTheme = theme === 'system' ? getSystemTheme() : theme;
+      setResolvedTheme(nextResolvedTheme);
+      applyResolvedTheme(nextResolvedTheme);
+    };
 
-    updateTheme()
+    updateTheme();
 
-    mediaQuery.addEventListener('change', updateTheme)
-    return () => mediaQuery.removeEventListener('change', updateTheme)
-  }, [theme])
+    mediaQuery.addEventListener('change', updateTheme);
+    return () => mediaQuery.removeEventListener('change', updateTheme);
+  }, [theme]);
 
   const setTheme = (nextTheme: Theme) => {
-    setThemeState(nextTheme)
-    localStorage.setItem(THEME_STORAGE_KEY, nextTheme)
-  }
+    setThemeState(nextTheme);
+    localStorage.setItem(THEME_STORAGE_KEY, nextTheme);
+  };
 
   const value = useMemo<ThemeContextValue>(
     () => ({
@@ -70,20 +65,20 @@ export function ThemeProvider({ children }: PropsWithChildren) {
       resolvedTheme,
       setTheme,
     }),
-    [theme, resolvedTheme],
-  )
+    [theme, resolvedTheme]
+  );
 
-  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>
+  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;
 }
 
 export function useTheme() {
-  const context = useContext(ThemeContext)
+  const context = useContext(ThemeContext);
 
   if (!context) {
-    throw new Error('useTheme must be used within ThemeProvider')
+    throw new Error('useTheme must be used within ThemeProvider');
   }
 
-  return context
+  return context;
 }
 
-export type { Theme }
+export type { Theme };