SettingsScreen CC 23 -> below 10. Form parsing, change detection and the dark-theme check moved to utils/ with unit tests; the dark switch now reads the OS scheme instead of comparing the background colour. Adds characterization tests for the screen.
41 lines
1.2 KiB
TypeScript
41 lines
1.2 KiB
TypeScript
import { AboutCard } from '@/components/settings/AboutCard';
|
|
import { AppearanceCard } from '@/components/settings/AppearanceCard';
|
|
import { ServerConnectionCard } from '@/components/settings/ServerConnectionCard';
|
|
import { useThemeColor } from '@/hooks/useThemeColor';
|
|
import React from 'react';
|
|
import { ScrollView, StyleSheet, useWindowDimensions } from 'react-native';
|
|
|
|
export default function SettingsScreen() {
|
|
const { width } = useWindowDimensions();
|
|
const colors = useThemeColor(); // Get current theme colors
|
|
const isLargeScreen = width > 768;
|
|
|
|
return (
|
|
<ScrollView
|
|
style={[styles.container, { backgroundColor: colors.backgroundColor }]}
|
|
contentContainerStyle={[
|
|
styles.scrollContent,
|
|
isLargeScreen && styles.desktopContent,
|
|
]}
|
|
>
|
|
<ServerConnectionCard />
|
|
<AppearanceCard />
|
|
<AboutCard />
|
|
</ScrollView>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
},
|
|
scrollContent: {
|
|
padding: 16,
|
|
paddingBottom: 40,
|
|
},
|
|
desktopContent: {
|
|
alignItems: 'center',
|
|
paddingTop: 40,
|
|
},
|
|
});
|