first commit

2026-01-02 17:56:16 +05:30
parent b94f98a764
commit 59fb7e0df4
149 changed files with 9362 additions and 12549 deletions
@@ -0,0 +1,151 @@
+import React from 'react';
+import { View, Text, StyleSheet, Dimensions, TouchableOpacity } from 'react-native';
+import AppIntroSlider from 'react-native-app-intro-slider';
+import ImagePath from '../../Constant/ImagePath';
+import NavigationString from '../../Constant/NavigationString';
+import colors from '../../Constant/Color';
+import FontsFamily from '../../Constant/FontsFamily';
+import { useNavigation } from '@react-navigation/native';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+const { width } = Dimensions.get('window');
+const slides = [
+    {
+        id: 1,
+        title: 'Welcome',
+        description: 'Discover a smarter way to manage your work and stay productive every day.',
+        Image: ImagePath.OnBoard1,
+    },
+    {
+        id: 2,
+        title: 'Stay Organized',
+        description: 'Keep all your tasks, updates, and important information in one place.',
+        Image: ImagePath.OnBoard2,
+    },
+    {
+        id: 3,
+        title: 'Real-Time Updates',
+        description: 'Get instant updates and notifications so you never miss anything important.',
+        Image: ImagePath.OnBoard3,
+    },
+    {
+        id: 4,
+        title: 'Get Started',
+        description: 'Let’s begin your journey and explore all the powerful features of the app.',
+        Image: ImagePath.OnBoard3,
+    },
+];
+
+const Onboarding = () => {
+    const Navigation: any = useNavigation()
+
+    const onFinish = async () => {
+        await AsyncStorage.setItem('onBoarding', 'true');
+        Navigation.navigate(NavigationString.Login)
+    };
+
+    const renderItem = ({ item }: any) => (
+        <View style={styles.slide}>
+            <item.Image />
+
+            <Text style={styles.title}>{item.title}</Text>
+            <Text style={styles.description}>{item.description}</Text>
+        </View>
+    );
+
+    const renderNextButton = () => (
+        <View style={styles.btnCircle}>
+            <Text style={styles.btnText}>Next</Text>
+        </View>
+    );
+
+    const renderPrevButton = () => (
+        <View style={styles.btnCircle}>
+            <Text style={styles.btnText}>Prev</Text>
+        </View>
+    );
+
+    // ✅ Done Button
+    const renderDoneButton = () => (
+        <TouchableOpacity style={styles.btnCircle} onPress={onFinish}>
+            <Text style={styles.btnText}>Start</Text>
+        </TouchableOpacity>
+    );
+
+    return (
+        <AppIntroSlider
+            data={slides}
+            renderItem={renderItem}
+            showSkipButton
+            showPrevButton
+            renderNextButton={renderNextButton}
+            renderPrevButton={renderPrevButton}
+            renderDoneButton={renderDoneButton}
+            onSkip={onFinish}
+            onDone={onFinish}
+            activeDotStyle={styles.activeDot}
+            dotStyle={styles.dot}
+            contentContainerStyle={{ paddingBottom: 100 }}
+        />
+    );
+};
+
+export default Onboarding;
+
+const styles = StyleSheet.create({
+    slide: {
+        flex: 1,
+        backgroundColor: colors.white,
+        justifyContent: 'center',
+        paddingHorizontal: 24,
+    },
+    image: {
+        width: width * 0.75,
+        height: width * 0.75,
+        resizeMode: 'contain',
+        marginBottom: 40,
+    },
+    title: {
+        fontSize: 24,
+        fontFamily: FontsFamily.poppinsBold,
+        color: colors.primary,
+        textAlign: 'center',
+        marginBottom: 12,
+    },
+    description: {
+        fontSize: 16,
+        fontFamily: FontsFamily.poppinsRegular,
+        color: colors.grayText,
+        textAlign: 'center',
+        lineHeight: 22,
+    },
+    dot: {
+        backgroundColor: colors.border,
+    },
+    activeDot: {
+        backgroundColor: colors.primary,
+        width: 22,
+    },
+    btnCircle: {
+        paddingHorizontal: 16,
+        paddingVertical: 8,
+        backgroundColor: colors.primary,
+        borderRadius: 20,
+        width: 80
+    },
+    btnText: {
+        color: colors.white,
+        fontFamily: FontsFamily.poppinsMedium,
+        textAlign: 'center'
+    },
+    doneBtn: {
+        paddingHorizontal: 24,
+        paddingVertical: 10,
+        backgroundColor: colors.primary,
+        borderRadius: 24,
+    },
+    doneText: {
+        color: colors.white,
+        fontFamily: FontsFamily.poppinsMedium,
+        textAlign: 'center'
+    },
+});