forked from Rockachopa/Timmy-time-dashboard
- Single-screen chat interface with Timmy's sovereign AI personality - Text messaging with real-time AI responses via server chat API - Voice recording and playback with waveform visualization - Image sharing (camera + photo library) with full-screen viewer - File attachments via document picker - Dark arcane theme matching the Timmy Time dashboard - Custom app icon with glowing T circuit design - Timmy system prompt ported from dashboard prompts.py - Unit tests for chat utilities and message types
69 lines
1.6 KiB
TypeScript
69 lines
1.6 KiB
TypeScript
import { View, type ViewProps } from "react-native";
|
|
import { SafeAreaView, type Edge } from "react-native-safe-area-context";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
|
|
export interface ScreenContainerProps extends ViewProps {
|
|
/**
|
|
* SafeArea edges to apply. Defaults to ["top", "left", "right"].
|
|
* Bottom is typically handled by Tab Bar.
|
|
*/
|
|
edges?: Edge[];
|
|
/**
|
|
* Tailwind className for the content area.
|
|
*/
|
|
className?: string;
|
|
/**
|
|
* Additional className for the outer container (background layer).
|
|
*/
|
|
containerClassName?: string;
|
|
/**
|
|
* Additional className for the SafeAreaView (content layer).
|
|
*/
|
|
safeAreaClassName?: string;
|
|
}
|
|
|
|
/**
|
|
* A container component that properly handles SafeArea and background colors.
|
|
*
|
|
* The outer View extends to full screen (including status bar area) with the background color,
|
|
* while the inner SafeAreaView ensures content is within safe bounds.
|
|
*
|
|
* Usage:
|
|
* ```tsx
|
|
* <ScreenContainer className="p-4">
|
|
* <Text className="text-2xl font-bold text-foreground">
|
|
* Welcome
|
|
* </Text>
|
|
* </ScreenContainer>
|
|
* ```
|
|
*/
|
|
export function ScreenContainer({
|
|
children,
|
|
edges = ["top", "left", "right"],
|
|
className,
|
|
containerClassName,
|
|
safeAreaClassName,
|
|
style,
|
|
...props
|
|
}: ScreenContainerProps) {
|
|
return (
|
|
<View
|
|
className={cn(
|
|
"flex-1",
|
|
"bg-background",
|
|
containerClassName
|
|
)}
|
|
{...props}
|
|
>
|
|
<SafeAreaView
|
|
edges={edges}
|
|
className={cn("flex-1", safeAreaClassName)}
|
|
style={style}
|
|
>
|
|
<View className={cn("flex-1", className)}>{children}</View>
|
|
</SafeAreaView>
|
|
</View>
|
|
);
|
|
}
|