Fix splash screen issue and service screen ui

feature/app-setup
vinay kumar 2025-07-11 17:17:21 +05:30
parent 5c2e3c8979
commit b0b0da447c
21 changed files with 181 additions and 86 deletions

65
.easignore Normal file
View File

@ -0,0 +1,65 @@
# Node modules
node_modules/
# macOS system files
.DS_Store
# Environment files
.env
.env.\*
!.env.example
# Expo
.expo/
.expo-shared/
dist/
web-build/
# Android build artifacts
android/.gradle/
android/build/
android/app/build/
android/app/.cxx/
android/.idea/
android/local.properties
# iOS build artifacts
ios/build/
ios/Pods/
ios/Podfile.lock
ios/.xcworkspace/
ios/.idea/
ios/DerivedData/
# Miscellaneous
_.jks
_.keystore
_.p8
_.p12
_.key
_.mobileprovision
_.tsbuildinfo
_.log
_.pem
_.orig.\*
_.csv
_.bak
# Metro bundler cache
.metro-cache/
.cache/
# Package manager logs
npm-debug.log
yarn-debug.log
yarn-error.log
pnpm-debug.log

View File

@ -1,6 +1,7 @@
<manifest xmlns:android="http://schemas.android.com/apk/res/android">
<manifest xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools">
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-permission android:name="android.permission.VIBRATE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
@ -12,9 +13,6 @@
</intent>
</queries>
<application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:allowBackup="true" android:theme="@style/AppTheme" android:supportsRtl="true">
<meta-data
android:name="com.google.android.geo.API_KEY"
android:value="AIzaSyBfz20PwTeQkeMonsgXETOViBAy9LOBlXY"/>
<meta-data android:name="expo.modules.updates.ENABLED" android:value="false"/>
<meta-data android:name="expo.modules.updates.EXPO_UPDATES_CHECK_ON_LAUNCH" android:value="ALWAYS"/>
<meta-data android:name="expo.modules.updates.EXPO_UPDATES_LAUNCH_WAIT_MS" android:value="0"/>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 65 KiB

After

Width:  |  Height:  |  Size: 39 KiB

View File

@ -1,6 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<background android:drawable="@mipmap/ic_launcher_background"/>
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
<monochrome android:drawable="@mipmap/ic_launcher_monochrome"/>
<background android:drawable="@color/iconBackground"/>
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
</adaptive-icon>

View File

@ -1,6 +1,6 @@
<resources>
<color name="splashscreen_background">#ffffff</color>
<color name="splashscreen_background">#252A34</color>
<color name="iconBackground">#ffffff</color>
<color name="colorPrimary">#023c69</color>
<color name="colorPrimaryDark">#ffffff</color>
<color name="colorPrimaryDark">#252A34</color>
</resources>

View File

@ -2,5 +2,5 @@
<string name="app_name">Driver Saathi</string>
<string name="expo_splash_screen_resize_mode" translatable="false">contain</string>
<string name="expo_splash_screen_status_bar_translucent" translatable="false">false</string>
<string name="expo_system_ui_user_interface_style" translatable="false">automatic</string>
<string name="expo_system_ui_user_interface_style" translatable="false">light</string>
</resources>

View File

@ -2,7 +2,7 @@
<style name="AppTheme" parent="Theme.EdgeToEdge">
<item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
<item name="colorPrimary">@color/colorPrimary</item>
<item name="android:statusBarColor">#ffffff</item>
<item name="android:statusBarColor">#252A34</item>
</style>
<style name="Theme.App.SplashScreen" parent="Theme.SplashScreen">
<item name="windowSplashScreenBackground">@color/splashscreen_background</item>

View File

@ -36,16 +36,18 @@
{
"backgroundColor": "#252A34",
"image": "./assets/images/splash-icon.png",
"dark": {
"image": "./assets/images/splash-icon-dark.png",
"backgroundColor": "#000000"
},
"imageWidth": 200
}
]
],
"experiments": {
"typedRoutes": true
},
"extra": {
"router": {},
"eas": {
"projectId": "d91c064f-5483-45be-b301-d8f036e7df09"
}
}
}
}

View File

@ -8,7 +8,6 @@ import { useSnackbar } from "@/contexts/Snackbar";
import NetInfo from "@react-native-community/netinfo";
import { getUserDetails } from "@/store/userSlice";
import { useDispatch } from "react-redux";
import { View } from "react-native";
export default function TabLayout() {
const { isLoggedIn } = useSelector((state: RootState) => state.auth);
@ -50,6 +49,7 @@ export default function TabLayout() {
return (
<Tabs
screenOptions={{
headerShadowVisible: false,
tabBarStyle: {
backgroundColor: "#252A34",
borderTopLeftRadius: 12,
@ -59,6 +59,9 @@ export default function TabLayout() {
},
tabBarActiveTintColor: "#fff",
tabBarInactiveTintColor: "#aaa",
headerStyle: {
backgroundColor: "#F3F5F8",
},
}}
>
{TAB_CONFIG.map(({ name, title, Icon, IconFilled }) => (
@ -71,9 +74,6 @@ export default function TabLayout() {
const IconComponent = focused ? IconFilled : Icon;
return <IconComponent />;
},
headerBackground: () => (
<View style={{ backgroundColor: "#252A34" }} />
),
}}
/>
))}

View File

@ -4,7 +4,7 @@ import { Text, View } from "react-native";
export default function PaymentsTabScreen() {
return (
<View style={styles.container}>
<Text style={styles.title}>Tab Two</Text>
<Text style={styles.title}>Coming Soon...</Text>
</View>
);
}

View File

@ -22,6 +22,7 @@ import api from "@/services/axiosClient";
import { useSnackbar } from "@/contexts/Snackbar";
import { BASE_URL } from "@/constants/config";
import { Overlay } from "@/components/common/Overlay";
import CrossIcon from "@/assets/icons/close_white.svg";
interface FormValues {
serviceType: string | null;
@ -268,7 +269,7 @@ export default function ServiceFormScreen(): JSX.Element {
setFieldValue("photos", updatedPhotos);
}}
>
<Text style={styles.removePhotoText}>×</Text>
<CrossIcon />
</TouchableOpacity>
</View>
))}
@ -277,19 +278,20 @@ export default function ServiceFormScreen(): JSX.Element {
{touched.photos && errors.photos && (
<Text style={styles.error}>{errors.photos}</Text>
)}
<Text style={styles.label}>Comments</Text>
<TextInput
style={styles.commentInput}
multiline
maxLength={100}
onChangeText={handleChange("comments")}
onBlur={handleBlur("comments")}
value={values.comments}
/>
<Text style={styles.wordCount}>
{values.comments.length}/100 words
</Text>
<View style={{ marginTop: 16 }}>
<Text style={styles.label}>Comments</Text>
<TextInput
style={styles.commentInput}
multiline
maxLength={100}
onChangeText={handleChange("comments")}
onBlur={handleBlur("comments")}
value={values.comments}
/>
<Text style={styles.wordCount}>
{values.comments.length}/100 words
</Text>
</View>
<TouchableOpacity
style={styles.submitButton}
@ -321,7 +323,7 @@ const styles = StyleSheet.create({
screen: {
flex: 1,
backgroundColor: "#F3F5F8",
marginBottom: 116,
paddingBottom: 116,
},
topBar: {
height: 56,
@ -409,6 +411,7 @@ const styles = StyleSheet.create({
padding: 10,
height: 80,
textAlignVertical: "top",
marginTop: 8,
},
wordCount: {
textAlign: "right",
@ -455,9 +458,9 @@ const styles = StyleSheet.create({
},
removePhotoButton: {
position: "absolute",
top: -8,
right: -8,
backgroundColor: "#D42210",
top: 4,
right: 4,
backgroundColor: "#252A345C",
borderRadius: 12,
width: 24,
height: 24,

View File

@ -1,51 +1,47 @@
import { Stack } from "expo-router";
import { StatusBar } from "expo-status-bar";
import { View, StyleSheet, TouchableOpacity } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
import { TouchableOpacity } from "react-native";
import GoBack from "@/assets/icons/chevron_left.svg";
import { useRouter } from "expo-router";
export default function AuthLayout() {
export default function UserLayout() {
const router = useRouter();
return (
<>
<StatusBar style="dark" />
<Stack
screenOptions={{
headerShown: false,
animation: "fade",
}}
/>
<Stack.Screen
name="profile"
options={{
headerShown: true,
title: "My Account",
headerTitleStyle: {
fontSize: 16,
color: "#252A34",
},
headerShadowVisible: true,
headerLeft: () => {
return (
<TouchableOpacity onPress={() => router.back()}>
<GoBack />
</TouchableOpacity>
);
},
headerShadowVisible: false,
headerLeft: () => (
<TouchableOpacity onPress={() => router.back()}>
<GoBack />
</TouchableOpacity>
),
headerStyle: {
backgroundColor: "#F3F5F8",
},
animation: "slide_from_right",
}}
/>
>
<Stack.Screen
name="profile"
options={{
title: "My Account",
}}
/>
<Stack.Screen
name="edit_name"
options={{
title: "Edit Name",
}}
/>
</Stack>
</>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#F3F5F8",
},
});

View File

@ -127,6 +127,7 @@ const styles = StyleSheet.create({
flex: 1,
justifyContent: "space-between",
paddingVertical: 24,
backgroundColor: "#F3F5F8",
},
formContainer: {
flex: 1,

View File

@ -193,6 +193,7 @@ const styles = StyleSheet.create({
scrollContent: {
paddingHorizontal: 16,
paddingBottom: 32,
backgroundColor: "#F3F5F8",
},
avatarContainer: {
alignItems: "center",

View File

@ -0,0 +1,8 @@
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="mask0_382_3096" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="17" height="17">
<rect x="0.613281" y="0.726562" width="16" height="16" fill="#D9D9D9"/>
</mask>
<g mask="url(#mask0_382_3096)">
<path d="M8.6138 9.6599L5.34714 12.9266C5.22491 13.0488 5.06936 13.1099 4.88047 13.1099C4.69158 13.1099 4.53602 13.0488 4.4138 12.9266C4.29158 12.8043 4.23047 12.6488 4.23047 12.4599C4.23047 12.271 4.29158 12.1155 4.4138 11.9932L7.68047 8.72656L4.4138 5.4599C4.29158 5.33768 4.23047 5.18212 4.23047 4.99323C4.23047 4.80434 4.29158 4.64879 4.4138 4.52656C4.53602 4.40434 4.69158 4.34323 4.88047 4.34323C5.06936 4.34323 5.22491 4.40434 5.34714 4.52656L8.6138 7.79323L11.8805 4.52656C12.0027 4.40434 12.1582 4.34323 12.3471 4.34323C12.536 4.34323 12.6916 4.40434 12.8138 4.52656C12.936 4.64879 12.9971 4.80434 12.9971 4.99323C12.9971 5.18212 12.936 5.33768 12.8138 5.4599L9.54713 8.72656L12.8138 11.9932C12.936 12.1155 12.9971 12.271 12.9971 12.4599C12.9971 12.6488 12.936 12.8043 12.8138 12.9266C12.6916 13.0488 12.536 13.1099 12.3471 13.1099C12.1582 13.1099 12.0027 13.0488 11.8805 12.9266L8.6138 9.6599Z" fill="white"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -10,7 +10,7 @@ import {
} from "react-native";
import Checkbox from "expo-checkbox";
import { issueConfig } from "@/constants/config";
import CloseIcon from "@/assets/icons/close.svg";
interface IssueSelectorModalProps {
visible: boolean;
onClose: () => void;
@ -46,6 +46,13 @@ export default function IssueSelectorModal({
<Modal visible={visible} animationType="slide">
<View style={styles.container}>
{/* Header */}
<View style={styles.headerBar}>
<Text>Select Issue</Text>
<TouchableOpacity onPress={onClose}>
<CloseIcon />
</TouchableOpacity>
</View>
<View style={styles.divider}></View>
<View style={styles.header}>
<TextInput
placeholder="Search"
@ -91,26 +98,36 @@ export default function IssueSelectorModal({
))}
</ScrollView>
{/* Done Button */}
<TouchableOpacity
style={styles.doneButton}
onPress={() => {
onSelect(selectedValues);
onClose();
}}
>
<Text style={styles.doneText}>Done</Text>
</TouchableOpacity>
<View>
<TouchableOpacity
style={styles.doneButton}
onPress={() => {
onSelect(selectedValues);
onClose();
}}
>
<Text style={styles.doneText}>Done</Text>
</TouchableOpacity>
</View>
</View>
</Modal>
);
}
const styles = StyleSheet.create({
headerBar: {
flexDirection: "row",
justifyContent: "space-between",
alignItems: "center",
paddingHorizontal: 16,
paddingVertical: 12,
backgroundColor: "#F9F9F9",
},
container: { flex: 1, backgroundColor: "#fff" },
header: {
paddingHorizontal: 16,
paddingVertical: 12,
backgroundColor: "#FCFCFC",
},
searchBar: {
backgroundColor: "#fff",
@ -127,16 +144,22 @@ const styles = StyleSheet.create({
justifyContent: "space-between",
paddingHorizontal: 20,
paddingVertical: 12,
backgroundColor: "#FCFCFC",
},
divider: {
height: 1,
backgroundColor: "#E5E9F0",
},
counterText: {
fontSize: 12,
fontSize: 14,
color: "#555",
fontWeight: "600",
},
clearText: {
fontSize: 14,
color: "#ADB4BD",
},
scrollArea: { paddingHorizontal: 0 },
scrollArea: { paddingHorizontal: 0, backgroundColor: "#FCFCFC" },
category: {
fontSize: 14,
color: "#252A34",

View File

@ -1,16 +1,15 @@
{
"build": {
"development": {
"env": {
"ENV": "development",
"BASE_URL": "https://dev-driver-saathi-api.vecmocon.com"
}
"developmentClient": true,
"distribution": "internal"
},
"preview": {
"distribution": "internal"
},
"production": {
"env": {
"ENV": "production",
"BASE_URL": "https://dev-driver-saathi-api.vecmocon.com"
}
"autoIncrement": true,
"distribution": "internal"
}
}
}