digikhata-mashreq-sdk 1.0.0 → 1.1.0

package/lib/module/app/screens/UpdateBusiness.js

@@ -0,0 +1,707 @@
+"use strict";
+
+import React, { useState, useRef, useEffect } from 'react';
+import { View, Text, TextInput, TouchableOpacity, Animated, FlatList, StyleSheet, Platform, PermissionsAndroid, Alert } from 'react-native';
+import { Button_Text_SIZES, COLORS, FONT_MEDIUM, FONT_NORMAL, HP, Input_Field_SIZES, TEXT_SIZES, WP } from "../themes/config.js";
+import LinearGradient from 'react-native-linear-gradient';
+import Ionicons from 'react-native-vector-icons/Ionicons';
+import { BottomView, CountryPhoneInput, CustomToast, FloatingInput } from "../components/index.js";
+import { generatePDF } from 'react-native-html-to-pdf';
+import { viewDocument } from '@react-native-documents/viewer';
+import Geolocation from '@react-native-community/geolocation';
+import { updateBusiness } from "../database/business.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function UpdateBusiness({
+  navigation,
+  route
+}) {
+  const {
+    field,
+    value,
+    selectedBusiness
+  } = route.params;
+
+  // console.log('selectedBusiness_update', selectedBusiness);
+
+  const [step, setStep] = useState(1);
+  const fadeAnim = useRef(new Animated.Value(1)).current;
+  const [ownerName, setOwnerName] = useState('');
+  const [businessName, setBusinessName] = useState('');
+  const [id, setId] = useState('');
+  const [businessType, setBusinessType] = useState(null);
+  const [businessCategory, setBusinessCategory] = useState(null);
+  // console.log('businessType_businessCategory', businessType, businessCategory);
+  const [email, setEmail] = useState('');
+  const [location, setLocation] = useState('');
+  const [inputValue, setInputValue] = useState('');
+  const [phone, setPhone] = useState(value || '');
+  const [businessNameOther, setBusinessNameOther] = useState('');
+  const [businessNameOtherCategory, setBusinessNameOtherCategory] = useState('');
+  const [toast, setToast] = useState(null); // { type, title, message }
+
+  const [address, setAddress] = useState({
+    building: '',
+    area: '',
+    city: ''
+  });
+
+  // ---- Card data ----
+  const typeData = [{
+    id: '1',
+    title: 'Retailer/ Shop',
+    icon: 'storefront-outline'
+  }, {
+    id: '2',
+    title: 'Wholesaler',
+    icon: 'restaurant-outline'
+  }, {
+    id: '3',
+    title: 'Distributor',
+    icon: 'storefront-outline'
+  }, {
+    id: '4',
+    title: 'Manufacturer',
+    icon: 'briefcase-outline'
+  }, {
+    id: '5',
+    title: 'Services',
+    icon: 'briefcase-outline'
+  }, {
+    id: '6',
+    title: 'Other',
+    icon: 'briefcase-outline'
+  }];
+  const categoryData = [{
+    id: '1',
+    title: 'Kirana/Grocery',
+    icon: 'cart-outline'
+  }, {
+    id: '2',
+    title: 'Textile/Fashion',
+    icon: 'shirt-outline'
+  }, {
+    id: '3',
+    title: 'Medical',
+    icon: 'medkit-outline'
+  }, {
+    id: '4',
+    title: 'Electronics',
+    icon: 'tv-outline'
+  }, {
+    id: '5',
+    title: 'Mobile',
+    icon: 'phone-portrait-outline'
+  }, {
+    id: '6',
+    title: 'Automobile',
+    icon: 'car-outline'
+  }, {
+    id: '7',
+    title: 'Sports',
+    icon: 'bicycle-outline'
+  }, {
+    id: '8',
+    title: 'Kids/Toys',
+    icon: 'happy-outline'
+  }, {
+    id: '9',
+    title: 'Hardware/Tools',
+    icon: 'construct-outline'
+  }, {
+    id: '10',
+    title: 'Others',
+    icon: 'apps-outline'
+  }];
+  useEffect(() => {
+    if (selectedBusiness) {
+      setId(selectedBusiness.id || '');
+      setPhone(selectedBusiness.phone || '');
+      setBusinessName(selectedBusiness.name || '');
+      setOwnerName(selectedBusiness.owner_name || '');
+      setLocation(selectedBusiness.address || '');
+      setEmail(selectedBusiness.email || '');
+      setBusinessType(selectedBusiness.type || '');
+      setBusinessCategory(selectedBusiness.category || '');
+      setBusinessNameOtherCategory(selectedBusiness.other_cat_name || '');
+      setBusinessNameOther(selectedBusiness.other_type_name || '');
+    }
+  }, [selectedBusiness]);
+  const renderField = () => {
+    switch (field) {
+      case 'phone':
+        return /*#__PURE__*/_jsxs(View, {
+          style: styles._phoneInput,
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: styles.topText,
+            children: "Phone Number"
+          }), /*#__PURE__*/_jsx(CountryPhoneInput, {
+            value: phone // 👈 new addition
+            ,
+            onChange: val => setPhone(val.fullNumber) // ✅ set phone value same way
+            ,
+            contentContainerStyle: {
+              flex: 1
+            }
+          })]
+        });
+      case 'businessName':
+        return /*#__PURE__*/_jsxs(View, {
+          style: styles.stepContainer,
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: styles.topText,
+            children: "Business Name"
+          }), /*#__PURE__*/_jsx(FloatingInput, {
+            label: "Enter business name",
+            iconName: "storefront-outline",
+            iconPosition: "right",
+            value: businessName,
+            onChangeText: text => setBusinessName(text),
+            allowedChars: /[^A-Za-z0-9\s]/g
+            // maxLength={15}
+          })]
+        });
+      case 'ownerName':
+        return /*#__PURE__*/_jsxs(View, {
+          style: styles.stepContainer,
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: styles.topText,
+            children: "Owner Name"
+          }), /*#__PURE__*/_jsx(FloatingInput, {
+            label: "Owner Name",
+            iconName: "person-outline",
+            iconPosition: "right",
+            value: ownerName,
+            onChangeText: text => setOwnerName(text),
+            allowedChars: /[^A-Za-z0-9\s]/g,
+            maxLength: 15
+          })]
+        });
+      case 'location':
+        return /*#__PURE__*/_jsxs(View, {
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: styles.topText,
+            children: "Location"
+          }), /*#__PURE__*/_jsxs(View, {
+            style: styles.inputBox,
+            children: [/*#__PURE__*/_jsx(TextInput, {
+              style: styles.input,
+              placeholder: "location",
+              value: location,
+              onChangeText: setLocation,
+              placeholderTextColor: "#888"
+            }), /*#__PURE__*/_jsx(View, {
+              style: styles.IoniconsParent,
+              children: /*#__PURE__*/_jsx(Ionicons, {
+                name: "location-outline",
+                size: 24,
+                color: COLORS.primaryColor
+              })
+            })]
+          })]
+        });
+      case 'email':
+        return /*#__PURE__*/_jsxs(View, {
+          style: styles.stepContainer,
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: styles.topText,
+            children: "Email"
+          }), /*#__PURE__*/_jsx(FloatingInput, {
+            label: "Email",
+            iconName: "create-outline",
+            iconPosition: "right",
+            value: email,
+            onChangeText: setEmail,
+            allowedChars: /[^A-Za-z0-9@._-]/g,
+            maxLength: 30
+          })]
+        });
+      case 'businessType':
+        return /*#__PURE__*/_jsxs(View, {
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: styles.topText,
+            children: "Select business type"
+          }), /*#__PURE__*/_jsx(FlatList, {
+            data: typeData,
+            numColumns: 2,
+            columnWrapperStyle: {
+              justifyContent: 'space-between',
+              paddingHorizontal: 3
+            },
+            renderItem: ({
+              item
+            }) => /*#__PURE__*/_jsxs(TouchableOpacity, {
+              style: [styles.card, businessType === item.id && {
+                borderColor: COLORS.primaryColor,
+                elevation: 4
+              }],
+              onPress: () => setBusinessType(item.id),
+              activeOpacity: 0.8,
+              children: [/*#__PURE__*/_jsx(View, {
+                style: {
+                  width: 40,
+                  height: 40,
+                  borderRadius: 25,
+                  backgroundColor: '#f4f6fb',
+                  alignItems: 'center',
+                  justifyContent: 'center'
+                },
+                children: /*#__PURE__*/_jsx(Ionicons, {
+                  name: item.icon,
+                  size: 25,
+                  color: businessType === item.id ? COLORS.primaryColor : '#444'
+                })
+              }), /*#__PURE__*/_jsx(Text, {
+                style: [styles.cardTitle, {
+                  color: businessType === item.id ? COLORS.primaryColor : '#333'
+                }],
+                children: item.title
+              })]
+            }),
+            keyExtractor: item => item.id
+          }), businessType === '6' && /*#__PURE__*/_jsx(View, {
+            style: {
+              marginTop: 25
+            },
+            children: /*#__PURE__*/_jsx(FloatingInput, {
+              label: "Other",
+              iconName: "create-outline",
+              iconPosition: "right",
+              value: businessNameOther,
+              onChangeText: text => {
+                // Allow only letters (A-Z, a-z) and limit to 15 characters
+                const filtered = text.replace(/[^A-Za-z0-9\s]/g, '').slice(0, 25);
+                setBusinessNameOther(filtered);
+              },
+              allowedChars: /[^A-Za-z0-9\s]/g,
+              maxLength: 15
+            })
+          })]
+        });
+      case 'businessCategory':
+        return /*#__PURE__*/_jsxs(View, {
+          children: [/*#__PURE__*/_jsx(Text, {
+            style: styles.topText,
+            children: "Select business category"
+          }), /*#__PURE__*/_jsx(FlatList, {
+            data: categoryData,
+            numColumns: 2,
+            columnWrapperStyle: {
+              justifyContent: 'space-between',
+              paddingHorizontal: 3
+            },
+            renderItem: ({
+              item
+            }) => /*#__PURE__*/_jsxs(TouchableOpacity, {
+              style: [styles.card, businessCategory === item.id && {
+                borderColor: COLORS.primaryColor,
+                elevation: 4
+              }],
+              onPress: () => setBusinessCategory(item.id),
+              activeOpacity: 0.8,
+              children: [/*#__PURE__*/_jsx(View, {
+                style: {
+                  width: 40,
+                  height: 40,
+                  borderRadius: 25,
+                  backgroundColor: '#f4f6fb',
+                  alignItems: 'center',
+                  justifyContent: 'center'
+                },
+                children: /*#__PURE__*/_jsx(Ionicons, {
+                  name: item.icon,
+                  size: 25,
+                  color: businessCategory === item.id ? COLORS.primaryColor : '#444'
+                })
+              }), /*#__PURE__*/_jsx(Text, {
+                style: [styles.cardTitle, {
+                  color: businessCategory === item.id ? COLORS.primaryColor : '#333'
+                }],
+                children: item.title
+              })]
+            }),
+            keyExtractor: item => item.id
+          }), businessCategory === '10' && /*#__PURE__*/_jsx(View, {
+            style: {
+              marginTop: 25
+            },
+            children: /*#__PURE__*/_jsx(FloatingInput, {
+              label: "Other",
+              iconName: "create-outline",
+              iconPosition: "right",
+              value: businessNameOtherCategory,
+              onChangeText: text => {
+                // Allow only letters (A-Z, a-z) and limit to 15 characters
+                const filtered = text.replace(/[^A-Za-z0-9\s]/g, '').slice(0, 25);
+                setBusinessNameOtherCategory(filtered);
+              },
+              allowedChars: /[^A-Za-z0-9\s]/g,
+              maxLength: 15
+            })
+          })]
+        });
+      default:
+        return /*#__PURE__*/_jsx(View, {
+          children: /*#__PURE__*/_jsx(Text, {
+            style: {
+              color: '#888',
+              textAlign: 'center',
+              marginTop: 20
+            },
+            children: "Unknown field selected."
+          })
+        });
+    }
+  };
+  const progressAnim = useRef(new Animated.Value(0)).current;
+
+  // Animate progress whenever step changes
+  React.useEffect(() => {
+    // Make the button start at 20% fill instead of 0%
+    const progress = 0.2 + (step - 1) / 4 * 0.8; // 0.2 = initial fill, remaining 0.8 covers all 5 steps
+
+    Animated.timing(progressAnim, {
+      toValue: progress,
+      duration: 400,
+      useNativeDriver: false
+    }).start();
+  }, [step]);
+  const handleUpdate = async () => {
+    // Gather all data
+    debugger;
+    const finalData = {
+      id,
+      businessName,
+      phone,
+      ownerName,
+      businessType,
+      businessCategory,
+      location,
+      email,
+      businessNameOther,
+      businessNameOtherCategory
+    };
+    console.log('Final Data:', finalData);
+
+    // 🧠 Validate: Don't update if the selected field value is empty
+    let isEmpty = false;
+    switch (field) {
+      case 'businessName':
+        isEmpty = !businessName?.trim();
+        break;
+      case 'phone':
+        {
+          // Remove all non-digit characters
+          const digits = phone.replace(/\D/g, ''); // e.g. "+92" → "92", "+923001234567" → "923001234567"
+
+          // If user only selected a country (usually 1–3 digit country code) and no real number
+          if (digits.length <= 4) {
+            isEmpty = true;
+          } else {
+            isEmpty = false;
+          }
+          break;
+        }
+      case 'ownerName':
+        isEmpty = !ownerName?.trim();
+        break;
+      case 'location':
+        isEmpty = !location?.trim();
+        break;
+      case 'email':
+        isEmpty = !email?.trim();
+        break;
+      case 'businessType':
+        isEmpty = !businessType;
+        break;
+      case 'businessCategory':
+        isEmpty = !businessCategory;
+        break;
+      default:
+        isEmpty = true;
+        break;
+    }
+    if (isEmpty) {
+      console.warn('⚠️ Cannot update: Field is empty');
+      setToast({
+        type: 'warning',
+        title: 'Missing Information',
+        message: 'Please fill in this field before updating.'
+      });
+      return; // ⛔ stop further execution
+    }
+    try {
+      // Proceed with update if field is not empty
+      const all = await updateBusiness(id, businessName, phone, ownerName, businessType, businessCategory, location, email, '', businessNameOtherCategory, businessNameOther);
+      console.log('Business Updated:', all);
+      setToast({
+        type: 'success',
+        title: 'Business Updated',
+        message: `${businessName} has been updated successfully.`
+      });
+      navigation.goBack();
+    } catch (error) {
+      console.error('Error updating business:', error);
+      setToast({
+        type: 'error',
+        title: 'Update Failed',
+        message: 'Something went wrong while updating your business.'
+      });
+    }
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles._mainContainers,
+    children: [/*#__PURE__*/_jsx(LinearGradient, {
+      start: {
+        x: 0,
+        y: 0
+      },
+      end: {
+        x: 1,
+        y: 0
+      },
+      colors: [COLORS.secondaryColor, COLORS.primaryColor],
+      style: styles._linearGradient,
+      children: /*#__PURE__*/_jsxs(View, {
+        style: styles._titleMain,
+        children: [/*#__PURE__*/_jsx(TouchableOpacity, {
+          activeOpacity: 0.8,
+          onPress: () => {
+            navigation.goBack();
+          },
+          children: /*#__PURE__*/_jsx(Ionicons, {
+            name: 'chevron-back',
+            color: COLORS.whiteColor,
+            size: 20
+          })
+        }), /*#__PURE__*/_jsx(Text, {
+          style: styles._title,
+          children: "Update Business"
+        })]
+      })
+    }), /*#__PURE__*/_jsx(View, {
+      style: [styles._contentMain],
+      children: renderField()
+    }), field !== 'location' && /*#__PURE__*/_jsx(BottomView, {
+      style: styles.bottomBar,
+      children: /*#__PURE__*/_jsx(TouchableOpacity, {
+        style: styles.totalButton,
+        activeOpacity: 0.8,
+        onPress: handleUpdate,
+        children: /*#__PURE__*/_jsx(Text, {
+          style: styles.totalText,
+          children: "Update"
+        })
+      })
+    }), toast && /*#__PURE__*/_jsx(CustomToast, {
+      type: toast.type,
+      title: toast.title,
+      message: toast.message,
+      onClose: () => setToast(null)
+    })]
+  });
+}
+const styles = StyleSheet.create({
+  _mainContainers: {
+    flex: 1,
+    backgroundColor: COLORS.whiteColor,
+    alignItems: 'center'
+  },
+  _linearGradient: {
+    width: WP(100),
+    height: 80,
+    alignItems: 'center'
+  },
+  _titleMain: {
+    width: WP(94),
+    height: 30,
+    // backgroundColor: "red",
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginTop: 10
+  },
+  _title: {
+    color: COLORS.whiteColor,
+    fontFamily: FONT_NORMAL,
+    fontSize: 15,
+    marginLeft: 15
+  },
+  _contentMain: {
+    width: WP(94),
+    // height: '100%',
+    backgroundColor: COLORS.whiteColor,
+    position: 'absolute',
+    top: 60,
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 2
+    },
+    shadowOpacity: 0.2,
+    shadowRadius: 3.84,
+    elevation: 5,
+    borderRadius: TEXT_SIZES.BORDER_RADIUS,
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    paddingVertical: 12,
+    padding: 10
+  },
+  stepContainer: {
+    width: '100%',
+    gap: 4
+  },
+  businesTittleParent: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    alignContent: 'center',
+    width: '100%' // 👈 ADD THIS
+  },
+  label: {
+    fontSize: 17,
+    fontFamily: FONT_MEDIUM,
+    color: COLORS.blackColor,
+    alignSelf: 'flex-start'
+    // marginBottom: 10,
+  },
+  getLocationParent: {
+    backgroundColor: '#cdf0f5',
+    padding: 6,
+    borderRadius: 50,
+    flexDirection: 'row',
+    gap: 5
+  },
+  getLocationChild: {
+    color: COLORS.blackColor,
+    fontFamily: FONT_MEDIUM,
+    fontSize: 12
+  },
+  _phoneInput: {
+    width: '100%'
+  },
+  topText: {
+    fontSize: TEXT_SIZES.Normal_Heading,
+    fontFamily: FONT_MEDIUM,
+    color: COLORS.blackColor,
+    alignSelf: 'flex-start'
+    // marginBottom: 10,
+  },
+  inputBox: {
+    width: '100%',
+    height: Input_Field_SIZES.Input_Field,
+    borderWidth: 1,
+    borderColor: COLORS.grey,
+    borderRadius: TEXT_SIZES.BORDER_RADIUS,
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: 12,
+    marginBottom: 10
+  },
+  input: {
+    flex: 1,
+    // marginLeft: 8,
+    fontSize: 15,
+    color: COLORS.blackColor
+  },
+  card: {
+    width: '49.5%',
+    height: 60,
+    borderRadius: TEXT_SIZES.BORDER_RADIUS,
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    gap: 5,
+    padding: 3,
+    marginVertical: 6,
+    backgroundColor: '#fff',
+    flexDirection: 'row',
+    // 💡 3D effect using light and dark edges
+    borderTopWidth: 1,
+    borderLeftWidth: 1,
+    borderBottomWidth: 1,
+    borderRightWidth: 1,
+    borderTopColor: '#f2f2f2',
+    // light edge (top/left)
+    borderLeftColor: '#f2f2f2',
+    borderBottomColor: '#f2f2f2',
+    // darker edge (bottom/right)
+    borderRightColor: '#f2f2f2',
+    elevation: 5
+  },
+  cardTitle: {
+    fontSize: 13
+    // marginTop: 6,
+  },
+  _bottomContainer: {
+    position: 'absolute',
+    bottom: HP(5),
+    width: '100%',
+    backgroundColor: COLORS.whiteColor,
+    borderTopLeftRadius: 25,
+    borderTopRightRadius: 25,
+    paddingVertical: 15,
+    alignItems: 'center',
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: -2
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 3,
+    elevation: 8
+  },
+  _continueBtn: {
+    width: '90%',
+    height: 50,
+    backgroundColor: COLORS.primaryColor,
+    // light base
+    borderRadius: TEXT_SIZES.BORDER_RADIUS,
+    justifyContent: 'center',
+    alignItems: 'center',
+    overflow: 'hidden' // ensure animated fill stays rounded
+  },
+  progressFill: {
+    ...StyleSheet.absoluteFillObject,
+    backgroundColor: COLORS.primaryColor,
+    borderRadius: 100,
+    width: '0%'
+  },
+  _continueBtnTxt: {
+    color: COLORS.whiteColor,
+    fontFamily: FONT_NORMAL,
+    fontSize: Button_Text_SIZES.Button_Text
+  },
+  IoniconsParent: {
+    // backgroundColor: COLORS.iconBG,
+    padding: 10,
+    borderRadius: 50
+  },
+  bottomBar: {
+    position: 'absolute',
+    bottom: 0,
+    left: 0,
+    right: 0,
+    backgroundColor: '#fff',
+    borderTopLeftRadius: TEXT_SIZES.BORDER_RADIUS,
+    borderTopRightRadius: TEXT_SIZES.BORDER_RADIUS,
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingVertical: 10,
+    elevation: 10
+  },
+  totalButton: {
+    borderWidth: 1,
+    marginBottom: 10,
+    borderColor: '#FF3B30',
+    backgroundColor: COLORS.primaryColor,
+    borderRadius: TEXT_SIZES.BORDER_RADIUS,
+    width: '100%',
+    height: 50,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  totalText: {
+    color: COLORS.whiteColor,
+    fontFamily: FONT_NORMAL,
+    fontSize: 13
+  }
+});
+//# sourceMappingURL=UpdateBusiness.js.map