32ffe782ea
Flatten widget layouts and use system colors so banner and expanded regions render on vibrant lock screens; migrate auth sessions per account to prevent double sign-in; scope app lock PIN to accounts; default clock description to "Clock In"; add architecture docs and deferred form validation on auth screens. Co-authored-by: Cursor <cursoragent@cursor.com>
56 lines
1.4 KiB
TypeScript
56 lines
1.4 KiB
TypeScript
import { BlurView } from "expo-blur";
|
|
import { StyleSheet, View } from "react-native";
|
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
|
|
import { TopChrome } from "@/components/TopChrome";
|
|
import { useAppTheme } from "@/contexts/ThemeContext";
|
|
import { blurIntensity } from "@/lib/beenvoice-theme";
|
|
import {
|
|
TOP_CHROME_PADDING_BOTTOM,
|
|
TOP_CHROME_ROW_HEIGHT,
|
|
} from "@/lib/top-chrome-insets";
|
|
|
|
/** Blurred status-bar chrome with logo + account switcher. */
|
|
export function TopChromeBar() {
|
|
const insets = useSafeAreaInsets();
|
|
const { isDark } = useAppTheme();
|
|
const tint = isDark ? "rgba(9, 9, 11, 0.28)" : "rgba(255, 255, 255, 0.32)";
|
|
|
|
return (
|
|
<View
|
|
style={[
|
|
styles.host,
|
|
{
|
|
paddingTop: insets.top,
|
|
paddingBottom: TOP_CHROME_PADDING_BOTTOM,
|
|
paddingLeft: insets.left,
|
|
paddingRight: insets.right,
|
|
height: insets.top + TOP_CHROME_ROW_HEIGHT + TOP_CHROME_PADDING_BOTTOM,
|
|
},
|
|
]}
|
|
>
|
|
<BlurView
|
|
intensity={blurIntensity.chrome}
|
|
tint={isDark ? "dark" : "light"}
|
|
style={StyleSheet.absoluteFill}
|
|
/>
|
|
<View
|
|
pointerEvents="none"
|
|
style={[StyleSheet.absoluteFill, { backgroundColor: tint }]}
|
|
/>
|
|
<TopChrome />
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
host: {
|
|
overflow: "hidden",
|
|
position: "absolute",
|
|
top: 0,
|
|
left: 0,
|
|
right: 0,
|
|
zIndex: 10,
|
|
},
|
|
});
|