3b471df8d5
- Add Lucide React Native icon library and use across tabs and screens
- Mobile-like design: rounded cards (xl/2xl), section dividers, icon chips, chevrons
- New pages from swagger: register, invoices/[id], reports, documents, settings
- Invoice detail: amount, bill to, items, Share/PDF actions (GET /invoices/{id})
- Register screen with link to login (POST /auth/register)
- Reports list with mock data and download (GET /reports)
- Documents list with upload CTA (GET /documents)
- Settings: notifications link, language, about
- Profile: links to Notifications, Reports, Documents, Settings
- Home: invoice rows navigate to /invoices/[id]
- Login ↔ Register navigation
- Keep orange (#ea580c) and dark navbar (#2d2d2d) theme throughout
- README: update screens table with new routes
Co-authored-by: Cursor <cursoragent@cursor.com>
73 lines
2.9 KiB
TypeScript
73 lines
2.9 KiB
TypeScript
import { View, ScrollView, Pressable } from 'react-native';
|
|
import { router } from 'expo-router';
|
|
import { Text } from '@/components/ui/text';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
|
import { Settings, Bell, Globe, ChevronRight, Info } from '@/lib/icons';
|
|
|
|
const PRIMARY = '#ea580c';
|
|
|
|
export default function SettingsScreen() {
|
|
return (
|
|
<ScrollView
|
|
className="flex-1 bg-[#f5f5f5]"
|
|
contentContainerStyle={{ padding: 20, paddingBottom: 40 }}
|
|
showsVerticalScrollIndicator={false}
|
|
>
|
|
<View className="mb-5 flex-row items-center gap-2">
|
|
<Settings color="#18181b" size={22} strokeWidth={2} />
|
|
<Text className="text-xl font-semibold text-gray-900">Settings</Text>
|
|
</View>
|
|
|
|
<Card className="mb-4 overflow-hidden rounded-xl border border-border bg-white">
|
|
<CardHeader className="pb-2">
|
|
<CardTitle className="text-base">Preferences</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="gap-0">
|
|
<Pressable
|
|
className="flex-row items-center justify-between border-b border-border py-3"
|
|
onPress={() => router.push('/notifications/settings')}
|
|
>
|
|
<View className="flex-row items-center gap-3">
|
|
<Bell color="#71717a" size={20} strokeWidth={2} />
|
|
<Text className="text-muted-foreground">Notifications</Text>
|
|
</View>
|
|
<ChevronRight color="#a1a1aa" size={18} strokeWidth={2} />
|
|
</Pressable>
|
|
<View className="flex-row items-center justify-between py-3">
|
|
<View className="flex-row items-center gap-3">
|
|
<Globe color="#71717a" size={20} strokeWidth={2} />
|
|
<Text className="text-muted-foreground">Language</Text>
|
|
</View>
|
|
<Text className="text-gray-900">English</Text>
|
|
</View>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="mb-4 overflow-hidden rounded-xl border border-border bg-white">
|
|
<CardHeader className="pb-2">
|
|
<View className="flex-row items-center gap-2">
|
|
<Info color="#71717a" size={18} strokeWidth={2} />
|
|
<CardTitle className="text-base">About</CardTitle>
|
|
</View>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<Text className="text-muted-foreground text-sm leading-5">
|
|
Yaltopia Tickets App v1.0 — Scan. Send. Reconcile.
|
|
</Text>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<View className="rounded-xl border border-border bg-white p-4">
|
|
<Text className="text-muted-foreground text-xs">
|
|
API: Invoices, Proforma, Payments, Reports, Documents, Notifications — see swagger.json and README for integration.
|
|
</Text>
|
|
</View>
|
|
|
|
<Button variant="outline" className="mt-6 rounded-xl border-border" onPress={() => router.back()}>
|
|
<Text className="font-medium">Back</Text>
|
|
</Button>
|
|
</ScrollView>
|
|
);
|
|
}
|