\n )\n}\n\nexport default Spinner\n","import React from 'react';\nimport { Link, withRouter } from \"react-router-dom\";\nimport { FetchAPI } from '../../Api/api';\nimport Spinner from '../Components/Spinner';\n\nlet messages=[{\n title: 'Open Your Store Now',\n message:'You are now minutes away from having your own Locol store. Enjoy!'\n},{\n title: 'Application under review',\n message:'Your application to open Locol store is under review, we will send you an email once approved'\n},{\n title:'Congratulations!',\n message:'Your application to open a Locol store has been accepted, tap on the button below to create your catalog'\n}]\n\n\n\nclass MyCatalog extends React.Component {\n\n\n constructor() {\n super()\n this.state = {\n loader: false,\n isApproved:false\n }\n }\n\n\n\n checkStatus = () => {\n if(this.props.status<0){\n this.props.history.push('/business-profile')\n }else {\n this.props.history.push('/add-item')\n }\n }\n\n\n render() {\n return (\n
\n\t\t\t\t\t\t\n\t\t\t\t\t)}\n\t\t\t\t\n\t\t\t)}\n\t\t\n\t);\n}\n","import React from 'react';\nimport { Link } from \"react-router-dom\";\n\nexport default class MyOffers extends React.Component {\n render() {\n return(\n
\n
\n
\n \n
\n
Live Offer
\n
Close by users will see your live offer first thing in nearby page.
\n {/* Add live offer */}\n \n
\n
\n )\n }\n }\n\n\n\n","import React from 'react';\nimport { Link } from \"react-router-dom\";\n\nexport default class Addliveoffer extends React.Component {\n render() {\n return(<>\n
\n\t\t\t\t\t\t\t\t\t\tWe always recommend using your own content, authentic works.\n\t\t\t\t\t\t\t\t\t\tBut if it’s not possible then feel free to use any of below\n\t\t\t\t\t\t\t\t\t\tcontent for free.\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprops.handleModalStates(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tda,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tprops.formik\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfontWeight: \"400\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tfontSize: \"13px\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tSelect this asset\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t
\n \n AppClip allows your customers to access your catalog without having\n download the full app. Select the card that best applies to your\n catalog.\n \n
\n \n \n );\n}\n\nexport default AppClipCard;\n","import React from \"react\";\nimport { useEffect, useRef } from \"react\";\nimport Spinner from \"../Components/Spinner\";\nimport { Formik, Field, formik, Form, ErrorMessage, FieldArray } from \"formik\";\nimport { useHistory } from \"react-router-dom\";\nimport {\n FetchAPI,\n FetchAPILocal,\n postAPI,\n updateAPI,\n uploadImage,\n deleteImage,\n update} from \"../../Api/api\";\nimport { useState } from \"react\";\nimport Alert from \"../Components/alert\";\nimport AsyncSelect from \"react-select/async\";\nimport axios from \"axios\";\nimport { initialValues, savedValues } from \"./formValues\";\nimport { isValidData, Data, fetchCoordinates, apply, openHoursCreator, setBusinessId, GoogleApiToken, LoadOptionsFormatter, business_categories_change, business_sub_categories_change, ValidationSchema2, validationSchema, UpdateProfilePic, getBusinessCategory, formatCategories, categoriesFormatter, fetchInformation, ValidationSchema3 } from './utils';\nimport Fields from \"./components/Fields\";\nimport AsyncCreatableSelect from 'react-select/async-creatable';\nimport { baseUrl } from '../../Api/baseUrl';\nimport CreatableSelect from \"react-select/creatable\";\nimport Modal from './components/modal';\nimport Storehours from \"./components/storehours\";\nimport { toast } from 'react-toastify';\nimport RadiusFeild from './components/radius';\n\n//API calls are being imported from here as functions.\nimport { update_application, UpdateBusiness } from './utils';\nimport AppClipCard from \"./components/appClipCard\";\nvar uniqid = require('uniqid');\n\n\n\n//refer formik tuitoal on world wide web\nexport default function BusinessProfile(props) {\n\n const [review, setReview] = useState(true)\n const [storePrivacy, setStorePrivacy] = useState(true)\n let history = useHistory();\n const [inputText, setInputText] = useState(true)\n const [loading, setLoading] = useState(true);\n const [saved, setSaved] = useState(false);\n //do we areally require the users position.\n const [position, setPosition] = useState(null);\n const [upLoader, setUploader] = useState(false)\n const [accepted, setAccepted] = useState(false);\n const [miniLoader, setMiniLoader] = useState(true)\n const [hasPhysicalAddress, setHasPhysicalAddress] = useState(true)\n //toggles the values of the\n const [cantFind, setCantFind] = useState(false)\n const [infoError, setInfoError] = useState({})\n //handles error at the time of submitting.\n const [error, setError] = useState(false)\n\n //axios cancel token ref for storing the cancel token.\n const cancelToken = useRef(null)\n const alertRef = useRef(null);\n\n //for the react select options \n const [buss_category, set_buss_category] = useState([])\n //for default options when loading a saved data from the api.\n const [default_buss_category, set_default_buss_category] = useState([]);\n const [sub_category, set_sub_category] = useState([])\n const [default_sub_category, set_default_sub_category] = useState([]);\n const [message, setMessage] = useState({ type: \"\", message: \"\", });\n const [buttonLoader, setButtonLoader] = useState(false);\n const [app_clip_data, set_app_clip_data] = useState([]);\n const [checkImage, setcheckImage] = useState(\"\");\n\n useEffect(() => {\n\n let info = JSON.parse(localStorage.getItem(\"user\"));\n\n let bussID = info.twbusiness;\n let token = info.token;\n //cancelling api token need to be required here\n handleAppClipApi(token)\n\n FetchAPI(`/temp-businesses/?user=${info.userID}`, token)\n .then((response) => {\n //the first criteria should not be there.\n if (response.data.length > 0 && response.data[0].isApproved) {\n // console.log(response.data);\n setAccepted(true);\n //this business ID gets changed if pre owned business gets approved.\n fetchBusiness(response.data[0].twbusiness.id, token)\n setBusinessId(response.data[0].twbusiness.id)\n\n\n } else {\n fetchApplication(info, token);\n // appendDataInForm(response.data);\n }\n\n fetchBusinessCategories(token)\n })\n .catch((error) => {\n console.log(error);\n });\n\n\n\n return () => { };\n }, []);\n\n let changeStorePrivacy = () => {\n setStorePrivacy(!storePrivacy);\n }\n let changeReview = () => {\n setReview(!review);\n }\n\n function fetchBusiness(bussID, token) {\n FetchAPI(`/twbusinesses/${bussID}`, token)\n .then((result) => {\n // console.log(result.data)\n if (!Array.isArray(result.data)) {\n appendDataInForm([{ ...result.data }]);\n }\n\n })\n .catch((error) => {\n setLoading(false);\n console.log(error);\n });\n }\n\n //loads options from the api formats it with the help of react asnyc select.\n async function loadOptions(inputValue, callback) {\n try {\n\n setMiniLoader(true)\n if (cancelToken.current) {\n\n cancelToken.current.cancel()\n }\n\n cancelToken.current = axios.CancelToken.source()\n\n let result = await axios.get(`${baseUrl}/temp-businesses/search?searchtext=${inputValue}&token=${GoogleApiToken}`,\n {\n cancelToken: cancelToken.current.token,\n }\n );\n\n setMiniLoader(false)\n\n\n\n if (result.data.length > 0) {\n\n let format = result.data.map((places, index) => {\n let data = new LoadOptionsFormatter(places.name, places.placeId, places.address)\n\n return data;\n });\n\n\n callback(format)\n\n\n }\n\n } catch (error) {\n\n // console.log(error.message);\n\n\n }\n }\n\n //handles the change for the react-slect\n async function handleChange(formik, values) {\n\n if (values) {\n setMiniLoader(true)\n //the values are coming from load options method.\n formik.setFieldValue(\"Address\", values.address, false);\n formik.setFieldValue(\"placeId\", values.id, false);\n formik.setFieldValue(\"name\", values.label, false);\n\n\n try {\n //fetches info with the help of the place ID and returns a formatted data using google maps API.\n let response = await fetchInformation(values.id);\n\n\n let info = response.data;\n\n //checks if the API is returning a valid data in state,city,country.\n let errors = isValidData(info);\n setInfoError(errors);\n\n if (Object.keys(errors).length > 0) {\n let error_string = Object.keys(errors).toString();\n\n toast.error(`Could not find ${error_string}`, { autoClose: 2000 })\n }\n\n\n formik.setFieldValue(\"lat_lng\", info.lat_lng, false);\n formik.setFieldValue(\"website\", info.website, false);\n formik.setFieldValue(\"state\", info.state, false);\n formik.setFieldValue(\"country\", info.country, false);\n formik.setFieldValue(\"city\", info.city, false);\n\n setMiniLoader(false)\n } catch (err) {\n toast.error(`${err.message}`, {\n autoClose: 2000\n })\n }\n }\n }\n\n const getSubCategory = async (category) => {\n\n if (category && category.length) {\n const categoryIds = category.map(c => c.id)\n let info = JSON.parse(localStorage.getItem('user'))\n let token = info.token;\n const res = await FetchAPI(`/businesssubcategories/businesscategory?q=${JSON.stringify(categoryIds)}`, token);\n\n if (res.data && res.data.length) {\n const newArr = []\n res.data.forEach(el => {\n newArr.push(...el)\n })\n let uniqueArr = [...new Set(newArr)];\n set_sub_category(formatCategories(uniqueArr))\n }\n }\n }\n\n //fetches the prior applciation only if the status is pending\n function fetchApplication(params, token) {\n // let ID = JSON.parse(localStorage.getItem('user'));\n FetchAPI(`/temp-businesses/?user=${params.userID}`, token)\n .then((result) => {\n\n if (result.data.length > 0) {\n setMessage({\n type: \"alert-info\",\n message: \"Hang on tight! We are reviewing your application.\",\n });\n appendDataInForm(result.data);\n // getMyLocation()\n } else {\n setMessage({\n type: \"alert-primary\",\n message:\n \"Fill in your business details so that we can start with your application\",\n });\n setLoading(false);\n }\n }).catch((err) => {\n console.log(err);\n setLoading(false);\n });\n }\n\n //data gets appended in the form for the values so that formik can use it\n function appendDataInForm(data) {\n if (Array.isArray(data)) {\n\n savedValues.name = data[0].name;\n savedValues.buss_category = data[0].buss_category;\n savedValues.Buss_subcategory = data[0].Buss_subcategory;\n savedValues.about = data[0].about;\n savedValues.website = data[0].website;\n savedValues.phone = data[0].phone;\n savedValues.Address = data[0].Address;\n savedValues.GoogleRating = data[0].GoogleRating;\n savedValues.placeId = data[0].placeId;\n savedValues.city = data[0].city;\n savedValues.state = data[0].state;\n savedValues.country = data[0].country;\n savedValues.lat_lng = data[0].lat_lng;\n savedValues.email = data[0].email;\n savedValues.applicationId = data[0].id;\n savedValues.photos_url = data[0].photos_url;\n savedValues.photoId = data[0].photoId;\n savedValues.appClipUid = data[0]?.appClipUid;\n savedValues.reviewEnabled = data[0]?.reviewEnabled;\n savedValues.isPrivateStore = data[0]?.isPrivateStore;\n savedValues.hasPhysicalAddress = data[0]?.hasPhysicalAddress;\n\n setcheckImage(data[0]?.appClipUid)\n props.handleUrlScan(data[0]?.appClipUid)\n\n if (data[0].radius) {\n savedValues.radius = data[0].radius\n }\n\n\n // console.log(data[0].photoId,data[0].photos_url)\n\n //formats the business categgoryu that he has chosen.//refer utils for more info.\n let categories = getBusinessCategory(data[0].buss_category)\n let subCategories = getBusinessCategory(data[0].Buss_subcategory)\n\n // console.log(categories,subCategories);\n\n set_default_buss_category(categories)\n set_default_sub_category(subCategories)\n\n\n //have the look of the jSOn part, the open hours key has a Stringified array.\n //this peice of code splits the array into readable formats of the time.\n if (data[0].op_hours) {\n let openHours = JSON.parse(data[0].op_hours);\n\n openHours.forEach((time, index) => {\n\n let slots = time.split(\",\");\n // console.log(slots)\n\n //console.log(\"=-=-=-=-=-=-=-=-=-=-=-=--=-==--==--=\")\n let slot1 = slots[0].split(\"y\");\n slot1.shift()\n slot1 = slot1.toString().split(\"-\")\n let finalSlot1 = slot1.toString().substr(1);\n finalSlot1 = finalSlot1.split(\",\")\n\n\n\n savedValues.op_hours[index].start = finalSlot1[0].trim();\n savedValues.op_hours[index].end = finalSlot1[1].trim();\n\n\n if (slots.length > 1) {\n //console.log(slots)\n let finalSlot2 = slots[1].split(\"-\")\n savedValues.op_hours[index].start2 = finalSlot2[0].trim();\n savedValues.op_hours[index].end2 = finalSlot2[1].trim();\n }\n\n });\n\n\n }\n }\n setSaved(true);\n setLoading(false);\n }\n\n\n\n async function handleSubmit(value, event) {\n\n try {\n setButtonLoader(true);\n\n //tallies all the store in an array .\n let openHours = openHoursCreator(value.op_hours)\n\n //if the business is not being fetched from google, we fetch its co-oridnates from the Google Geocoding API\n if (cantFind) {\n let GeoCoding = await fetchCoordinates(value.Address + value.city + value.state + value.country)\n\n if (GeoCoding !== null) {\n value.lat_lng = `${GeoCoding.geometry.location.lat},${GeoCoding.geometry.location.lng}`;\n value.placeId = GeoCoding.place_id;\n }\n else {\n\n setMessage({ type: \"alert-danger\", message: \"Please Enter a valid address Below, we Could not verify the address.\" });\n\n setTimeout(() => {\n setMessage({ type: \"\", message: \"\" });\n }, 4000)\n\n setButtonLoader(false);\n return\n\n }\n\n //assings the business a new unique ID.\n // value.placeId = uniqid.time()\n }\n\n let ID = JSON.parse(localStorage.getItem(\"user\"));\n\n\n //calls a constructor function and creates an object\n const user = new Data(\n value.name,\n value.about,\n value.GoogleRating,\n ID.userID,\n value.website,\n value.city,\n JSON.stringify(openHours),\n value.country,\n value.photos_url,\n value.placeId,\n value.photoId,\n value.buss_category,\n value.Buss_subcategory,\n value.lat_lng,\n value.Address,\n value.phone,\n value.email,\n value.state,\n value.radius,\n value.appClipUid,\n value.reviewEnabled,\n value.isPrivateStore,\n value.hasPhysicalAddress\n )\n // if the applciation is already submitted, update will be made, if not submit will be made.\n if (!accepted) {\n //in this case only the ID will not be saved.\n if (!saved) {\n\n let applyStatus = await apply(user);\n if (applyStatus) {\n if (applyStatus.status === 0) {\n\t\t\t\t\t\t\ttoast.error(applyStatus.message, { autoClose: 2000 });\n\t\t\t\t\t\t\tsetButtonLoader(false);\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n setMessage({ type: \"alert-success\", message: \"Application Submitted Successfully\" });\n setButtonLoader(false);\n alertRef.current.scrollIntoView({ behaviour: \"smooth\" });\n value.applicationId = applyStatus.id;\n setBusinessId(applyStatus.id)\n setTimeout(() => history.push(\"/home\"), 1000)\n }\n setSaved(true)\n\n\n } else {\n\n let updateStatus = await update_application(user, value.applicationId);\n if (updateStatus) {\n setBusinessId(value.applicationId)\n setMessage({ type: \"alert-success fade show\", message: \"Your application has been updated\", });\n setTimeout(() => {\n setMessage({ type: \"\", message: \"\" });\n }, 4000)\n\n setButtonLoader(false);\n alertRef.current.scrollIntoView({ behaviour: \"smooth\" });\n }\n }\n } else {\n\n setButtonLoader(true)\n //updates in the business collection.\n let updateStatus = await UpdateBusiness(value.applicationId, user)\n\n //updates in the temp business collection.\n let updateStatusTemp = await update_application(user, value.applicationId);\n\n if (updateStatus) {\n toast.info('Profile updated', { autoClose: 2000 })\n setButtonLoader(false)\n\n }\n }\n\n } catch (error) {\n\n //this part remains in the valid UI message\n console.log(error)\n toast.error('Error in Performing Action', { autoClose: 2000 })\n setButtonLoader(false);\n\n }\n\n }\n\n\n async function fileUpload(e, formik) {\n // console.log(e.target.files)\n setUploader(true)\n //if there is a photo previously, dlete that photo and move add new .\n if (formik.values.photoId.length > 0 && formik.values.photos_url.length > 0) {\n await deleteImage(`/upload/files/${formik.values.photoId}`).catch(err => {\n })\n\n }\n\n\n const formData = new FormData();\n\n\n formData.append(\"files\", e.target.files[e.target.files.length - 1]);\n\n uploadImage(`/upload`, formData)\n .then((result) => {\n //check in the utils\n let op_hours = openHoursCreator(formik.initialValues.op_hours);\n\n //sets the formik values to latest fileds\n formik.setFieldValue(\"photos_url\", result.data[0].url);\n formik.setFieldValue(\"photoId\", result.data[0].id);\n\n\n //this piece of code here formats data hits an api which updates the buisinees ,photo url feilds without the help of clicking update button in the UI\n let data = UpdateProfilePic(result.data[0].url, result.data[0].id, JSON.stringify(op_hours), formik.initialValues.buss_category)\n\n // if there is new userr or if the business has not been appoved yet. Update in twbsiness collection or temp -Business collection and vice versa.\n if (formik.initialValues.applicationId.length > 0 && accepted) return update(`/twbusinesses/${formik.initialValues.applicationId}`, data)\n else if (formik.initialValues.applicationId.length > 0 && !accepted) return update(`/temp-businesses/${formik.initialValues.applicationId}`, data)\n\n }).then(updated => {\n if (updated) toast.info('Picture updated', {\n autoClose: 2000\n })\n //removes the content of the filelist.\n document.getElementById('up_file').value = []\n\n })\n .catch((err) => {\n toast.error(`${`There seems to be an error`}`, {\n autoClose: 2000\n })\n }).then(() => {\n //this part of code runs irrespective of whatever the promise resolves into.\n setUploader(false)\n })\n\n\n }\n\n function updateBusiness(id, data) {\n setButtonLoader(true);\n\n update(`/twbusinesses/${id}`, data)\n .then((result) => {\n // console.log(result);\n // setMessage({\n // type: \"alert-success fade show\",\n // message: \"Your profile is updated\",\n // });\n\n toast.info('Profile updated', {\n autoClose: 2000\n })\n\n alertRef.current.scrollIntoView({ behaviour: \"smooth\" });\n setButtonLoader(false);\n })\n .catch((err) => {\n console.log(err);\n\n setMessage({\n type: \"alert-danger fade show\",\n message: \"Error in updating profile\",\n });\n setButtonLoader(false);\n });\n }\n\n //fetches and formats them.\n async function fetchBusinessCategories(token) {\n try {\n\n\n //promise. all settled is used when we have to call multiple API which are not dependent on each other.\n\n // it returns a status of each and every API called with response of respective to resolve or reject.\n let status = await Promise.allSettled([\n FetchAPI(`/businesscategories`, token),\n // FetchAPI(`/businesssubcategories`, token)\n ])\n if (status[0].status === 'fulfilled' && status[0].value?.data?.length > 0) set_buss_category(formatCategories(status[0].value.data.map(el => ({ ...el, name: el.category }))))\n // if(status[1].status==='fulfilled'&&status[1].value?.data?.length>0) set_sub_category( formatCategories(status[1].value.data))\n\n\n // if(categories.data.data.length > 0) formatCategories(categories.data.data)\n\n // if(subcategories.data.data.length > 0) formatCategories(subcategories.data.data)\n\n\n\n\n } catch (error) {\n\n console.log(error)\n\n }\n\n finally {\n setMiniLoader(false)\n }\n\n\n }\n\n //deletes the proifle pic of the business.\n function deleteFile(formik) {\n setUploader(true);\n\n deleteImage(`/upload/files/${formik.values.photoId}`)\n .then((result) => {\n let op_hours = openHoursCreator(formik.initialValues.op_hours);\n let data = UpdateProfilePic('', '', JSON.stringify(op_hours), formik.initialValues.buss_category)\n\n if (formik.initialValues.applicationId.length > 0 && accepted) return update(`/twbusinesses/${formik.initialValues.applicationId}`, data)\n else if (formik.initialValues.applicationId.length > 0 && !accepted) return update(`/temp-businesses/${formik.initialValues.applicationId}`, data)\n\n }).then((updated) => {\n if (updated) console.log(updated, 'updated successfully')\n })\n .catch((err) => {\n\n console.log(err);\n\n\n }).then(() => {\n\n //does not matter if promise resolved or gets rejected, this part od then will always run.\n setUploader(false);\n formik.setFieldValue(\"photos_url\", \"\");\n formik.setFieldValue(\"photoId\", \"\");\n })\n }\n\n //toggles the form from Manual mode to automatic Mode.\n function toggleForm() {\n setCantFind(!cantFind)\n setInputText(!inputText)\n }\n\n const handleAppClipApi = (token) => {\n FetchAPI(`/app-clips`, token)\n .then((res) => {\n // console.log(\"res === \", res.data)\n let data = res?.data ? res?.data : []\n set_app_clip_data(data)\n })\n .catch((error) => {\n console.log(error);\n });\n }\n\n const handlecheckImage = (Uid, formik) => {\n formik.setFieldValue(\"appClipUid\", Uid)\n props.handleUrlScan(Uid)\n }\n\n return (\n <>\n {loading ?\n
\n Your categories and subcategories are displayed on your store front following the below order. Drag and drop categories to change their order, once updated your order will be reflected in your live store. Scan QR code to check.\n
.default})
\n .default})
\n .default})
*/}\n .default}){kind=icon}
\n \n .default})
\n