fix(profile/faq): demographics-hint auto-expand + FAQ-chevron-direction
Profile: - Hint "fuelle deine anonymen Daten aus" oeffnet das DemographicsAccordion jetzt automatisch via expanded-Prop + useEffect mit LayoutAnimation. Vorher: scrollte hin, liess es geschlossen, User musste nochmal tappen. - DemographicsAccordion: expanded-Prop fuer external-trigger; interner expandedLocal-State, Toggle-Button bleibt unabhaengig functional. ProtectionDetailsSheet FAQ: - chevron-forward (0deg→90deg Rotation, sah aus wie Nav-Link) → chevron-down (0deg→180deg). Geschlossen=runter, offen=hoch. State-Toggling war schon korrekt, nur visuelle Affordance war falsch. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
756947549f
commit
2f3b19f71b
@ -107,6 +107,7 @@ export default function ProfileScreen() {
|
||||
const insets = useSafeAreaInsets();
|
||||
const [bannerDismissed, setBannerDismissed] = useState(false);
|
||||
const [demographics, setDemographics] = useState<Demographics>(DUMMY_DEMOGRAPHICS);
|
||||
const [demographicsExpanded, setDemographicsExpanded] = useState(false);
|
||||
const { me } = useMe();
|
||||
const { user } = useAuthStore();
|
||||
|
||||
@ -148,6 +149,11 @@ export default function ProfileScreen() {
|
||||
);
|
||||
}
|
||||
|
||||
function openDemographics() {
|
||||
setDemographicsExpanded(true);
|
||||
scrollToDemographics();
|
||||
}
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1, backgroundColor: '#ffffff' }}>
|
||||
<AppHeader showBack title="Profil" />
|
||||
@ -165,7 +171,7 @@ export default function ProfileScreen() {
|
||||
memberSince={profile.memberSince}
|
||||
provider={profile.provider}
|
||||
showDemographicsHint={!demoComplete}
|
||||
onDemographicsHintPress={scrollToDemographics}
|
||||
onDemographicsHintPress={openDemographics}
|
||||
onEditAvatar={() => {
|
||||
// TODO Phase C: AvatarPickerSheet (preset-grid + custom-upload via expo-image-picker)
|
||||
Alert.alert(
|
||||
@ -241,6 +247,7 @@ export default function ProfileScreen() {
|
||||
<DemographicsAccordion
|
||||
demographics={demographics}
|
||||
plan={profile.plan}
|
||||
expanded={demographicsExpanded}
|
||||
onChange={(next) => {
|
||||
// TODO Phase C: PATCH /api/profile/me/demographics — Body: next
|
||||
// Endpoint: profile.demographics_consent_at = NOW() bei erstem Save (DSGVO-Audit-Trail).
|
||||
|
||||
@ -653,7 +653,7 @@ function FaqItem({ question, answer }: { question: string; answer: string }) {
|
||||
|
||||
const rotate = rotateAnim.interpolate({
|
||||
inputRange: [0, 1],
|
||||
outputRange: ['0deg', '90deg'],
|
||||
outputRange: ['0deg', '180deg'],
|
||||
});
|
||||
|
||||
return (
|
||||
@ -692,7 +692,7 @@ function FaqItem({ question, answer }: { question: string; answer: string }) {
|
||||
transform: [{ rotate }],
|
||||
}}
|
||||
>
|
||||
<Ionicons name="chevron-forward" size={16} color="#525252" />
|
||||
<Ionicons name="chevron-down" size={16} color="#525252" />
|
||||
</Animated.View>
|
||||
</Pressable>
|
||||
{open && (
|
||||
|
||||
@ -30,6 +30,7 @@ export type Demographics = {
|
||||
type Props = {
|
||||
demographics: Demographics;
|
||||
plan: Plan;
|
||||
expanded?: boolean;
|
||||
defaultExpanded?: boolean;
|
||||
onChange?: (next: Demographics) => void;
|
||||
onRevokeConsent?: () => void;
|
||||
@ -109,11 +110,21 @@ function mockPersist(_next: Demographics) {
|
||||
export function DemographicsAccordion({
|
||||
demographics,
|
||||
plan,
|
||||
expanded: expandedProp,
|
||||
defaultExpanded = false,
|
||||
onChange,
|
||||
onRevokeConsent,
|
||||
}: Props) {
|
||||
const [expanded, setExpanded] = useState(defaultExpanded);
|
||||
const [expandedLocal, setExpandedLocal] = useState(defaultExpanded);
|
||||
|
||||
useEffect(() => {
|
||||
if (expandedProp) {
|
||||
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
|
||||
setExpandedLocal(true);
|
||||
}
|
||||
}, [expandedProp]);
|
||||
|
||||
const expanded = expandedLocal;
|
||||
const [local, setLocal] = useState<Demographics>(demographics);
|
||||
|
||||
// Select-Sheet-State
|
||||
@ -128,7 +139,7 @@ export function DemographicsAccordion({
|
||||
|
||||
function toggle() {
|
||||
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
|
||||
setExpanded((v) => !v);
|
||||
setExpandedLocal((v) => !v);
|
||||
}
|
||||
|
||||
function persist(next: Demographics) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user