Files
Timmy-time-dashboard/mobile-app/components/screen-container.tsx
Manus AI b4b508ff5a feat: add Timmy Chat mobile app (Expo/React Native)
- 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
2026-02-26 21:55:41 -05:00

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>
);
}