@jescon-technologies/react-native-ui-kit 0.0.4 → 0.0.5

package/src/Screens/Splash.js

@@ -0,0 +1,788 @@
+import React, { useContext, useEffect, useState } from 'react';
+import {
+  View,
+  StatusBar,
+  Text,
+  Image,
+  TouchableOpacity,
+  KeyboardAvoidingView,
+  BackHandler,
+  Modal,
+  Dimensions,
+  Platform,
+  StyleSheet
+} from 'react-native';
+import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import RNExitApp from 'react-native-exit-app';
+import RNFS from 'react-native-fs';
+import { normalize } from '../CommonStyle/componentStyle';
+import { isNU, isNUQ, notifyMessage } from '../CommonStyle/ComponentFunctions';
+import { Global } from '../../../../../src/Common/Global';
+import Icons from '../Common/Icons';
+import NetworkServiceCall from '../Common/NetworkServiceCall';
+import { APIURL } from '../../../../../src/Common/apiConstants';
+import HOCIcons from '../HOC/HOCIcons';
+import CBackHandler from '../CustomComponents/CBackHandler';
+import ApkInstaller from 'react-native-installer'
+import { useNavigation } from '../Navigation/useNavigation';
+import packageJson from '../../package.json';
+
+const ThemeColors = [
+  {
+    primary_color: '#094485',
+    secondary_color: 'black',
+    text_color: '#fff',
+    heading_text_color: 'darkblue',
+    bg_button: '#fff',
+    icon_color: 'darkblue',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: 'black',
+    secondary_color: 'black',
+    text_color: '#fff',
+    heading_text_color: 'black',
+    bg_button: 'black',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: '#00008B',
+    secondary_color: 'black',
+    text_color: '#fff',
+    heading_text_color: '#00008B',
+    bg_button: '#fff',
+    icon_color: '#00008B',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: '#e54495',
+    secondary_color: 'black',
+    text_color: '#fff',
+    heading_text_color: '#fc5dac',
+    bg_button: '#fff',
+    icon_color: '#fc5dac',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: 'purple',
+    secondary_color: 'purple',
+    text_color: '#fff',
+    heading_text_color: 'purple',
+    bg_button: 'purple',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: '#0d910d',
+    secondary_color: '#0d910d',
+    text_color: '#fff',
+    heading_text_color: '#0d910d',
+    bg_button: '#fff',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: '#f70404',
+    secondary_color: '#f70404',
+    text_color: '#fff',
+    heading_text_color: '#f70404',
+    bg_button: '#fff',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: '#3489a8',
+    secondary_color: '#3489a8',
+    text_color: '#fff',
+    heading_text_color: '#3489a8',
+    bg_button: '#fff',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: 'grey',
+    secondary_color: 'grey',
+    text_color: '#fff',
+    heading_text_color: 'grey',
+    bg_button: '#fff',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: '#bab10e',
+    secondary_color: '#bab10e',
+    text_color: '#fff',
+    heading_text_color: '#bab10e',
+    bg_button: '#fff',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  },
+  {
+    primary_color: '#9e331e',
+    secondary_color: '#9e331e',
+    text_color: '#fff',
+    heading_text_color: '#9e331e',
+    bg_button: '#fff',
+    icon_color: '#fff',
+    selected_color: "#d7ffbc",
+    blur_color: 'rgba(255,255,255,0.6)',
+    error_color: '#D32F2F',
+  }
+];
+
+export default function Splash(props) {
+  const [loading, setLoading] = useState(false);
+  const [backHandler, setBackHandler] = useState(false);
+  const [refresh, setRefresh] = useState(0);
+  const [progress, setProgress] = useState(null);
+  const [isLoading, setIsLoading] = useState(false);
+  const [showText, setShowText] = useState();
+  const [updateVersion, setUpdateVersion] = useState();
+  const [retry, setRetry] = useState(false);
+  const navigation = useNavigation()
+
+  useEffect(() => {
+    if (Platform.OS === 'android') {
+      getApiVersionCheck();
+    } else if (Platform.OS === 'web') {
+      getData();
+    } else {
+      getData();
+    }
+  }, []);
+
+
+  useEffect(() => {
+    const backAction = () => {
+      RNExitApp.exitApp();
+      return true;
+    };
+
+    const backHandler = BackHandler.addEventListener('hardwareBackPress', backAction);
+    return () => backHandler.remove();
+  }, []);
+
+  const isValidUrl = (string) => {
+    try {
+      new URL(string);
+      return true;
+    } catch (err) {
+      return false;
+    }
+  };
+
+  const goBackFunction = (showText, retry, isLoading) => {
+    if (isNU(showText) && !retry && isLoading) {
+      RNExitApp.exitApp();
+    }
+  };
+
+  const getApiVersionCheck = () => {
+    setIsLoading(true);
+    setShowText();
+    setUpdateVersion();
+    setRetry(false);
+    setProgress(null);
+
+    const buttonapi = `${APIURL}insuranceadvanceget/emrcommonget/rnmoduleversioncheck ${Global.hospitalcode},${Global.module}`;
+    console.log('getApiVersionCheck buttonapi ', JSON.stringify(buttonapi));
+
+    NetworkServiceCall('get', buttonapi).then(function (response) {
+      if (
+        response.httpstatus === 200 &&
+        isNU(response.data) &&
+        isNUQ(response.data.version) &&
+        isNUQ(response.data.apkVersion) &&
+        isNUQ(response.data.bundleUrl) &&
+        isValidUrl(response.data.bundleUrl) &&
+        isNUQ(response.data.apkUrl) &&
+        isValidUrl(response.data.apkUrl) &&
+        isNU(response.data.descriptions)
+      ) {
+        console.log('getApiVersionCheck response @@@@@@@@@@@', JSON.stringify(response));
+        console.log('New version available:', response.data.version,Global.version);
+        console.log('New APK version available:', response.data.apkVersion,packageJson.version);
+        if (Global.version !== response.data.version) {
+          setUpdateVersion(response.data.version);
+          downloadBundleWithProgress(
+            (p) => setProgress(p),
+            response.data.bundleUrl,
+            response.data.version,
+            response.data.descriptions
+          );
+        } else if (packageJson.version !== response.data.apkVersion) {
+          downloadApkWithProgress(
+            (p) => setProgress(p),
+            response.data.apkUrl,
+            response.data.apkVersion,
+            response.data.descriptions
+          );
+        } else {
+          getData();
+        }
+      } else {
+        setIsLoading(false);
+        setRetry(true);
+        notifyMessage('Network Error.Please try again.', 2);
+      }
+    });
+  };
+
+  const downloadBundleWithProgress = async (onProgressUpdate, url, newversion, desc) => {
+    console.log('Starting bundle download from:', url);
+    return new Promise((resolve, reject) => {
+      const downloadDest = `${RNFS.ExternalDirectoryPath}/update.apk`;
+      const download = RNFS.downloadFile({
+        fromUrl: url,
+        toFile: downloadDest,
+        progressInterval: 500,
+        progress: (res) => {
+          const percentage = Math.floor((res.bytesWritten / res.contentLength) * 100);
+          console.log(`[OTA] Download progress: ${percentage}%`);
+          onProgressUpdate?.(percentage);
+        }
+      });
+
+      download.promise
+        .then(async (res) => {
+          console.log('[OTA] Download complete! Moving file...');
+          try {
+            ApkInstaller.install(downloadDest);
+            console.log('[OTA] File moved to final destination!');
+            setShowText(desc);
+            resolve(true);
+            RNExitApp.exitApp();
+          } catch (moveErr) {
+            console.warn('[OTA] Failed to move file:', moveErr.message);
+            reject(moveErr);
+            setRetry(true);
+          }
+        })
+        .catch((err) => {
+          console.warn('[OTA] Download failed:', err.message);
+          reject(err);
+          setRetry(true);
+        });
+    });
+  };
+
+  const downloadApkWithProgress = async (onProgressUpdate, url, newversion, desc) => {
+    console.log('Starting APK download from:', url);
+    return new Promise((resolve, reject) => {
+      const downloadDest = `${RNFS.ExternalDirectoryPath}/insure${newversion}.apk`;
+      const download = RNFS.downloadFile({
+        fromUrl: url,
+        toFile: downloadDest,
+        progressInterval: 500,
+        progress: (res) => {
+          const percentage = Math.floor((res.bytesWritten / res.contentLength) * 100);
+          console.log(`[APK] Download progress: ${percentage}%`);
+          onProgressUpdate?.(percentage);
+        }
+      });
+
+      download.promise
+        .then(async (res) => {
+          console.log('[APK] Download complete! Moving file...');
+          try {
+            ApkInstaller.install(downloadDest);
+            console.log('[APK] File moved to final destination!');
+            setShowText(desc);
+            resolve(true);
+            RNExitApp.exitApp();
+          } catch (moveErr) {
+            console.warn('[APK] Failed to move file:', moveErr.message);
+            reject(moveErr);
+            setRetry(true);
+          }
+        })
+        .catch((err) => {
+          console.warn('[APK] Download failed:', err.message);
+          reject(err);
+          setRetry(true);
+        });
+    });
+  };
+
+  const removeValue = async () => {
+    try {
+      await AsyncStorage.removeItem(Global.asyncStorageAppKey);
+    } catch (e) {
+      // remove error
+    }
+  };
+
+  const getLoginPageData = (object, key) => {
+    setLoading(true);
+    const buttonapi = `http://${object.APIP}:${object.PortNumber}/${object.ApiLink} '${key}',${object.ApiVersion}`;
+    console.log('getLoginPageData buttonpai ', JSON.stringify(buttonapi));
+
+    NetworkServiceCall('get', buttonapi, '').then(function (response) {
+      if (response.httpstatus === 200) {
+        if (object.ValidationStatus === true) {
+          Global.HospitalData = response.data.hospitalInfo;
+          Global.InstallationKey = key;
+          // props.navigation.navigate('Login', { data: response.data });
+          navigation.navigate('Login', { data: response.data });
+          setLoading(false);
+        } else {
+          setBackHandler(false);
+          notifyMessage('Install validation failed...', 3);
+          setLoading(false);
+        }
+      } else {
+        setBackHandler(false);
+        notifyMessage('Network Error... ', 4);
+        setLoading(false);
+      }
+    });
+  };
+
+  const getValidation = (otp) => {
+    const buttonapi = `${Global.licenseIp}'${otp}'`;
+    console.log('getValidation buttonapi', buttonapi);
+
+    setLoading(true);
+    NetworkServiceCall('get', buttonapi, '').then(function (response) {
+      console.log('getValidation response @@@@@@@@@@@', JSON.stringify(response));
+
+      if (response.httpstatus === 200) {
+        if (response.data?.ValidationStatus === true) {
+          setBackHandler(false);
+          storeData(otp, response.data);
+          getLoginPageData(response.data, otp);
+        } else {
+          setLoading(false);
+          setBackHandler(false);
+          notifyMessage('Validation Failed...Please enter right key', 3);
+        }
+      } else {
+        setLoading(false);
+        notifyMessage('Network Error... ', 4);
+      }
+    });
+  };
+
+  const storeData = async (value, response) => {
+    try {
+      const newValue = {
+        key: value,
+        hospitaldata: response
+      };
+      const jsonValue = JSON.stringify(newValue);
+      await AsyncStorage.setItem(Global.asyncStorageAppKey, jsonValue);
+    } catch (e) {
+      // saving error
+    }
+  };
+
+  const setTheme = async (item) => {
+    try {
+      const jsonValue = JSON.stringify(item);
+      await AsyncStorage.setItem(Global.asyncStorageThemeKey, jsonValue);
+      Global.AppTheme = item;
+      setRefresh(refresh + 1);
+    } catch (e) {
+      // saving error
+    }
+    removeValue();
+    setBackHandler(false);
+  };
+
+  const getStorageItem = async (key) => {
+    if (Platform.OS === 'web' || Platform.OS === 'windows' || Platform.OS === 'macos') {
+      // Check if we're in Electron
+      if (window && window.process && window.process.type === 'renderer') {
+        // For Electron renderer process
+        console.log('Getting from localStorage for key (Electron):', key);
+        return localStorage.getItem(key);
+        //return 'emr@amala'
+      }
+      return localStorage.getItem(key);
+    } else {
+      const AsyncStorage = require('@react-native-async-storage/async-storage').default;
+      return await AsyncStorage.getItem(key);
+    }
+  };
+
+
+
+  const getData = async () => {
+    try {
+      const jsonValue = await getStorageItem(Global.asyncStorageAppKey);
+      console.log('Retrieved value:', jsonValue);
+
+      if (!jsonValue) {
+        return getValidation(Global.preinstallationkey);
+        console.log("Hello");
+      }
+
+      const InstallationData = JSON.parse(jsonValue);
+      console.log('installation', JSON.stringify(InstallationData));
+
+      setBackHandler(false);
+      return getLoginPageData(InstallationData.hospitaldata, InstallationData.key);
+    } catch (e) {
+      console.error('Error in getData:', e);
+      return getValidation(Global.preinstallationkey);
+    }
+  };
+
+  const renderUpdateModal = () => (
+    <Modal
+      animationType="none"
+      transparent={true}
+      visible={isLoading}
+      onRequestClose={() => goBackFunction(showText, retry, isLoading)}
+      style={styles.modal}
+    >
+      <View style={styles.modalContainer}>
+        <View style={styles.modalContent}>
+          {retry ? (
+            <View style={styles.retryContainer}>
+              <TouchableOpacity
+                onPress={getApiVersionCheck}
+                style={styles.retryButton}
+              >
+                <HOCIcons.MaterialCommunityIcons
+                  name={'reload'}
+                  color={'red'}
+                  size={normalize(30)}
+                  style={styles.retryIcon}
+                />
+                <Text style={styles.retryText}>Retry</Text>
+              </TouchableOpacity>
+            </View>
+          ) : (
+            <View style={styles.downloadContainer}>
+              {!showText && (
+                <Image
+                  style={styles.downloadGif}
+                  source={{ uri: APIURL + 'insurancefile/getCommonFile/image/transfer.gif' }}
+                />
+              )}
+              {!showText && (
+                <Text style={styles.progressText}>
+                  {isNU(progress) ? `${progress} % Downloading` : null}
+                </Text>
+              )}
+              {showText && (
+                <View style={styles.descriptionContainer}>
+                  <Text style={styles.descriptionText}>
+                    {showText}
+                  </Text>
+                </View>
+              )}
+              {updateVersion && (
+                <Text style={styles.versionText}>
+                  <Text style={styles.versionLabel}>Latest Version: </Text>
+                  {updateVersion}
+                </Text>
+              )}
+            </View>
+          )}
+          {!showText && (
+            <View>
+              <Text style={styles.currentVersionText}>
+                <Text style={styles.versionLabel}>Current Version: </Text>
+                {Global.version}
+              </Text>
+            </View>
+          )}
+        </View>
+      </View>
+    </Modal>
+  );
+
+  const renderThemeSelector = () => (
+    <View style={styles.themeContainer}>
+      <Text style={[styles.themeLabel, { color: Global.AppTheme.text_color }]}>
+        Choose Theme:
+      </Text>
+      <View style={styles.themeRow}>
+        {ThemeColors.map((item, i) => (
+          <TouchableOpacity
+            key={i}
+            onPress={() => setTheme(item)}
+            style={styles.themeButton}
+          >
+            <Icons.FontAwesome
+              name="circle"
+              color={item.primary_color}
+              size={normalize(20)}
+            />
+          </TouchableOpacity>
+        ))}
+      </View>
+    </View>
+  );
+
+  const renderSocialIcons = () => (
+    <View style={styles.socialContainer}>
+      {['facebook', 'web', 'linkedin'].map((item, i) => (
+        <TouchableOpacity
+          key={i}
+          onPress={removeValue}
+          hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
+        >
+          <MaterialCommunityIcons
+            name={item}
+            color={Global.AppTheme.text_color}
+            size={normalize(15)}
+          />
+        </TouchableOpacity>
+      ))}
+    </View>
+  );
+
+  const renderAppLogo = () => (
+    <TouchableOpacity onPress={() => setBackHandler(false)}>
+      <View style={styles.logoContainer}>
+        <Image
+          style={styles.logo}
+          source={require('../../android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png')}
+        />
+        <Text style={styles.appName}>
+          {Global.SplashHeading || 'HOMES'}
+        </Text>
+      </View>
+    </TouchableOpacity>
+  );
+
+  const renderCompanyInfo = () => (
+    <View style={styles.companyContainer}>
+      <Text style={styles.fromText}>from,</Text>
+      <Text style={styles.companyName}>JESCON TECHNOLOGIES PVT LTD</Text>
+
+      {renderSocialIcons()}
+
+      {Platform.OS !== 'ios' && (
+        <View style={styles.versionContainer}>
+          <Text style={styles.codePushVersion}>
+            {Global.CodePushVersion}
+          </Text>
+        </View>
+      )}
+
+      <Text style={styles.versionText}>
+        {isNU(Global.version) ? `V ${Global.version}` : null}
+      </Text>
+
+      <TouchableOpacity
+        disabled={loading}
+        onPress={() => Platform.OS === 'android' ? getApiVersionCheck() : getData()}
+        style={styles.refreshButton}
+      >
+        <Icons.FontAwesome name={'refresh'} color={'#fff'} size={normalize(25)} />
+        <Text style={styles.refreshText}>Refresh</Text>
+      </TouchableOpacity>
+    </View>
+  );
+
+  return (
+    <KeyboardAvoidingView
+      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
+      style={[styles.container, { backgroundColor: Global.AppTheme.primary_color }]}
+    >
+      <StatusBar
+        backgroundColor={Global.AppTheme.primary_color}
+        barStyle={Platform.OS === 'ios' ? 'dark-content' : 'light-content'}
+      />
+
+      {isLoading && renderUpdateModal()}
+
+      {renderAppLogo()}
+      {renderCompanyInfo()}
+      {renderThemeSelector()}
+
+      {backHandler && (
+        <CBackHandler
+          type={1}
+          close={(val) => val && setBackHandler(val)}
+          callBack={(val) => val && getValidation(val)}
+        />
+      )}
+    </KeyboardAvoidingView>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  // Modal Styles
+  modal: {
+    alignSelf: 'center',
+    padding: 0
+  },
+  modalContainer: {
+    height: Dimensions.get('window').height,
+    width: Dimensions.get('screen').width,
+    justifyContent: 'center',
+    alignItems: 'center',
+    paddingBottom: normalize(50)
+  },
+  modalContent: {
+    backgroundColor: 'white',
+    borderWidth: 1,
+    elevation: 5,
+    borderColor: 'grey',
+    borderRadius: 3,
+    alignItems: 'center',
+    alignSelf: 'center',
+    justifyContent: 'center',
+    height: Dimensions.get('screen').height * 0.2,
+    minWidth: Dimensions.get('screen').width * 0.8
+  },
+  retryContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  retryButton: {
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  retryIcon: {
+    marginHorizontal: normalize(8)
+  },
+  retryText: {
+    fontSize: normalize(12),
+    fontWeight: 'bold',
+    color: 'red'
+  },
+  downloadContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  downloadGif: {
+    width: normalize(150),
+    height: normalize(100)
+  },
+  progressText: {
+    color: 'black'
+  },
+  descriptionContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  descriptionText: {
+    color: '#cf1818',
+    fontSize: normalize(12),
+    textAlign: 'center'
+  },
+  versionText: {
+    color: Global.AppTheme.primary_color,
+    fontSize: normalize(10)
+  },
+  currentVersionText: {
+    color: Global.AppTheme.primary_color,
+    fontSize: normalize(10)
+  },
+  versionLabel: {
+    color: 'black',
+    fontSize: normalize(10)
+  },
+  // Logo Styles
+  logoContainer: {
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  logo: {
+    width: normalize(70),
+    height: normalize(70),
+    resizeMode: 'contain',
+    borderRadius: normalize(30)
+  },
+  appName: {
+    color: Global.AppTheme.text_color,
+    fontWeight: 'bold',
+    fontSize: normalize(25),
+    textAlign: 'center'
+  },
+  // Company Info Styles
+  companyContainer: {
+    paddingTop: normalize(40),
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  fromText: {
+    color: Global.AppTheme.text_color,
+    paddingBottom: normalize(8)
+  },
+  companyName: {
+    color: Global.AppTheme.text_color,
+    fontWeight: 'bold',
+    fontSize: normalize(16)
+  },
+  versionContainer: {
+    alignItems: 'center'
+  },
+  codePushVersion: {
+    color: 'white',
+    fontSize: normalize(16),
+    paddingTop: normalize(20)
+  },
+  refreshButton: {
+    marginTop: normalize(20),
+    alignItems: 'center'
+  },
+  refreshText: {
+    color: '#fff',
+    fontSize: normalize(7)
+  },
+  // Social Icons Styles
+  socialContainer: {
+    flexDirection: 'row',
+    width: normalize(90),
+    paddingTop: normalize(10),
+    justifyContent: 'space-between'
+  },
+  // Theme Selector Styles
+  themeContainer: {
+    paddingTop: normalize(50),
+    alignSelf: 'flex-start',
+    paddingHorizontal: normalize(20)
+  },
+  themeLabel: {
+    paddingBottom: normalize(2),
+    fontSize: normalize(14),
+    fontWeight: '500'
+  },
+  themeRow: {
+    flexDirection: 'row',
+    paddingTop: normalize(4),
+    alignItems: 'center',
+    flexWrap: 'wrap'
+  },
+  themeButton: {
+    paddingLeft: normalize(10),
+    paddingBottom: normalize(5)
+  }
+});