refactor(brownie): require selector param in useStore

Author: okwasniewski

docs/docs/brownie/typescript-usage.mdx

@@ -4,36 +4,36 @@ Use stores in React Native with the `useStore` hook.
 
 ## useStore Hook
 
-The `useStore` hook provides a `useState`-like API for accessing shared state:
+The `useStore` hook provides a `useState`-like API for accessing shared state. It requires a selector function to subscribe to a specific slice of state. The component only re-renders when the selected value changes.
 
 ```tsx
 import { useStore } from '@callstack/brownie';
 
 function Counter() {
-  const [state, setState] = useStore('BrownfieldStore');
+  // Select the counter slice - only re-renders when counter changes
+  const [counter, setState] = useStore('BrownfieldStore', (s) => s.counter);
 
   return (
     <View>
-      <Text>Count: {state.counter}</Text>
+      <Text>Count: {counter}</Text>
       <Button
         title="Increment"
-        onPress={() => setState({ counter: state.counter + 1 })}
+        onPress={() => setState({ counter: counter + 1 })}
       />
     </View>
   );
 }
 ```
 
-## Selectors
-
-Use selectors to subscribe to a slice of state. The component only re-renders when the selected value changes:
-
 ```tsx
 // Only re-renders when counter changes
 const [counter, setState] = useStore('BrownfieldStore', (s) => s.counter);
 
 // Only re-renders when user changes
 const [user, setState] = useStore('BrownfieldStore', (s) => s.user);
+
+// Select entire state (re-renders on any change)
+const [state, setState] = useStore('BrownfieldStore', (s) => s);
 ```
 
 ## Updating State

packages/brownie/ArchitectureOverview.md

@@ -307,23 +307,7 @@ packages/brownie/
 
 ### React Hook
 
-```ts
-// Full state (useState-like API)
-const [state, setState] = useStore('BrownfieldStore');
-
-// Read state
-console.log(state.counter);
-
-// Update state (partial update)
-setState({ counter: state.counter + 1 });
-
-// Update with callback (like useState)
-setState((prev) => ({ counter: prev.counter + 1 }));
-```
-
-### Selectors
-
-Selectors allow subscribing to a slice of state, reducing unnecessary re-renders:
+`useStore` requires a selector function to subscribe to a specific slice of state:
 
 ```ts
 import { useStore } from '@callstack/brownie';
@@ -333,6 +317,15 @@ const [counter, setState] = useStore('BrownfieldStore', (s) => s.counter);
 
 // Select object
 const [user, setState] = useStore('BrownfieldStore', (s) => s.user);
+
+// Select entire state (re-renders on any change)
+const [state, setState] = useStore('BrownfieldStore', (s) => s);
+
+// Update state (partial update)
+setState({ counter: counter + 1 });
+
+// Update with callback (like useState)
+setState((prev) => ({ counter: prev.counter + 1 }));
 ```
 
 **How it works:**

packages/brownie/src/index.ts

@@ -95,18 +95,6 @@ export function setState<K extends keyof BrownieStores>(
   }
 }
 
-const identity = <T>(x: T): T => x;
-
-/**
- * React hook for subscribing to a native store with optional selector.
- * Inspired by Zustand's useStore implementation.
- * @param key Store key registered in StoreManager
- * @returns Tuple of [state, setState] for the store
- */
-export function useStore<K extends keyof BrownieStores>(
-  key: K
-): [BrownieStores[K], (action: SetStateAction<BrownieStores[K]>) => void];
-
 /**
  * React hook for subscribing to a native store with selector.
  * Inspired by Zustand's useStore implementation.
@@ -117,23 +105,12 @@ export function useStore<K extends keyof BrownieStores>(
 export function useStore<K extends keyof BrownieStores, U>(
   key: K,
   selector: (state: BrownieStores[K]) => U
-): [U, (action: SetStateAction<BrownieStores[K]>) => void];
-
-export function useStore<K extends keyof BrownieStores, U>(
-  key: K,
-  selector?: (state: BrownieStores[K]) => U
-): [U | BrownieStores[K], (action: SetStateAction<BrownieStores[K]>) => void] {
+): [U, (action: SetStateAction<BrownieStores[K]>) => void] {
   const sub = useCallback(
     (listener: () => void) => subscribe(key, listener),
     [key]
   );
-  const snap = useCallback(
-    () =>
-      (selector ?? (identity as (state: BrownieStores[K]) => U))(
-        getSnapshot(key)
-      ),
-    [key, selector]
-  );
+  const snap = useCallback(() => selector(getSnapshot(key)), [key, selector]);
 
   const slice = useSyncExternalStore(sub, snap, snap);