Add WellNuo logo to Dashboard header

Replaced "Dashboard" text with app logo image in header:
- Import Image component from react-native
- Replace Text with Image (icon.png) in both header states
- Add logo style: 36x36px with horizontal margins
- Remove unused headerTitle and headerTitleWithBack styles
- Refresh button now uses marginLeft: 'auto' for proper spacing

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Sergei 2026-01-12 12:09:13 -08:00
parent 5fc7586f09
commit b5eef6760c

View File

@ -1,5 +1,5 @@
import React, { useState, useRef } from 'react'; import React, { useState, useRef } from 'react';
import { View, Text, StyleSheet, ActivityIndicator, TouchableOpacity } from 'react-native'; import { View, Text, StyleSheet, ActivityIndicator, TouchableOpacity, Image } from 'react-native';
import { WebView } from 'react-native-webview'; import { WebView } from 'react-native-webview';
import { Ionicons } from '@expo/vector-icons'; import { Ionicons } from '@expo/vector-icons';
import { SafeAreaView } from 'react-native-safe-area-context'; import { SafeAreaView } from 'react-native-safe-area-context';
@ -40,7 +40,11 @@ export default function DashboardScreen() {
return ( return (
<SafeAreaView style={styles.container} edges={['top']}> <SafeAreaView style={styles.container} edges={['top']}>
<View style={styles.header}> <View style={styles.header}>
<Text style={styles.headerTitle}> </Text> <Image
source={require('@/assets/images/icon.png')}
style={styles.logo}
resizeMode="contain"
/>
</View> </View>
<FullScreenError message={error} onRetry={handleRefresh} /> <FullScreenError message={error} onRetry={handleRefresh} />
</SafeAreaView> </SafeAreaView>
@ -56,9 +60,11 @@ export default function DashboardScreen() {
<Ionicons name="arrow-back" size={24} color={AppColors.textPrimary} /> <Ionicons name="arrow-back" size={24} color={AppColors.textPrimary} />
</TouchableOpacity> </TouchableOpacity>
)} )}
<Text style={[styles.headerTitle, canGoBack && styles.headerTitleWithBack]}> <Image
{/* Empty title - WebView has its own dashboard header */} source={require('@/assets/images/icon.png')}
</Text> style={styles.logo}
resizeMode="contain"
/>
<TouchableOpacity style={styles.refreshButton} onPress={handleRefresh}> <TouchableOpacity style={styles.refreshButton} onPress={handleRefresh}>
<Ionicons name="refresh" size={22} color={AppColors.primary} /> <Ionicons name="refresh" size={22} color={AppColors.primary} />
</TouchableOpacity> </TouchableOpacity>
@ -116,17 +122,14 @@ const styles = StyleSheet.create({
padding: Spacing.xs, padding: Spacing.xs,
marginRight: Spacing.sm, marginRight: Spacing.sm,
}, },
headerTitle: { logo: {
flex: 1, width: 36,
fontSize: FontSizes.xl, height: 36,
fontWeight: '700', marginHorizontal: Spacing.md,
color: AppColors.textPrimary,
},
headerTitleWithBack: {
marginLeft: 0,
}, },
refreshButton: { refreshButton: {
padding: Spacing.xs, padding: Spacing.xs,
marginLeft: 'auto',
}, },
webViewContainer: { webViewContainer: {
flex: 1, flex: 1,