mirror of
https://github.com/0xWheatyz/handler.git
synced 2026-08-30 09:36:24 +00:00
Claude
daecaa7e6b
Build the committed 2a interactive prototype from Handler Mobile.dc.html as a real Expo app: six wired screens (Fleet, Agent detail, Answer, Spawn, Log, Settings) with the exact state logic ported from the design's renderVals(). - Port Leeworks tokens (colors light/dark, typography, spacing, radii, shadows) to typed RN values in src/theme. - Reimplement the design-system components used by the screens (Button, Badge, Icon, Switch, Select, TextField, segmented control, chip, tab bar). - Shared store mirrors the prototype's single-screen navigation and the Waiting -> Running flip when agt-7a1d is answered. - Real OS status bar / home indicator (safe-area insets) replace the mock phone chrome; dark mode follows system appearance. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01PdF2hHVQ4UUBFPtpeMQ81o
18 lines
735 B
TypeScript
18 lines
735 B
TypeScript
import { useColorScheme } from "react-native";
|
|
import { darkColors, lightColors, type ThemeColors } from "./tokens";
|
|
|
|
export type Scheme = "light" | "dark";
|
|
|
|
/**
|
|
* Resolves the active Leeworks palette from the OS appearance.
|
|
*
|
|
* The design exposed dark mode as a design-time prop (`data-theme`); on a
|
|
* real iOS app the faithful equivalent is the system appearance, so the
|
|
* theme follows `useColorScheme()` (app.json sets userInterfaceStyle
|
|
* "automatic"). All six screens read colors through this hook.
|
|
*/
|
|
export function useTheme(): { colors: ThemeColors; scheme: Scheme } {
|
|
const scheme: Scheme = useColorScheme() === "dark" ? "dark" : "light";
|
|
return { colors: scheme === "dark" ? darkColors : lightColors, scheme };
|
|
}
|