e76be7ee78
Profile (3 Iterationen):
- app/profile/index.tsx + components/profile/* (Header, StatsBar, Approved,
Streak, UrgeStats, Demographics, DigaMissionBanner)
- echte Live-Daten via useMe-Hook (Avatar/Nickname/Plan/Email/Provider-Pill)
- Demographics mit echten Inputs (TextInput + Bottom-Sheet-Selects),
debounced auto-save, Pro-Trial-Reward-Banner, Mikro-Why-Texte
- Approved Domains als plain integer (KEIN Plan-Slot/Cap)
- Friendly Hint-Text statt Progress-Bar (alignSelf:'stretch' Pattern)
- StatsBar zentriert mit 3 prominenten Cards (vertikale Dividers)
- Cooldown-Timeline als Liste mit 1px-Rail
- ApprovedDomainsList: Collapse-Chevron rechts in Title-Row (Pattern-Fix)
- Eigene vs fremde Profile-Ansicht streng getrennt (DSGVO/Anonymität)
Header-Dropdown (kein 3-Punkte-Icon):
- Avatar als Trigger im AppHeader (User-Wunsch)
- Custom-Modal beide Plattformen, Card-Style
- SOS prominent oben (nur Wort 'SOS' rot, Tagline 'wir sind für dich da' klein darunter)
- Profile/Settings/Games/Debug(__DEV__)/Logout
- Logout neutral (nicht rot — Recovery-tonal)
- AppHeader: neue showBack + title Props für Sub-Routes
Routes (Stub bis Phase C):
- app/profile/[userId].tsx — anonym (nur public-Stats)
- app/settings.tsx — Coming-Soon-Skeleton
- app/games.tsx — Standalone Games-Page mit GameCard-Grid
- app/debug.tsx — __DEV__-only
Game-Picker (Migration aus Nuxt):
- components/games/{GameCard, StarRating, GameRatingStars}
- 2x2 Grid, 56pt SVG-Icons (inline aus components/urge/gameSvgs.ts)
- Live-Backend /api/games/ratings (silent-fail)
- Re-use UrgeGames.tsx ohne TTS/Cooldown-Loop
UI-Pattern-Fixes (alle aus screenshot-User-Feedback 2026-05-07):
- Snake-Bug (food-pellet React-18-StrictMode-Reducer-double-call) gefixt
- Snake-Buttons platform-native (iOS-blue / Android-ripple)
- Tetris-Margins (16px paddingHorizontal)
- PostCard-Buttons Apple-44pt-Hit-Area (Image-Select, Image-Remove,
Cancel, Share-Pill — via hitSlop)
- ProfileHeader Demographics-Hint: alignSelf:'stretch' Pattern
- ApprovedDomainsList Collapse: Title flex:1 + Chevron rechts
- ProtectionDetailsSheet FAQ-Items: alignSelf:'stretch' defensive
- AppHeader Back-Button: neue showBack-Prop + chevron-back
Memory + Plan-Docs:
- 17 Memory-Files dokumentieren System-Wissen + Patterns
- ops/{CUTOVER, UI_MIGRATION, PROFILE_PAGE, WEBHOOK, GAMES_1V1,
RELEASE_READINESS, TESTING_STATE, MAESTRO_HOSTING}_*.md
Backend bleibt unverändert (Tier-LLM + Nickname + sort:latency
sind seit gestern deployed).
36 lines
1.5 KiB
TypeScript
36 lines
1.5 KiB
TypeScript
// Cross-platform Tab-Bar Icons.
|
|
//
|
|
// react-native-bottom-tabs akzeptiert `ImageSource | AppleIcon` als tabBarIcon.
|
|
// AppleIcon = SF Symbols → iOS-only. Auf Android müssen wir ImageSource liefern.
|
|
//
|
|
// Lösung: 5 PNG-Files (Ionicons-rastered) im assets/tabs/-Ordner. Metro bundelt
|
|
// sie automatisch + Android RES-Drawable wird via require()-Asset-Hash erzeugt.
|
|
// react-native-bottom-tabs wendet tabBarActiveTintColor automatisch als Tint an.
|
|
//
|
|
// Warum nicht Ionicons.getImageSource() at runtime? @expo/vector-icons v14
|
|
// expose-d die statische Methode nicht mehr — und der Vendor-Pfad nutzt
|
|
// RNVectorIconsManager (native), das Expo nicht bundled. Bundle-PNGs sind die
|
|
// einzige zuverlässige Lösung.
|
|
import { Platform, type ImageSourcePropType } from 'react-native';
|
|
|
|
export type TabKey = 'home' | 'chat' | 'coach' | 'blocker' | 'mail';
|
|
|
|
const ANDROID_ICONS: Partial<Record<TabKey, ImageSourcePropType>> = {
|
|
home: require('../assets/tabs/home.png'),
|
|
chat: require('../assets/tabs/chatbubble.png'),
|
|
coach: require('../assets/tabs/sparkles.png'),
|
|
blocker: require('../assets/tabs/shield-checkmark.png'),
|
|
mail: require('../assets/tabs/mail.png'),
|
|
};
|
|
|
|
export function getTabIcon(key: TabKey): ImageSourcePropType | undefined {
|
|
if (Platform.OS !== 'android') return undefined;
|
|
return ANDROID_ICONS[key];
|
|
}
|
|
|
|
// Backwards-compat: noop. Andere Module rufen `preloadTabIcons()` aus dem alten
|
|
// async-getImageSource-Pattern auf.
|
|
export function preloadTabIcons(): Promise<void> {
|
|
return Promise.resolve();
|
|
}
|