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

package/src/Screens/Login.js

@@ -0,0 +1,328 @@
+import React, { useState, useEffect } from 'react';
+import {
+  View,
+  StatusBar,
+  Text,
+  Image,
+  Platform,
+  TouchableOpacity,
+  Dimensions,
+  StyleSheet,
+  ScrollView,
+  TouchableWithoutFeedback,
+  Keyboard,
+  SafeAreaView,
+  Linking,
+  BackHandler,
+} from 'react-native';
+import { normalize } from '../CommonStyle/componentStyle';
+import Icon from '../Common/Icons';
+import Loader from '../Custom/Loader';
+import { useIsFocused } from '../Navigation/useIsFocused';
+import { useNavigation } from '../Navigation/useNavigation';
+import RNFetchBlob from 'react-native-blob-util';
+import { Global } from '../../../../../src/Common/Global';
+import { isNU } from '../CommonStyle/ComponentFunctions';
+import RNExitApp from 'react-native-exit-app';
+import HView from '../HOC/HView';
+import { APIURL } from '../../../../../src/Common/apiConstants';
+
+/**
+ * Login Component
+ * 
+ * Handles the main login screen functionality of the application
+ * 
+ * @param {Object} props - Component props passed from parent
+ * @returns {React.ReactElement} Rendered login screen
+ */
+function Login(props) {
+  // State variables
+  const [data, setData] = useState(props.route.params.data);
+  const [isLoading, setIsLoading] = useState(false);
+
+  // Hooks and dimensions
+  const { width, height } = Dimensions.get('screen');
+  const isFocused = useIsFocused();
+  const navigation = useNavigation();
+
+  // Handle back button press to exit app
+  useEffect(() => {
+    const backAction = () => {
+      if (!navigation.isFocused()) {
+        return false;
+      }
+
+      RNExitApp.exitApp();
+      return true;
+    };
+
+    const backHandler = BackHandler.addEventListener(
+      'hardwareBackPress',
+      backAction,
+    );
+
+    return () => backHandler.remove();
+  }, [navigation]);
+
+  /**
+   * Get file extension from filename
+   * @param {string} filename - The file name to extract extension from
+   * @returns {string|undefined} - The file extension
+   */
+  const getExtention = filename => {
+    return /[.]/.exec(filename) ? /[^.]+$/.exec(filename) : undefined;
+  };
+
+  /**
+   * Downloads an image from URL to device storage
+   */
+  const downloadImage = () => {
+    let date = new Date();
+    let image_URL = 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png';
+    let ext = getExtention(image_URL);
+    ext = '.' + ext[0];
+
+    const { config, fs } = RNFetchBlob;
+    let PictureDir = fs.dirs.PictureDir;
+
+    let options = {
+      fileCache: true,
+      addAndroidDownloads: {
+        useDownloadManager: true,
+        notification: true,
+        path: PictureDir + '/image_' + Math.floor(date.getTime() + date.getSeconds() / 2) + ext,
+        description: 'Image',
+      },
+    };
+
+    config(options)
+      .fetch('GET', image_URL)
+      .then(res => {
+        console.log('res -> ', JSON.stringify(res));
+        alert('Image Downloaded Successfully.');
+      });
+  };
+
+  const hospitalBgImage = Global.HospitalData?.bgimage || 'https://i.ibb.co/jvj0wdH/Adams-Neilson.jpg';
+
+  return (
+    <SafeAreaView style={styles.container}>
+      <StatusBar
+        translucent
+        backgroundColor="transparent"
+        barStyle={Platform.OS === 'ios' ? 'light-content' : 'dark-content'} />
+
+      <TouchableWithoutFeedback>
+        <View style={styles.container}>
+          {/* App Title */}
+          <Text
+            style={[
+              styles.titleText,
+              {
+                paddingHorizontal: 30,
+                textShadowColor: Global.AppTheme.primary_color,
+                textShadowOffset: { width: normalize(5), height: normalize(5) },
+                textShadowRadius: normalize(15),
+                textAlign: 'center',
+              },
+            ]}
+          >
+            {'HOMES'}
+          </Text>
+
+          <ScrollView keyboardShouldPersistTaps="handled">
+            <View style={styles.contentContainer}>
+              {/* Header Image */}
+              <View>
+                <Image
+                  style={styles.headerImage}
+                  source={{ uri: hospitalBgImage }}
+                />
+
+                {/* Customer Service Button */}
+                <TouchableOpacity
+                  style={styles.customerServiceButton}
+                  onPress={() => Linking.openURL(`tel:${Global.HospitalData.customercare}`)}
+                >
+                  <Icon.AntDesign
+                    name="customerservice"
+                    color="#fff"
+                    size={normalize(17)}
+                  />
+                </TouchableOpacity>
+              </View>
+
+              {/* Login Form */}
+              <View style={styles.bottomView}>
+                <HView
+                  component={'InsureLoginLayout'}
+                  loader={val => (val === undefined ? null : setIsLoading(val))}
+                />
+              </View>
+            </View>
+
+            {/* Company Logo Section */}
+            <View style={styles.companyLogoSection}>
+              <TouchableOpacity
+                onPress={() => Linking.openURL('http://jescontechnologies.com/')}
+                style={styles.footer_container}
+              >
+                <View style={styles.companyinfo_container}>
+                  <Image
+                    style={styles.companyLogo}
+                    source={{ uri: 'https://i.ibb.co/dkNbcDN/jesconnewlogo.jpg' }}
+                  />
+                  <Image
+                    style={styles.company_icon}
+                    source={{ uri: `${APIURL}insurancefile/getCommonFile/image/companyaddress_transparent.png` }}
+                  />
+                </View>
+              </TouchableOpacity>
+            </View>
+          </ScrollView>
+
+          {/* App Version Display */}
+          <View style={styles.versionContainer}>
+            {Platform.OS !== 'ios' && (
+              <Text style={styles.versionText}>
+                {Global.CodePushVersion}
+              </Text>
+            )}
+            <Text style={styles.versionText}>
+              {isNU(Global.version) ? `V ${Global.version}` : null}
+            </Text>
+          </View>
+
+          {/* Footer Icons */}
+          {/* <View style={styles.footerIconsContainer}>
+            <View style={styles.footerIconsRow}>
+              {data?.loginfootericons?.map((item, i) => (
+                <CVectorIcon
+                  key={i}
+                  data={{
+                    disabled: false,
+                    displaytext: item.displaytext,
+                    fontcolor: item.color,
+                    fontWeight: 'bold',
+                    size: 12,
+                    iconname: item.iconname,
+                    iconcolor: item.color,
+                    iconsize: 22,
+                    functionid: 'DF01',
+                  }}
+                  callBack={val =>
+                    val === undefined
+                      ? null
+                      : props.navigation.navigate('WebPage', { data: item })
+                  }
+                />
+              ))}
+            </View>
+          </View> */}
+
+          {/* Loading Indicator */}
+          {isLoading && <Loader displaytext={true} />}
+        </View>
+      </TouchableWithoutFeedback>
+    </SafeAreaView>
+  );
+}
+
+export default Login;
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
+  contentContainer: {
+    flex: 1,
+    marginBottom: Platform.OS !== 'web' ? normalize(100) : normalize(50),
+  },
+  titleText: {
+    position: 'absolute',
+    top: Dimensions.get('screen').height * 0.05,
+    alignSelf: 'center',
+    color: '#fff',
+    zIndex: 1,
+    elevation: 5,
+    fontWeight: 'bold',
+    fontSize: normalize(40),
+  },
+  headerImage: {
+    height: Dimensions.get('screen').height * 0.25,
+    width: '100%',
+    opacity: 0.7,
+  },
+  customerServiceButton: {
+    position: 'absolute',
+    top: normalize(60),
+    right: normalize(20),
+    backgroundColor: Global.AppTheme.primary_color,
+    padding: normalize(5),
+    borderRadius: 1000,
+  },
+  bottomView: {
+    backgroundColor: '#fff',
+    opacity: 0.95,
+    marginTop: normalize(-50),
+    borderRadius: normalize(20),
+    marginHorizontal: normalize(7),
+    paddingHorizontal: normalize(15),
+  },
+  companyLogoSection: {
+    position: Platform.OS !== 'web' && 'absolute',
+    bottom: normalize(50),
+    backgroundColor: '#fff',
+  },
+  footer_container: {
+    marginBottom: '1%',
+    alignItems: 'center',
+    width: '100%',
+  },
+  companyinfo_container: {
+    flexDirection: 'row',
+    height: normalize(45),
+    width: '100%',
+    justifyContent: 'flex-start',
+    alignItems: 'flex-start',
+  },
+  companyLogo: {
+    width: '47%',
+    height: '100%',
+    borderRadius: 0,
+    margin: 5,
+    resizeMode: 'cover',
+  },
+  company_icon: {
+    width: '47%',
+    height: '100%',
+    borderRadius: 0,
+    margin: 5,
+    resizeMode: 'contain',
+  },
+  versionContainer: {
+    position: 'absolute',
+    bottom: 0,
+    zIndex: 1,
+    alignSelf: 'center',
+  },
+  versionText: {
+    color: Global.AppTheme.secondary_color,
+    fontSize: normalize(10),
+    alignSelf: 'center',
+    fontWeight: 'bold',
+  },
+  footerIconsContainer: {
+    position: 'absolute',
+    bottom: 0,
+    backgroundColor: '#fff',
+    width: '100%',
+    height: normalize(45),
+    justifyContent: 'center',
+  },
+  footerIconsRow: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingHorizontal: normalize(15),
+  },
+});

package/src/Screens/Notification.js

@@ -0,0 +1,149 @@
+import React, { useState } from 'react';
+import { View, Text, FlatList, TouchableOpacity, RefreshControl, Linking } from 'react-native';
+import Ionicons from 'react-native-vector-icons/Ionicons';
+import moment from 'moment';
+import { normalize } from '../CommonStyle/componentStyle';
+import { notifyMessage, ValueCheck } from '../CommonStyle/ComponentFunctions';
+import CContainerView from '../CustomComponents/CContainerView';
+import HeaderBlock from './HeaderBlock';
+import CDetailView from '../CustomComponents/CDetailView';
+import NotificationContext from '../Handlers/NoticationsContext';
+import { Global } from '../../../../../src/Common/Global';
+import HHeading from '../HOC/HHeading';
+import Icons from '../Common/Icons';
+
+const Notifications = (props) => {
+
+    var TestArray = [{ "code": 12, "displayheader": "UPDATE", "displaytext": "Updates are available ", "status": true, "patientnumber": 0, "patientname": "", "tokennumber": 0, "phonenumber": "", "qrcode": 0, "date": "2022-12-07T15:59:00", "time": "2022-12-07T15:59:00" }, { "code": 11, "displayheader": "Consultation", "displaytext": "Booking is confirmed on 31st Dec 2022 for CHRISTY MARIA; Token Number :6 Patient name :HAROLD  LOUIS TEST", "status": false, "patientnumber": 0, "patientname": "HAROLD  LOUIS TEST", "tokennumber": 6, "phonenumber": "7338483582", "qrcode": 2345, "date": "2022-12-07T15:15:00", "time": "2022-12-07T15:15:00" }, { "code": 8, "displayheader": "Consultation", "displaytext": "Booking is confirmed on 30th Dec 2022 for SR.ROSE MAVELIKUNNEL MBBS,DGO; Token Number :19 Patient name :ALVIN ANTONY", "status": false, "patientnumber": 0, "patientname": "ALVIN ANTONY", "tokennumber": 19, "phonenumber": "7338483582", "qrcode": 2345, "date": "2022-12-06T14:53:00", "time": "2022-12-06T14:53:00" }, { "code": 7, "displayheader": "Consultation", "displaytext": "Booking is confirmed on 28th Dec 2022 for CHRISTY MARIA; Token Number :4 Patient name :HAROLD LOUIS", "status": false, "patientnumber": 0, "patientname": "HAROLD LOUIS", "tokennumber": 4, "phonenumber": "7338483582", "qrcode": 2345, "date": "2022-12-05T16:23:00", "time": "2022-12-05T16:23:00" }, { "code": 1, "displayheader": "HEADER", "displaytext": "NOTIFICATIONS", "status": false, "patientnumber": 0, "patientname": "", "tokennumber": 0, "phonenumber": "", "qrcode": 0, "date": "2022-12-05T12:28:00", "time": "2022-12-05T12:28:00" }]
+
+    const NoticationData = React.useContext(
+        NotificationContext,
+    );
+    // console.log("RRRRRRRRRREEEEEEEEESSSSSVARRRRRRRRRR",JSON.stringify(NoticationData))
+    var today = new Date()
+    const [NotificationArr, setNotificationArr] = useState(NoticationData)
+    const [refresh, setRefresh] = useState(0)
+    const [pulltorefresh] = useState(false)
+
+    return (
+        <CContainerView>
+            <HeaderBlock navigation={props.navigation} />
+
+            <CDetailView userlist={false}>
+                <View style={{ marginTop: normalize(-3), flex: 1 }}>
+                    <HHeading
+                        styles={{
+                            "iconname": 'bell',
+                            "bgcolor": "#f2efef",
+                            "iconsize": 16,
+                            "iconcolor": Global.AppTheme.primary_color,
+                            "displaytext": "Notifications",
+                            "textsize": 14,
+                            "textcolor": Global.AppTheme.primary_color
+                        }}
+                        callBack={val => (val == undefined ? null : console.log(val))}>
+                    </HHeading>
+
+                    <View style={{ flex: 1, backgroundColor: '#f2efef' }}>
+                        <FlatList
+                            data={NotificationArr}
+                            renderItem={renderItem}
+                            style={{ flex: 1 }}
+                            initialNumToRender={10}
+                            maxToRenderPerBatch={20}
+                            refreshControl={
+                            <RefreshControl
+                                refreshing={pulltorefresh}
+                                size={"large"}
+                                tintColor={"blue"}
+                                colors={["red", "green", "cyan", "black"]}
+                                progressBackgroundColor={"white"}
+                                onRefresh={() => console.log("......Refresh.....")} 
+                            />
+                            }
+                            contentContainerStyle={{ marginHorizontal: 10 }}
+                            keyExtractor={(item, index) => 'key' + index}
+                        />
+                    </View>
+                </View>
+            </CDetailView>
+        </CContainerView>
+    )
+
+    function urlify(text) {
+        var urlRegex = /(https?:\/\/[^\s]+)/g;
+        var x
+        text.replace(urlRegex, function (url) {
+            x = url
+        })
+        return x
+    }
+
+    function getLink(params) {
+        var linkUrl = urlify(params.displaytext)
+        if (linkUrl != undefined && linkUrl != null) {
+            Linking.openURL(linkUrl).catch(err => notifyMessage("Couldn't load page", 4))
+        }
+    }
+
+    function getNotification(data) {
+        switch (data.type) {
+            case 4: console.log("LAB RESULTS PRESSED")
+                break;
+
+            default: getLink(data)
+                break;
+        }
+
+        data.status = false
+        setRefresh(refresh + 1)
+    }
+
+    function getIcons(data) {
+        switch (data.type) {
+            case 4: return "microscope"
+            default:return "bell"
+        }
+    }
+
+    function getTimeCalculate(datePassed) {
+        var newDate = moment(today).format('DD/MM/YYYY');
+        var fromdate = moment(datePassed).format('DD/MM/YYYY');
+
+        var a = moment(newDate, 'DD/MM/YYYY');
+        var b = moment(fromdate, 'DD/MM/YYYY');
+        var diffDays = b.diff(a, 'days');
+        return -diffDays == 0 ? "Today" : -diffDays + " Days ago"
+    }
+
+    function renderItem({ item }) {
+        return (
+            <TouchableOpacity onPress={() => getNotification(item)}
+                style={{
+                    backgroundColor: !item.status ? 'transparent' : '#fff', marginVertical: normalize(4),
+                    flexDirection: 'row', paddingVertical: 10, borderRadius: 10, borderWidth: 1, borderColor: '#d8d6d6'
+                }}>
+                <View style={{ alignItems: 'center', justifyContent: 'center', width: '15%' }}>
+                    <Icons.FontAwesome5 name={getIcons(item)} color="black" size={normalize(25)} />
+                </View>
+                <View style={{ flexDirection: 'column', width: '80%' }}>
+                    <Text style={{ fontWeight: '700', color: '#626263' }}>{item.displayheader}</Text>
+                    <Text style={{ fontSize: normalize(12), color: '#626263' }}>{item.displaytext}</Text>
+                    <View style={{ flexDirection: 'column' }}>
+                        <Text style={{ fontSize: normalize(12), color: '#626263' }}>{getTimeCalculate(item.time)} |{"  "}
+                            <Ionicons name={item.status ? 'eye-outline' : 'ios-eye-off-outline'} color="#626263"
+                                size={normalize(15)} />
+                        </Text>
+                    </View>
+                </View>
+
+                {ValueCheck(item.user) ?
+                    <View style={{ position: 'absolute', bottom: normalize(5), right: normalize(5) }}>
+                        <Text style={{ fontSize: normalize(11), color: '#626263' }}>{"USERNAME"}</Text>
+                    </View> : null}
+
+            </TouchableOpacity>
+        )
+    }
+}
+export default Notifications;

package/src/Screens/OcrScreen.js

@@ -0,0 +1,20 @@
+import COcrScanner from "../CustomComponents/COcrScanner";
+
+
+export default function OcrScreen(props) {
+
+    return (
+        <COcrScanner
+            imageurl={[
+                {
+                    "url": "https://imgv3.fotor.com/images/blog-cover-image/How-to-Make-Text-Stand-Out-And-More-Readable.jpg"
+                },
+                {
+                    "url": "https://im.indiatimes.in/content/2022/Sep/Kerala-Doctors-Handwriting-Goes-Viral-For-Being-Too-Neat_633690f2b67a7.jpg?w=1200&h=900&cc=1&webp=1&q=75"
+                }
+            ]}
+            pdfurl={[{ "url": "https://www.adobe.com/support/products/enterprise/knowledgecenter/media/c4611_sample_explain.pdf" }]}
+        />
+    )
+
+}