feat: auth & admin

.agents/skills/vercel-react-best-practices/rules/rerender-use-deferred-value.md

@@ -13,15 +13,15 @@ When user input triggers expensive computations or renders, use `useDeferredValu
 
 ```tsx
 function Search({ items }: { items: Item[] }) {
-  const [query, setQuery] = useState('')
-  const filtered = items.filter(item => fuzzyMatch(item, query))
+  const [query, setQuery] = useState('');
+  const filtered = items.filter((item) => fuzzyMatch(item, query));
 
   return (
     <>
-      <input value={query} onChange={e => setQuery(e.target.value)} />
+      <input value={query} onChange={(e) => setQuery(e.target.value)} />
       <ResultsList results={filtered} />
     </>
-  )
+  );
 }
 ```
 
@@ -29,22 +29,22 @@ function Search({ items }: { items: Item[] }) {
 
 ```tsx
 function Search({ items }: { items: Item[] }) {
-  const [query, setQuery] = useState('')
-  const deferredQuery = useDeferredValue(query)
+  const [query, setQuery] = useState('');
+  const deferredQuery = useDeferredValue(query);
   const filtered = useMemo(
-    () => items.filter(item => fuzzyMatch(item, deferredQuery)),
-    [items, deferredQuery]
-  )
-  const isStale = query !== deferredQuery
+    () => items.filter((item) => fuzzyMatch(item, deferredQuery)),
+    [items, deferredQuery],
+  );
+  const isStale = query !== deferredQuery;
 
   return (
     <>
-      <input value={query} onChange={e => setQuery(e.target.value)} />
+      <input value={query} onChange={(e) => setQuery(e.target.value)} />
       <div style={{ opacity: isStale ? 0.7 : 1 }}>
         <ResultsList results={filtered} />
       </div>
     </>
-  )
+  );
 }
 ```