feat(native): help section — FAQ, Contact, About, Crisis pages
New route group app/help/ with 4 sub-pages navigable from settings. - help/faq.tsx: accordion with 8 Q&As (drafted by UI agent, see below) - help/contact.tsx: mailto:hilfe@rebreak.org with prefilled subject, address block (Rebreak placeholder — TODO verify legal entity name) - help/about.tsx: mission text + 3 fact rows (DiGA, Hetzner, DSGVO) - help/crisis.tsx: BZgA 0800 1 372 700, check-dein-spiel.de, anonyme-spieler.org, Telefonseelsorge 0800 111 0 111, emergency 112-box with error-color border treatment. Disclaimer at bottom. All pages use AppHeader showBack for correct back-button. All strings in help.* namespace in DE/EN/FR locales. FAQ answers drafted by UI agent — pending lyra-persona tone review: faq_a1 (what is Rebreak), faq_a2 (blocker), faq_a3 (Mac DNS), faq_a4 (cancel sub), faq_a5 (data), faq_a6 (bug report), faq_a7 (whitelist), faq_a8 (DiGA). FR locale: faq answers are DE-fallback text (TODO: translate properly). Contact address block: placeholder — TODO confirm legal entity + address. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
943afb827b
commit
d840247c98
18
apps/rebreak-native/app/help/_layout.tsx
Normal file
18
apps/rebreak-native/app/help/_layout.tsx
Normal file
@ -0,0 +1,18 @@
|
||||
import { Stack } from 'expo-router';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useColors } from '../../lib/theme';
|
||||
|
||||
export default function HelpLayout() {
|
||||
const { t } = useTranslation();
|
||||
const colors = useColors();
|
||||
|
||||
return (
|
||||
<Stack
|
||||
screenOptions={{
|
||||
headerShown: false,
|
||||
animation: 'slide_from_right',
|
||||
contentStyle: { backgroundColor: colors.groupedBg },
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
137
apps/rebreak-native/app/help/about.tsx
Normal file
137
apps/rebreak-native/app/help/about.tsx
Normal file
@ -0,0 +1,137 @@
|
||||
import { Linking, ScrollView, Text, TouchableOpacity, View } from 'react-native';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useColors } from '../../lib/theme';
|
||||
import { AppHeader } from '../../components/AppHeader';
|
||||
|
||||
export default function AboutScreen() {
|
||||
const { t } = useTranslation();
|
||||
const colors = useColors();
|
||||
const insets = useSafeAreaInsets();
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1, backgroundColor: colors.groupedBg }}>
|
||||
<AppHeader showBack title={t('help.about_title')} />
|
||||
|
||||
<ScrollView
|
||||
style={{ flex: 1 }}
|
||||
contentContainerStyle={{
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 20,
|
||||
paddingBottom: insets.bottom + 40,
|
||||
}}
|
||||
showsVerticalScrollIndicator={false}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.card,
|
||||
borderRadius: 14,
|
||||
padding: 16,
|
||||
marginBottom: 16,
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 1 },
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 3,
|
||||
elevation: 1,
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 22,
|
||||
fontFamily: 'Nunito_800ExtraBold',
|
||||
color: colors.text,
|
||||
marginBottom: 12,
|
||||
}}
|
||||
>
|
||||
{t('help.about_headline')}
|
||||
</Text>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.text,
|
||||
lineHeight: 24,
|
||||
}}
|
||||
>
|
||||
{t('help.about_body')}
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.card,
|
||||
borderRadius: 14,
|
||||
overflow: 'hidden',
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 1 },
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 3,
|
||||
elevation: 1,
|
||||
}}
|
||||
>
|
||||
{(
|
||||
[
|
||||
{ icon: 'shield-checkmark-outline', label: t('help.about_fact_diga') },
|
||||
{ icon: 'server-outline', label: t('help.about_fact_servers') },
|
||||
{ icon: 'lock-closed-outline', label: t('help.about_fact_privacy') },
|
||||
] as { icon: React.ComponentProps<typeof Ionicons>['name']; label: string }[]
|
||||
).map((item, i, arr) => (
|
||||
<View
|
||||
key={item.icon}
|
||||
style={{
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
gap: 14,
|
||||
paddingHorizontal: 16,
|
||||
paddingVertical: 14,
|
||||
borderBottomWidth: i < arr.length - 1 ? 1 : 0,
|
||||
borderBottomColor: colors.border,
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
width: 34,
|
||||
height: 34,
|
||||
borderRadius: 10,
|
||||
backgroundColor: colors.surfaceElevated,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
}}
|
||||
>
|
||||
<Ionicons name={item.icon} size={17} color={colors.textMuted} />
|
||||
</View>
|
||||
<Text
|
||||
style={{
|
||||
flex: 1,
|
||||
fontSize: 14,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.text,
|
||||
lineHeight: 20,
|
||||
}}
|
||||
>
|
||||
{item.label}
|
||||
</Text>
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
|
||||
<TouchableOpacity
|
||||
onPress={() => Linking.openURL('https://rebreak.org')}
|
||||
activeOpacity={0.7}
|
||||
style={{ marginTop: 20, alignItems: 'center' }}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 13,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: '#6366f1',
|
||||
}}
|
||||
>
|
||||
rebreak.org
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</ScrollView>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
107
apps/rebreak-native/app/help/contact.tsx
Normal file
107
apps/rebreak-native/app/help/contact.tsx
Normal file
@ -0,0 +1,107 @@
|
||||
import { Linking, ScrollView, Text, View } from 'react-native';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useColors } from '../../lib/theme';
|
||||
import { AppHeader } from '../../components/AppHeader';
|
||||
import { Button } from '../../components/Button';
|
||||
|
||||
export default function ContactScreen() {
|
||||
const { t } = useTranslation();
|
||||
const colors = useColors();
|
||||
const insets = useSafeAreaInsets();
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1, backgroundColor: colors.groupedBg }}>
|
||||
<AppHeader showBack title={t('help.contact_title')} />
|
||||
|
||||
<ScrollView
|
||||
style={{ flex: 1 }}
|
||||
contentContainerStyle={{
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 20,
|
||||
paddingBottom: insets.bottom + 40,
|
||||
}}
|
||||
showsVerticalScrollIndicator={false}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.card,
|
||||
borderRadius: 14,
|
||||
padding: 16,
|
||||
marginBottom: 16,
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 1 },
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 3,
|
||||
elevation: 1,
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
fontFamily: 'Nunito_700Bold',
|
||||
color: colors.text,
|
||||
marginBottom: 8,
|
||||
}}
|
||||
>
|
||||
{t('help.contact_email_label')}
|
||||
</Text>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 14,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.textMuted,
|
||||
lineHeight: 21,
|
||||
marginBottom: 16,
|
||||
}}
|
||||
>
|
||||
{t('help.contact_email_desc')}
|
||||
</Text>
|
||||
<Button
|
||||
title={t('help.contact_email_cta')}
|
||||
onPress={() =>
|
||||
Linking.openURL(
|
||||
'mailto:hilfe@rebreak.org?subject=Support%20Anfrage',
|
||||
)
|
||||
}
|
||||
size="md"
|
||||
/>
|
||||
</View>
|
||||
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.card,
|
||||
borderRadius: 14,
|
||||
padding: 16,
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 1 },
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 3,
|
||||
elevation: 1,
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
fontFamily: 'Nunito_700Bold',
|
||||
color: colors.text,
|
||||
marginBottom: 8,
|
||||
}}
|
||||
>
|
||||
{t('help.contact_address_label')}
|
||||
</Text>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 14,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.textMuted,
|
||||
lineHeight: 22,
|
||||
}}
|
||||
>
|
||||
{t('help.contact_address_block')}
|
||||
</Text>
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
250
apps/rebreak-native/app/help/crisis.tsx
Normal file
250
apps/rebreak-native/app/help/crisis.tsx
Normal file
@ -0,0 +1,250 @@
|
||||
import { Linking, ScrollView, Text, TouchableOpacity, View } from 'react-native';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useColors } from '../../lib/theme';
|
||||
import { AppHeader } from '../../components/AppHeader';
|
||||
|
||||
type HotlineRowProps = {
|
||||
label: string;
|
||||
sublabel: string;
|
||||
phoneOrUrl: string;
|
||||
isUrl?: boolean;
|
||||
colors: ReturnType<typeof useColors>;
|
||||
};
|
||||
|
||||
function HotlineRow({ label, sublabel, phoneOrUrl, isUrl, colors }: HotlineRowProps) {
|
||||
return (
|
||||
<TouchableOpacity
|
||||
onPress={() => Linking.openURL(isUrl ? phoneOrUrl : `tel:${phoneOrUrl.replace(/\s/g, '')}`)}
|
||||
activeOpacity={0.7}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
gap: 12,
|
||||
paddingHorizontal: 16,
|
||||
paddingVertical: 14,
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
width: 34,
|
||||
height: 34,
|
||||
borderRadius: 10,
|
||||
backgroundColor: colors.surfaceElevated,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
}}
|
||||
>
|
||||
<Ionicons
|
||||
name={isUrl ? 'globe-outline' : 'call-outline'}
|
||||
size={17}
|
||||
color={colors.textMuted}
|
||||
/>
|
||||
</View>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
fontFamily: 'Nunito_600SemiBold',
|
||||
color: colors.text,
|
||||
}}
|
||||
>
|
||||
{label}
|
||||
</Text>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 12,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.textMuted,
|
||||
marginTop: 2,
|
||||
}}
|
||||
>
|
||||
{sublabel}
|
||||
</Text>
|
||||
</View>
|
||||
<Ionicons name="chevron-forward" size={16} color={colors.border} />
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
}
|
||||
|
||||
export default function CrisisScreen() {
|
||||
const { t } = useTranslation();
|
||||
const colors = useColors();
|
||||
const insets = useSafeAreaInsets();
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1, backgroundColor: colors.groupedBg }}>
|
||||
<AppHeader showBack title={t('help.crisis_title')} />
|
||||
|
||||
<ScrollView
|
||||
style={{ flex: 1 }}
|
||||
contentContainerStyle={{
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 20,
|
||||
paddingBottom: insets.bottom + 40,
|
||||
}}
|
||||
showsVerticalScrollIndicator={false}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 13,
|
||||
fontFamily: 'Nunito_600SemiBold',
|
||||
color: colors.textMuted,
|
||||
textTransform: 'uppercase',
|
||||
letterSpacing: 1,
|
||||
marginBottom: 8,
|
||||
marginLeft: 4,
|
||||
}}
|
||||
>
|
||||
{t('help.crisis_section_gambling')}
|
||||
</Text>
|
||||
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.card,
|
||||
borderRadius: 14,
|
||||
overflow: 'hidden',
|
||||
marginBottom: 20,
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 1 },
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 3,
|
||||
elevation: 1,
|
||||
}}
|
||||
>
|
||||
<View style={{ borderBottomWidth: 1, borderBottomColor: colors.border }}>
|
||||
<HotlineRow
|
||||
label={t('help.crisis_bzga_label')}
|
||||
sublabel={t('help.crisis_bzga_sublabel')}
|
||||
phoneOrUrl="0800 1 372 700"
|
||||
colors={colors}
|
||||
/>
|
||||
</View>
|
||||
<View style={{ borderBottomWidth: 1, borderBottomColor: colors.border }}>
|
||||
<HotlineRow
|
||||
label={t('help.crisis_checkdein_label')}
|
||||
sublabel={t('help.crisis_checkdein_sublabel')}
|
||||
phoneOrUrl="https://www.check-dein-spiel.de"
|
||||
isUrl
|
||||
colors={colors}
|
||||
/>
|
||||
</View>
|
||||
<HotlineRow
|
||||
label={t('help.crisis_anonyme_label')}
|
||||
sublabel={t('help.crisis_anonyme_sublabel')}
|
||||
phoneOrUrl="https://www.anonyme-spieler.org"
|
||||
isUrl
|
||||
colors={colors}
|
||||
/>
|
||||
</View>
|
||||
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 13,
|
||||
fontFamily: 'Nunito_600SemiBold',
|
||||
color: colors.textMuted,
|
||||
textTransform: 'uppercase',
|
||||
letterSpacing: 1,
|
||||
marginBottom: 8,
|
||||
marginLeft: 4,
|
||||
}}
|
||||
>
|
||||
{t('help.crisis_section_general')}
|
||||
</Text>
|
||||
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.card,
|
||||
borderRadius: 14,
|
||||
overflow: 'hidden',
|
||||
marginBottom: 20,
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 1 },
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 3,
|
||||
elevation: 1,
|
||||
}}
|
||||
>
|
||||
<HotlineRow
|
||||
label={t('help.crisis_seelsorge_label')}
|
||||
sublabel={t('help.crisis_seelsorge_sublabel')}
|
||||
phoneOrUrl="0800 111 0 111"
|
||||
colors={colors}
|
||||
/>
|
||||
</View>
|
||||
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: '#fef2f2',
|
||||
borderRadius: 14,
|
||||
borderWidth: 1.5,
|
||||
borderColor: colors.error,
|
||||
padding: 16,
|
||||
marginBottom: 20,
|
||||
}}
|
||||
>
|
||||
<View style={{ flexDirection: 'row', alignItems: 'center', gap: 10, marginBottom: 8 }}>
|
||||
<Ionicons name="warning-outline" size={20} color={colors.error} />
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 15,
|
||||
fontFamily: 'Nunito_700Bold',
|
||||
color: colors.error,
|
||||
}}
|
||||
>
|
||||
{t('help.crisis_emergency_label')}
|
||||
</Text>
|
||||
</View>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 14,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.text,
|
||||
lineHeight: 21,
|
||||
marginBottom: 12,
|
||||
}}
|
||||
>
|
||||
{t('help.crisis_emergency_desc')}
|
||||
</Text>
|
||||
<TouchableOpacity
|
||||
onPress={() => Linking.openURL('tel:112')}
|
||||
activeOpacity={0.7}
|
||||
style={{
|
||||
backgroundColor: colors.error,
|
||||
borderRadius: 10,
|
||||
paddingVertical: 12,
|
||||
alignItems: 'center',
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 16,
|
||||
fontFamily: 'Nunito_700Bold',
|
||||
color: '#ffffff',
|
||||
}}
|
||||
>
|
||||
{t('help.crisis_emergency_cta')}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 12,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.textMuted,
|
||||
lineHeight: 18,
|
||||
textAlign: 'center',
|
||||
marginHorizontal: 8,
|
||||
}}
|
||||
>
|
||||
{t('help.crisis_disclaimer')}
|
||||
</Text>
|
||||
</ScrollView>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
120
apps/rebreak-native/app/help/faq.tsx
Normal file
120
apps/rebreak-native/app/help/faq.tsx
Normal file
@ -0,0 +1,120 @@
|
||||
import { useState } from 'react';
|
||||
import { ScrollView, Text, TouchableOpacity, View } from 'react-native';
|
||||
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useColors } from '../../lib/theme';
|
||||
import { AppHeader } from '../../components/AppHeader';
|
||||
|
||||
type FaqItem = { q: string; a: string };
|
||||
|
||||
function FaqRow({ q, a, colors }: FaqItem & { colors: ReturnType<typeof useColors> }) {
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
borderBottomWidth: 1,
|
||||
borderBottomColor: colors.border,
|
||||
}}
|
||||
>
|
||||
<TouchableOpacity
|
||||
onPress={() => setOpen((v) => !v)}
|
||||
activeOpacity={0.7}
|
||||
style={{
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
paddingHorizontal: 16,
|
||||
paddingVertical: 14,
|
||||
gap: 12,
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
flex: 1,
|
||||
fontSize: 15,
|
||||
fontFamily: 'Nunito_600SemiBold',
|
||||
color: colors.text,
|
||||
lineHeight: 21,
|
||||
}}
|
||||
>
|
||||
{q}
|
||||
</Text>
|
||||
<Ionicons
|
||||
name={open ? 'chevron-up' : 'chevron-down'}
|
||||
size={18}
|
||||
color={colors.textMuted}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
{open ? (
|
||||
<Text
|
||||
style={{
|
||||
paddingHorizontal: 16,
|
||||
paddingBottom: 16,
|
||||
fontSize: 14,
|
||||
fontFamily: 'Nunito_400Regular',
|
||||
color: colors.textMuted,
|
||||
lineHeight: 21,
|
||||
}}
|
||||
>
|
||||
{a}
|
||||
</Text>
|
||||
) : null}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
export default function FaqScreen() {
|
||||
const { t } = useTranslation();
|
||||
const colors = useColors();
|
||||
const insets = useSafeAreaInsets();
|
||||
|
||||
const items: FaqItem[] = [
|
||||
{ q: t('help.faq_q1'), a: t('help.faq_a1') },
|
||||
{ q: t('help.faq_q2'), a: t('help.faq_a2') },
|
||||
{ q: t('help.faq_q3'), a: t('help.faq_a3') },
|
||||
{ q: t('help.faq_q4'), a: t('help.faq_a4') },
|
||||
{ q: t('help.faq_q5'), a: t('help.faq_a5') },
|
||||
{ q: t('help.faq_q6'), a: t('help.faq_a6') },
|
||||
{ q: t('help.faq_q7'), a: t('help.faq_a7') },
|
||||
{ q: t('help.faq_q8'), a: t('help.faq_a8') },
|
||||
];
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1, backgroundColor: colors.groupedBg }}>
|
||||
<AppHeader showBack title={t('help.faq_title')} />
|
||||
|
||||
<ScrollView
|
||||
style={{ flex: 1 }}
|
||||
contentContainerStyle={{
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 20,
|
||||
paddingBottom: insets.bottom + 40,
|
||||
}}
|
||||
showsVerticalScrollIndicator={false}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: colors.card,
|
||||
borderRadius: 14,
|
||||
overflow: 'hidden',
|
||||
shadowColor: '#000',
|
||||
shadowOffset: { width: 0, height: 1 },
|
||||
shadowOpacity: 0.04,
|
||||
shadowRadius: 3,
|
||||
elevation: 1,
|
||||
}}
|
||||
>
|
||||
{items.map((item, i) => (
|
||||
<FaqRow
|
||||
key={i}
|
||||
q={item.q}
|
||||
a={item.a}
|
||||
colors={colors}
|
||||
/>
|
||||
))}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user