{this.props.children}
\n \n onSearchKey(e)}\n style={{ width: '100%' }}\n />\n
\n \n {`${startBmbIndex}-${endBmbIndex} of ${bmbTotalItems} `}\n \n \n {bmbSelectedPageSize}\n \n \n {bmbpageSizes.map((size, index) => {\n return (\n changeBmbPageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n \n \n Add to my Chatbot\n \n
\n )}\n \n onSearchKeyUserUploads(e)}\n style={{ width: '100%' }}\n />\n
\n \n \n {`${startUserIndex}-${endUserIndex} of ${userTotalItems} `}\n \n \n {userSelectedPageSize}\n \n \n {userpageSizes.map((size, index) => {\n return (\n changeUserPageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n \n \n Add to my Chatbot\n \n
)}\n Logo
\n\n \n \n \n \n \n \n
\n );\n};\n\nexport default TopnavEasyAccess;\n","\nimport { User } from \"@twilio/conversations\";\nimport moment from \"moment\";\nimport React, { useEffect, useState } from \"react\";\nimport { injectIntl } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { gAPI_Users_By_Id } from \"../../constants/APIs\";\nimport { getGroupID, AxiosAPI, getUserID } from \"../../helpers/AxiosAPI\";\n\nconst Intercom = ({ propertyId, email, locale }) => {\n useEffect(() => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Users_By_Id}/${getUserID()}?gid=${getGroupID()}`,\n })\n .then((res) => {\n if (res.data.userId !== undefined) {\n res.data.loginDate = moment().date() + moment().month() + moment().year();\n window.parent.postMessage(res.data, \"*\");\n }\n });\n });\n const windowMessage = () => {\n\n }\n return (\n Switch to
\n\n handleAivaRedirect(getGroupID())} className='aiva-item' alt=\"\"/>\n
\n {/* {showFrame && \n
\n );\n}\nconst mapStateToProps = ({ settings }) => {\n\n const {\n locale,\n propertyId,\n\n\n email,\n\n } = settings;\n\n return {\n\n locale,\n\n propertyId,\n\n email,\n\n };\n};\n\nconst mapActionsToProps = {};\n\nconst aap = injectIntl(Intercom);\nexport default connect(mapStateToProps, mapActionsToProps)(aap);\n","import React, { Component, Fragment } from 'react';\nimport { injectIntl } from 'react-intl';\nimport aiva_logo from \"./../../assets/aiva_logo_large.jpg\";\nimport {\n UncontrolledDropdown,\n DropdownItem,\n DropdownToggle,\n DropdownMenu,\n Modal,\n Button,\n ModalBody,\n ModalFooter,\n Spinner,\n} from 'reactstrap';\nimport { BusinessProfile } from '../pages/BussinessProfile';\nimport Select from 'react-select';\nimport { NavLink } from 'react-router-dom';\nimport { connect } from 'react-redux';\nimport {\n AxiosAPI,\n getGroupID,\n AxiosStripeAPI,\n getUserID,\n AxiosPublicAPI,\n} from '../../helpers/AxiosAPI';\nimport {\n gAPI_Subscription_By_Group_Id,\n gAPI_BotConversations_list,\n gAPI_AgentConversations_list,\n gAPI_Group_By_Id,\n gAPI_Users_LinkedGrups_By_Id,\n gAPI_Users_LinkedProperties_By_Id,\n putAPI_AgentStatus,\n putAPI_UpdateAgentStatus_By_Id,\n} from '../../constants/APIs';\nimport { reactSelectProperties } from '../../helpers/Utils';\nimport {\n setContainerClassnames,\n clickOnMobileMenu,\n logoutUser,\n changeLocale,\n changeProperty,\n getPropertyList,\n changeTimeZone,\n changeCurrency,\n ConnectUser,\n Changecloudbeds,\n} from '../../redux/actions';\nimport {\n menuHiddenBreakpoint,\n searchPath,\n localeOptions,\n} from '../../constants/defaultValues';\nimport timeZoneList from '../../data/timeZoneList';\nimport { MobileMenuIcon, MenuIcon } from '../../components/svg';\nimport { getDirection, setDirection } from '../../helpers/Utils';\nimport Navbar from 'reactstrap/lib/Navbar';\nimport ModalHeader from 'reactstrap/lib/ModalHeader';\nimport Switch from 'rc-switch';\nimport 'rc-switch/assets/index.css';\nimport TopnavEasyAccess from './Topnav.EasyAccess';\nimport { faHandsHelping } from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport Intercom from './Intercom';\n\nclass TopNav extends Component {\n constructor(props) {\n super(props);\n\n this.state = {\n isInFullScreen: false,\n searchKeyword: '',\n hotel: { value: '-1', label: 'All' },\n hotelName: 'All',\n propertyList: [],\n stripeCustomerId: '',\n showTwilioConversationList: false,\n showBotConversationOn: false,\n showAgentConversation: false,\n botConversationList: [],\n agentConversationList: [],\n groupsList: [],\n propertiesList: [],\n websiteLink: '',\n rooms: 0,\n starRating: 0,\n bussinessProfileVisible: false,\n type: '',\n groupName: '',\n NotificationTitle: '',\n showLinkedGroups: false,\n loading: false,\n chatInvitations: [],\n showAgentStatus: false,\n agentStatus: false,\n aboutProperty: false,\n propertyList: this.props.plist\n\n };\n this.audio = new Audio(\n 'https://bmbuiassetsprod.blob.core.windows.net/images/chat1.mp3'\n );\n }\n\n componentWillReceiveProps(props) {\n // if (props.signalRConnection.newConnection !== undefined) {\n // console.log(\n // 'props.signalRConnection.newConnection.connection',\n // props.signalRConnection.newConnection.connection._connectionState\n // );\n // }\n if (\n props.signalRConnection.newConnection !== undefined &&\n this.props.signalRConnection.newConnection === undefined\n ) {\n // props.signalRConnection.newConnection.connection.on(\n // 'newConnection',\n // (m) => {\n console.log('****** newConnection ******');\n const user = this.props.userData;\n const userProperties = [];\n if (user.properties.length > 0) {\n if (user.properties[0] === '-1') {\n this.props.plist.forEach((p) => {\n userProperties.push(p.id);\n });\n } else {\n user.properties.forEach((p) => {\n userProperties.push(p);\n });\n }\n }\n\n // AxiosPublicAPI({\n // method: 'post',\n // url: `${process.env.REACT_APP_SIGNALR}/api/AddToGroup`,\n // data: {\n // connectionId: m,\n // recipient: getUserID(),\n // groupname: userProperties,\n // },\n // }).then((resp) => {});\n // }\n //);\n\n props.signalRConnection.newConnection.connection\n .invoke('SendMessage', {\n recipient: getUserID(),\n groupname: userProperties,\n })\n .catch(function (err) {\n console.error(err.toString());\n });\n\n props.signalRConnection.newConnection.connection.on(\n 'newChatUserMessage',\n (message) => {\n if (message.Source === 'Visitor' && message.AgentId === getUserID()) {\n this.handleNotificationPopup(message.Content.messages[0]);\n this.audio.play();\n this.setState({ showAgentConversation: true });\n }\n }\n );\n\n props.signalRConnection.newConnection.connection.on(\n 'newChat',\n (message) => {\n this.audio.play();\n this.setState({ showBotConversationOn: true });\n }\n );\n\n props.signalRConnection.newConnection.connection.on(\n 'newAgentChat',\n (message) => {\n if (this.state.agentStatus) {\n AxiosAPI({\n method: 'put',\n url: `${putAPI_UpdateAgentStatus_By_Id}/${message}`,\n data: {\n groupId: getGroupID(),\n userId: getUserID(),\n status: 'RequestReceived',\n },\n });\n\n const checkConversations = this.state.chatInvitations.filter(\n (m) => m === message\n );\n if (checkConversations.length === 0) {\n this.handleNotificationPopup('New chat request arrived');\n this.setState({\n chatInvitations: [message, ...this.state.chatInvitations],\n });\n this.audio.play();\n this.setState({ showAgentConversation: true });\n }\n }\n }\n );\n }\n }\n acceptChat(id) {\n console.log(id);\n var array = [...this.state.chatInvitations]; // make a separate copy of the array\n var index = array.indexOf(id);\n if (index !== -1) {\n array.splice(index, 1);\n this.setState({ chatInvitations: array });\n }\n //this.props.history.push('/app/pages/conversations/active');\n this.props.history.push({\n pathname: '/app/pages/conversations/active',\n state: { incomingchatId: id },\n });\n }\n componentDidMount() {\n if (this.props.userRole != undefined && this.props.userRole === 'View') {\n setTimeout(() => {\n var event = document.createEvent('HTMLEvents');\n event.initEvent('resize', false, false);\n window.dispatchEvent(event);\n }, 350);\n this.props.setContainerClassnames(\n ++this.state.menuClickCount,\n this.state.containerClassnames,\n this.props.selectedMenuHasSubItems\n );\n }\n\n if (window.location.href.includes(\"/app/pages/tokens\") === false && window.location.href.includes(\"/app/pages/cloudbeds\") === false && this.props.cloudBedsCode !== undefined && this.props.cloudBedsCode != '') {\n //localStorage.removeItem(\"cloudbeds\"); \n window.location.href = \"/app/pages/tokens\" + this.props.cloudBedsCode;\n }\n this.setHotelName(this.props.pid);\n this.setNotification();\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Subscription_By_Group_Id}?groupid=${getGroupID()}`,\n }).then((subscriptionResponse) => {\n if (\n subscriptionResponse.data.stripeCustomerId === null ||\n subscriptionResponse.data.stripeCustomerId === ''\n ) {\n } else {\n this.setState({\n stripeCustomerId: subscriptionResponse.data.stripeCustomerId,\n });\n }\n });\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Users_LinkedGrups_By_Id}?id=${getUserID()}&bmb=false&aiva=true`,\n }).then((gresponse) => {\n this.setState({ groupsList: gresponse.data });\n });\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Users_LinkedProperties_By_Id}?id=${getUserID()}&bmb=true&aiva=true`,\n }).then((response) => {\n this.setState({ propertiesList: response.data });\n console.log(response.data.filter((f) => f.groupId === getGroupID() && f.id === this.props.propertyId));\n });\n\n }\n\n RefreshConversations = () => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_BotConversations_list}?gid=${getGroupID()}&pid=${this.props.pid\n }`,\n }).then((botresponse) => {\n // console.log(botresponse.data)\n if (botresponse.data.length > 0) {\n // console.log(this.state.botConversationList)\n // this.setState({ botConversationList: [...this.state.botConversationList, ...botresponse.data] })\n // this.setState({ showBotConversationOn: true })\n\n //if (this.state.showBotConversationOn === false) {\n this.audio.play();\n //}\n this.setState({ showBotConversationOn: true });\n botresponse.data.map((element, index) => {\n this.handleNotificationPopup(element.message);\n });\n } else {\n // this.setState({ showBotConversationOn: false })\n }\n });\n\n AxiosAPI({\n method: 'get',\n url: `${gAPI_AgentConversations_list}?gid=${getGroupID()}&pid=${this.props.pid\n }`,\n }).then((botresponse) => {\n //console.log(botresponse.data)\n this.setState({\n agentConversationList: [\n ...this.state.botConversationList,\n ...botresponse.data,\n ],\n });\n if (botresponse.data.length > 0) {\n // if (this.state.showAgentConversation === false) {\n this.audio.play();\n // }\n botresponse.data.map((element, index) => {\n this.handleNotificationPopup(element.message);\n });\n this.setState({ showAgentConversation: true });\n } else {\n // this.setState({ showAgentConversation: false })\n }\n });\n };\n\n setHotelName = (id) => {\n //console.log(this.props.plist)\n const hotel = this.props.plist.find((elem) => {\n return elem.id === id;\n });\n if (hotel) {\n // console.log(hotel);\n const name = hotel.name;\n const websiteLink = hotel.websiteLink;\n const rooms = hotel.rooms;\n const starRating = hotel.starRating;\n const type = hotel.type;\n const groupName = hotel.groupName;\n this.props.changeProperty(id);\n this.props.changeCurrency(hotel.currency);\n this.props.changeTimeZone(hotel.timeZone);\n this.setState({\n hotelName: name,\n websiteLink: websiteLink,\n rooms: rooms,\n starRating: starRating,\n type: type,\n groupName: groupName,\n });\n } else {\n console.log('not found');\n // this.props.changeProperty(this.state.propertyList[0].id);\n // this.setState({ hotelName: this.state.propertyList[0].name });\n }\n };\n\n handleChangeLocale = (locale, direction) => {\n this.props.changeLocale(locale);\n\n // const currentDirection = getDirection().direction;\n // if (direction !== currentDirection) {\n // setDirection(direction);\n setTimeout(() => {\n window.location.reload();\n }, 500);\n //}\n };\n\n toggleBussinessPopup = (e) => {\n e.preventDefault();\n this.setState({\n bussinessProfileVisible: !this.state.bussinessProfileVisible,\n });\n }\n\n toggleUserNotifications = (e) => {\n e.preventDefault();\n window.location.href = '/app/pages/admin';\n }\n handleChangePropertyID = (propertyId, timeZone, currency) => {\n this.props.changeProperty(propertyId);\n this.props.changeTimeZone(timeZone);\n this.props.changeCurrency(currency);\n setTimeout(() => {\n window.location.reload();\n }, 500);\n };\n handleChangeSelect = (e) => {\n this.setState({ loading: true });\n const groupId = e.value.split('|').length > 0 ? e.value.split('|')[0] : e.value;\n if (e.value.split('|').length >= 1) {\n changeProperty(e.value.split('|')[1]);\n }\n const AUTHORITY_SERVER = process.env.REACT_APP_AUTHORITY_SERVER;\n window.location.href = `${AUTHORITY_SERVER}/Aiva/SwitchGroup/${getUserID()}?groupId=${groupId}`;\n };\n handleBMBRedirect = () => {\n this.setState({ loading: true });\n const AUTHORITY_SERVER = process.env.REACT_APP_AUTHORITY_SERVER;\n window.location.href = `${AUTHORITY_SERVER}/Account/SwitchGroup/${getUserID()}?groupId=${getGroupID()}`;\n };\n handleChangePropertyIDAll = () => {\n this.props.changeProperty('-1');\n // AxiosAPI({\n // method: 'get',\n // url: `${gAPI_Group_By_Id}/${getGroupID()}`,\n // })\n // .then(res => {\n // console.log(res.data)\n // let timeZones = timeZoneList.filter(item => item.IsoAlpha2 === res.data.country);\n // if (timeZones.length > 0) {\n // this.props.changeTimeZone(timeZones[0].TimeZones[0]);\n // this.props.changeCurrency(res.data.currency);\n // // setTimeout(() => {\n // // window.location.reload();\n // // }, 500);\n // }\n // });\n this.props.changeTimeZone('Etc/GMT');\n this.props.changeCurrency('');\n setTimeout(() => {\n window.location.reload();\n }, 500);\n };\n\n isInFullScreen = () => {\n return (\n (document.fullscreenElement && document.fullscreenElement !== null) ||\n (document.webkitFullscreenElement &&\n document.webkitFullscreenElement !== null) ||\n (document.mozFullScreenElement &&\n document.mozFullScreenElement !== null) ||\n (document.msFullscreenElement && document.msFullscreenElement !== null)\n );\n };\n handleSearchIconClick = (e) => {\n if (window.innerWidth < menuHiddenBreakpoint) {\n let elem = e.target;\n if (!e.target.classList.contains('search')) {\n if (e.target.parentElement.classList.contains('search')) {\n elem = e.target.parentElement;\n } else if (\n e.target.parentElement.parentElement.classList.contains('search')\n ) {\n elem = e.target.parentElement.parentElement;\n }\n }\n\n if (elem.classList.contains('mobile-view')) {\n this.search();\n elem.classList.remove('mobile-view');\n this.removeEventsSearch();\n } else {\n elem.classList.add('mobile-view');\n this.addEventsSearch();\n }\n } else {\n this.search();\n }\n };\n addEventsSearch = () => {\n document.addEventListener('click', this.handleDocumentClickSearch, true);\n };\n removeEventsSearch = () => {\n document.removeEventListener('click', this.handleDocumentClickSearch, true);\n };\n\n handleDocumentClickSearch = (e) => {\n let isSearchClick = false;\n if (\n e.target &&\n e.target.classList &&\n (e.target.classList.contains('navbar') ||\n e.target.classList.contains('simple-icon-magnifier'))\n ) {\n isSearchClick = true;\n if (e.target.classList.contains('simple-icon-magnifier')) {\n this.search();\n }\n } else if (\n e.target.parentElement &&\n e.target.parentElement.classList &&\n e.target.parentElement.classList.contains('search')\n ) {\n isSearchClick = true;\n }\n\n if (!isSearchClick) {\n const input = document.querySelector('.mobile-view');\n if (input && input.classList) input.classList.remove('mobile-view');\n this.removeEventsSearch();\n this.setState({\n searchKeyword: '',\n });\n }\n };\n handleSearchInputChange = (e) => {\n this.setState({\n searchKeyword: e.target.value,\n });\n };\n handleSearchInputKeyPress = (e) => {\n if (e.key === 'Enter') {\n this.search();\n }\n };\n\n handleAgentConversationClick = (e) => {\n this.setState({ showAgentConversation: false });\n // this.setState({\n // showTwilioConversationList: true,\n // });\n this.props.history.push('/app/pages/conversations/active');\n };\n\n search = () => {\n this.props.history.push(searchPath + '/' + this.state.searchKeyword);\n this.setState({\n searchKeyword: '',\n });\n };\n\n toggleSwitchAccount = () => {\n this.setState({\n showLinkedGroups: !this.state.showLinkedGroups,\n });\n };\n\n twilioStartChat = () => {\n this.setState({\n showTwilioConversationList: true,\n });\n };\n\n toggleFullScreen = () => {\n const isInFullScreen = this.isInFullScreen();\n\n var docElm = document.documentElement;\n if (!isInFullScreen) {\n if (docElm.requestFullscreen) {\n docElm.requestFullscreen();\n } else if (docElm.mozRequestFullScreen) {\n docElm.mozRequestFullScreen();\n } else if (docElm.webkitRequestFullScreen) {\n docElm.webkitRequestFullScreen();\n } else if (docElm.msRequestFullscreen) {\n docElm.msRequestFullscreen();\n }\n } else {\n if (document.exitFullscreen) {\n document.exitFullscreen();\n } else if (document.webkitExitFullscreen) {\n document.webkitExitFullscreen();\n } else if (document.mozCancelFullScreen) {\n document.mozCancelFullScreen();\n } else if (document.msExitFullscreen) {\n document.msExitFullscreen();\n }\n }\n this.setState({\n isInFullScreen: !isInFullScreen,\n });\n };\n\n handleChangePassword = () => {\n this.props.history.push('/app/pages/users/change-password');\n };\n\n handleChangePin = () => {\n this.props.history.push('/app/pages/users/change-pin');\n };\n\n onSearchKey = (e) => {\n var serachtext = e.target.value.toLowerCase();\n var resdata = this.props.plist.filter(a => a.name.toLowerCase().includes(serachtext));\n this.setState({ propertyList: resdata });\n };\n\n handleSubscription = () => {\n this.props.history.push('/app/pages/billing/subscription');\n };\n\n handleLatestBotConversation = () => {\n this.setState({ showBotConversationOn: false });\n this.props.history.push('/app/pages/conversations/active');\n };\n\n handleInvoices = () => {\n this.StripeCustmerPortal(this.state.stripeCustomerId);\n };\n\n StripeCustmerPortal = (customerID) => {\n var qs = require('qs');\n var data = qs.stringify({\n customer: customerID,\n return_url: window.location.href,\n });\n AxiosStripeAPI({\n method: 'post',\n url: `v1/billing_portal/sessions`,\n data: data,\n }).then((stripeResponse) => {\n window.open(\n stripeResponse.data.url,\n '_blank' // <- This is what makes it open in a new window.\n );\n });\n };\n\n handleLogout = (e) => {\n this.props.Changecloudbeds('');\n // this.props.logoutUser(this.props.history);\n e.preventDefault();\n const AUTHORITY_SERVER = process.env.REACT_APP_AUTHORITY_SERVER;\n let id_token = JSON.parse(\n sessionStorage.getItem(\n `oidc.user:${AUTHORITY_SERVER}:${process.env.REACT_APP_IDENTITY_SERVER_CLIENT_APP_ID}`\n )\n ).id_token;\n //this.props.history.push(`${AUTHORITY_SERVER}/Account/Logout?logoutId=${id_token}`)\n window.location.href = `${AUTHORITY_SERVER}/Aiva/Logout?logoutId=${id_token}`;\n // userManager.signoutRedirect();\n // userManager.removeUser();\n };\n\n handlePrivacy = (e) => {\n e.preventDefault();\n window.open('https://www.myma.ai/privacy-policy');\n };\n\n handleHelpCenter=(e)=>{\n e.preventDefault();\n window.open('https://help.myma.ai/en/collections/5437506-aiva-ai-voucher-e-gift-solution', '_blank');\n }\n\n handleWebsiteLink = (e) => {\n e.preventDefault();\n window.open(this.state.websiteLink);\n };\n menuButtonClick = (e, menuClickCount, containerClassnames) => {\n e.preventDefault();\n\n setTimeout(() => {\n var event = document.createEvent('HTMLEvents');\n event.initEvent('resize', false, false);\n window.dispatchEvent(event);\n }, 350);\n this.props.setContainerClassnames(\n ++menuClickCount,\n containerClassnames,\n this.props.selectedMenuHasSubItems\n );\n };\n mobileMenuButtonClick = (e, containerClassnames) => {\n e.preventDefault();\n this.props.clickOnMobileMenu(containerClassnames);\n };\n\n setNotification = () => {\n if (!('Notification' in window)) {\n console.log('This browser does not support desktop notification');\n } else if (Notification.permission === 'granted') {\n this.setState({ NotificationTitle: '' });\n } else {\n this.setState({ NotificationTitle: 'Allow Notification' });\n }\n };\n handleNotificationPopup = (msg) => {\n if (!('Notification' in window)) {\n console.log('This browser does not support desktop notification');\n } else if (Notification.permission === 'granted') {\n this.setState({ NotificationTitle: '' });\n //var notification = new Notification(msg);\n var img =\n 'https://bmbuiassetsprod.blob.core.windows.net/images/newlogo.png';\n var notification = new Notification('Book Me Bob', {\n body: msg,\n icon: img,\n });\n notification.onclick = function (x) {\n window.focus();\n window.location.href = '/app/pages/conversations/active';\n this.close();\n };\n setTimeout(notification.close(), 1 * 1000);\n } else if (\n Notification.permission === 'denied' ||\n Notification.permission === 'default'\n ) {\n Notification.requestPermission(function (permission) {\n if (permission === 'granted') {\n var img =\n 'https://bmbuiassetsprod.blob.core.windows.net/images/newlogo.png';\n var notification = new Notification('Aiva', {\n body: msg,\n icon: img,\n });\n notification.onclick = function (x) {\n window.focus();\n window.location.href = '/app/pages/conversations/active';\n this.close();\n };\n setTimeout(notification.close(), 1 * 1000);\n } else {\n Notification.requestPermission(function (per) {\n console.log(per);\n });\n }\n });\n }\n };\n handleAllowNotification = () => {\n if (!('Notification' in window)) {\n console.log('This browser does not support desktop notification');\n } else {\n Notification.requestPermission().then(function (permission) {\n console.log(permission);\n });\n console.log(Notification.permission);\n this.setState({ NotificationTitle: '' });\n }\n };\n handleSwitchChange = (value) => {\n console.log(value);\n AxiosAPI({\n method: 'put',\n url: `${putAPI_AgentStatus}/${getUserID()}/agent-status`,\n data: { status: value },\n }).then((subscriptionResponse) => {\n console.log('Status changed');\n });\n this.setState({ agentStatus: value });\n };\n rejectChat = (id) => {\n var array = [...this.state.chatInvitations]; // make a separate copy of the array\n var index = array.indexOf(id);\n if (index !== -1) {\n array.splice(index, 1);\n this.setState({ chatInvitations: array });\n }\n };\n\n redirectToRedeemVouchers=()=>{ \n window.location.href =\"/app/pages/redeemVouchers\";\n }\n render() {\n const {\n containerClassnames,\n menuClickCount,\n locale,\n user,\n usersListApp: { properties },\n role,\n signalRConnection,\n } = this.props;\n\n let GROUP_ID = JSON.parse(\n sessionStorage.getItem(\n `oidc.user:${process.env.REACT_APP_AUTHORITY_SERVER}:${process.env.REACT_APP_IDENTITY_SERVER_CLIENT_APP_ID}`\n )\n ).profile.nickname;\n const { messages } = this.props.intl;\n \n return (\n \n \n
} */}\n \n
\n ) : (\n Your request is in progress
\n\n
\n ))}\n \n \n - \n {this.state.chatInvitations.map((person, i) => (\n
\n
\n \n this.rejectChat(person)}\n >\n x\n
\n \n
\n \n
\n \n User requested to chat with the agent. Please click\n accept to connect to conversation or click cancel to\n close the request{' '}\n
\n\n
\n this.setState({showModal:false})}\n size=\"lg\"\n style={{ maxWidth: '1024px' }}\n >\n this.setState({showModal:false})}> \n \n \n \n
\n }\n \n
\n \n \n \n \n \n
\n \n this.setState({showModal:true})}\n >What's New\n \n
\n \n
\n \n \n {menuItems &&\n menuItems.map((item) => {\n return (\n \n {item.subs &&\n item.subs.map((sub, index) => {\n if (\n this.checkMenuAccess(sub.domains, sub.type) === true\n )\n return (\n \n {sub.newWindow ? (\n \n {' '}\n \n \n {' '}\n \n \n );\n }\n )}\n \n \n \n ) : (\n \n {' '}\n \n )}\n \n );\n })}\n \n );\n })} \n \n
\n 700? \"\" : \"menu-mobile\"}\"menu-sub-hidden main-hidden sub-hidden\"`}> {this.state.renderNav ? (\n \n \n ) : (\n \n \n \n )}\n \n \n
:\n \n \n
\n 700? containerClassnames : \"menu-mobile \" + containerClassnames}>\n {this.state.renderNav ? (\n \n \n ) : (\n \n \n \n )}\n \n \n
\n }\n \n \n
\n {this.props.children}
\n \n \n \n \n \n \n
\n );\n};\n\nexport default IconCard;\n","const data = [\n { title: 'dashboards.pending-orders', icon: \"iconsminds-clock\", value: 14 },\n { title: 'dashboards.completed-orders', icon: \"iconsminds-basket-coins\", value: 32 },\n { title: 'dashboards.refund-requests', icon: \"iconsminds-arrow-refresh\", value: 74 },\n { title: 'dashboards.new-comments', icon: \"iconsminds-mail-read\", value: 25 }\n ]\n export default data\n ","import React from 'react';\nimport PropTypes from 'prop-types';\nimport Glide from '@glidejs/glide';\nimport { getDirection } from '../../helpers/Utils';\nimport '@glidejs/glide/dist/css/glide.core.min.css';\n\nlet resizeTimeOut = -1;\nlet mountTimeOut = -1;\n\nexport default class GlideComponent extends React.Component {\n static propTypes = {\n settings: PropTypes.shape({\n type: PropTypes.string,\n startAt: PropTypes.number,\n perView: PropTypes.number,\n focusAt: PropTypes.oneOf([PropTypes.number, PropTypes.string]),\n gap: PropTypes.number,\n autoplay: PropTypes.bool,\n hoverpause: PropTypes.bool,\n keyboard: PropTypes.bool,\n bound: PropTypes.bool,\n swipeThreshold: PropTypes.oneOf([PropTypes.number, PropTypes.bool]),\n dragThreshold: PropTypes.oneOf([PropTypes.number, PropTypes.bool]),\n perTouch: PropTypes.oneOf([PropTypes.number, PropTypes.bool]),\n touchRatio: PropTypes.number,\n touchAngle: PropTypes.number,\n animationDuration: PropTypes.number,\n rewind: PropTypes.bool,\n rewindDuration: PropTypes.number,\n animationTimingFunc: PropTypes.string,\n direction: PropTypes.string,\n peek: PropTypes.object,\n breakpoints: PropTypes.object,\n classes: PropTypes.object,\n throttle: PropTypes.number,\n }),\n id: PropTypes.string,\n className: PropTypes.string,\n };\n\n constructor(props) {\n super(props);\n this.onResize = this.onResize.bind(this);\n this.renderDots = this.renderDots.bind(this);\n this.state = {\n total: React.Children.count(this.props.children),\n };\n }\n\n componentDidMount() {\n this.glideCarousel = new Glide(this.carousel, {\n ...this.props.settings,\n direction: getDirection().direction,\n });\n this.glideCarousel.mount();\n mountTimeOut = setTimeout(() => {\n var event = document.createEvent('HTMLEvents');\n event.initEvent('resize', false, false);\n window.dispatchEvent(event);\n this.glideCarousel.on('resize', this.onResize);\n }, 500);\n }\n\n componentWillUnmount() {\n clearTimeout(resizeTimeOut);\n clearTimeout(mountTimeOut);\n this.glideCarousel.destroy();\n }\n\n onResize() {\n clearTimeout(resizeTimeOut);\n resizeTimeOut = setTimeout(() => {\n this.glideCarousel.update();\n resizeTimeOut = -1;\n }, 500);\n }\n\n renderDots() {\n let dots = [];\n for (let i = 0; i < this.state.total; i++) {\n dots.push(\n \n
{value}
\n\n
\n \n );\n }\n}\n","import React from \"react\";\nimport IconCard from \"../../components/cards/IconCard\";\nimport data from \"../../data/iconCards\";\nimport GlideComponent from \"../../components/carousel/GlideComponent\";\n\nconst IconCardsCarousel = ({className=\"icon-cards-row\"}) => {\n\n return (\n (this.carousel = node)}>\n \"\n >\n \n \n
\n )}\n \n
\n {!this.props.settings.hideNav && (\n {this.props.children}
\n \n \n \n \n\n \n {this.renderDots()}\n
\n\n \n \n {data.map((item, index) => {\n return (\n \n\n\n
\n );\n};\nexport default IconCardsCarousel;\n","const produtcs = [\n {\n id: 1,\n title: 'Marble Cake',\n img: '/assets/img/marble-cake-thumb.jpg',\n category: 'Cakes',\n createDate: '02.04.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Wedding cake with flowers Macarons and blueberries',\n sales: 1647,\n stock: 62\n },\n {\n id: 2,\n title: 'Fat Rascal',\n category: 'Cupcakes',\n img: '/assets/img/fat-rascal-thumb.jpg',\n createDate: '01.04.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Cheesecake with chocolate cookies and Cream biscuits',\n sales: 1240,\n stock: 48\n },\n {\n id: 3,\n title: 'Chocolate Cake',\n img: '/assets/img/chocolate-cake-thumb.jpg',\n category: 'Cakes',\n createDate: '25.03.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Homemade cheesecake with fresh berries and mint',\n sales: 1080,\n stock: 57\n },\n {\n id: 4,\n title: 'Goose Breast',\n img: '/assets/img/goose-breast-thumb.jpg',\n category: 'Cakes',\n createDate: '21.03.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Chocolate cake with berries',\n sales: 1014,\n stock: 41\n },\n {\n id: 5,\n title: 'Petit Gâteau',\n category: 'Cupcakes',\n img: '/assets/img/petit-gateau-thumb.jpg',\n createDate: '02.06.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Chocolate cake with mascarpone',\n sales: 985,\n stock: 23\n },\n {\n id: 6,\n title: 'Salzburger Nockerl',\n img: '/assets/img/salzburger-nockerl-thumb.jpg',\n category: 'Desserts',\n createDate: '14.07.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Wedding cake decorated with donuts and wild berries',\n sales: 962,\n stock: 34\n },\n {\n id: 7,\n title: 'Napoleonshat',\n img: '/assets/img/napoleonshat-thumb.jpg',\n category: 'Desserts',\n createDate: '05.02.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Cheesecake with fresh berries and mint for dessert',\n sales: 921,\n stock: 31\n },\n {\n id: 8,\n title: 'Cheesecake',\n img: '/assets/img/cheesecake-thumb.jpg',\n category: 'Cakes',\n createDate: '18.08.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Delicious vegan chocolate cake',\n sales: 887,\n stock: 21\n },\n {\n id: 9,\n title: 'Financier',\n img: '/assets/img/financier-thumb.jpg',\n category: 'Cakes',\n createDate: '15.03.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description:\n 'White chocolate strawberry yogurt cake decorated with fresh fruits and chocolate',\n sales: 865,\n stock: 53\n },\n {\n id: 10,\n title: 'Genoise',\n img: '/assets/img/genoise-thumb.jpg',\n category: 'Cupcakes',\n createDate: '11.06.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Christmas fruit cake, pudding on top',\n sales: 824,\n stock: 55\n },\n {\n id: 11,\n title: 'Gingerbread',\n img: '/assets/img/gingerbread-thumb.jpg',\n category: 'Cakes',\n createDate: '10.04.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Wedding cake decorated with donuts and wild berries',\n sales: 714,\n stock: 12\n },\n {\n id: 12,\n title: 'Magdalena',\n img: '/assets/img/magdalena-thumb.jpg',\n category: 'Cakes',\n createDate: '22.07.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Christmas fruit cake, pudding on top',\n sales: 702,\n stock: 14\n },\n {\n id: 13,\n title: 'Parkin',\n img: '/assets/img/parkin-thumb.jpg',\n category: 'Cakes',\n createDate: '22.08.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description:\n 'White chocolate strawberry yogurt cake decorated with fresh fruits and chocolate',\n sales: 689,\n stock: 78\n },\n {\n id: 14,\n title: 'Streuselkuchen',\n img: '/assets/img/streuselkuchen-thumb.jpg',\n category: 'Cakes',\n createDate: '22.07.2018',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Delicious vegan chocolate cake',\n sales: 645,\n stock: 55\n },\n {\n id: 15,\n title: 'Tea loaf',\n img: '/assets/img/tea-loaf-thumb.jpg',\n category: 'Cakes',\n createDate: '10.09.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Cheesecake with fresh berries and mint for dessert',\n sales: 632,\n stock: 20\n },\n {\n id: 16,\n title: 'Merveilleux',\n img: '/assets/img/merveilleux-thumb.jpg',\n category: 'Cakes',\n createDate: '18.02.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Chocolate cake with mascarpone',\n sales: 621,\n stock: 6\n },\n {\n id: 17,\n title: 'Fruitcake',\n img: '/assets/img/fruitcake-thumb.jpg',\n category: 'Cakes',\n createDate: '12.01.2019',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Chocolate cake with berries',\n sales: 595,\n stock: 17\n },\n {\n id: 18,\n title: 'Bebinca',\n img: '/assets/img/bebinca-thumb.jpg',\n category: 'Cakes',\n createDate: '04.02.2019',\n status: 'PROCESSED',\n statusColor: 'secondary',\n description: 'Homemade cheesecake with fresh berries and mint',\n sales: 574,\n stock: 16\n },\n {\n id: 19,\n title: 'Cremeschnitte',\n img: '/assets/img/cremeschnitte-thumb.jpg',\n category: 'Desserts',\n createDate: '04.03.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Cheesecake with chocolate cookies and Cream biscuits',\n sales: 562,\n stock: 9\n },\n {\n id: 20,\n title: 'Soufflé',\n img: '/assets/img/souffle-thumb.jpg',\n category: 'Cupcakes',\n createDate: '16.01.2018',\n status: 'ON HOLD',\n statusColor: 'primary',\n description: 'Wedding cake with flowers Macarons and blueberries',\n sales: 524,\n stock: 14\n }\n]\n\nexport default produtcs\n","import React from \"react\";\nimport { NavLink } from \"react-router-dom\";\nimport PerfectScrollbar from \"react-perfect-scrollbar\";\nimport { Card, CardBody, CardTitle, Badge } from \"reactstrap\";\n\nimport IntlMessages from \"../../helpers/IntlMessages\";\nimport data from \"../../data/products\";\n\nexport default function RecentOrders() {\n return (\n \n \n
\n );\n })}\n \n \n
\n \n \n {data.slice(0, 6).map((order, index) => {\n return (\n
\n \n \n \n {order.status}\n \n \n\n
\n );\n })}\n \n \n \n \n
\n {order.title}
\n\n
\n \n {order.description}\n
\n\n {order.createDate}\n
\n \n \n \n \n \n \n \n
\n );\n};\nexport default Logs;\n","const tickets = [\n {\n title: 'Mayra Sibley',\n detail: '09.08.2018 - 12:45',\n thumb: '/assets/img/profile-pic-l.jpg'\n },\n {\n title: 'Mimi Carreira',\n detail: '05.08.2018 - 10:20',\n thumb: '/assets/img/profile-pic-l-2.jpg'\n },\n {\n title: 'Philip Nelms',\n detail: '05.08.2018 - 09:12',\n thumb: '/assets/img/profile-pic-l-3.jpg'\n },\n {\n title: 'Terese Threadgill',\n detail: '01.08.2018 - 18:20',\n thumb: '/assets/img/profile-pic-l-4.jpg'\n },\n {\n title: 'Kathryn Mengel',\n detail: '27.07.2018 - 11:45',\n thumb: '/assets/img/profile-pic-l-5.jpg'\n },\n {\n title: 'Esperanza Lodge',\n detail: '24.07.2018 - 15:00',\n thumb: '/assets/img/profile-pic-l-2.jpg'\n },\n {\n title: 'Laree Munsch',\n detail: '24.05.2018 - 11:00',\n thumb: '/assets/img/profile-pic-l.jpg'\n }\n]\n\nexport default tickets\n","import React from \"react\";\nimport { NavLink } from \"react-router-dom\";\nimport PerfectScrollbar from \"react-perfect-scrollbar\";\nimport { Card, CardBody, CardTitle } from \"reactstrap\";\n\nimport IntlMessages from \"../../helpers/IntlMessages\";\nimport data from \"../../data/tickets\";\nconst Tickets = () => {\n return (\n \n \n \n \n {data.map((log, index) => {\n return (\n
\n \n
\n | \n | \n \n \n {log.label}\n \n | \n\n {log.time}\n | \n
\n \n {data.map((ticket, index) => {\n return (\n \n \n \n\n
\n );\n })}\n \n \n \n \n \n
\n {ticket.title}
\n\n {ticket.detail}\n
\n\n
\n );\n };\n ","const data = [\n {\n key: 0,\n title: \"Meeting with Account\",\n allDay: true,\n start: \"Tue Jul 31 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Thu Aug 02 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 1,\n title: \"Delivery\",\n start: \"Mon Sep 10 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Mon Sep 10 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 2,\n title: \"Sale Week\",\n start: \"Sun Oct 14 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sun Oct 21 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 3,\n title: \"Delivery\",\n start: \"Tue Nov 13 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Tue Nov 13 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 4,\n title: \"Tax Days\",\n start: \"Sun Dec 09 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Fri Dec 14 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 5,\n title: \"Marketing Conference\",\n start: \"Sun Nov 04 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Wed Nov 07 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 6,\n title: \"Meeting\",\n start: \"Sat Dec 08 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sat Dec 08 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 7,\n title: \"Sales\",\n start: \"Tue Dec 25 2018 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Fri Dec 28 2018 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 8,\n title: \"Store Repairs\",\n start: \"Mon Jan 14 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Wed Jan 16 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 9,\n title: \"Web Meeting\",\n start: \"Tue Feb 05 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Fri Feb 08 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 10,\n title: \"Delivery\",\n start: \"Fri Feb 22 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sat Feb 23 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 11,\n title: \"Sales Week\",\n start: \"Sun Mar 10 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sun Mar 17 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 12,\n title: \"Tax\",\n start: \"Wed Mar 27 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Thu Mar 28 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 13,\n title: \"Meeting\",\n start: \"Sun Apr 14 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Mon Apr 15 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 14,\n title: \"Delivery\",\n start: \"Mon Apr 22 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Fri Apr 26 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 15,\n title: \"Account\",\n start: \"Wed May 08 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Thu May 09 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 16,\n title: \"Shop Opening\",\n start: \"Tue May 14 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Thu May 16 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 17,\n title: \"Vacation\",\n start: \"Sun Jun 09 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sun Jun 23 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 18,\n title: \"Account Inspection\",\n start: \"Tue Jul 09 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sun Jul 14 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 19,\n title: \"Marketing\",\n start: \"Wed Jul 17 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Thu Jul 18 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 20,\n title: \"Delivery\",\n start: \"Sat Aug 10 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sun Aug 11 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 21,\n title: \"Sales Week\",\n start: \"Sun Aug 18 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sun Aug 25 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 22,\n title: \"Teem Workshop\",\n start: \"Fri Sep 13 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sun Sep 15 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 23,\n title: \"Account Meeting\",\n start: \"Tue Oct 08 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Wed Oct 09 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 23,\n title: \"Vacation\",\n start: \"Mon Oct 21 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Sat Oct 26 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 24,\n title: \"Meeting\",\n start: \"Thu Nov 14 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Fri Nov 15 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 25,\n title: \"Sales Meeting\",\n start: \"Fri Nov 22 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Tue Nov 26 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 26,\n title: \"Account\",\n start: \"Sun Dec 08 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Mon Dec 09 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n },\n {\n key: 26,\n title: \"Annual Meeting\",\n start: \"Tue Dec 24 2019 00:00:00 GMT+0300 (GMT+03:00)\",\n end: \"Wed Dec 25 2019 00:00:00 GMT+0300 (GMT+03:00)\"\n }\n ]\nexport default data;\n","import React from \"react\";\nimport { Card, CardBody, CardTitle } from \"reactstrap\";\nimport BigCalendar from \"react-big-calendar\";\nimport moment from \"moment\";\n\nimport { CalendarToolbar } from \"../../components/CalendarToolbar\";\nimport IntlMessages from \"../../helpers/IntlMessages\";\nimport data from \"../../data/events\";\n\nimport { getDirection } from \"../../helpers/Utils\";\n\nBigCalendar.momentLocalizer(moment);\n\nconst Calendar = () => {\n const localizer = BigCalendar.momentLocalizer(moment);\n return (\n \n \n
\n \n \n
\n \n \n Today\n \n \n \n
\n \n {\n showPageJump &&\n \n \n {\n if (!canPrevious) return;\n this.changePage(page - 1);\n }}\n disabled={!canPrevious}\n >\n \n \n \n\n {this.renderPages()}\n \n {\n if (!canNext) return;\n this.changePage(page + 1);\n }}\n disabled={!canNext}\n >\n \n \n \n \n {\n showPageSizeOptions &&\n
\n Page \n \n \n {this.state.page + 1}\n \n \n {this.renderPageJump()}\n \n \n of {pages}
\n }\n\n \n Items \n \n \n {this.state.pageSize}\n \n \n {pageSizeOptions.map((size, index) => {\n return (\n this.changePageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n }\n {props.value}
\n },\n {\n Header: \"Sales\",\n accessor: \"sales\",\n Cell: props =>{props.value}
\n },\n {\n Header: \"Stock\",\n accessor: \"stock\",\n Cell: props =>{props.value}
\n },\n {\n Header: \"Category\",\n accessor: \"category\",\n Cell: props =>{props.value}
\n }\n ];\n return (\n\n
\n );\n })}\n \n {s.title}\n \n {s.status}/{s.total}\n \n
\n \n\n
\n
\n
\n \n
\n\n - \n {data.slice(0, 12).map((c, index) => {\n return (\n
- \n
{c.title} \n \n );\n })}\n
\n
\n - \n {data.slice(12, 24).map((c, index) => {\n return (\n
- \n
{c.title} \n \n );\n })}\n
\n
\n \n
\n {title}
\n{detail}
\n\n
\n \n \n
\n \n
\n \n
\n \n {this.state.currentValue}\n
\n{this.state.currentLabel}
\n\n (this.chart_instance = ref && ref.chart_instance)}\n type=\"lineWithLine\"\n options={{\n ...smallLineChartOptions,\n tooltips: {\n intersect: false,\n enabled: false,\n custom: function(tooltipModel) {\n if (tooltipModel && tooltipModel.dataPoints) {\n var yLabel = tooltipModel.dataPoints[0].yLabel;\n var xLabel = tooltipModel.dataPoints[0].xLabel;\n var label = tooltipModel.body[0].lines[0].split(\":\")[0];\n changeState(\"$\" + addCommas(yLabel), label + \"-\" + xLabel);\n }\n }\n }\n }}\n plugins={[\n {\n afterInit: function(chart, options) {\n var yLabel = chart.data.datasets[0].data[0];\n var xLabel = chart.data.labels[0];\n var label = chart.data.datasets[0].label;\n changeState(\"$\" + addCommas(yLabel), label + \"-\" + xLabel);\n }\n }\n ]}\n data={data}\n />\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n
\n \n
\n \n 
\n
\n);\n\nconst TopRatedItems = () => {\n return (\n \n {order}.\n {title}\n
\n({rateCount})
\n\n
\n );\n })}\n \n
\n \n {this.state.currentValue}\n
\n{this.state.currentLabel}
\n\n (this.chart_instance = ref && ref.chart_instance)}\n type=\"lineWithLine\"\n options={{\n ...smallLineChartOptions,\n tooltips: {\n intersect: false,\n enabled: false,\n custom: function(tooltipModel) {\n if (tooltipModel && tooltipModel.dataPoints) {\n var yLabel = tooltipModel.dataPoints[0].yLabel;\n var xLabel = tooltipModel.dataPoints[0].xLabel;\n var label = tooltipModel.body[0].lines[0].split(\":\")[0];\n changeState(\"$\" + addCommas(yLabel), label + \"-\" + xLabel);\n }\n }\n }\n }}\n plugins={[\n {\n afterInit: function(chart, options) {\n var yLabel = chart.data.datasets[0].data[0];\n var xLabel = chart.data.labels[0];\n var label = chart.data.datasets[0].label;\n changeState(\"$\" + addCommas(yLabel), label + \"-\" + xLabel);\n }\n }\n ]}\n data={data}\n />\n
\n \n
\n\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n\n \n
\n {height === undefined && \n
\n Contacts
\n \n Stored Contacts from Pre Chat Form & Leave Message\n \n\n handleTextChange(event)}\n >\n \n \n \n \n \n \n \n \n \n \n {sessionStorage.getItem(\"lock\") === \"true\" &&\n \n \n \n \n \n \n \n \n \n \n \n \n Download\n \n }\n
}\n \n
\n\n \n
\n \n \n
\n \n
\n \n
\n \n \n
\n \n
\n\n \n
\n \n \n\n
\n \n\n
\n \n\n
\n \n\n \n
\n \n
\n );\n};\n\nexport default React.memo(QuestionListItem);","import React, { useState, Fragment } from 'react';\nimport { Card, CardBody, Button } from 'reactstrap';\nimport styled from \"styled-components\";\n\nconst HeroDiv = styled.div`\n\n.herocard-container {\ndisplay: block;\npadding: 2px;\n}\n.herocard-image {\n width: calc(100% + 3px);\nmargin-left: -2px;\nbox-shadow: 0 0 4px rgba(0,0,0,0.2);\nobject-fit: cover;\nheight: 132px;\npadding-left: 2px;\npadding-right: 2px;\n}\n.herocard-text-area {\n padding: 10px;\n}\n\n.herocard-title-text {\n color: #444444;\n font-weight: bold;\n font-size: 17px;\n padding-bottom: 2px;\n width: calc(100% + 4px);\n}\n\n.herocard-button-col-container {\n width: calc(100% + 0px);\n}\n\n.herocard-button-row-container {\n display: flex;\n width: calc(100% + 4px);\n flex-direction: row;\n}\n\n.herocard-button-row {\n flex: 1;\n}\n\n.herocard-button-row:not(:first-child) {\n border-left: 2px solid #e9eef4;\n}\n\n.herocard-button-row:not(:first-child):hover {\n border-left: 2px solid rgba(45,58,58,0);\n}\n\n.herocard-button-col {\n width: 100%;\n}\n\n.herocard-button {\n font-size: 15px;\nborder-top: 2px solid white;\ntext-align: center;\npadding: 5px;\ncursor: pointer;\n}\n\n.herocard-button:hover {\n}\n.below{\n border-bottom-right-radius: 4px;\n border-bottom-left-radius: 20px;\n}\n`;\nconst HeroCard = ({ item, sender, color }) => {\n const cardData = JSON.parse(item);\n function handleClick(path, type) {\n if (type === \"openUrl\" && path.includes(\":Webview\")) {\n var IndexWebview = path.split(\":Webview\");\n var Jsondata = JSON.parse(IndexWebview[1]);\n window.open(IndexWebview[0]);\n }\n else if (type === \"openUrl\" && !path.includes(\":Webview\")) {\n window.open(path);\n }\n else if (type === \"messageBack\") {\n var Jsondata = JSON.parse(path);\n window.open(Jsondata.url);\n }\n }\n return (\n \n
\n {moment(item.time).format(\"DD/MM/YYYY h:mm a\")}
\n\n
\n \n {item.text}\n
\n\n {cardData.content.images !== undefined && cardData.content.images.length > 0 ?\n cardData.content.images.map((img) =>\n (
)\n )\n : \"\"\n }\n
\n \n
\n {cardData.content.title}
\n \n {cardData.content.text}\n
\n \n {cardData.content.buttons.map((e) =>\n (() => {\n switch (e.type) {\n case \"imBack\":\n return (\n
\n {e.value}
\n );\n case \"openUrl\":\n return (\n handleClick(e.value, e.type)}\n style={{\n backgroundColor: color.heroButtonBackground,\n color: color.heroButtonText,\n cursor: \"pointer\"\n }}>{e.title}
\n );\n case \"messageBack\":\n return (\n handleClick(e.value, e.type)}\n style={{\n backgroundColor: color.heroButtonBackground,\n color: color.heroButtonText,\n cursor: \"pointer\"\n }}>{e.title}
\n );\n default:\n break;\n }\n }\n )()\n )}\n handleLink(e)}>{SildeItem.caption}
\n \n {e}\n
\n );\n })}\n \n {e.text}\n
\n );\n })}\n \n {url !== undefined && url.map((c, i) => (\n 
\n ))}\n
\n \n
\n {caption}
\n \n {description}\n
\n \n {buttons.map((c, index) =>\n (() => {\n switch (c.type) {\n case \"imBack\":\n return (\n
\n {c.title}\n
\n );\n case \"messageBack\":\n return ( handleClick(c.value, c.type)}\n style={{\n backgroundColor: color.heroButtonBackground,\n color: color.heroButtonText,\n cursor: \"pointer\"\n }}>{c.title}\n
);\n case \"openUrl\":\n return (\n handleClick(c.value, c.type)}\n style={{\n backgroundColor: color.heroButtonBackground,\n color: color.heroButtonText,\n cursor: \"pointer\"\n }}>{c.title}
);\n default:\n break;\n }\n })()\n )}\n \n \n
\n );\n })}\n \n \n setIsUpdating(!isUpdating)}\n >\n Edit\n \n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n id={id}\n submit={handleSubmit}\n propertyId={propertyId}\n />\n )}\n
\n );\n}\n","import React, { useState, Fragment, useEffect } from \"react\";\nexport default function Masking({ input, inputType, number }) {\n const [text, setText] = useState(input);\n useEffect(() => {\n if (text !== \"\" && text !== undefined && text !== null) {\n if (number === undefined || number === null || number === '') {\n number = 1;\n }\n if (inputType === \"mobile\") {\n let maskedValue = \"\";\n for (let i = 0; i < text.length - number; i++) {\n maskedValue += \"X\";\n }\n setText(maskedValue + text.substring(text.length - number, text.length));\n }\n else if (inputType === \"email\") {\n let maskedvalue = text.replace(/()(.*)(?=@)/,\n function (gp1, gp2, gp3) {\n for (let i = 0; i < gp3.length; i++) {\n gp2 += \"X\";\n } return gp2;\n });\n setText(maskedvalue)\n }\n }\n }, [input]);\n\n return \n \n \n \n \n Pick a quick reply or type your message\n \n \n \n \n \n View Templates\n \n \n
\n \n \n \n \n \n \n \n \n
\n \n \n \n \n \n \n
\n \n \n \n \n
\n \n
\n \n \n \n
\n \n \n \n Templates \n \n \n \n \n
\n {quickReplyTemplates.map((item, index) => {\n return (\n \n \n \n \n );\n })}\n \n \n \n
\n
\n );\n};\nexport default React.memo(Visitor);\n","\nimport { User } from \"@twilio/conversations\";\nimport moment from \"moment\";\nimport React, { useEffect, useState } from \"react\";\nimport { injectIntl } from \"react-intl\";\nimport { connect } from \"react-redux\";\nimport { gAPI_Vouchers_List, gAPI_Voucher_Stats, gAPI_Invitation_By_Property, API_Ingetration } from \"../../../../../constants/APIs\";\nimport { getGroupID, AxiosAPI } from \"../../../../../helpers/AxiosAPI\";\n\nconst UserGuide = ({ propertyId, email, locale }) => {\n const [showFrame, setShowFrame] = useState(true);\n const [intregations, setIntregations] = useState(true);\n const [invitation, setInvitations] = useState(true);\n const [statsData, setStatsData] = useState('');\n useEffect(() => {\n if (showFrame) {\n let intregations = [];\n let invitation = [];\n let statsData = [];\n AxiosAPI({\n url: `${gAPI_Invitation_By_Property}?group_id=${getGroupID()}&property_id=${propertyId}`,\n method: 'get',\n }).then((res) => {\n invitation = (res.data);\n }); \n AxiosAPI({\n method: 'get',\n url: `${gAPI_Voucher_Stats}`,\n params: {\n group_id: getGroupID(),\n property_id: propertyId,\n fromDate: moment(\n moment().subtract(6, 'days').format('YYYY-MM-DD') + ' 00:00:00'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss'),\n toDate: moment(moment().format('YYYY-MM-DD') + ' 23:59:59')\n .utc()\n .format('YYYY-MM-DD HH:mm:ss'),\n type: 'Day',\n },\n }).then((res) => {\n try\n {\n let v = 0;\n res.data.voucher.map((m) => {\n v = v + parseInt(m.views);\n });\n statsData = ({ views: v });\n }catch{\n \n }\n });\n let body={\n channels:['Stripe','VoucherWebsite']\n };\n AxiosAPI({\n method: 'post',\n url: `${API_Ingetration}?group_id=${getGroupID()}`,\n data: body\n }).then((res) => {\n intregations = (res.data);\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Vouchers_List}?groupId=${getGroupID()}&propertyId=${propertyId}&languageCode=${locale}&search=&status=All&pageNumber=1&pageSize=10000&email=${email}`,\n })\n .then((res) => {\n if (res.data.vouchers !== undefined && res.data.vouchers.length > 0)\n res.data.vouchers = res.data.vouchers.filter((f) => f.thirdPartyVoucher === false);\n\n if (res.data.vouchers !== undefined && res.data.vouchers.length > 0) {\n if (invitation.length === 0) {\n const voucherIntegrationData = intregations.filter(\n (k) => k.channel === 'VoucherWebsite'\n );\n let webIntregation = voucherIntegrationData.filter((f) => f.properties.includes(propertyId));\n\n if (webIntregation.length === 0) {\n console.log(\"userGuide:1\");\n window.parent.postMessage('userGuide:1', '*');\n }\n }\n }\n if (res.data.vouchers !== undefined && res.data.vouchers.length > 0 && intregations.filter(\n (k) => k.channel === 'VoucherWebsite' && k.properties.includes(propertyId)\n ).length > 0 && invitation.length === 0 && statsData.views > 5) {\n console.log(\"userGuide:2\");\n window.parent.postMessage('userGuide:2', '*');\n }\n if (res.data.vouchers !== undefined && res.data.vouchers.length > 0 && intregations.filter(\n (k) => k.channel === 'VoucherWebsite' && k.properties.includes(propertyId)\n ).length > 0 && intregations.filter(\n (k) => k.channel === 'Stripe' && k.properties.includes(propertyId)).length === 0\n ) {\n console.log(\"userGuide:3\");\n window.parent.postMessage('userGuide:3', '*');\n }\n });\n });\n }\n setShowFrame(false);\n }, [invitation, intregations, statsData]);\n const windowMessage = () => {\n window.parent.postMessage(\"ShowUserGuide\", \"*\")\n }\n return (\n \n \n \n Actions \n {item.takeControl === true &&\n item.visitor.facebookSenderId !== '' ? (\n \n \n fbStop(item.botConversationId)}\n style={{ borderRadius: '6px' }}\n className=\"mr-1 mb-1\"\n >\n Handover to Messenger\n \n ) : (\n fbResume(item.botConversationId)}\n style={{ borderRadius: '6px' }}\n className=\"mr-1 mb-1\"\n >\n Handover to Chatbot\n \n )}\n \n ) : null}\n\n \n \n statustoggle()}\n style={{ borderRadius: '6px' }}\n className=\"mr-1 mb-1\"\n >\n {item.status === 'Opened' ? 'New' : item.status}\n \n \n \n \n
\n \n \n \n Chat Insights \n \n \n ) : null}\n \n \n
\n {(item.visitor.name !== '' ||\n item.visitor.email !== '' ||\n item.visitor.phoneNumber !== '' ||\n (item.channel !== 'Phone' &&\n item.visitor.consentGivenDateTime !== '' &&\n item.visitor.consentGivenDateTime !== null)) && (\n \n
\n \n
\n \n \n
\n\n
\n \n {item.visitor.contactId !== undefined &&\n item.visitor.contactId !== '' ? (\n
\n
\n {item.visitor.ipAddress !== '' &&\n item.visitor.ipAddress !== null ? (\n \n
\n \n \n
\n\n {item.tags.map((tag, index) => {\n return (\n \n {' '}\n {tag} {' '}\n \n );\n })}\n
\n \n
\n {item.visitor.latitude !== undefined &&\n item.visitor.latitude !== '' && (\n \n
\n \n \n
\n\n {item.visitor.ipAddress !== '' ? (\n
\n Near {item.visitor.location}
\n ) : null}\n {item.visitor.ipAddress !== '' ? (\n\n This location is approximate and determined by IP\n address ({item.visitor.ipAddress})\n
\n ) : null}\n\n \n
\n )}\n \n \n \n Pre-chat Info \n {item.visitor.name !== '' && (\n \n \n
\n )}\n {((item.visitor.url !== '' && item.visitor.url !== null) ||\n (item.visitor.referralUrl !== '' &&\n item.visitor.referralUrl !== null)) && (\n \n
\n )}\n {item.visitor.email !== '' && (\n \n
\n \n \n
\n\n
\n {item.visitor.name}
\n\n
\n )}\n {item.visitor.phoneNumber !== '' && (\n \n
\n \n \n
\n\n
\n \n {isMasked !== 'true' ? (\n
\n
\n )}\n {item.visitor.zipCode !== '' && (\n \n
\n \n \n
\n\n
\n \n {isMasked !== 'true' ? (\n
\n
\n )}\n {item.channel !== 'Phone' &&\n item.visitor.consentGivenDateTime !== '' &&\n item.visitor.consentGivenDateTime !== null && (\n \n
\n \n \n
\n\n
\n {item.visitor.zipCode}
\n\n
\n )}\n \n
\n \n \n
\n\n
\n \n Marketing Consent:\n {item.visitor.consentGiven === 'Yes' ? (\n \n {item.visitor.consentGiven}\n \n ) : (\n \n {item.visitor.consentGiven}\n \n )}{' '}\n (\n {moment(item.visitor.consentGivenDateTime).format(\n 'dddd, DD MMMM YYYY'\n )}{' '}\n {moment(item.visitor.consentGivenDateTime).format(\n 'h:mm a'\n )}\n )\n
\n\n \n \n Visited Pages \n {item.visitor.url !== '' && item.visitor.url !== null && (\n \n \n
\n )}\n {((item.visitor.facebookSenderId === '' &&\n item.visitor.googleSenderName === '') ||\n (item.visitor.facebookSenderId !== '' &&\n item.visitor.facebookSenderId !== null) ||\n (item.visitor.googleSenderName !== '' &&\n item.visitor.googleSenderName !== null)) && (\n \n
\n )}\n\n {item.visitor.referralUrl !== '' &&\n item.visitor.referralUrl !== null ? (\n \n
\n \n \n
\n\n
\n \n Chat started on this page\n
\n{item.visitor.url}
\n\n
\n ) : null}\n \n
\n \n \n
\n\n
\n \n User referred to your page by this website\n
\n{item.visitor.referralUrl}
\n\n \n \n Device Info \n {item.visitor.facebookSenderId === '' &&\n item.visitor.googleSenderName === '' ? (\n \n \n ) : null}\n {item.visitor.facebookSenderId !== '' &&\n item.visitor.facebookSenderId !== null ? (\n \n \n ) : null}\n {item.visitor.googleSenderName !== '' &&\n item.visitor.googleSenderName !== null ? (\n \n \n ) : null}\n \n \n
\n )}{' '}\n {(recordingurl !== '' ||\n transcript !== '' ||\n (item.visitor.phoneNumber !== '' &&\n item.channel === 'Phone' &&\n item.visitor.phoneNumber !== undefined)) && (\n \n
\n \n
\n \n \n
\n\n
\n {item.visitor.deviceType}
\n\n
\n \n
\n \n {' '}\n \n
\n\n
\n {item.visitor.browser} browser
\n\n
\n \n
\n \n \n
\n\n
\n {item.visitor.userAgent}
\n\n
\n \n
\n \n \n
\n\n
\n \n Facebook Sender Id\n
\n{item.visitor.facebookSenderId}
\n\n
\n \n
\n \n {' '}\n \n
\n\n
\n {item.visitor.facebookSenderName}
\n\n
\n \n
\n \n \n
\n\n
\n \n
\n
\n \n
\n \n {' '}\n \n
\n\n
\n {item.visitor.googleSenderName}
\n\n \n \n Recording & Transcript \n {recordingurl !== '' && (\n \n \n \n \n
\n )}\n {transcript !== '' && (\n \n \n \n \n
\n \n )}\n {item.visitor.phoneNumber !== '' &&\n item.channel === 'Phone' &&\n item.visitor.phoneNumber !== undefined &&\n (item.visitor.phoneNumber.startsWith('+6422') ||\n item.visitor.phoneNumber.startsWith('+6427') ||\n item.visitor.phoneNumber.startsWith('+6421') ||\n item.visitor.phoneNumber.startsWith('+6428') ||\n item.visitor.phoneNumber.startsWith('+6429')) && (\n \n \n \n toggleModal()}\n style={{ width: '50%' }}\n >\n Send a Text\n \n \n
\n \n )}\n {item.visitor.phoneNumber !== '' &&\n item.channel === 'Phone' &&\n item.visitor.phoneNumber !== undefined && (\n \n \n \n \n Call Back\n \n \n
\n \n )}\n \n \n
\n )}\n \n Customer Transcript\n
\n \n
\n \n
\n \n \n
\n\n
\n Unique Chat ID
\n{item.conversationId}
\n\n {\n setTemplateVisible(!templateVisible);\n }}\n submit={handleSubmit}\n propertyId={propertyId}\n />\n
\n \n {\n setTemplateVisible(!templateVisible);\n }}\n >\n + Create a New Template\n \n
\n \n
\n \n
\n \n {item.name}\n
\n\n
\n \n deleteReply(item.id)}\n >\n Delete\n \n
\n \n {/* {showFrame && \n
\n );\n}\nconst mapStateToProps = ({ settings }) => {\n\n const {\n locale,\n propertyId,\n\n\n email,\n\n } = settings;\n\n return {\n\n locale,\n\n propertyId,\n\n email,\n\n };\n};\n\nconst mapActionsToProps = {};\n\nconst aap = injectIntl(UserGuide);\nexport default connect(mapStateToProps, mapActionsToProps)(aap);\n","const week = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];\nconst year = [\n 'Jan',\n 'Feb',\n 'Mar',\n 'Apr',\n 'May',\n 'Jun',\n 'Jul',\n 'Aug',\n 'Sep',\n 'Oct',\n 'Nov',\n 'Dec',\n];\nconst month = [\n '1',\n '2',\n '3',\n '4',\n '5',\n '6',\n '7',\n '8',\n '9',\n '10',\n '11',\n '12',\n '13',\n '14',\n '15',\n '16',\n '17',\n '18',\n '19',\n '20',\n '21',\n '22',\n '23',\n '24',\n '25',\n '26',\n '27',\n '28',\n '29',\n '30',\n '31',\n];\n\nfunction formatDate(date) {\n var dd = date.getDate();\n var mm = date.getMonth() + 1;\n // var yyyy = date.getFullYear()\n if (dd < 10) {\n dd = '0' + dd;\n }\n if (mm < 10) {\n mm = '0' + mm;\n }\n date = dd + '/' + mm;\n return date;\n}\n\nfunction LastxDays(num) {\n var result = [];\n for (var i = 0; i < num; i++) {\n var d = new Date();\n // console.log(d);\n d.setDate(d.getDate() - i);\n result.push(formatDate(d));\n }\n return result.reverse();\n}\n\nconst last7Days = LastxDays(7);\nconst last30Days = LastxDays(30);\nconst last90Days = LastxDays(90);\n\nexport { week, month, last7Days, last30Days, last90Days, year };\n","import React from 'react';\nimport { Card } from 'reactstrap';\n\nimport IntlMessages from '../../../../../helpers/IntlMessages';\nimport { AreaChart } from '../charts';\nimport { ThemeColors } from '../../../../../helpers/ThemeColors';\nconst colors = ThemeColors();\n\nconst VoucherClicks = ({ labels, data }) => {\n const datasets = data.map(elem => elem.count);\n const areaChartData = {\n labels,\n datasets: [\n {\n label: 'clicks',\n data: datasets,\n borderColor: '#EF4A81',\n pointBackgroundColor: '#EF4A81',\n pointBorderColor: '#EF4A81',\n pointHoverBackgroundColor:'#EF4A81',\n pointHoverBorderColor: '#EF4A81',\n pointRadius: 4,\n pointBorderWidth: 2,\n pointHoverRadius: 5,\n fill: false,\n borderWidth: 2,\n backgroundColor: '#EF4A81',\n },\n ],\n };\n return (\n \n \n
} */}\n \n
\n\n \n
\n \n
\n \n aiva Clicks\n
\n \n Total Voucher Engine Clicks\n \n\n
\n \n
\n\n \n
\n \n
\n \n Sales\n
\n \n \n\n
\n \n
\n );\n};\nexport default VoucherStats;","import React from \"react\";\nimport VoucherStats from \"./VoucherStats\";\nimport { Card, CardBody, CardTitle } from 'reactstrap';\n\nimport IntlMessages from '../../../../../helpers/IntlMessages';\nimport ReactTable from 'react-table';\nimport DataTablePagination from '../../../../../components/DatatablePagination';\nconst PopularVoucher = ({ statsData, data, labels, revenue, currency, clicks }) => {\n return (\n
\n \n
\n \n \n
\n Clicks
\n\n {clicks !== undefined ? clicks : 0}\n
\n\n
\n \n
\n \n \n
\n Views
\n\n {statsData.views !== undefined ? statsData.views : 0}\n
\n\n
\n \n
\n \n \n
\n Sold
\n\n {statsData.sold !== undefined ? statsData.sold : 0}\n
\n\n
\n \n
\n \n \n
\n Revenue
\n\n {revenue !== undefined ? (numberFormat(revenue).replace(/[A-Za-z]/g, '')).substring(0, numberFormat(revenue).indexOf('.') - 2) : 0}\n
\n\n
);\n};\nexport default PopularVoucher;","\nimport React, { Fragment } from \"react\";\nimport { Card } from 'reactstrap';\nimport moment from 'moment';\nimport ReactHtmlParser from \"react-html-parser\";\nconst RecentOrder = ({ data }) => { \n return (\n \n
\n\n \n \n \n \n \n
\n \n
\n \n
\n \n
\n \n Popular Vouchers\n
\n \n Vouchers Interest and Activity\n \n\n
\n \n
\n );\n};\nexport default RecentOrder;","import React from 'react';\nimport { Card, CardBody, CardTitle } from 'reactstrap';\n\nimport IntlMessages from '../../../../../helpers/IntlMessages';\nimport ReactTable from 'react-table';\nimport DataTablePagination from '../../../../../components/DatatablePagination';\n\nconst VoucherEngineVisits = ({ labels, data }) => {\n return (\n \n \n \n
\n \n
\n \n
\n \n
\n \n Recent Purchases\n
\n\n {data.map((m) => {\n return (\n \n \n );\n })}\n
\n \n
\n \n
\n \n \n
\n \n
\n \n
\n \n
\n \n
\n \n Voucher Website Visits By Country\n
\n \n\n \n
\n \n Drop file here to upload, or click to select file\n\n \n
\n\n \n \n
\n\n {files.map((file, index) => (\n
\n \n
\n\n ))}\n \n
\n\n {/* handleRemoveFields(index)}\n >\n {\" \"}\n {\" \"}\n */}\n \n
\n\n \n {file.img.name}{\" \"}\n
\n {file.img.size}
\n \n {\n setAgree(!isAgree);\n }}\n >\n I have copyright or permissions to use this json file\n\n \n
*/}\n \n \n\n
\n \n
\n {ImageGalleryButton()}\n \n \n setUpdateModal(!updateModal)}\n style={{ maxWidth: '500px' }}\n >\n setUpdateModal(!updateModal)}>\n To-DO List\n \n \n Are you sure your want to remove this to-do from list ?\n \n \n \n \n \n \n \n\n \n \n
\n \n \n \n );\n })}\n
\n \n
\n {toogleData.length > 0 && toogleData.map((m, index) => {\n if((m.status == \"0\" || m.status == \"Active\")&& moment(m.startDate).format('YYYY-MM-DD')<=moment().format('YYYY-MM-DD') &&\n moment(m.endDate).format('YYYY-MM-DD') >=moment().format('YYYY-MM-DD'))\n return (\n \n
\n \n
\n \n To-do List\n
\n \n {/* //Vouchers Interest and Activity */}\n \n \n
\n \n \n \n \n \n
\n \n \n \n
\n \n {m.icon !== undefined && m.icon !== ''?\n ![]({\"https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885_1280.jpg\"})
\n :
\n {m.subTitle}\n
\n {/*\n {\"item.createDate\"}\n
*/}\n\n {/* \n {\"item.label\"}\n */}\n \n {m.category}\n
\n \n handleChange(index,m)}\n label=\"\"\n />\n
\n \n
\n\n {m.links !== undefined && {m.text}
\n\n {m.links.length >0 && window.location.href=m.links[0].url}>{m.links[0].text} }\n {m.links.length >1 && window.location.href=m.links[1].url} className=\"ml-3\">{m.links[1].text} }\n {m.links.length >2 && window.location.href=m.links[2].url} className=\"ml-3\">{m.links[2].text} }\n
}\n \n
);\n};\nexport default PopularAds;","import React from 'react';\nimport { Card } from 'reactstrap';\n\nimport IntlMessages from '../../../../../helpers/IntlMessages';\nimport { AreaChart } from '../charts';\nimport { ThemeColors } from '../../../../../helpers/ThemeColors';\nconst colors = ThemeColors();\n\nconst VoucherEngineShare = ({ labels, data, currency\n}) => {\n console.log(data);\n const datasets = data.filter(f=>f.type===\"Clicks\").map(elem => elem.stats);\n const secondDataset = data.filter(f=>f.type===\"Share\").map(elem => elem.stats);\n const areaChartData = {\n labels,\n datasets: [\n {\n label: 'Clicks',\n data: datasets,\n borderColor: '#EF4A81',\n pointBackgroundColor: '#EF4A81',\n pointBorderColor: '#EF4A81',\n pointHoverBackgroundColor:'#EF4A81',\n pointHoverBorderColor: '#EF4A81',\n pointRadius: 4,\n pointBorderWidth: 2,\n pointHoverRadius: 5,\n fill: false,\n borderWidth: 2,\n backgroundColor: '#EF4A81',\n },\n {\n label: 'Share',\n data: secondDataset,\n borderColor: '#3582b3',\n pointBackgroundColor: '#3582b3',\n pointBorderColor: '#3582b3',\n pointHoverBackgroundColor:'#3582b3',\n pointHoverBorderColor: '#3582b3',\n pointRadius: 4,\n pointBorderWidth: 2,\n pointHoverRadius: 5,\n fill: true,\n borderWidth: 2,\n backgroundColor: '#3582b3',\n },\n ],\n };\n return (\n \n
\n\n \n \n \n \n \n
\n \n
\n \n
\n \n
\n \n Advertisements\n
\n \n Ads Impressions and Clicks\n \n\n
\n\n \n
\n \n
\n \n Social Share\n
\n \n \n\n
\n {props.value}
,\n },\n {\n Header: 'Clicks',\n accessor: 'clicks',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Visitors',\n accessor: 'visitors',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n];\nconst poupularVoucherDataTablescolumn = [\n {\n Header: 'Name',\n accessor: 'voucherName',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Views',\n accessor: 'views',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Added to Cart',\n accessor: 'cart',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Payments',\n accessor: 'payments',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Purchases',\n accessor: 'purchases',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Clicks',\n accessor: 'clicks',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Share',\n accessor: 'share',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n];\n\n\nconst popularAdsDataTablecolumn = [\n {\n Header: 'Name',\n accessor: 'voucherName',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Impressions',\n accessor: 'impression',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Clicks',\n accessor: 'clicks',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Revenue',\n accessor: 'revenue',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n }\n];\n\nexport default function ChartCard({\n propertyId,\n isVoucherEngine,\n timeZone,\n domains,\n currency, locale,\n history\n}) {\n moment.tz.setDefault(timeZone);\n const [buttonText, setButtonText] = useState(\n{props.value}
,\n },\n {\n Header: 'Email',\n accessor: 'email',\n Cell: (props) => (\n\n {isMasked !== 'true' ? maskEmail(props.value) : props.value}\n
\n {isMasked !== 'true' ? maskMobile(props.value, 4) : props.value}\n
{props.value}
,\n },\n {\n Header: 'Marketing Consent',\n accessor: 'consent',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Date',\n accessor: 'consentDate',\n Cell: (props) => (\n\n {props.value !== '' ? moment(props.value).format('lll') : ''}\n
\n ),\n },\n ];\n const handleMaskClick = () => {\n if (isMasked === 'true') {\n sessionStorage.setItem('lock', 'false');\n setIsMasked(sessionStorage.getItem('lock'));\n } else {\n sessionStorage.setItem('lock', 'true');\n setIsMasked(sessionStorage.getItem('lock'));\n }\n };\n useEffect(() => {\n if (propertyId !== '' && propertyId !== undefined) {\n selectLast7Days();\n }\n let body={\n channels:['EmbedVoucher','VoucherStandAlonePage','VoucherWebsite']\n };\n AxiosAPI({\n method: 'post',\n url: `${API_Ingetration}?group_id=${getGroupID()}`,\n data: body\n }).then((res) => {\n if (res.data.length > 0) {\n res.data = res.data.filter((m) => (m.channel === \"EmbedVoucher\" || m.channel === \"VoucherStandAlonePage\" || m.channel === \"VoucherWebsite\") && m.disabled === false && m.properties.filter(f => f === propertyId).length > 0)\n }\n setIntregation(res.data);\n });\n }, [propertyId]);\n const today = () => {\n return moment(moment().format('YYYY-MM-DD') + ' 23:59:59')\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const daysAgo7 = () => {\n return moment(moment().subtract(6, 'days').format('YYYY-MM-DD HH:mm:ss'))\n .utc()\n .format('YYYY-MM-DD 00:00:00');\n };\n\n const daysAgo30 = () => {\n return moment(moment().subtract(29, 'days').format('YYYY-MM-DD HH:mm:ss'))\n .utc()\n .format('YYYY-MM-DD 00:00:00');\n };\n\n const daysAgo60 = () => {\n return moment(moment().subtract(59, 'days').format('YYYY-MM-DD HH:mm:ss'))\n .utc()\n .format('YYYY-MM-DD 00:00:00');\n };\n\n const daysAgo90 = () => {\n return moment(moment().subtract(89, 'days').format('YYYY-MM-DD HH:mm:ss'))\n .utc()\n .format('YYYY-MM-DD 00:00:00');\n };\n\n const startOfWeek = () => {\n const today = moment();\n return moment(moment(today).isoWeekday(1).format('YYYY-MM-DD HH:mm:ss'))\n .utc()\n .format('YYYY-MM-DD 00:00:00');\n };\n\n const endOfWeek = () => {\n const today = moment();\n return moment(\n moment(today).isoWeekday(7).format('YYYY-MM-DD') + ' 23:59:59'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const startOfMonth = () => {\n return moment(moment().startOf('month').format('YYYY-MM-DD HH:mm:ss'))\n .utc()\n .format('YYYY-MM-DD 00:00:00');\n };\n\n const startOfPreviousMonth = () => {\n return moment(\n moment().subtract(1, 'months').startOf('month').format('YYYY-MM-DD') +\n ' 00:00:00'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const startOfThisYear = () => {\n return moment(new Date().getFullYear() + '-01-01' + ' 00:00:00').format(\n 'YYYY-MM-DD HH:mm:ss'\n );\n };\n\n\n\n const toggleAppMenu = (tab) => {\n setActiveTab(tab);\n };\n\n const startOfLastYear = () => {\n return moment(new Date().getFullYear() - 1 + '-01-01' + ' 00:00:00').format(\n 'YYYY-MM-DD HH:mm:ss'\n );\n };\n const endOfLastYear = () => {\n return moment(new Date().getFullYear() - 1 + '-12-31' + ' 00:00:00').format(\n 'YYYY-MM-DD HH:mm:ss'\n );\n };\n\n const endOfPreviousMonth = () => {\n return moment(\n moment().subtract(1, 'months').endOf('month').format('YYYY-MM-DD') +\n ' 23:59:59'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const endOfMonth = () => {\n return moment(moment().endOf('month').format('YYYY-MM-DD') + ' 23:59:59')\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const selectLast7Days = (id) => {\n setButtonText(\n \n \n {buttonText}\n \n \n selectLast7Days(itegrationId)}>\n \n selectLast30Days(itegrationId)}>\n \n selectLast90Days(itegrationId)}>\n \n selectThisWeek(itegrationId)}>\n \n selectThisMonth(itegrationId)}>\n \n selectPreviousMonth(itegrationId)}>\n \n selectThisYear(itegrationId)}>\n \n selectLastYear(itegrationId)}>\n \n \n \n
\n \n {integration.length > 1 && \n \n {integrationName === \"All\" ? \"All Integrations\" : integrationName}\n \n \n { setIntregationId('All'); setIntregationName('All'); ReloadStats('All'); }}>\n All Integrations\n \n {integration.length > 0 && integration.map((i) => (\n { setIntregationId(i.id); setIntregationName(i.name); ReloadStats(i.id); }}>\n {i.name}\n \n ))}\n \n }\n
\n \n
\n ) : (\n Temporarily Unavailable
\n )}\n \n\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n countryvisit.length > 0 && (\n \n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n {(isVoucherEngine || domains.length == 1) && !isPopularAds ? (\n\n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n stats.recentOrders !== undefined && stats.recentOrders.length > 0 && (\n Temporarily Unavailable
\n }\n \n ) : (\n ''\n )}\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n\n
\n ) : (\n \n
\n ) : ( \n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\nVouchers
You have 3rd party voucher which are awaiting your approval
\n \n \n
\n);\nexport default Dashboards;","import React, { useState, useEffect, Fragment } from 'react';\nimport IntlMessages from '../../../../helpers/IntlMessages';\nimport DatePicker from 'react-datepicker';\nimport 'react-datepicker/dist/react-datepicker.css';\nimport {\n faChevronLeft,\n faChevronRight,\n} from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport './table.scss';\n\nimport moment from 'moment';\n\nexport default function AriDatePicker({ getStartDate }) {\n const [startDate, setStartDate] = useState(moment());\n const [daysArr, setDaysArr] = useState([]);\n\n const daysArrGenerator = (startDate, stopDate) => {\n var arr = [];\n while (startDate < stopDate) {\n arr.push(moment(startDate));\n startDate = moment(startDate).add(1, 'days');\n }\n // console.log('object', arr);\n\n return arr;\n };\n\n useEffect(() => {\n setDaysArr(\n daysArrGenerator(moment(startDate), moment(startDate).add(30, 'days'))\n );\n }, [startDate]);\n\n const handldDateChange = date => {\n setStartDate(date);\n getStartDate(date);\n };\n\n const moveDays = (e, direction) => {\n e.preventDefault();\n if (direction === 'left') {\n setStartDate(pre => moment(pre).subtract(4, 'days'));\n }\n if (direction === 'right') {\n setStartDate(pre => moment(pre).add(4, 'days'));\n }\n };\n\n return (\n -
\n \n
\n \n
\n \n handldDateChange(date)}\n />\n
\n \n moveDays(e, 'left')}\n />\n
\n \n moveDays(e, 'right')}\n />\n
\n \n \n {day.format('ddd') === 'Sat' || day.format('ddd') === 'Sun' ? (\n \n ))}\n
\n x
\n {daysArr.map((day, index) => (\n \n
\n ) : (\n \n {day.format('DD MMM')}{' '}\n ({day.format('ddd').slice(0, 1)})\n
\n \n
\n )}\n \n {day.format('DD MMM')}{' '}\n ({day.format('ddd').slice(0, 1)})\n
\n \n \n Booking \n \n \n \n \n \n \n \n \n
\n );\n}\n","import styled from 'styled-components';\n\nconst dark_blue = '#67737d';\nconst red = '#bf303c';\n\nexport const TableSytle = styled.div`\n margin-top: 150px;\n max-width: 1595px;\n width: 100%;\n overflow: hidden !important;\n`;\n\nexport const HorizontalContainer = styled.div`\n display: flex;\n`;\n\nexport const VerticalContainer = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nexport const CellHeader = styled.div`\n font-size: 16px;\n font-weight: 700;\n line-height: 50px;\n width: 282px;\n height: 50px;\n text-align: left;\n border-bottom: 1px ${dark_blue} solid;\n border-right: 1px ${dark_blue} solid;\n border-top: 1px ${dark_blue} solid;\n margin: -1px;\n`;\n\nexport const CellHeader2 = styled.div`\n font-size: 16px;\n line-height: 50px;\n width: 282px;\n height: 50px;\n text-align: left;\n border-bottom: 1px ${dark_blue} solid;\n border-right: 1px ${dark_blue} solid;\n border-top: 1px ${dark_blue} solid;\n margin: -1px;\n\n padding-left: 20px;\n`;\n\nexport const CellStyle = styled.div`\n cursor: pointer;\n font-size: 16px;\n text-align: center;\n // line-height: 50px;\n padding: 20% 0;\n margin: auto;\n width: 85px;\n height: 50px;\n // box-shadow: var(--cell-shadow);\n border: 1px ${dark_blue} solid;\n margin: -1px;\n position: relative;\n // z-index: 1;\n\n .tips {\n position: absolute;\n top: 4px;\n right: 5px;\n display: inline-block;\n font-size: 12px;\n color: ${red};\n }\n\n #tips {\n display: inline-block;\n position: absolute;\n right: 25px;\n top: -5px;\n line-height: 15px;\n font-size: 15px;\n font-weight: 600;\n color: ${red};\n background-color: #fff;\n border: ${red} 2px solid;\n border-radius: 20px;\n padding: 5px 10px;\n z-index: inherit;\n }\n`;\n\nexport const UpdateCellInput = styled.input`\n margin-top: -10px;\n width: 74px;\n height: 49px;\n z-index: 1;\n`;\n\nexport const UpdateInventoryButton = styled.div`\n position: absolute;\n top: 35px;\n right: 2px;\n font-size: 13px;\n padding: 8px 10px;\n line-height: 13px;\n color: #fff;\n background-color: #26a746;\n border-radius: 16px;\n z-index: 1;\n`;\n","import React, { useState, useEffect } from 'react';\nimport ImgStopsell from '../icon/stopsell.png';\nimport ImgCta from '../icon/cta.png';\nimport ImgCtd from '../icon/ctd.png';\nimport CellModal from './CellModal';\n\nimport { faQuestionCircle } from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { CellStyle, UpdateInventoryButton, UpdateCellInput } from '../Layout';\nimport { AxiosAPI } from '../../../../../helpers/AxiosAPI';\nimport { postAPI_Update_Inventory } from '../../../../../constants/APIs';\n\n// Redux\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\n\nfunction Cell({\n propertyId,\n roomTypeId,\n rate,\n date,\n text,\n stopsell,\n cta,\n ctd,\n isEditingInventoryCell,\n currency\n}) {\n const [cellText, setCellText] = useState(text || '');\n const [flipped, setFlipped] = useState(false);\n const [style, setStyle] = useState({});\n const [isVisible, setIsVisible] = useState(false);\n const [isChanged, setIsChanged] = useState(false);\n\n useEffect(() => {\n if (stopsell) {\n setStyle({\n backgroundImage: `url(${ImgStopsell})`,\n backgroundSize: '100% 100%',\n });\n }\n if (cta) {\n setStyle({\n backgroundImage: `url(${ImgCta})`,\n backgroundSize: '100% 100%',\n });\n }\n if (ctd) {\n setStyle({\n backgroundImage: `url(${ImgCtd})`,\n backgroundSize: '100% 100%',\n });\n }\n\n if (text === '-') {\n setStyle({ color: '#bdbdbd', backgroundColor: '#bdbdbd' });\n setIsVisible(false);\n }\n }, [stopsell, cta, ctd, text, isVisible]);\n\n const handleMouseOver = () => {\n setFlipped(true);\n };\n\n const handleMouseOut = () => {\n setFlipped(false);\n };\n\n const handleChange = e => {\n setCellText(e.target.value);\n setIsChanged(true);\n };\n\n const handleUpdate = () => {\n AxiosAPI({\n url: postAPI_Update_Inventory,\n method: 'post',\n data: {\n propertyId,\n data: [\n {\n roomTypeId,\n startDate: date.slice(0, 10),\n endDate: date.slice(0, 10),\n count: Number(cellText),\n },\n ],\n },\n }).then(setIsChanged(false));\n };\n\n const Tips = flipped => {\n if (flipped) {\n if (stopsell) return stopsell
;\n if (cta) return closed to arrival
;\n if (ctd) return closed to departure
;\n }\n };\n\n return (\n stopsell
;\n if (cta) return closed to arrival
;\n if (ctd) return closed to departure
;\n }\n };\n\n return (\n \n
\n x
\n Stop Sell
\n x
\n Closed to arrival
\n x
\n Closed to departure
\n \n \n Bulk Edit \n \n \n \n {inputFields.map((inputField, index) => (\n \n \n \n \n handleInputChange(index, event)}\n >\n \n {roomlist.map((elem, index) => (\n \n ))}\n \n {/* Choose the room type! */}\n \n \n \n \n \n handleInputChange(index, event)}\n />\n {/* Choose the start date! */}\n \n \n \n \n \n handleInputChange(index, event)}\n />\n {/* Choose the end date! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.count}\n />\n {/* Set the inventory number! */}\n \n \n \n \n
\n ))}\n \n \n \n \n \n \n \n \n
\n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(InventoryEditModal));\n","import React, { useState, Fragment } from 'react';\nimport {\n Row,\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n Label,\n} from 'reactstrap';\n\nimport { AvForm, AvGroup, AvInput } from 'availity-reactstrap-validation';\nimport { Colxx } from '../../../../../components/common/CustomBootstrap';\n\nimport { AxiosAPI } from '../../../../../helpers/AxiosAPI';\nimport { postAPI_Update_Restrictions } from '../../../../../constants/APIs';\nimport { gAPI_RatesPlan_List_ByRoomId } from '../../../../../constants/APIs';\n\n// Redux\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\n\nfunction RestrictionsEditModal({\n isVisible,\n toggleModal,\n propertyId,\n roomlist,\n ratelist,\n}) {\n //console.log('ratelist', ratelist);\n const templateInputField = {\n roomTypeId: '',\n ratePlanId: '',\n startDate: '',\n endDate: '',\n maximumLengthOfStay: 0,\n minimumLengthOfStay: 0,\n stopSell: false,\n closedArrival: false,\n closedDeparture: false,\n };\n\n const [inputFields, setInputFields] = useState([templateInputField]);\n const [ratePlanlist, setRatePlanlist] = useState([]);\n const handleAddFields = () => {\n const values = [...inputFields];\n values.push(templateInputField);\n setInputFields(values);\n };\n\n const handleRemoveFields = index => {\n const values = [...inputFields];\n values.splice(index, 1);\n setInputFields(values);\n };\n\n const handleInputChange = (index, event) => {\n const values = [...inputFields];\n switch (event.target.name) {\n case 'roomTypeId':\n values[index].roomTypeId = event.target.value;\n AxiosAPI({\n methed: 'get',\n url: `${gAPI_RatesPlan_List_ByRoomId}?roomId=${event.target.value}&status=1`,\n })\n .then(res => {\n const ratelist = res.data.ratePlans.map(elem => ({\n ratePlanId: elem.id,\n ratePlanName: elem.name,\n }));\n setRatePlanlist(ratelist);\n })\n .catch(err => {\n console.log(err);\n });\n break;\n case 'ratePlanId':\n values[index].ratePlanId = event.target.value;\n break;\n case 'startDate':\n values[index].startDate = event.target.value;\n break;\n case 'endDate':\n values[index].endDate = event.target.value;\n break;\n case 'maximumLengthOfStay':\n values[index].maximumLengthOfStay = event.target.value;\n break;\n case 'minimumLengthOfStay':\n values[index].minimumLengthOfStay = event.target.value;\n break;\n case 'stopSell':\n values[index].stopSell = event.target.value;\n break;\n case 'closedArrival':\n values[index].closedArrival = event.target.value;\n break;\n case 'closedDeparture':\n values[index].closedDeparture = event.target.value;\n break;\n\n default:\n break;\n }\n\n setInputFields(values);\n };\n\n const handleUpdate = () => {\n AxiosAPI({\n url: postAPI_Update_Restrictions,\n method: 'post',\n data: {\n propertyId,\n data: inputFields,\n },\n }).then(\n setTimeout(() => {\n window.location.reload();\n }, 500)\n );\n };\n\n return (\n \n \n + Add More\n \n {inputFields.length > 1 && (\n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n >\n -\n \n )}\n
\n \n \n Edit Restrictions \n \n \n \n {inputFields.map((inputField, index) => (\n \n \n \n \n \n handleInputChange(index, event)}\n >\n \n {roomlist.map((elem, index) => (\n \n ))}\n \n {/* Choose the room type! */}\n \n \n \n \n \n handleInputChange(index, event)}\n >\n \n {ratePlanlist.map((elem, index) => (\n \n ))}\n \n {/* Choose the room type! */}\n \n \n \n \n \n handleInputChange(index, event)}\n />\n {/* Choose the start date! */}\n \n \n \n \n \n handleInputChange(index, event)}\n />\n {/* Choose the end date! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.maximumLengthOfStay}\n />\n {/* Set the inventory number! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.minimumLengthOfStay}\n />\n {/* Set the inventory number! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.stopSell}\n >\n \n \n \n {/* Set the inventory number! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.closedArrival}\n >\n \n \n \n {/* Set the inventory number! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.closedDeparture}\n >\n \n \n \n {/* Set the inventory number! */}\n \n \n \n \n
\n \n ))}\n \n \n \n \n \n \n \n \n
\n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(RestrictionsEditModal));\n","import React, { useState, Fragment } from 'react';\nimport {\n Row,\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n Label,\n} from 'reactstrap';\n\nimport { AvForm, AvGroup, AvInput } from 'availity-reactstrap-validation';\nimport { Colxx } from '../../../../../components/common/CustomBootstrap';\n\nimport { AxiosAPI } from '../../../../../helpers/AxiosAPI';\nimport { postAPI_Update_Rates } from '../../../../../constants/APIs';\nimport { gAPI_RatesPlan_List_ByRoomId } from '../../../../../constants/APIs';\nimport currencies from '../../../../../data/currencies';\n// Redux\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\n\nfunction RatesEditModal({\n isVisible,\n toggleModal,\n propertyId,\n roomlist,\n ratelist,\n}) {\n //console.log('ratelist', ratelist);\n const templateInputField = {\n roomTypeId: '',\n ratePlanId: '',\n startDate: '',\n endDate: '',\n amount: 0,\n includeTax: true,\n numberOfGuests: 0,\n currency: 'NZD',\n };\n\n const [inputFields, setInputFields] = useState([templateInputField]);\n const [ratePlanlist, setRatePlanlist] = useState([]);\n const handleAddFields = () => {\n const values = [...inputFields];\n values.push(templateInputField);\n setInputFields(values);\n };\n\n const handleRemoveFields = index => {\n const values = [...inputFields];\n values.splice(index, 1);\n setInputFields(values);\n };\n\n const handleInputChange = (index, event) => {\n const values = [...inputFields];\n switch (event.target.name) {\n case 'roomTypeId':\n values[index].roomTypeId = event.target.value;\n AxiosAPI({\n methed: 'get',\n url: `${gAPI_RatesPlan_List_ByRoomId}?roomId=${event.target.value}&status=1`,\n })\n .then(res => {\n const ratelist = res.data.ratePlans.map(elem => ({\n ratePlanId: elem.id,\n ratePlanName: elem.name,\n }));\n setRatePlanlist(ratelist);\n })\n .catch(err => {\n console.log(err);\n });\n break;\n case 'ratePlanId':\n values[index].ratePlanId = event.target.value;\n break;\n case 'startDate':\n values[index].startDate = event.target.value;\n break;\n case 'endDate':\n values[index].endDate = event.target.value;\n break;\n case 'amount':\n values[index].amount = event.target.value;\n break;\n case 'includeTax':\n values[index].includeTax = event.target.value;\n break;\n case 'numberOfGuests':\n values[index].numberOfGuests = event.target.value;\n break;\n case 'currency':\n values[index].currency = event.target.value;\n break;\n\n default:\n break;\n }\n\n setInputFields(values);\n };\n\n const handleUpdate = () => {\n AxiosAPI({\n url: postAPI_Update_Rates,\n method: 'post',\n data: {\n propertyId,\n data: inputFields,\n },\n }).then(\n setTimeout(() => {\n window.location.reload();\n }, 500)\n );\n };\n\n const selectCurrencies = currencies.sort(dynamicSort(\"label\")).map(item => {\n return \n });\n\n function dynamicSort(property) {\n var sortOrder = 1;\n if (property[0] === \"-\") {\n sortOrder = -1;\n property = property.substr(1);\n }\n return function (a, b) {\n /* next line works with strings and numbers, \n * and you may want to customize it to your needs\n */\n var result = (a[property] < b[property]) ? -1 : (a[property] > b[property]) ? 1 : 0;\n return result * sortOrder;\n }\n }\n\n return (\n \n \n + Add More\n \n {inputFields.length > 1 && (\n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n >\n -\n \n )}\n
\n \n \n Edit Rates \n \n \n \n {inputFields.map((inputField, index) => (\n \n \n \n \n \n handleInputChange(index, event)}\n >\n \n {roomlist.map((elem, index) => (\n \n ))}\n \n {/* Choose the room type! */}\n \n \n \n \n \n handleInputChange(index, event)}\n >\n \n {ratePlanlist.map((elem, index) => (\n \n ))}\n \n {/* Choose the room type! */}\n \n \n \n \n \n handleInputChange(index, event)}\n />\n {/* Choose the start date! */}\n \n \n \n \n \n handleInputChange(index, event)}\n />\n {/* Choose the end date! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.amount}\n />\n {/* Set the inventory number! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.includeTax}\n >\n \n \n \n {/* Set the inventory number! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.numberOfGuests}\n >\n {/* Set the inventory number! */}\n \n \n \n \n \n handleInputChange(index, event)}\n value={inputField.currency}\n >\n {selectCurrencies}\n \n {/* Set the inventory number! */}\n \n \n \n \n
\n \n ))}\n \n \n \n \n \n \n \n \n
\n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(RatesEditModal));\n","import React, { useState, useEffect, Fragment } from 'react';\nimport 'react-datepicker/dist/react-datepicker.css';\nimport { faSuitcaseRolling } from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { Button, Row } from 'reactstrap';\nimport Cell from './components/Cell';\nimport RateCell from './components/RateCell';\nimport Legend from './Legend';\nimport {\n TableSytle,\n HorizontalContainer,\n VerticalContainer,\n CellHeader,\n CellHeader2,\n} from './Layout';\nimport InventoryEditModal from './components/InventoryEditModal';\n\n// Redux\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\n\nimport { AxiosAPI } from '../../../../helpers/AxiosAPI';\nimport { gAPI_Ari_Room } from '../../../../constants/APIs';\nimport { gAPI_LinkedRoomList_ByPropertyId } from '../../../../constants/APIs';\nimport RestrictionsEditModal from './components/RestrictionsEditModal';\nimport RatesEditModal from './components/RatesEditModal';\n\nconst Room = ({ roomData, isEditingInventoryCell, currency }) => {\n const [display, setDisplay] = useState(true);\n const [style, setStyle] = useState({});\n\n useEffect(() => {\n if (display) {\n setStyle({\n display: 'flex',\n });\n } else {\n setStyle({\n display: 'none',\n });\n }\n }, [display]);\n return (\n \n \n + Add More\n \n {inputFields.length > 1 && (\n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n >\n -\n \n )}\n
\n \n | \n
\n );\n })}\n \n \n {roomDate.map((data, index) => (\n \n \n {\n setIsEditingBulkInventory(!isEditingBulkInventory);\n }}\n isVisible={isEditingBulkInventory}\n roomlist={roomlist}\n />\n {\n setIsEditingBulkRestriction(!isEditingBulkRestriction);\n }}\n isVisible={isEditingBulkRestriction}\n roomlist={roomlist}\n ratelist={ratelist}\n />\n {\n setIsEditingBulkRates(!isEditingBulkRates);\n }}\n isVisible={isEditingBulkRates}\n roomlist={roomlist}\n ratelist={ratelist}\n />\n \n {isEditingInventoryCell ? (\n {\n setTimeout(() => {\n window.location.reload();\n }, 300);\n }}\n >\n Confirm All\n \n ) : (\n setIsEditingInventoryCell(!isEditingInventoryCell)}\n >\n Edit Inventory and Rate\n \n )}\n setIsEditingBulkInventory(!isEditingBulkInventory)}\n >\n Bulk Edit Inventory\n \n setIsEditingBulkRates(!isEditingBulkRates)}\n >\n Bulk Edit Rate\n \n setIsEditingBulkRestriction(!isEditingBulkRestriction)}\n >\n Bulk Edit Restriction\n \n
\n
\n );\n};\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId, currency } = settings;\n return {\n propertyId,\n currency\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(AriRoomsTable));\n","import React, { useState, Fragment } from 'react';\nimport { Row } from 'reactstrap';\nimport { Colxx } from '../../../../components/common/CustomBootstrap';\n\nimport AriDatePicker from './AriDatePicker';\nimport AriRoomsTable from './AriRoomsTable';\nimport moment from 'moment';\n\nexport default function Index() {\n const [startDate, setStartDate] = useState(moment().format('YYYY-MM-DD'));\n const [endDate, setEndDate] = useState(\n moment()\n .add(30, 'days')\n .format('YYYY-MM-DD')\n );\n const getStartDate = date => {\n setStartDate(moment(date).format('YYYY-MM-DD'));\n setEndDate(\n moment(date)\n .add(30, 'days')\n .format('YYYY-MM-DD')\n );\n };\n\n return (\n \n setFont(e)}\n >\n \n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n \n \n \n \n\n \n\n\n \n\n\n \n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n\n\n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n\n \n {botSettings.customFonts !== undefined && botSettings.customFonts.length > 0 && botSettings.customFonts.map((m) => {\n return (\n \n );\n })}\n\n \n
);\n}","import React, { useState, useEffect, Fragment } from 'react';\nimport {\n Card,\n CardBody,\n CardImg,\n ButtonGroup,\n Button,\n Row,\n Modal,\n ModalHeader,\n CustomInput,\n InputGroupAddon,\n InputGroupText,\n Input,\n ModalBody,\n InputGroup,\n} from 'reactstrap';\n\nimport {\n Separator,\n Colxx,\n} from '../../../../../components/common/CustomBootstrap';\nimport {\n colorBlockStlye,\n SelectStyle,\n InputStlye,\n setBackGroundColor,\n} from '../style/DigitalAssistantStyle';\n\nimport avatars from '../data/avatarData';\n//import Avatar from './Avatar';\nimport ImageGallery from '../../propinfo/gallery/index';\nimport { getGroupID } from '../../../../../helpers/AxiosAPI';\nimport { ChromePicker } from 'react-color';\nimport FontsList from './FontsList';\nexport default function DigitalAssistant({\n isVoucher = false,\n botSettings,integration,\n saveIntegration,\n allProperties,propertyId,\n integrationId,\n}) {\n /** Avatar state */\n const [isSelected, setIsSelected] = useState({\n Jenni: false,\n Novi: false,\n Bob: false,\n Sarah: false,\n Wallis: false,\n });\n const [isAivaHide,setIsAivaHide]=useState(integration.isaivaHide ||false);\n const [error, setError] = useState(true);\n const [avatarLink, setAvatarLink] = useState('');\n const [avatarName, setAvatarName] = useState('');\n const [isFooterHide, setIsFooterHide] = useState(botSettings.isFooterHide);\n const [applyPromoCode, setApplyPromoCode] = useState(integration.applyPromoCode);\n const [displayVouchers, setDisplayVouchers] = useState('');\n const [galleryVisible, setGalleryVisible] = useState(false);\n /** other Digital Assistant state */\n const [edit, setEdit] = useState(true);\n const [fontsList,setFontsList]=useState({\n 'title':'',\n 'subTitle':'',\n 'voucherTitle':'',\n 'voucherDescription':'',\n 'website':'',\n 'buttonText':'',\n });\n const [setting, setSetting] = useState(botSettings);\n let [colorSettings, setColorSettings] = useState(botSettings.colours !== undefined ? botSettings.colours :\n {\n 'primaryColor': '',\n 'buttonColor': '',\n 'redeemBar': '',\n 'redeemButton': '',\n 'redeemButton': '',\n 'buttonTextColor': '',\n 'redeemTextColor': '',\n 'shoppingBar': '',\n 'shoppingBarText': '',\n\n });\n let [iseditMode, setEditMode] = useState({\n 'title': false,\n 'subTitle': false,\n 'arrow': false,\n 'primaryColor': false,\n 'buttonColor': false,\n 'redeemBar': false,\n 'redeemButton': false,\n 'buttonTextColor': false,\n 'redeemTextColor': false,\n 'shoppingBar': false,\n 'shoppingBarText': false,\n });\n\n const handleColoursReset = () => { \n\n let colours = colorSettings;\n colours.title = 'black';\n colours.subtitle = 'black';\n colours.primaryColor = '#E31B78';\n colours.buttonColor = '#033DA5';\n colours.redeemBar = '#FA8DAB';\n colours.redeemButton = '#F5D2E3';\n colours.buttonTextColor = 'white';\n colours.redeemTextColor = 'black';\n colours.shoppingBar = '#ED187B';\n colours.shoppingBarText = 'white'; \n setColorSettings(colorSettings);\n \n let fontDetails = fontsList;\n fontDetails.title=\"Helvetica-Bold\";\n fontDetails.subTitle=\"Helvetica\";\n fontDetails.voucherTitle=\"Helvetica\";\n fontDetails.voucherDescription=\"Helvetica\";\n fontDetails.website=\"Helvetica-Bold\";\n fontDetails.buttonText=\"Helvetica\"; \n setFontsList(fontDetails); \n handleSave(\"Helvetica-Bold\");\n}\n\n\n useEffect(() => {\n if (botSettings) {\n setSetting(botSettings);\n setFontsList(botSettings.fonts);\n setAvatarName(botSettings.name);\n setAvatarLink(botSettings.urls.icon);\n setDisplayVouchers(botSettings.displayVouchers);\n setIsSelected({ ...avatars, [botSettings.name]: true });\n }\n }, [botSettings]);\n\n\n useEffect(() => {\n if (setting) {\n setSetting({\n ...setting,\n urls: { ...setting.urls, icon: avatarLink },\n });\n }\n }, [avatarLink]);\n const RedirectToDemo = () => {\n var url = `${process.env.REACT_APP_BOT_DEMO\n }?gid=${getGroupID()}&iid=${integrationId}`;\n window.open(url, '_blank');\n };\n const handleColorChange = (e) => {\n const value = e.target.value;\n setSetting({\n ...setting,\n colours: { ...setting.colours, [e.target.name]: value },\n });\n };\n\n const handleChange = (e) => {\n const value = e.target.value;\n setSetting({\n ...setting,\n [e.target.name]: value,\n });\n };\n\n const handleSave = () => { \n setting.isFooterHide = isFooterHide;\n setting.colours = colorSettings;\n setting.fonts=fontsList; \n saveIntegration({ botSetting: setting ,isaivaHide:isAivaHide, applyPromoCode : applyPromoCode});\n };\n const handleAivaChange=(e)=>{ \n setIsAivaHide(e.target.checked);\n }\n const togglegallery = () => {\n setGalleryVisible(!galleryVisible);\n };\n const selectedImage = (image) => {\n setAvatarLink(image.src);\n setSetting({\n ...setting,\n name: image.caption,\n });\n };\n const SetClose = () => {\n setEditMode({\n 'title': false,\n 'subTitle': false,\n 'arrow': false,\n 'primaryColor': false,\n 'buttonColor': false,\n 'redeemBar': false,\n 'redeemButton': false,\n 'buttonTextColor': false,\n 'redeemTextColor': false,\n 'shoppingBar': false,\n 'shoppingBarText': false,\n });\n };\n const CloseColorBox = (event) => {\n if ((iseditMode.title === true || iseditMode.arrow === true ||\n iseditMode.subTitle === true || iseditMode.primaryColor === true || iseditMode.buttonColor === true || iseditMode.redeemBar === true\n || iseditMode.redeemButton === true || iseditMode.buttonTextColor === true ||\n iseditMode.shoppingBar === true || iseditMode.shoppingBarText === true)) {\n SetClose();\n\n }\n };\n // const selectAvatar = (name, link) => {\n // const avatars = {\n // Jenni: false,\n // Novi: false,\n // Bob: false,\n // Sarah: false,\n // Wallis: false,\n // };\n // setIsSelected({ ...avatars, [name]: true });\n // setAvatarLink(link);\n // setAvatarName(name);\n // setSetting({\n // ...setting,\n // name,\n // });\n // };\n\n const ImageGalleryButton = () => {\n return (\n \n {\n setEdit(!edit);\n }}\n >\n Edit\n \n \n Preview\n \n
\n {features()}\n Choose icon
\n Display Vouchers
\n \n
\n \n \n {setting.displayVouchers === 1 ? \"As Per Voucher Order Defined\" : \"Random Rotation\"}
\n Change Edit to change
\n\n
\n {iseditMode.buttonTextColor && { e.stopPropagation(); }}>\n
\n Button Text Color
\n \n \n {\n let colours = colorSettings;\n colours.buttonTextColor = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n value={colorSettings.buttonTextColor}\n />\n \n {\n setEditMode({ ...iseditMode, buttonTextColor: !iseditMode.buttonTextColor });\n }\n } className=\"color-square\" style={setBackGroundColor(colorSettings.buttonTextColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = colorSettings;\n colours.buttonTextColor = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemTextColor && { e.stopPropagation(); }}>\n
\n Redeem Text Color
\n \n \n {\n let colours = colorSettings;\n colours.redeemTextColor = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n value={colorSettings.redeemTextColor}\n />\n \n {\n setEditMode({ ...iseditMode, redeemTextColor: !iseditMode.redeemTextColor });\n }\n } className=\"color-square\" style={setBackGroundColor(colorSettings.redeemTextColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = colorSettings;\n colours.redeemTextColor = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n \n {iseditMode.shoppingBar && { e.stopPropagation(); }}>\n \n {\n let colours = colorSettings;\n colours.shoppingBar = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n />\n \n {\n setEditMode({ ...iseditMode, shoppingBar: !iseditMode.shoppingBar });\n }} className=\"color-square\" style={setBackGroundColor(colorSettings.shoppingBar)}> \n \n \n
\n Shopping Bar
\n < div className='col-md-6' >\n \n
}\n { e.stopPropagation(); }}>\n {\n if (edit) {\n let colours = colorSettings;\n colours.shoppingBar = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n
\n \n {iseditMode.shoppingBarText && { e.stopPropagation(); }}>\n \n {\n let colours = colorSettings;\n colours.shoppingBarText = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n />\n \n {\n setEditMode({ ...iseditMode, shoppingBarText: !iseditMode.shoppingBarText });\n }} className=\"color-square\" style={setBackGroundColor(colorSettings.shoppingBarText)}> \n \n \n
\n Shopping Bar Text
\n < div className='col-md-6 ' >\n \n
}\n { e.stopPropagation(); }}>\n {\n if (edit) {\n let colours = colorSettings;\n colours.shoppingBarText = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n
\n {iseditMode.primaryColor && { e.stopPropagation(); }}>\n
\n Primary Color
\n \n \n {\n let colours = colorSettings;\n colours.primaryColor = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n value={colorSettings.primaryColor}\n />\n \n {\n setEditMode({ ...iseditMode, primaryColor: !iseditMode.primaryColor });\n }\n } className=\"color-square\" style={setBackGroundColor(colorSettings.primaryColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = colorSettings;\n colours.primaryColor = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.buttonColor && { e.stopPropagation(); }}>\n
\n Button Color
\n \n \n {\n let colours = colorSettings;\n colours.buttonColor = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n value={colorSettings.buttonColor}\n />\n \n {\n setEditMode({ ...iseditMode, buttonColor: !iseditMode.buttonColor });\n }\n } className=\"color-square\" style={setBackGroundColor(colorSettings.buttonColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = colorSettings;\n colours.buttonColor = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemBar && { e.stopPropagation(); }}>\n
\n Redeem Bar
\n \n \n {\n let colours = colorSettings;\n colours.redeemBar = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n value={colorSettings.redeemBar}\n />\n \n {\n setEditMode({ ...iseditMode, redeemBar: !iseditMode.redeemBar });\n }\n } className=\"color-square\" style={setBackGroundColor(colorSettings.redeemBar)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = colorSettings;\n colours.redeemBar = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemButton && { e.stopPropagation(); }}>\n
\n Redeem Button
\n \n \n {\n let colours = colorSettings;\n colours.redeemButton = e.target.value;\n setColorSettings({ ...colorSettings, colours: colours });\n }}\n value={colorSettings.redeemButton}\n />\n \n {\n setEditMode({ ...iseditMode, redeemButton: !iseditMode.redeemButton });\n }\n } className=\"color-square\" style={setBackGroundColor(colorSettings.redeemButton)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = colorSettings;\n colours.redeemButton = e.hex;\n setColorSettings({ ...colorSettings, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n \n \n {\n setEdit(!edit);\n }}\n >\n Cancel\n \n \n
\n\n Digital Assistant
\n\n \n Browse Avatars\n \n
\n\n Display Vouchers
\n\n \n
\n {features()}\n\n \n setSetting({ ...setting, displayVouchers: e.target.value })}>\n \n \n
\n Font Settings
\n \n \n } \n
\n \n
\n {fontsList !== undefined && \n
\n
\n \n Website Font Name \n
\n \n
\n setFontsList({ ...fontsList, website: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Title Font \n
\n \n
\n setFontsList({ ...fontsList, title: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Subtitle Font \n
\n \n
\n setFontsList({ ...fontsList, subTitle: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Button Font \n
\n \n
\n setFontsList({ ...fontsList, buttonText: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Voucher Title Font \n
\n \n
\n setFontsList({ ...fontsList, voucherTitle: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Voucher Description Font \n
\n \n
\n setFontsList({ ...fontsList, voucherDescription: e.target.value })}> \n
\n \n Replace the eVoucher email from text to \"{allProperties.filter((m)=>m.id===propertyId)[0].name}\", otherwise shows as \"aiva\"\n
\n \n e.target.checked === true ? setIsFooterHide(true) : setIsFooterHide(false)}\n >Hide \"Grow with aiva\"\n
\n \n e.target.checked === true ? setApplyPromoCode(true) : setApplyPromoCode(false)}\n >Show \"Gift card or promo code\" option\n
\n \n {\n handleColoursReset();\n }}\n >\n Reset to default font and colors\n \n
\n \n setIsEditing(!isEditing)}\n >\n Edit\n \n
\n \n Select Businesses\n
\n{integration ? integration.name : null}
\n\n
\n Group
\n\n \n ({integration ? integration.groupId : null})\n \n
\n \n
\n Select Businesses to include in this Voucher Store
\n\n {formatedProperties\n ? formatedProperties.map((elem, index) => {\n return (\n
\n\n \n {elem ? elem.name : null}{' '}\n \n ({elem ? elem.id : null})\n \n
\n );\n })\n : null}\n \n \n Integration Information{' '}\n
\n \n \n setIsEditing(!isEditing)}\n >\n Cancel\n \n \n
\n \n Integration Information{' '}\n
\n \n
\n Integration Name
\n\n
\n Group
\n\n \n ({integration ? integration.groupId : null})\n \n
\n \n
\n Select Businesses to include in this Voucher Store
\n \n\n setIsShowMembership(e.target.checked)}\n />\n
\n Members Only
\n\n {isShowMembership === true && showselect===true &&\n \n }\n
\n {integration.channel==\"EmbedVoucher\" &&\n Memberships
\n\n setAllVouchers(e.target.checked)}\n />\n
}\n All Vouchers
\n\n { setOwnTag(e.target.value) }}\n />\n
\n {JSON.stringify(updateEyeCatcherNudgesData, null, 2)} */}\n \n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n Nudges
\n\n {/* Greeting\n edit(nudge, index)}\n >\n Edit\n \n
\n \n {nudge.greeting ? nudge.greeting.response.messages[0] : null}\n
*/}\n Eye Catcher\n\n {nudge.eyeCatcher\n ? nudge.eyeCatcher.response.messages[0]\n : null}\n
\n Delay in Seconds\n\n {nudge.delayInMilliseconds\n ? nudge.delayInMilliseconds / 1000\n : null}\n s\n
\n\n {\n setEdit(!edit);\n }}\n >\n Edit\n \n
\n Languages:
\n\n Enable:\n {botSettings.multilingual ? 'Yes' : 'No'}\n
\n \n Default Language: {selectedLanguage.label}\n
\n \n Selected Languages:\n \n {botLanguages.map((lang, msgIndex) => {\n return (\n \n {' '}\n \n );\n })}\n
\n
\n {lang.name}
\n\n \n \n {\n setEdit(!edit);\n }}\n >\n Cancel\n \n \n
\n Language
\n\n Enable\n
\n
\n \n
\n Choose Languages\n
\n\n {botLanguagesList.map((elem, index) => (\n \n {' '}\n \n {elem.name}\n \n \n ))}\n
\n
\n\n \n
\n Default Language\n
\n
\n\n \n
Publish your Assistant
\n\n \n {' '}\n <!-- This is start of the Book Me Bob digital\n assistant code -->\n \n <script>\n \n var BMB_BOT_domain =\n '{process.env.REACT_APP_WEBCHAT_API}/';\n \n \n var BMB_BOT_botHTMLPath =\n BMB_BOT_domain + 'index.html';\n \n \n var BMB_BOT_head =\n document.getElementsByTagName('head')[0];\n \n \n var BMB_BOT_script =\n document.createElement('script');\n \n \n BMB_BOT_script.type =\n 'text/javascript';\n \n \n BMB_BOT_script.src = BMB_BOT_domain +\n 'chatplugin.js';\n \n \n BMB_BOT_head.appendChild(BMB_BOT_script);\n \n \n var BMB_BOT_gid = '{getGroupID()}';\n \n \n var BMB_BOT_iid = '{integration.id}';\n \n var BMB_BOT_pid = '';\n </script>\n \n {' '}\n <!-- This is end of the Book Me Bob digital\n assistant code -->{' '}\n \n
\n \n setCopied(true)}>\n \n Copy the code snippet\n \n \n \n Preview\n \n {copied ?
\n \n \n Copy and paste this code before the closing </body>\n tag on every page of your website.\n \n
\n Copied.
: null}\n Embed your Assistant
\n\n \n <iframe frameborder=\"0\" style=\"bottom: 0; right: 0; margin:\n 0; z-index: 2000001;height:630px;width:390px;\"\n id=\"chatbotiframe\"\n src=\"{process.env.REACT_APP_WEBCHAT_API}?location=&title=&referrer=&iid=\n {integration.id}&gid={getGroupID()}\n &mobile=false&open=1&custom=1\"></iframe>\n \n
\n \n setIframeCopied(true)}\n >\n \n Copy the code snippet\n \n \n \n Preview\n \n {iframecopied ?
\n \n \n Copy and paste this code at desired location on the page of\n your website.\n \n
\n Copied.
: null}\n \n {\n setEdit(!edit);\n }}\n >\n Edit\n \n
\n Position:
\n\n Alignment: {botSettings.bubbleSettings.bubblePosition.align}\n
\n \n Alignment Margin: {botSettings.bubbleSettings.bubblePosition.side}px\n
\n \n Bottom Margin: {botSettings.bubbleSettings.bubblePosition.bottom}px\n
\n \n \n \n {\n setEdit(!edit);\n }}\n >\n Cancel\n \n \n
\n Position
\n\n Alignment\n
\n\n \n \n \n
\n \n
\n Alignment Margin (px)\n
\n
\n \n
\n Bottom Margin (px)\n
\n
\n\n \n\n\n\n \n
\n
\n Example
\nPublish your Vouchers
\n\n \n {' '}\n <!-- This is start of the aiva voucher\n assistant code -->\n \n <script>\n \n var aiva_Voucher_domain ='{process.env.REACT_APP_VOUCHER_URL}';\n \n \n var aiva_Voucher_botHTMLPath =\n aiva_Voucher_domain;\n \n \n var aiva_Voucher_head =\n document.getElementsByTagName('head')[0];\n \n \n var aiva_Voucher_script =\n document.createElement('script');\n \n \n aiva_Voucher_script.type =\n 'text/javascript';\n \n \n aiva_Voucher_script.src =\n aiva_Voucher_domain + 'voucherplugin.js';\n \n \n aiva_Voucher_head.appendChild(aiva_Voucher_script);\n \n \n var aiva_Voucher_gid = '{getGroupID()}\n ';\n \n \n var aiva_Voucher_iid = '\n {integration.id}';\n \n var aiva_Voucher_pid = '';\n </script>\n \n {' '}\n <!-- This is end of the aiva voucher\n assistant code -->{' '}\n \n
\n \n setShowEmailBox(!showEmailBox)}\n >\n Email to developer\n \n setCopied(true)}>\n \n Copy the code snippet\n \n \n \n Preview\n \n\n {copied ?
\n \n \n Copy and paste this code before the closing </body>\n tag on every page of your website.\n \n
\n Copied.
: null}\n Embed your Assistant
\n\n \n <iframe frameborder=\"0\" style=\"bottom: 0; right: 0; margin:\n 0; z-index: 2000001;height:630px;width:390px;\"\n id=\"voucherbotiframe\" src=\"https://vouchers.getaiva.com/voucherengine?location=&title=&referrer=&iid=\n {integration.id}&gid={getGroupID()}\n &mobile=false&open=1&custom=1\"></iframe>\n \n
\n \n setIframeCopied(true)}\n >\n \n Copy the code snippet\n \n \n \n Preview\n \n {iframecopied ?
\n \n \n Copy and paste this code at desired location on the page of\n your website.\n \n
\n\n Copied.
: null}\n Direct Link
\n\n \n https://vouchers.getaiva.com/voucherengine?location=&title=&referrer=&iid=\n {integration.id}&gid={getGroupID()}\n &mobile=false&open=1&custom=1\n \n
\n \n setDirectLinkCopied(true)}\n >\n \n Copy the URL\n \n \n \n Preview\n \n {directLinkCopied ?
\n \n \n Copy and paste this code at desired location on the page of\n your website.\n \n
\n\n Copied.
: null}\n Publish your Vouchers
\n\n \n {' '}\n <!-- This is start of the aiva voucher\n assistant code -->\n \n <script>\n \n var aiva_Voucher_domain ='{process.env.REACT_APP_VOUCHER_URL}/';\n \n \n var aiva_Voucher_botHTMLPath =\n aiva_Voucher_domain;\n \n \n var aiva_Voucher_head =\n document.getElementsByTagName('head')[0];\n \n \n var aiva_Voucher_script =\n document.createElement('script');\n \n \n aiva_Voucher_script.type =\n 'text/javascript';\n \n \n aiva_Voucher_script.src =\n aiva_Voucher_domain + 'embedVoucherPlugin.js';\n \n \n aiva_Voucher_head.appendChild(aiva_Voucher_script);\n \n \n var aiva_Voucher_gid = '{getGroupID()}\n ';\n \n \n var aiva_Voucher_iid = '\n {integration.id}';\n \n var aiva_Voucher_pid = '';\n </script>\n \n {' '}\n <!-- This is end of the aiva voucher\n assistant code -->{' '}\n \n
\n \n setEmbedScriptCopied(true)}>\n \n Copy the code snippet\n \n \n {embedScriptcopied ?
\n \n \n Copy and paste this code before the closing </body>\n tag on every page of your website.\n \n
\n Copied.
: null}\n Embed your Assistant
\n\n \n <iframe frameborder=\"0\" style=\"bottom: 0; right: 0; margin:\n 0; z-index: 2000001;height:630px;width:390px;\"\n id=\"voucherFrame\" src=\"{process.env.REACT_APP_VOUCHER_URL}/embedVoucher?location=&title=&referrer=&iid=\n {integration.id}&gid={getGroupID()}\n &mobile=false&open=1&embed=1&custom=1\"></iframe>\n \n
\n \n setEmbedIframeCopied(true)}\n >\n \n Copy the code snippet\n \n \n {/* \n Preview\n */}\n {embedIframecopied ?
\n \n \n Copy and paste this code at desired location on the page of\n your website.\n \n
\n\n Copied.
: null}\n \n Your developer teammate will receive an e-mail containing the code\n and necessary instructions to implement it.\n
\n\n
\n \n
\n \n Drop files here to upload, or click to select files\n\n \n
\n\n \n \n
\n\n {files.map((file, index) => (\n
\n \n
\n\n ))}\n \n
\n\n {/* handleRemoveFields(index)}\n >\n {\" \"}\n {\" \"}\n */}\n \n
\n \n 
\n
\n \n \n
\n \n \n {\" \"}\n {file.img.name}{\" \"}\n
\n {file.img.size}
\n \n {\n setAgree(!isAgree);\n }}\n >\n I have copyright or permissions to use this font file\n\n \n
\n \n \n\n
\n \n \n );\n })}\n \n Add Fonts\n \n handleSave()}\n >\n Save\n \n
\n {ImageGalleryButton()}\n \n Upload Fonts\n
\n\n
\n \n
\n Font Name
\n\n handleSaveName(e,m.id)}\n name=\"name\"\n />\n
\n \n
\n\n Font Link
\n\n handleSaveLink(e,m.id)}\n name=\"name\"\n />\n
\n \n togglegallery(m.id)}\n >\n Browse Fonts\n \n RemoveFonts(m.id)}\n >\n Remove Fonts\n \n
\n \n Font file is not valid. Try again after some time.\n
\n\n
\n \n Custom Emails (Coming Soon) \n
\n\n handleSwitchChange(primary)}\n />\n
\n \n \n {selectedItem} \n \n setSelectedItem(e.target.value)}>\n Voucher Email\n \n setSelectedItem(e.target.value)}>\n Gift Voucher Email\n \n setSelectedItem(e.target.value)}>\n E Card Email\n \n setSelectedItem(e.target.value)}>\n E Gift Card Email\n \n \n \n
\n {selectedItem == \"Voucher Email\" && \n \n \n setIsEditing(!isEditing)}\n >\n Cancel\n \n \n
\n \n \n
\n \n Select Businesses \n
\n\n Select the businesses that are visible through this voucher store\n
\n\n
\n \n
\n \n Appearance\n
\n\n Choose the icon to display on your website\n
\n\n
\n \n
\n \n Nudges\n
\n\n Setup proactive messages to engage the website visitors\n
\n\n
\n \n
\n \n Position\n
\n\n Control the position of the Vouchers icon on your website\n
\n\n
\n \n
\n \n Language\n
\n\n Select the languages for the chat widget\n
\n\n
\n \n
\n \n Custom Emails\n
\n\n Select the languages for the chat widget\n
\n\n
\n \n
\n \n Custom Fonts\n
\n\n Control the fonts of aiva widget on your website\n
\n\n
\n \n
\n \n Publish to your website\n
\n\n Copy the code snippet to install your Voucher plug-in\n
\n\n
\n \n \n Preview\n \n\n
\n \n \n Archive\n \n\n
\n \n \n | \n \n ) : (\n \n | \n \n )}\n
\n {messageInput}
\n ) : (\nThis is an example {example}
\n )}\n\n
\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n \n \n Caption \n \n \n \n
\n \n Image Link \n \n \n \n
\n \n \n \n \n \n \n
\n \n \n Caption \n \n \n \n
\n \n Video Link \n \n \n \n
\n \n \n \n \n \n\n \n Save\n \n \n \n Cancel\n \n
\n \n \n \n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId, locale } = settings;\n return {\n propertyId, locale\n };\n};\n\nexport default injectIntl(connect(mapStateToProps)(VideoLink));","import React, { useState, useEffect } from 'react';\nimport {\n Row, Input, Button, Modal,\n ModalHeader,\n ModalBody\n} from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\n\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\n\nimport { putAPI_Update_Response } from '../../../../../../constants/APIs';\nimport { AxiosAPI, getGroupID } from '../../../../../../helpers/AxiosAPI';\nimport ImageGallery from '../../gallery/index'\n\nfunction BotResponseButton({\n reloadBotResponse,\n caption,\n url,\n code,\n messages,\n link,\n details,\n index,\n setIsEditingToFalse,\n setIsAddImageToFalse,\n isAddImage,\n /** Globle property id from redux */\n propertyId,\n type,\n toggleButtonAddedd,\n buttonText,\n buttonValue,\n urls,\n captions,\n toggleButtonMessageAddedd,\n locale\n}) {\n const [buttonTextInput, setButtonTextInput] = useState(buttonText);\n\n const [postData, setPostData] = useState({\n GroupId: getGroupID(),\n Code: code,\n Language: `${locale === 'en' ? 'en-US' : locale}`,\n Channel: 'WebsiteDirectLine',\n PropertyId: propertyId,\n Default: null,\n Overrides: {},\n });\n\n useEffect(() => {\n if (type === \"link\") {\n setPostData(pre => {\n return {\n ...pre,\n Default: {\n Messages: messages,\n Url: link,\n Caption: caption,\n apiButtons: [{ text: buttonTextInput, value: buttonValue }]\n },\n };\n });\n //('Image Post Data', postData);\n }\n else if (type === \"messages\") {\n setPostData(pre => {\n return {\n ...pre,\n Default: messages,\n apiButtons: [{ text: buttonTextInput, value: buttonValue }],\n };\n });\n //console.log('Image Post Data', postData);\n }\n else if (type === \"imagecarousel\") {\n let imageList = [];\n imageList = urls.map((url, index) => {\n const imgCaption = captions[index];\n return { Url: url, Caption: imgCaption };\n });\n setPostData(pre => {\n return {\n ...pre,\n Default: {\n Messages: messages,\n Images: imageList,\n apiButtons: [{ text: buttonTextInput, value: buttonValue }]\n },\n };\n });\n //console.log('Image Post Data', postData);\n }\n else if (type === \"video\") {\n let videoList = [];\n videoList = urls.map((url, index) => {\n const videoCaption = captions[index];\n return { Url: url, Caption: videoCaption };\n });\n setPostData(pre => {\n return {\n ...pre,\n Default: {\n Messages: messages,\n Videos: videoList,\n apiButtons: [{ text: buttonTextInput, value: buttonValue }]\n },\n };\n });\n //console.log('Image Post Data', postData);\n }\n }, [buttonTextInput]);\n\n const handleCaptionChange = e => {\n setButtonTextInput(e.target.value);\n };\n\n const handleSave = async () => {\n //console.log(postData)\n try {\n return await AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Response}`,\n data: postData,\n })\n .then(() => {\n if (setIsEditingToFalse) {\n setIsEditingToFalse();\n }\n if (setIsAddImageToFalse) {\n setIsAddImageToFalse();\n }\n })\n .finally(\n setTimeout(() => {\n toggleButtonAddedd();\n toggleButtonMessageAddedd();\n reloadBotResponse();\n }, 1000)\n );\n } catch (error) {\n console.error(error);\n }\n // toggleButtonAddedd();\n // reloadBotResponse();\n };\n\n const handleCancel = () => {\n if (setIsEditingToFalse) {\n setIsEditingToFalse();\n }\n if (setIsAddImageToFalse) {\n setIsAddImageToFalse();\n }\n toggleButtonAddedd();\n toggleButtonMessageAddedd();\n };\n return (\n \n \n {/* Button Title \n \n \n \n
\n \n \n \n \n \n\n \n Save\n \n \n \n Cancel\n \n
\n \n \n\n \n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId, locale } = settings;\n return {\n propertyId, locale\n };\n};\n\nexport default injectIntl(connect(mapStateToProps)(BotResponseButton));\n","import React from 'react';\nimport IntlMessages from '../../../../../../helpers/IntlMessages';\n\nimport { Button } from 'reactstrap';\nimport { faPlus, faBan } from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\n\nexport const AddImgButton = () => {\n return (\n {JSON.stringify(postData, null, 2)} */}\n \n
\n \n );\n};\n\nexport const AddLinkButton = ({ disabled }) => {\n return (\n \n \n {elem.query.category}\n \n
\n );\n}\n\n\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId, locale } = settings;\n return {\n propertyId, locale\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(ResponseInformation));\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Row, Card, CardBody, CardTitle } from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\nimport IntlMessages from '../../../../../../helpers/IntlMessages';\nimport { faPlug } from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\n\nexport default function Example({ example, child }) {\n return (\n {elem.query.hintQuestion}
\n {showFav === true && ( handleChecked(e)} >\n {favouriteResponse ?\n
\n {elem.query.detailedExplanation}
\n{example}
}\n\n
\n {button.query.buttonText}
\nOpening Hours
\n\n \n \n \n \n \n ⚠️\n \n Image will be deleted!\n \n \n deleteImage()}\n size=\"xs\"\n >\n Delete\n \n \n Cancel\n \n \n \n
\n );\n};\n\nfunction ImageCarousel(props) {\n const { reloadBotResponse, code, urls, captions, messages, SaveRecommenderQuestionCode, apiButtons, propertyId, locale } = props;\n const [isEditing, setIsEditing] = useState(false);\n const [isdeleteAllVisible, setIsdeleteAllVisible] = useState(false);\n const toggleAll = () => {\n setIsdeleteAllVisible(!isdeleteAllVisible);\n };\n const [postData, setPostData] = useState({\n GroupId: getGroupID(),\n Code: code,\n Language: `${props.locale === 'en' ? 'en-US' : props.locale}`,\n Channel: 'WebsiteDirectLine',\n PropertyId: props.propertyId,\n Default: null,\n Overrides: {},\n });\n\n //console.log(\"buttons\", apiButtons)\n const handleEdit = () => {\n setIsEditing(true);\n };\n\n const handleDelete = () => {\n let data = postData;\n data.Default.Images = []\n\n try {\n return AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Response}`,\n data: postData,\n })\n .then(\n setTimeout(() => {\n if (SaveRecommenderQuestionCode !== undefined) {\n SaveRecommenderQuestionCode();\n }\n else {\n reloadBotResponse();\n }\n }, 1000)\n );\n } catch (error) {\n console.error(error);\n }\n };\n\n const handleSingleDelete = (index) => {\n //TODO:\n let data = postData;\n data.Default.Images.splice(index, 1);\n\n try {\n return AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Response}`,\n data: postData,\n })\n .then(\n setTimeout(() => {\n if (SaveRecommenderQuestionCode !== undefined) {\n SaveRecommenderQuestionCode();\n }\n else {\n reloadBotResponse();\n }\n }, 1000)\n );\n } catch (error) {\n console.error(error);\n }\n };\n\n useEffect(() => {\n let imageList = [];\n setPostData(pre => {\n imageList = urls.map((url, index) => {\n const imgCaption = captions[index];\n return { Url: url, Caption: imgCaption };\n });\n //console.log('imageList', imageList);\n if (apiButtons !== undefined && apiButtons.length > 0) {\n let buttons = [];\n buttons = apiButtons.map((button, index) => {\n return { text: button.query.buttonText, value: button.query.code };\n });\n return {\n ...pre,\n Default: {\n Messages: messages,\n Images: imageList,\n apiButtons: buttons\n },\n };\n }\n else {\n return {\n ...pre,\n Default: {\n Messages: messages,\n Images: imageList\n },\n };\n }\n });\n }, []);\n\n const Editing = () => {\n return (\n \n ![{captions[index]}]({url})
\n \n {captions[index]}\n \n \n
\n\n \n
\n \n
\n );\n })}\n \n \n
\n \n \n \n \n \n \n ⚠️\n \n Video will be deleted!\n \n \n deleteImage()}\n size=\"xs\"\n >\n Delete\n \n \n Cancel\n \n \n \n
\n );\n};\n\nfunction Videos(props) {\n const { reloadBotResponse, code, urls, captions, messages, SaveRecommenderQuestionCode, apiButtons, propertyId, locale } = props;\n const [isEditing, setIsEditing] = useState(false);\n const [isdeleteAllVisible, setIsdeleteAllVisible] = useState(false);\n const [isYouTubeVideo, setIsyouTubeVideo] = useState(false);\n const toggleAll = () => {\n setIsdeleteAllVisible(!isdeleteAllVisible);\n };\n const [postData, setPostData] = useState({\n GroupId: getGroupID(),\n Code: code,\n Language: `${props.locale === 'en' ? 'en-US' : props.locale}`,\n Channel: 'WebsiteDirectLine',\n PropertyId: props.propertyId,\n Default: null,\n Overrides: {},\n });\n\n //console.log(\"buttons\", apiButtons)\n const handleEdit = () => {\n setIsEditing(true);\n\n };\n\n const handleDelete = () => {\n let data = postData;\n const arr = [...postData.Default.Messages];\n data.Default = arr;\n try {\n return AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Response}`,\n data: postData,\n })\n .then(\n setTimeout(() => {\n if (SaveRecommenderQuestionCode !== undefined) {\n SaveRecommenderQuestionCode();\n }\n else {\n reloadBotResponse();\n }\n }, 1000)\n );\n } catch (error) {\n console.error(error);\n }\n };\n\n const handleSingleDelete = (index) => {\n //TODO:\n let data = postData;\n data.Default.Videos.splice(index, 1);\n\n try {\n return AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Response}`,\n data: postData,\n })\n .then(\n setTimeout(() => {\n if (SaveRecommenderQuestionCode !== undefined) {\n SaveRecommenderQuestionCode();\n }\n else {\n reloadBotResponse();\n }\n }, 1000)\n );\n } catch (error) {\n console.error(error);\n }\n };\n\n useEffect(() => {\n let videoList = [];\n setPostData(pre => {\n videoList = urls.map((url, index) => {\n const videoCaption = captions[index];\n return { Url: url, Caption: videoCaption };\n });\n //console.log('imageList', imageList);\n if (apiButtons !== undefined && apiButtons.length > 0) {\n let buttons = [];\n buttons = apiButtons.map((button, index) => {\n return { text: button.text, value: button.value };\n });\n return {\n ...pre,\n Default: {\n Messages: messages,\n Videos: videoList,\n apiButtons: buttons\n },\n };\n }\n else {\n return {\n ...pre,\n Default: {\n Messages: messages,\n Videos: videoList\n },\n };\n }\n });\n }, []);\n\n const Editing = () => {\n return (\n \n {url.slice((url.lastIndexOf(\".\") - 1 >>> 0) + 2) !== \"mp4\" ? (\n \n ) :\n (\n \n )}\n \n {captions[index]}\n \n \n
\n\n \n
\n \n \n \n
\n );\n })}\n\n \n
\n {button.query.buttonText}
\n {/*\n
\n \n Bedroom {roomindex + 1}\n {isExtensional ? (\n setIsExtensional(!isExtensional)}\n >\n Collapse ▲\n \n ) : (\n setIsExtensional(!isExtensional)}\n >\n Details ▼\n \n )}\n handleRemoveBedRooms(roomindex)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n \n
togglegallery(index)}\n style={{ cursor: 'pointer', fontSize: '28px', color: '#73236b' }}\n >\n\n
\n \n deleteImage(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n \n {images.length > 0 && (\n \n NEW\n \n \n TRENDING\n */}\n
\n {JSON.stringify(postData, null, 2)} */}\n \n
\n \n
\n \n {isEdit ? (\n \n \n Save\n \n \n
\n Package is a service bundle offering multiple services\n for sale as a one combined service package.\n
Special Offer is certain special value you can offer to\n your client.\n \n );\n } else if (qbot) {\n return (\n
Housekeeping is something guest can ask for the room,\n like cleaning, replacing towels, toiletries etc.\n \n );\n } else {\n return (\n
Package is service bundle offering multiple services for\n sale as one combined service package.\n
Special Offer is certain special value you can offer to\n your client.\n \n );\n }\n };\n\n const priceChangeTooltipText = () => {\n if (isDoctor) {\n return (\n
{JSON.stringify(serviceData, null, 2)} */}\n \n\n \n
\n ) : (\n \n \n $ \n \n
\n to
\n \n \n $ \n \n
\n \n {serviceData.imageLink != '' ? (\n \n Browse Gallery\n \n
\n \n handleRemoveImage()}\n >\n {' '}\n {' '}\n \n
\n ) : (\n ''\n )}\n\n \n setIsUpdating(!isUpdating)}\n >\n Edit\n \n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n formLabel=\"Edit Service\"\n visible={isUpdating}\n />\n )}\n
\n );\n}\n\n","import React, { Fragment } from \"react\";\nimport { Card, CardBody, Badge, CustomInput, Button } from \"reactstrap\";\nimport { NavLink } from \"react-router-dom\";\n\nimport { Colxx } from \"../../../../../../components/common/CustomBootstrap\";\nimport ServiceFormButton from \"./ServiceFormButton\";\n\nconst ServiceListItem = ({ item, toggleModal }) => {\n function generateRandomColor() {\n var arr = [\n 'primary',\n 'secondary',\n 'info',\n 'success',\n 'warning',\n 'danger',\n 'light',\n 'dark',\n ];\n return arr[Math.floor(Math.random() * arr.length)];\n }\n return (\n \n
\n \n
\n \n
\n \n {item.title}\n
\n\n {item.type}\n
\n\n {item.displayText}\n
\n\n {item.categories.map((tag, index) => {\n return (\n
\n {item.priceRangeEnd > 0\n ?
\n {item.status}\n
\n\n \n \n
\n \n { }}\n label=\"\"\n />\n
\n \n
\n \n \n
\n \n {service.title}\n
\n\n {service.type}\n
\n\n\n {service.displayText}\n
\n\n {service.conditions}\n
\n\n {service.currency} {service.priceRangeStart} - {service.currency} {service.priceRangeEnd}\n
\n\n {service.categories.map((cat, index) => {\n return (\n
\n
\n
\n = servicesData.length}\n onChange={() => handleChangeSelectAll(true)}\n label=\"Select All\"\n />\n
These will be added with inactive status, you can edit and make them active when you ready
\n \n \n\n \n \n )}\n
\n Services
\n {!loading && (\n\n \n Add New\n \n
\n \n
\n \n \n \n \n \n {orderOptions.map((order, index) => {\n return (\n changeOrderBy(order.column)}\n >\n {order.label}\n \n );\n })}\n \n \n
\n \n onSearchKey(e)}\n />\n
\n {JSON.stringify(serviceData, null, 2)} */}\n \n \n setIsUpdating(!isUpdating)}\n >\n Edit\n \n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n formLabel=\"Edit Location\"\n visible={isUpdating}\n />\n )}\n
\n );\n}\n\n","import React from \"react\";\nimport { Card } from \"reactstrap\";\nimport { Colxx } from \"../../../../../../components/common/CustomBootstrap\";\nimport LocationFormButton from \"./LocationFormButton\";\n\nconst LocationListItem = ({ item, toggleModal }) => {\n return (\n \n
\n \n
\n \n {item.name}\n
\n\n {item.city}\n
\n\n {item.address}\n
\n\n {item.openingHours}\n
\n\n {item.websiteLink}\n
\n\n {item.status}\n
\n\n \n \n
\n \n \n \n )}\n
\n \n Locations\n
\n {!loading && (\n\n \n Add New\n \n
\n \n
\n \n \n \n \n \n {orderOptions.map((order, index) => {\n return (\n changeOrderBy(order.column)}\n >\n {order.label}\n \n );\n })}\n \n \n
\n \n onSearchKey(e)}\n />\n
\n \n \n {/* \n \n \n \n \n \n \n \n \n \n \n
\n \n \n \n \n Save\n \n \n \n Cancel\n \n
\n \n \n\n \n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps)(QuestionSetForm));\n","import React, { useState, useEffect } from 'react';\nimport {\n Row, Input, Button, Modal,\n ModalHeader,\n ModalBody\n} from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\n\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\n\nimport { postAPI_Create_Question_Option, putAPI_Update_Question_Option } from '../../../../../../constants/APIs';\nimport { AxiosAPI, getGroupID } from '../../../../../../helpers/AxiosAPI';\n\n\nfunction QuestionOptionForm({\n /** Globle property id from redux */\n propertyId,\n QuestionId,\n CancelQuestionOption,\n loadResponse,\n optionName,\n Id,\n updateOption\n}) {\n const [buttonTextInput, setButtonTextInput] = useState(optionName == undefined ? '' : optionName)\n const [postData, setPostData] = useState({\n GroupId: getGroupID(),\n PropertyId: propertyId,\n QuestionId: QuestionId,\n Option: '',\n DisplayOrder: 1,\n Status: 'Active',\n Creator: 'API'\n });\n\n useEffect(() => {\n setPostData({ ...postData, Option: buttonTextInput })\n }, [buttonTextInput]);\n\n const handleCaptionChange = e => {\n setButtonTextInput(e.target.value);\n };\n\n const handleSave = async () => {\n if (Id === undefined) {\n try {\n return await AxiosAPI({\n method: 'post',\n url: `${postAPI_Create_Question_Option}`,\n data: postData,\n })\n .then(() => {\n console.log(\"added\")\n })\n .finally(\n setTimeout(() => {\n CancelQuestionOption();\n loadResponse();\n }, 1000)\n );\n } catch (error) {\n console.error(error);\n }\n }\n else {\n let data = {\n Option: buttonTextInput,\n Status: 'Active',\n Updater: 'Dashboard',\n DisplayOrder: 1\n }\n try {\n return await AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Question_Option}/${Id}`,\n data: data,\n })\n .then(() => {\n console.log(\"added\")\n })\n .finally(\n setTimeout(() => {\n updateOption(buttonTextInput)\n }, 1000)\n );\n } catch (error) {\n console.error(error);\n }\n }\n\n };\n\n const handleCancel = () => {\n CancelQuestionOption();\n // if (setIsEditingToFalse) {\n // setIsEditingToFalse();\n // }\n // if (setIsAddImageToFalse) {\n // setIsAddImageToFalse();\n // }\n // toggleButtonAddedd();\n // toggleButtonMessageAddedd();\n };\n return (\n {JSON.stringify(postData, null, 2)} */}\n\n \n \n {/* \n \n \n
\n \n\n \n \n\n \n Save\n \n \n \n Cancel\n \n
\n \n \n\n \n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps)(QuestionOptionForm));\n","import React, { useState, useEffect, Fragment } from 'react';\nimport { AxiosAPI, getGroupID } from '../../../../../../helpers/AxiosAPI';\nimport { putAPI_Delete_Question_Option } from '../../../../../../constants/APIs';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { Collapse } from 'reactstrap';\nimport { faEdit, faTrashAlt } from '@fortawesome/free-solid-svg-icons';\nimport QuestionOptionForm from './QuestionOptionForm'\nfunction QuestionOption({\n option,\n loadResponse\n}) {\n const [data, setData] = useState(option);\n const [isEditing, setIsEditing] = useState(false);\n\n const toggleEdit = () => {\n setIsEditing(!isEditing)\n }\n\n const updateOption = (name) => {\n setData({ ...data, option: name })\n toggleEdit();\n }\n\n const deleteSet = () => {\n let deleteData = {\n Deleter: 'Dashboard'\n }\n try {\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Delete_Question_Option}/${data.id}`,\n data: deleteData,\n })\n .then(() => {\n loadResponse();\n });\n } catch (error) {\n console.error(error);\n }\n }\n\n return (\n {JSON.stringify(postData, null, 2)} */}\n\n \n deleteSet()}\n />\n
\n\n - \n {Question !== undefined && Question.options !== null && Question.options.map((option, index) => {\n return (\n
- \n\n
\n\n \n );\n })}\n
{seriesName}
\nFirst Question you will ask to start filtering
\nFirst question you will ask to help people filter the most relevant products & promotions for them
\n\nAdd Your First Set of Recommendation Questions
\nBuild a series of questions to help people filter the most relevant products & promotions for them
\n\n{JSON.stringify(buisnessData, null, 2)} */}\n \n \n
\n \n \n \n $ \n \n\n
\n \n to\n
\n \n \n $ \n \n
\n \n
\n \n\n \n \n $ \n \n\n
\n \n to\n
\n \n \n $ \n \n
\n \n {buisnessData.imageLink != null && buisnessData.imageLink != \"\" ? (\n \n ) : ''}\n\n \n
\n\n\n \n setIsUpdating(!isUpdating)}\n >\n Edit\n \n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n formLabel=\"Edit Product\"\n visible={isUpdating}\n LoadData={LoadData}\n />\n )}\n
\n );\n}\n\n","import React, { Fragment } from \"react\";\nimport { Card, CardBody, Badge, CustomInput, Button } from \"reactstrap\";\nimport { NavLink } from \"react-router-dom\";\n\nimport { Colxx } from \"../../../../../../components/common/CustomBootstrap\";\nimport ProductFormButton from \"./ProductFormButton\";\n\nconst ProductListItem = ({ item, toggleModal, LoadData }) => {\n function generateRandomColor() {\n var arr = [\n 'primary',\n 'secondary',\n 'info',\n 'success',\n 'warning',\n 'danger',\n 'light',\n 'dark',\n ];\n return arr[Math.floor(Math.random() * arr.length)];\n }\n return (\n \n
\n \n
\n \n {item.title != null ? item.title[0].statement : ''}\n
\n\n {item.type}\n
\n\n {item.shortDescription != null ? item.shortDescription[0].statement : ''}\n
\n\n {item.categories.map((tag, index) => {\n return (\n
\n {item.tags.map((tag, index) => {\n return (\n
\n {item.status}\n
\n\n \n \n
\n \n \n \n )}\n
\n \n Products & Promotions\n
\n {!loading && (\n\n \n Add New\n \n
\n \n
\n \n \n \n \n \n {orderOptions.map((order, index) => {\n return (\n changeOrderBy(order.column)}\n >\n {order.label}\n \n );\n })}\n \n \n
\n \n onSearchKey(e)}\n />\n
\n \n {`${startUserIndex}-${endUserIndex} of ${userTotalItems} `}\n \n \n {userSelectedPageSize}\n \n \n {userpageSizes.map((size, index) => {\n return (\n changeUserPageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n \n \n \n
\n);\nexport default UI;\n","import React, { Fragment } from 'react';\nimport {\n Row,\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n Label,\n ModalFooter,\n Card\n} from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\nimport moment from 'moment';\nexport default function ViewOrders({\n isopen,\n orderData,\n toggle,\n subOrderList\n}) {\n const dataTableColumns = [\n {\n Header: 'Voucher Name',\n accessor: 'name',\n Cell: props => {props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Voucher Number',\n accessor: 'voucherNumber',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Order Item Id',\n accessor: 'orderItemId',\n Cell: props =>{props.value}
\n },\n {\n Header: 'Quantity',\n accessor: 'quantity',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Customer Email',\n accessor: 'email',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Price',\n accessor: 'amount',\n Cell: props =>${props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Discount',\n accessor: 'discount',\n Cell: props =>{props.value}%
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Discounted Price',\n accessor: 'discountedPrice',\n Cell: props =>${props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Created Date',\n accessor: 'createdDate',\n Cell: props =>{moment(props.value).format(\"DD-MM-YYYY hh:mm:ss A\")}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n }\n ];\n return (\n{subOrderList.orderNumber}
\n {moment(subOrderList.creadtedDate).format('LL')}
\n {orderData.length}
\n \n {subOrderList.currency !== undefined && subOrderList.currency.toUpperCase()} {orderData.reduce((a, b) => a + b.discountedPrice, 0)}\n
\n {subOrderList.status}
\n {subOrderList.email}
\n Items
\n {orderData.map((item, index) => (\n\n 
\n
\n {item.voucherNumber}
\n {item.currency.toUpperCase()} {item.amount}
\n {item.name}
\n {item.discount} %
\n {item.quantity}
\n {item.currency.toUpperCase()} {item.discountedPrice}
\n \n {subOrderList.paymentDetail.length > 0 &&
Payments
}\n {subOrderList.paymentDetail.length > 0 && subOrderList.paymentDetail.map((item, index) => (\n {item.type}
\n {item.provider}
\n {item.currency.toUpperCase()} {item.amount}
\n {item.paymentId}
\n {item.status}
\n {item.receiptEmail}
\n {item.method}
\n \n \n \n \n {statement.statementList !== undefined && statement.statementList.length > 0 ?\n :\n \n }\n \n
\n \n
\n\n \n \n
\n {statement.footer !== undefined && statement.footer.isAivaVisible == true && \n
}\n {statement.footer !== undefined && statement.footer.isThirdPartyVisible == true && \n
}\n\n \n
\n \n
\n \n }\n
\n From Payer:
\nMyma Digital Limited, trading as aiva
\n8 Whakatomo Place
\nHavelock North
\nNew Zealand 4130
\n \nPaid To:
\nParty: {property !== '' ? property.name : \"\"}
\nBank Account: {(integrations.length > 0 && integrations[0].channelDetails != null && integrations[0].channelDetails.bankAccountDetails !== undefined )? integrations[0].channelDetails.bankAccountDetails.accountNumber : \"\"}
\n \n\n\n {statement.statementList !== undefined && statement.statementList.length > 0 && (\n \n \n\n )}\n\n\n {statement.statementList !== undefined && statement.statementList.length > 0 && statement.statementList.map((m, index) => (\n \n \n ))}\n\n {statement.statementList === undefined && isLoading === true &&\n
\n\n {statement.footer !== undefined &&\n \n
\n \n\n Voucher Name\n
\n {statement.header !== undefined && statement.header.isOwnerNameVisible == true && \n Voucher Owner\n
}\n {statement.header !== undefined && statement.header.isSellingPartyNameVisible == true && \n Selling Partner\n
}\n \n Order Number\n
\n \n Voucher Number\n
\n \n\n Customer\n
\n \n Voucher Status\n
\n \n Reporting Tags\n
\n \n Voucher Sale Date\n
\n \n Sale Amount\n
\n {statement.header !== undefined && statement.header.isAivaFeeVisible == true && \n aiva commission\n
}\n {statement.header !== undefined && statement.header.isThirdPartyVisible == true && \n 3rd party commission\n
}\n \n Settlement Date\n
\n \n Net Amount\n
\n \n
\n \n\n {m.voucherName}\n
\n {statement.header !== undefined && statement.header.isOwnerNameVisible == true && \n {m.ownerName}\n
}\n {statement.header !== undefined && statement.header.isSellingPartyNameVisible == true && \n {m.sellingPartyName}\n
}\n \n {m.orderNumber}\n
\n \n {m.voucherNumber}\n
\n \n\n {m.email}\n
\n \n {m.voucherStatus}\n
\n \n {m.reportingTags}\n
\n \n {moment(m.orderDate).format('YYYY-MM-DD')}\n
\n \n ${m.discountedPrice}\n
\n {statement.header !== undefined && statement.header.isAivaFeeVisible == true &&\n \n {parseFloat((m.aivaFee * 100) / m.discountedPrice).toFixed(2)}%\n
}\n {statement.header !== undefined && statement.header.isThirdPartyVisible == true &&\n \n {parseFloat((m.thirdPartyFee * 100) / m.discountedPrice).toFixed(2)}%\n
}\n \n {m.settlementDate === \"\" ? \"\" : moment(m.settlementDate).format('YYYY-MM-DD')}\n
\n \n ${(m.redeem == 1 || m.redeem == 3) ? \"0.00\" : m.transferedAmount}\n
\n \n
}\n\n \n {items.length > 0 && (\n
\n )}\n {loading ===true && (\n \n
\n \n {items.map((m, index) => {\n return (\n hanldeOrderId(m.voucherNumber)}\n className={\n m.voucherNumber ===orderId\n ? 'd-flex flex-row border-bottom selected-div'\n : 'd-flex flex-row border-bottom '\n }\n style={{ cursor: 'pointer',paddingTop:'0.75rem',paddingLeft:'-0.5rem' }} \n >\n
\n );\n })}\n \n
\n \n {m.discountedPrice}\n
\n \n {m.redeem === 'NotRedeemed' && 'Available'} {m.redeem === 'Void' && 'Void'} {m.redeem === 'Redeem' && 'Redeemed'} {m.redeem === 'Refund' && 'Refunded'}\n
\n \n
\n \n
\n \n {moment(m.createdDate).format(\n 'DD/MM/YYYY h:mm a'\n )}\n \n
\n\n {m.name}
\n\n\n {m.email}\n {m.email !== \"\" && m.email !== null &&\n \n {/*
\n
\n )}\n \n {/* {showButton && (\n \n \n
\n \n \n
\n \n
\n \n
\n\n \n
\n \n
\n \n \n \n }\n
\n \n
\n \n
\n \n
\n {/* {data.voucherBookingDetails !== undefined && data.voucherBookingDetails.firstName !== null && data.voucherBookingDetails.firstName !== '' &&\n \n
\n } */}\n {data.reportingTags !== undefined && data.reportingTags !== null && data.reportingTags.length > 0 && \n
}\n {data.giftDetails !==null && data.giftDetails.to !== null &&\n \n
}\n\n\n \n
\n
\n \n {data.isCard !== undefined && data.isCard===true? \n {data.name}(Balance : {data.currency.toUpperCase()}{data.balance})\n \n : \n {data.name}\n } \n
\n \n Voucher Number:\n
\n \n {data.voucherNumber}\n
\n \n Order Number:\n
\n \n {data.orderNumber}\n
\n \n Sales Channel:\n
\n \n {data.intregationName}\n
\n \n Customer Email:\n
\n \n {data.email}\n
\n \n Payment Reference:\n
\n \n {data.paymentid} {data.paymentMethod !== '' ?\"(\"+data.paymentMethod+\")\" : \"\"}\n
\n {data.comments !== undefined && \n \n {data.comments}\n
\n \n Payment Status:\n
\n \n {data.status}\n
\n \n \n
\n
\n \n Retail Price:\n
\n \n {data.currency.toUpperCase()} {data.isCard !== undefined && data.isCard===true? data.discountedPrice :data.price}\n
\n \n \n
\n
\n \n Discount:\n
\n \n {data.discount}%\n
\n \n \n
\n
\n \n Price:\n
\n \n {data.currency.toUpperCase()} {data.intregationName ==='aiva Dashboard'?parseFloat(parseFloat(data.discount) >0 ? (parseFloat(data.price)-(parseFloat(data.price)*parseFloat(data.discount))/100):data.price).toFixed(2) : data.discountedPrice}\n
\n \n Voucher Status:\n
\n \n {data.redeem === 'NotRedeemed' ? 'Available' : data.redeem}\n
\n \n Booking Details:\n
\n \n Name:{data.voucherBookingDetails.firstName +' '+data.voucherBookingDetails.lastName }\n
\n \n Address:{data.voucherBookingDetails.address }\n
\n \n Country:{data.voucherBookingDetails.country}\n
\n \n Phone Number:{data.voucherBookingDetails.phoneNumber}\n
\n \n Reporting Tags:\n
\n \n
\n \n {data.reportingTags !== undefined && data.reportingTags !== null && data.reportingTags.length > 0 && data.reportingTags.map((m) => (\n \n ))}\n
\n \n Gift Details:\n
\n \n Name:{data.giftDetails !== null ? data.giftDetails.to : \"\"}\n
\n \n Email:{data.giftDetails !== null ? data.giftDetails.email : \"\"}\n
\n \n Message:{data.giftDetails !== null ? data.giftDetails.message : \"\"}\n
\n \n Date:{data.giftDetails !== null ? data.giftDetails.deliveryDate : \"\"}\n
\n \n Status:{data.gifted ? \"Email Sent\" : \"Email Pending\"}\n
\n \n \n
\n
\n {data.thirdPartyProcessingFee !== 0 && \n \n
\n aiva
\n Commission:
\n \n {data.currency.toUpperCase()} {data.processingFee} ({parseFloat((data.processingFee * 100) / data.discountedPrice).toFixed(2)}%)\n
\n \n \n
\n
}\n \n
\n 3rd Party
\n Commission:
\n \n {data.currency.toUpperCase()} {data.thirdPartyProcessingFee} ({parseFloat((data.thirdPartyProcessingFee * 100) / data.discountedPrice).toFixed(2)}%)\n
\n \n \n
\n
\n \n
\n Net
\n Amount:
\n \n {data.currency.toUpperCase()} {parseFloat(data.discountedPrice) - (parseFloat(data.processingFee) + parseFloat(data.thirdPartyProcessingFee))}\n
\n \n
\n\n\n {noteData.notesList != undefined && noteData.notesList.length > 0 && noteData.notesList.map((n) => {\n return (\n
\n \n {moment(n.createdDate).format('MMMM Do YYYY, h:mm:ss a')}\n {n.note.map((m) =>
\n {m}
)\n }\n\n \n \n Actions\n \n \n setUpdateModal(true)}\n >\n Update Status\n \n setNoteModal(true)}\n >\n Add Note\n \n\n setResendEmail(true)}\n >\n Resend email\n \n {\n setSettlementData({\n ...settlementData, email: data.email,\n voucherNumber: data.voucherNumber, saleDate: data.createdDate, amount: data.price\n });\n setSettlementodal(true);\n }}\n >\n Reconcile Payment\n \n \n \n
\n {/* \n\n */}\n \n
\n {sessionDetails !== '' && sessionDetails.details.IpAddress !== '' &&\n sessionDetails.details.IpAddress !== null ? (\n \n
\n \n \n
\n\n
\n \n
\n
\n {sessionDetails.details.IpAddress.Latitude !== undefined &&\n sessionDetails.details.IpAddress.Latitude !== '' && (\n \n
\n \n \n
\n\n {sessionDetails.details.IpAddress !== '' ? (\n
\n Near {sessionDetails.details.IpAddress.City},{\" \"}{sessionDetails.details.IpAddress.RegionName}
\n ) : null}\n {sessionDetails.details.IpAddress !== '' ? (\n\n This location is approximate and determined by IP\n address ({sessionDetails.details.IpAddress.IpAddress})\n
\n ) : null}\n\n \n
\n )}\n \n \n {visitorData.customerInfo !== null &&\n \n Visitor Info \n {visitorData.customerInfo.email !== '' && (\n }\n \n
\n )}\n\n {sessionDetails !== '' && sessionDetails.details !== undefined &&\n sessionDetails.details.ClientInformation !== undefined && sessionDetails.details.ClientInformation !== null && (\n \n
\n )}\n {\n visitorData.customerInfo.timeUTC !== '' &&\n visitorData.customerInfo.timeUTC !== null && (\n \n
\n \n \n
\n\n
\n \n {visitorData.customerInfo.email}\n
\n\n
\n )}\n \n
\n \n \n
\n\n
\n \n Marketing Consent:\n {visitorData.customerInfo.consentGiven === 'true' ? (\n \n {'Yes'}\n \n ) : (\n \n {'No'}\n \n )}{' '}\n \n (\n {moment(visitorData.customerInfo.timeUTC).format(\n 'dddd, DD MMMM YYYY'\n )}{' '}\n {moment(visitorData.customerInfo.timeUTC).format(\n 'h:mm a'\n )}\n )\n
\n\n \n \n Device Info \n \n \n \n \n
\n )}{' '}\n \n
\n \n
\n \n \n
\n\n
\n {sessionDetails.details.ClientInformation.Device !== (undefined && null) && sessionDetails.details.ClientInformation.Device.Family}
\n\n
\n \n
\n \n {' '}\n \n
\n\n
\n {sessionDetails.details.ClientInformation.String} browser
\nVoucher Status
\n setStatus(e.target.value)}\n placeHolder=\"Please select voucher status\"\n >\n \n \n \n \n \n
\n \n \n
\n \n setReason(e.target.value)}>\n \n
\n Voucher Status
\n Balance: ${data.balance}\n
\n \n setStatus(e.target.value)}\n placeHolder=\"Please select voucher status\"\n >\n \n \n \n \n \n
\n \n {\n setRedeemAmount(data.balance);\n setRedeemType(0);\n }}\n />\n
\n \n {\n setRedeemAmount(0);\n setRedeemType(1);\n }}\n />\n
\n \n Balance to Redeem:{redeemType == 0 ? \n ${data.balance} :\n {data.balance > 0 ?\n {\n if(data.balance - e.target.value >= 0){\n setRedeemAmount(e.target.value);\n setError('');\n }else{\n setError('Amount should be equal or less than the Balance');\n }\n\n }} >{error !=='' && Amount should be equal or less than the Balance} \n : $0}\n }\n
\n\n \n Remaining Balance:\n ${data.balance - redeemAmount}
\n \n \n
\n \n setReason(e.target.value)}>\n \n
\n Add Notes
\n \n
\n \n setNote(e.target.value)}>\n \n
\n Resend Email
\n \n \n Email
\n \n \n {emailData.map((m, index) => (\n \n \n \n {\n handleChange(index, e);\n }} />\n \n\n \n \n \n
\n ))}\n \n \n \n + Add email\n \n \n
\n
\n \n deleteEmail(m.id)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n X\n \n
\n Reconcile Payment
\nKeep your records up to date. Mark the date you received the vouchers payment from aiva.\n
\n\n \n \n setSettlementData({ ...settlementData, date: e })}\n placeholderText=\"Select Date\"\n dateFormat=\"DD/MM/YYYY\"\n />\n \n \n \n null} disabled={true}>\n \n \n
\n Voucher Number : {settlementData.voucherNumber !== undefined ? settlementData.voucherNumber : \"\"}\n Customer : {settlementData.email !== undefined ? settlementData.email : \"\"}\n Sale Date : {settlementData.saleDate !== undefined ? moment(settlementData.saleDate).format('YYYY-MM-DD HH:mm:ss') : \"\"}\n
\n {props.value}
,\n },\n {\n Header: 'Email',\n accessor: 'email',\n Cell: (props) => (\n\n {props.value}\n
\n {props.value}\n
{props.value}
,\n },\n {\n Header: 'Marketing Consent',\n accessor: 'consent',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Date',\n accessor: 'consentDate',\n Cell: (props) => (\n\n {props.value !== '' ? moment(props.value).format('lll') : ''}\n
\n ),\n },\n];\n\nfunction Index({ propertyId, user }) {\n const [startDate, setStartDate] = useState(moment().subtract(5, 'days'));\n const [endDate, setEndDate] = useState(moment());\n const [loading, setLoading] = useState(true);\n const [orderList, setOrderList] = useState([]);\n const [orderData, setOrderData] = useState([]);\n const [orderId, setOrderId] = useState('');\n const [showOrderData, setShowOrderData] = useState(false);\n const [showOrdeList, setShowOrderList] = useState(false);\n const [showStatement, setShowStatement] = useState(false);\n const [searchOrder, setSearchOrder] = useState(\"\");\n const [currency, setCurrency] = useState(\"\");\n const [websiteIntregationId, setWebsiteIntregationId] = useState('');\n const [reportingTags, setReportingTags] = useState([]);\n const [activeTab, setActiveTab] = useState(\"orders\");\n const [contactStatsData, setContactStatsData] = useState([]);\n const [propertyData, setPropertyData] = useState('');\n const [status, setStatus] = useState('All');\n const [selectedReportingTags, setSelectedReportingTags] = useState({});\n const [vouchers, setVouchers] = useState([]);\n const [inputData, setInputData] = useState({\n GroupId: getGroupID(),\n Name: '',\n Level: 'Group',\n Properties:[propertyId],\n SessionTimeoutInSeconds: 600,\n BaseUrl: 'https://www.bookmebob.com',\n HomePageRoute: '/',\n DefaultLanguage: 'en-US',\n DefaultRuleDescription: 'Default', \n layoutType:0,arrowType:0,arrowSize:40,arrowColor:'black',\n colours:{title:'',subtitle:'',arrow:'black', primaryColor:'#E31B78',\n buttonColor: '#033DA5',\n redeemBar:'#FA8DAB',\n redeemButton:'#F5D2E3',\n buttonTextColor:'white',\n redeemTextColor:'black',\n shoppingBar:'#ED187B',\n shoppingBarText:'white'},\n isFooterHide:false\n });\n const handleSearchfilterDate = date => {\n setStartDate(date);\n onstartDateChange(date);\n };\n const handleSearchfilterEndDate = date => {\n setEndDate(date);\n onEndDateChange(date);\n };\n\n const onstartDateChange = (date) => {\n setStartDate(date);\n };\n\n const currencyFormat = (currency, value) =>\n new Intl.NumberFormat('en-US', {\n style: \"currency\",\n currency: currency,\n }).format(value);\n\n const onEndDateChange = (date) => {\n setEndDate(date);\n };\n const handleReportingTags = (selectedTags) => {\n setSelectedReportingTags(selectedTags);\n };\n const LoadData = (startdate, enddate) => {\n setOrderList([]); \n let fromDate = startdate ? startDate.format('YYYY-MM-DD') + ' 00:00:00' : '';\n let toDate = enddate ? endDate.format('YYYY-MM-DD') + ' 23:59:59' : '';\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Orders_Voucher}?fromDate=${fromDate}&toDate=${toDate}&groupId=${getGroupID()}&propertyId=${propertyId}`,\n })\n .then(res => {\n\n let options = [];\n let reportingOptions = [];\n\n if (res.data.length > 0) {\n if (status !== 'All')\n res.data = res.data.filter((f) => f.redeem === status)\n if (reportingTags.length > 0)\n res.data = res.data.filter((f) => f.reportingTags.includes(reportingTags))\n res.data.map((m) => {\n if (m.reportingTags !== undefined && m.reportingTags !== null && m.reportingTags.length > 0) {\n m.reportingTags.map((n) => {\n if (reportingOptions.filter((f) => f.value === n).length === 0) {\n reportingOptions.push({\n label: n,\n value: n,\n key: n\n });\n }\n });\n }\n })\n setReportingTags(reportingOptions);\n setOrderId(res.data[0].voucherNumber);\n }\n setOrderList(res.data);\n setLoading(false);\n setShowOrderList(true);\n })\n .catch(err => console.log('err', err));\n }\n const handleSubmit = (startdate, enddate) => {\n setOrderList([]);\n let fromDate = startdate ? startDate.format('YYYY-MM-DD') + ' 00:00:00' : '';\n let toDate = enddate ? endDate.format('YYYY-MM-DD') + ' 23:59:59' : '';\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Orders_Voucher}?fromDate=${fromDate}&toDate=${toDate}&groupId=${getGroupID()}&propertyId=${propertyId}`,\n })\n .then(res => {\n\n if (res.data.length > 0) {\n if (status !== 'All')\n res.data = res.data.filter((f) => f.redeem === status);\n if (res.data.length > 0 && selectedReportingTags.value !== undefined)\n res.data = res.data.filter((m) => m.reportingTags.includes(selectedReportingTags.value) === true);\n }\n setOrderId(res.data[0].voucherNumber);\n setOrderList(res.data);\n setLoading(false);\n setShowOrderList(true);\n })\n .catch(err => console.log('err', err));\n }\n const LoadSearchOrderData = (search, status) => {\n setOrderList([]);\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Orders_Voucher}/search?status=${status}&search=${search}&groupId=${getGroupID()}&propertyId=${propertyId}`,\n })\n .then(res => {\n setOrderList(res.data);\n setLoading(false);\n })\n .catch(err => console.log('err', err));\n }\n\n const OrderData = (id) => {\n setOrderData([]);\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Orders_Voucher}/detail?orderId=${id}`,\n })\n .then(res => {\n setOrderData(res.data.items);\n })\n .catch(err => console.log('err', err));\n }\n\n const handleCurrency = (currency) => {\n try {\n if (currency === \"AUD\") {\n currency = currencyFormat(\"AUD\", 0)\n .replace(/[A-Za-z]/g, \"\")\n .charAt(currencyFormat(\"AUD\", 0).indexOf(\"$\") - 1);\n return currency;\n } else if (currency === \"NZD\") {\n currency = currencyFormat(\"NZD\", 0)\n .replace(/[A-Za-z]/g, \"\")\n .charAt(currencyFormat(\"NZD\", 0).indexOf(\"$\") - 2);\n return currency;\n } else if (currency === \"PHP\") {\n currency = currencyFormat(currency, 0)\n .replace(/[A-Za-z]/g, \"\")\n .substring(0, 1);\n return currency;\n } else if (currency === \"EUR\") {\n currency = currencyFormat(currency, 0)\n .replace(/[A-Za-z]/g, \"\")\n .substring(0, 1);\n return currency;\n } else if (currency === \"MYR\") return \"RM\";\n else if (currency === \"ISK\") return \"kr\";\n else if (currency === \"MYR\") return \"RM\";\n else if (currency === \"ISK\") return \"kr\";\n else if (currency === \"AED\") {\n return \"فلس\";\n } else {\n currency = currencyFormat(currency, 0)\n .replace(/[A-Za-z]/g, \"\")\n .substring(0, 1);\n return currency;\n }\n } catch {\n currency = currencyFormat(\"NZD\", 0)\n .replace(/[A-Za-z]/g, \"\")\n .charAt(currencyFormat(\"NZD\", 0).indexOf(\"$\") - 2);\n return currency;\n }\n };\n\n useEffect(() => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Internal_Property_By_Id}/${propertyId\n }?group_id=${getGroupID()}`,\n }).then(propData => { \n let property = [];\n property.push(propData.data);\n setPropertyData(propData.data); \n try { \n if (property[0].currency === \"AUD\")\n setCurrency(currencyFormat(\"AUD\", 0)\n .replace(/[A-Za-z]/g, \"\")\n .charAt(currencyFormat(\"AUD\", 0).indexOf(\"$\") - 1));\n else\n setCurrency(currencyFormat(property[0].currency, 0)\n .replace(/[A-Za-z]/g, \"\")\n .substring(\n 0,\n currencyFormat(property[0].currency, 0).indexOf(\"0\") - 2\n ));\n } catch {\n currency=propData.data.currency;\n setCurrency(currencyFormat(\"NZD\", 0)\n .replace(/[A-Za-z]/g, \"\")\n .charAt(currencyFormat(\"NZD\", 0).indexOf(\"$\") - 2));\n }\n loadIntegration(propData.data.currency);\n });\n \n LoadData(startDate, endDate);\n }, [propertyId]);\n\n const loadOrderVoucherpdf = (orderVoucher) => {\n NotificationManager.success(\n '',\n 'Please wait, it will take a few moments to download the PDF',\n 3000,\n null,\n null,\n 'success'\n );\n AxiosAPI({\n method: 'GET',\n url: `${API_Order_Voucher_Pdf}?voucher_number=${orderVoucher}`\n })\n .then(response => {\n // var pdfAsDataUri = \"data:application/pdf;base64,\" + response.data.content;\n // window.open(pdfAsDataUri);\n let link=document.createElement('a');\n const mimeType = \"application/pdf\";\n link.href=`data:${mimeType};base64,${response.data.content}`;\n link.download=`${orderVoucher}.pdf`;\n link.click();\n })\n .catch(error => {\n console.log(error);\n });\n }\n\n const loadIntegration=(currency)=>{ \n localStorage.removeItem(\"currentCartVouchers\");\n localStorage.removeItem(\"currentCartItemLength\");\n let body={\n channels:['EmbedVoucher']\n }\n AxiosAPI({\n method: 'post',\n url: `${API_Ingetration}?group_id=${getGroupID()}`,\n data: body\n }).then((res) => {\n const webIntegrationData = res.data.filter(\n (k) => k.channel === 'EmbedVoucher' && k.disabled === false && k.properties !== undefined && k.properties.includes(propertyId)\n ); \n if (webIntegrationData.length > 0)\n setWebsiteIntregationId(webIntegrationData[0].id);\n else {\n AddIntegration();\n }\n if (webIntegrationData.length === 1){\n AxiosAPI({\n method: \"get\",\n url: `${gAPI_Vouchers}?groupId=${getGroupID()}&integration_id=${webIntegrationData[0].id}&propertyId=${propertyId}&languageCode=en&search=&status=Active&pageNumber=1&pageSize=10000¤cy=${currency}`,\n })\n .then((res) => { \n setVouchers(res.data.vouchers);\n });\n }\n\n });\n };\n\n const AddIntegration=()=>{\n Axios.all([ \n AxiosAPI({\n method: 'post',\n url: `${API_EmbedVoucher_Connection}`,\n data: inputData,\n }),\n ]).then(() =>{ \n let body={\n 'channels':['EmbedVoucher']\n };\n AxiosAPI({\n method: 'post',\n url: `${API_Ingetration}?group_id=${getGroupID()}`,\n data: body\n }).then((res) => {\n const webIntegrationData = res.data.filter(\n (k) => k.channel === 'EmbedVoucher' && k.disabled === false && k.properties !== undefined && k.properties.includes(propertyId)\n ); \n if (webIntegrationData.length === 1)\n setWebsiteIntregationId(webIntegrationData[0].id);\n else {\n \n }\n if (webIntegrationData.length === 1){\n AxiosAPI({\n method: \"get\",\n url: `${gAPI_Vouchers}?groupId=${getGroupID()}&integration_id=${webIntegrationData[0].id}&propertyId=${propertyId}&languageCode=en&search=&status=Active&pageNumber=1&pageSize=10000¤cy=${propertyData.currency}`,\n })\n .then((res) => { \n setVouchers(res.data.vouchers);\n });\n }\n \n }); \n });\n };\n\n const handleContacts = (startdate, enddate) => {\n let fromDate = startdate ? startDate.format('YYYY-MM-DD') + ' 00:00:00' : '';\n let toDate = enddate ? endDate.format('YYYY-MM-DD') + ' 23:59:59' : '';\n AxiosAPI({\n method: 'get',\n url: `${gAPI_VisitorsGroupsContact_Stats}`,\n params: {\n groupId: getGroupID(),\n dateFrom: fromDate,\n dateTo: toDate,\n propertyId: propertyId,\n },\n }).then((res) => {\n setContactStatsData(res.data);\n });\n };\n\n return (\n\n {\n setSearchOrder(e.target.value);\n LoadSearchOrderData(e.target.value, 'All');\n }}> \n
\n \n 
0 && v.images[0].url}>\n
\n {v.discount > 0 && (\n 0 && v.images[0].url}>\n \n \n {\" \"}\n {v.discount}%OFF\n \n
\n \n \n
\n \n \n ); \n }\n })}\n \n {websiteIntregationId !== '' && {v.isCard !== true ? handleCurrency(v.currency) + v.discountedPrice : ( handleCurrency(v.currency) + v.minAmount.toLocaleString('en-US') + \" -\" + handleCurrency(v.currency) + v.discountedPrice.toLocaleString('en-US'))}
\n{v.name}
\n\n {\n setSearchOrder(e.target.value);\n LoadSearchOrderData(e.target.value, 'All');\n }}>
\n {props.value}
,\n },\n {\n Header: 'Clicks',\n accessor: 'clicks',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Visitors',\n accessor: 'visitors',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n];\nconst poupularVoucherDataTablescolumn = [\n {\n Header: 'Name',\n accessor: 'voucherName',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Views',\n accessor: 'views',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Added to Cart',\n accessor: 'cart',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Payments',\n accessor: 'payments',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n {\n Header: 'Purchases',\n accessor: 'purchases',\n Cell: (props) => (\n\n {props.value}\n
\n ),\n },\n];\nfunction Insights({\n propertyId,\n isVoucherEngine,\n timeZone,\n locale,\n domains,\n currency,\n}) {\n moment.tz.setDefault(timeZone);\n const [buttonText, setButtonText] = useState(\n{props.value}
,\n },\n {\n Header: 'Email',\n accessor: 'email',\n Cell: (props) => (\n\n {isMasked !== 'true' ? maskEmail(props.value) : props.value}\n
\n {isMasked !== 'true' ? maskMobile(props.value, 4) : props.value}\n
{props.value}
,\n },\n {\n Header: 'Marketing Consent',\n accessor: 'consent',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Date',\n accessor: 'consentDate',\n Cell: (props) => (\n\n {props.value !== '' ? moment(props.value).format('lll') : ''}\n
\n ),\n },\n ];\n const handleMaskClick = () => {\n if (isMasked === 'true') {\n sessionStorage.setItem('lock', 'false');\n setIsMasked(sessionStorage.getItem('lock'));\n } else {\n sessionStorage.setItem('lock', 'true');\n setIsMasked(sessionStorage.getItem('lock'));\n }\n };\n useEffect(() => {\n if (propertyId !== '' && propertyId !== undefined) {\n selectLast7Days();\n }\n }, [propertyId]);\n\n const today = () => {\n return moment(moment().format('YYYY-MM-DD') + ' 23:59:59')\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const daysAgo7 = () => {\n return moment(\n moment().subtract(6, 'days').format('YYYY-MM-DD') + ' 00:00:00'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const daysAgo30 = () => {\n return moment(\n moment().subtract(29, 'days').format('YYYY-MM-DD') + ' 00:00:00'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const daysAgo90 = () => {\n return moment(\n moment().subtract(89, 'days').format('YYYY-MM-DD') + ' 00:00:00'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const startOfWeek = () => {\n const today = moment();\n return moment(\n moment(today).isoWeekday(1).format('YYYY-MM-DD') + ' 00:00:00'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const endOfWeek = () => {\n const today = moment();\n return moment(\n moment(today).isoWeekday(7).format('YYYY-MM-DD') + ' 23:59:59'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const startOfMonth = () => {\n return moment(moment().startOf('month').format('YYYY-MM-DD') + ' 00:00:00')\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const startOfPreviousMonth = () => {\n return moment(\n moment().subtract(1, 'months').startOf('month').format('YYYY-MM-DD') +\n ' 00:00:00'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const startOfThisYear = () => {\n return moment(new Date().getFullYear() + '-01-01' + ' 00:00:00').format(\n 'YYYY-MM-DD HH:mm:ss'\n );\n };\n\n const startOfLastYear = () => {\n return moment(new Date().getFullYear() - 1 + '-01-01' + ' 00:00:00').format(\n 'YYYY-MM-DD HH:mm:ss'\n );\n };\n const endOfLastYear = () => {\n return moment(new Date().getFullYear() - 1 + '-12-31' + ' 00:00:00').format(\n 'YYYY-MM-DD HH:mm:ss'\n );\n };\n\n const endOfPreviousMonth = () => {\n return moment(\n moment().subtract(1, 'months').endOf('month').format('YYYY-MM-DD') +\n ' 23:59:59'\n )\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const endOfMonth = () => {\n return moment(moment().endOf('month').format('YYYY-MM-DD') + ' 23:59:59')\n .utc()\n .format('YYYY-MM-DD HH:mm:ss');\n };\n\n const selectLast7Days = () => {\n setButtonText(\n \n \n {buttonText}\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n Temporarily Unavailable
\n )}\n \n ) : (\n ''\n )}\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n stats.recentOrders.length > 0 && (\n Temporarily Unavailable
\n }\n \n ) : (\n ''\n )}\n\n {isVoucherEngine || domains.length == 1 ? (\n\n
\n ) : (\n countryvisit.length > 0 && (\n \n \n\n\n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from \"react\";\nimport { Row } from \"reactstrap\";\nimport IntlMessages from \"../../../../helpers/IntlMessages\";\nimport { Colxx, Separator } from \"../../../../components/common/CustomBootstrap\";\nimport Breadcrumb from \"../../../../containers/navs/Breadcrumb\";\n\nexport default class FinancePage extends Component {\n render() {\n return (\n Roles & Businesses
\n\n {\n setIsCreating(!isCreating);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Create & Invite a User\n \n {\n setIsCreating(!isCreating);\n }}\n submit={handleSubmit}\n />\n { setOpen(!open) }}> \n
\n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(CreateInviteUsersForm));\n\nCreateInviteUsersForm.propTypes = {\n // propertyId: PropTypes.string.isRequired,\n};\n","import React, { useState, useEffect, Fragment } from 'react';\nimport {\n Row,\n Input,\n Label,\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n FormGroup,\n CustomInput,\n} from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\nimport { AxiosAPI, getGroupID } from '../../../../../../helpers/AxiosAPI';\nimport {\n gAPI_Users_By_Id,\n gAPI_Property_List,\n} from '../../../../../../constants/APIs';\nimport roleListData from '../../../../../../data/rolelist.json';\n\nexport default function EditUsersForm({\n formLabel,\n visible,\n toggle,\n id,\n submit,\n}) {\n const [propertyList, setPropertyList] = useState([]);\n const [roleList, setRolesList] = useState([]);\n const [usersData, setUsersData] = useState({\n email: '',\n properties: ['-1'],\n roles: ['Admin'],\n creator: 'dashboard',\n firstName: '',\n lastName: '',\n phoneNumber: '',\n });\n\n useEffect(() => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Users_By_Id}/${id}?gid=${getGroupID()}`,\n })\n .then((res) => {\n setUsersData(res.data);\n setRolesList(\n roleListData.data.map((elem) => {\n elem.checked = false;\n res.data.roles.forEach((r) => {\n if (r === elem.id) {\n elem.checked = true;\n }\n });\n return elem;\n })\n );\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Property_List}/?group_id=${getGroupID()}`,\n })\n .then((res1) => {\n setPropertyList(\n res1.data.map((elem) => {\n elem.checked = false;\n res.data.properties.forEach((r) => {\n if (r === elem.id) {\n elem.checked = true;\n }\n });\n return elem;\n })\n );\n })\n .catch((err) => console.error(err));\n })\n .catch((err) => console.log('err', err));\n }, [id]);\n\n const handleChange = (e) => {\n setUsersData({\n ...usersData,\n [e.target.name]: e.target.value,\n });\n };\n\n const handlePropertiesChange = (e) => {\n const values = propertyList.map((elem) => {\n if (elem.id === e.target.value) {\n if (elem.checked) {\n elem.checked = false;\n } else if (!elem.checked) {\n elem.checked = true;\n }\n }\n return {\n ...elem,\n };\n });\n setPropertyList(values);\n };\n\n const handleRoleChange = (e) => {\n const values = roleList.map((elem) => {\n if (elem.name === e.target.value) {\n if (elem.checked) {\n elem.checked = false;\n } else if (!elem.checked) {\n elem.checked = true;\n }\n }\n return {\n ...elem,\n };\n });\n setRolesList(values);\n };\n\n useEffect(() => {\n const appPropertiesArr = propertyList\n .filter((elem) => elem.checked === true)\n .map((elem) => elem.id);\n\n const appRolesArr = roleList\n .filter((elem) => elem.checked === true)\n .map((elem) => elem.id);\n if (appPropertiesArr.length === 0) {\n appPropertiesArr.push('-1');\n }\n\n setUsersData({\n ...usersData,\n properties: appPropertiesArr,\n roles: appRolesArr,\n });\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [propertyList, roleList]);\n\n const handleSubmit = () => {\n submit(usersData);\n };\n\n return (\n {JSON.stringify(usersData, null, 2)} */}\n {usersData.firstName !== undefined ? (\n Roles & Businesses
\n\n setIsUpdating(!isUpdating)}\n >\n Edit\n \n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n id={id}\n submit={handleSubmit}\n />\n )}\n {setOpen(!open)}}> \n
\n );\n}\n\n// UpdateRatePlansForm.propTypes = {\n// id: PropTypes.string.isRequired,\n// applicableAddOnsWithIdAndName: PropTypes.array.isRequired,\n// includedAddOnsWithIdAndName: PropTypes.array.isRequired,\n// applicablePromosWithIdAndName: PropTypes.array.isRequired,\n// };\n","import React from 'react';\nimport { Button } from 'reactstrap';\nimport { AxiosAPI, getGroupID } from '../../../../../../helpers/AxiosAPI';\nimport { postAPI_ResendInvite, gAPI_Group_By_Id } from '../../../../../../constants/APIs';\nimport { NotificationManager } from \"../../../../../../components/common/react-notifications\";\n\nexport default function ReinviteUserForm({\n id\n}) {\n\n const handleReInvite = data => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Group_By_Id}/${getGroupID()}`,\n })\n .then(res => {\n AxiosAPI({\n method: 'put',\n url: `${postAPI_ResendInvite}/${data}/resend-invite`,\n data: {\n groupName: res.data.name\n },\n }).then(resnew => {\n navigator.clipboard.writeText(resnew.data.url);\n NotificationManager.success(\n \"\",\n \"Invitation sent successfully and URL copied to clipboard.\",\n 3000,\n null,\n null,\n \"success\"\n );\n }\n );\n })\n .catch(err => console.error(err));\n };\n\n return (\n\n \n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n {props.value}
,\n },\n {\n Header: 'Email',\n accessor: 'email',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Status',\n accessor: 'status',\n Cell: (props) =>{props.value}
,\n },\n {\n Header: 'Role',\n accessor: 'roles',\n Cell: (props) => (\n\n {props.value.map((role, index) => {\n return (\n
}\n
\n {props.row.status !== 'Pending' ? (\n
\n {props.row.status === 'Pending' ? (\n
\n {props.row.status === 'Pending' ? (\n
\n Roles\n
\n {roles.map((role, index) => {\n return (\n \n Properties\n
\n {properties.map((property, index) => {\n return (\n \n \n \n \n \n
\n Add Integration
\n\n \n \n \n \n
\n Connect Vouchers to your website
\n\n \n \n \n \n
\n Connect Standalone Voucher Page to your website
\n\n \n {/* \n {\" \"}\n {\" \"}\n */}\n handleSwitchChange(primary)}\n />\n
\n \n \n Disconnect\n */}\n {/*
\n \n \n
\n Popup Store
\n\n {integration ? integration.name : null}\n
\n \n {formatedProperties} \n {moreProperties}\n
\n {/* \n \n
*/}\n \n \n {\n //console.log(selectedproperty);\n if (selectedproperty !== '') {\n handlePayment();\n } else {\n toggle();\n setInputData({ ...inputData, Properties: 0 });\n }\n }}\n >\n Create New {label} Stripe Integration\n \n\n \n \n
\n Add {label} Stripe Integration
\n\n
\n
\n \n
\n
\n
\n
\n
\n \n \n \n \n
\n \n
\n \n \n
\n \n
\n \n \n
\n \n
\n
\n {button}\n\n
\n \n
\n
\n \n
\n
\n {formbody}
\n\n \n Disconnect\n \n
\n {label === \"\" &&\n\n Update Bank Details\n \n }\n
\n \n {label}\n
\n \n {integration.botSettings ? integration.botSettings.name : ''}\n
\n \n {integration ? integration.name : null}\n
\n \n {formatedProperties} \n {moreProperties}
\n
\n \n
\n {integration.channelDetails.stripeCustomerId}\n
\n \n {label === \"\" &&\n
\n \n {id === undefined ? () : ()}\n \n \n
\n Add Intregation
\n\n
\n \n {\" \"}\n {\" \"}\n \n\n \n
\n Title
\n {integration.name}\n\n
\n Hotel Code
\n {integration.channelDetails.hotelCode}\n\n
\n Business Name
\n {formatedProperties} \n {moreProperties}\n\n
\n Rateplan Code
\n {integration.channelDetails.ratePlanCode}\n\n \n \n \n \n
\n Connect Embed VoucherCodeSnippet to your website
\n\n \n {/* \n {\" \"}\n {\" \"}\n */}\n handleSwitchChange(primary)}\n />\n
\n \n \n Disconnect\n */}\n {/*
\n \n Embed Store
\n\n {integration ? integration.name : null}\n
\n \n {formatedProperties} \n {moreProperties}\n
\n {/* \n \n
*/}\n \n \n {/* \n {\" \"}\n {\" \"}\n */}\n handleSwitchChange(primary)}\n />\n
\n \n \n Disconnect\n */}\n {/*
\n \n Standalone Store
\n\n {integration ? integration.name : null}\n
\n \n {formatedProperties} \n {moreProperties}\n
\n {/* \n \n
*/}\n \n \n {id === undefined ? () : ()}\n \n \n
\n Add Intregation
\n\n
\n \n {\" \"}\n {\" \"}\n \n\n \n
\n Name
\n {integration.name}\n\n
\n Business Name
\n {formatedProperties} \n {moreProperties}\n\n \n {id === undefined ? () : ()}\n \n \n
\n Add Intregation
\n\n setIsEditing(!isEditing)}\n >\n Edit\n \n
\n\n Delete\n \n \n
\n \n {integration.botSettings ? integration.botSettings.name : ''}\n
\n \n {integration ? integration.name : null}\n
\n \n {formatedProperties} \n {moreProperties}
\n
\n \n \n
\n
\n \n {id === undefined ? () : ()}\n \n \n
\n Add Intregation
\n\n
\n \n {\" \"}\n {\" \"}\n \n\n \n
\n Title
\n {integration.name}\n\n
\n Business Name
\n {formatedProperties} \n {moreProperties}\n\n \n {id === undefined ? () : ()}\n \n \n
\n Add Intregation
\n\n
\n Name
\n {integration.name}\n\n
\n Business Name
\n {formatedProperties} \n {moreProperties}\n\n \n {id === undefined ? (\n \n ) : (\n \n )}\n \n \n
\n {id === undefined ? \"Add\" : \"Update\"} Intregation
\n\n
\n Name
\n {integration.name}\n\n
\n Business Name
\n {formatedProperties} \n {moreProperties}\n\n \n {id === undefined ? () : ()}\n \n \n
\n {id === undefined ? \"Add\" : \"Update\" } Google Tag Manager Intregation
\n\n {/*
\n {/* \n {\" \"}\n {\" \"}\n */}\n \n
\n Name
\n {integration.name}\n\n
\n Business Name
\n {formatedProperties} \n {moreProperties}\nAvailable Integrations
\n\n setIsAddVouchers(!isAddVouchers)}>Connect\n
\n \n 
\n
\n \n
\n Popup Store
\n Open the voucher store as a popup inside your website (iFrame).\n\n setIsAddStandalonePage(!isAddStandalonePage)}>Connect\n
\n \n \n
\n \n
\n Standalone Store
\n Create a customized voucher store and link from your website.\n\n setIsAddEmbedVoucher(!isAddEmbedVoucher)}>Connect\n
\n \n \n
\n \n
\n Embedded Store
\n Display vouchers inside your webpage (iFrame).\nConnected Integrations
\nAvailable Integrations
\n\n \n
\n
\n \n
\n \n
\n \n \n
\n Connect Amadeus for Stay Vouchers
\n\n \n {' '}\n
\n
\n \n {' '}\n
\n \n
\n \n \n
\n Connect Xola for Tour & Activity Vouchers
\n\n \n {' '}\n
\n
\n \n {' '}\n
\n \n
\n \n \n
\n Connect CloudBeds
\n\n \n {' '}\n
\n
\n \n {' '}\n
\n \n
\n \n \n
\n New to Stripe?
\nCreate a New Standard Stripe Account for Payment Processing
\n\n \n
\n
\n \n
\n \n
\n \n \n
\n Connect to Mews
\n\n \n {' '}\n
\n
\n \n {' '}\n
\n \n
\n \n \n
\n Connect to PayPal
\n\n \n {' '}\n
\n
\n \n {' '}\n
\n \n
\n \n \n
\n Connect to Google Tag Manager
\n\n \n {' '}\n
\n
\n \n {' '}\n
\n \n
\n \n \n
\n Already using Stripe?
\nConnect to Existing Stripe Account for Payment Processing
\nConnected Integrations
\n\n \n \n
\n);\n\nexport default UI;\n","import React, { Fragment, useState, useEffect } from 'react';\nimport {\n Button,\n Row,\n Modal,\n ModalBody,\n ModalHeader,\n ModalFooter,\n Card,\n CardBody,\n} from 'reactstrap';\n\nimport {\n Colxx,\n Separator,\n} from '../../../../../components/common/CustomBootstrap';\nimport DigitalAssistant from './DigitalAssistant';\nimport IntegrationInfo from './IntegrationInfo';\nimport NudgesSetting from './NudgesSetting';\nimport MultliLanguages from './MultliLanguages';\nimport { AxiosAPI, getGroupID } from '../../../../../helpers/AxiosAPI';\nimport {\n putAPI_Update_Ingetration,\n gAPI_Ingetration,\n gAPI_Property_List,\n dAPI_Delete_Ingetration,\n gAPI_MembershipTags\n} from '../../../../../constants/APIs';\nimport CodeSnippet from './CodeSnippet';\nimport { NavLink } from 'react-router-dom';\nimport { faHandSpock } from '@fortawesome/free-regular-svg-icons';\nimport {\n faPalette,\n faLanguage,\n faLocationArrow,\n} from '@fortawesome/free-solid-svg-icons';\nimport { faWpforms } from '@fortawesome/free-brands-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport BubblePosition from './BubblePosition';\nimport Example from './Example';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\n\n function IntegrationList({ match, history,propertyId }) {\n const integrationId = match.params.id;\n const [integration, setIntegration] = useState();\n const [allProperties, setAllProperties] = useState([]);\n const [deleteVisible, setDeleteVisible] = useState(false);\n const [propertyVisible, setPropertyVisible] = useState(false);\n const [apperanceVisible, setApperanceVisible] = useState(false);\n const [nudgesVisible, setNudgesVisible] = useState(false);\n const [positionVisible, setPositionVisible] = useState(false);\n const [formVisible, setFormVisible] = useState(false);\n const [languageVisible, setLanguageVisible] = useState(false);\n const [publishVisible, setPublishVisible] = useState(false);\n const [persistentMenuVisible, setPersistentMenuVisible] = useState(false);\n const [membershipTags,setMembershipTags]=useState([]);\n const localeOptions = [\n { id: \"en\", name: \"English\", desc: \"English\", code: \"en\", locale: \"en\" },\n { id: \"hi\", name: \"Hindi\", desc: \"हिंदी\", code: \"hi\", locale: \"hi\" },\n {\n id: \"id\",\n name: \"Indonesian\",\n desc: \"bahasa Indonesia\",\n code: \"id\",\n locale: \"id\",\n },\n { id: \"es\", name: \"Spanish\", desc: \"Español\", code: \"es\", locale: \"es\" },\n { id: \"fr\", name: \"French\", desc: \"français\", code: \"fr\", locale: \"fr\" },\n { id: \"de\", name: \"German\", desc: \"Deutsche\", code: \"de\", locale: \"de\" },\n { id: \"zh\", name: \"Chinese\", desc: \"简体中文\", code: \"ZH-簡\", locale: \"zh\" },\n {\n id: \"vi\",\n name: \"Vietnamese\",\n desc: \"Tiếng Việt\",\n code: \"vi\",\n locale: \"vi\",\n },\n { id: \"th\", name: \"Thai\", desc: \"ไทย\", code: \"th\", locale: \"th\" },\n { id: \"ja\", name: \"Japanese\", desc: \"日本語\", code: \"ja\", locale: \"ja\" },\n {\n id: \"zh-TW\",\n name: \"Chinese (Traditional)\",\n desc: \"繁體中文\",\n code: \"ZH-繁\",\n locale: \"hk\",\n },\n {\n id: \"tl\",\n name: \"Tagalog (Filipino)\",\n desc: \"Tagalog (Filipino)\",\n code: \"tl\",\n locale: \"tl\",\n },\n { id: \"af\", name: \"Afrikaans\", desc: \"Afrikaans\", code: \"af\", locale: \"af\" },\n { id: \"ko\", name: \"Korean\", desc: \"한국어\", code: \"ko\", locale: \"ko\" },\n { id: \"mi\", name: \"Maori\", desc: \"Maori\", code: \"mi\", locale: \"mi\" },\n ];\n const toggle = () => {\n setDeleteVisible(!deleteVisible);\n };\n\n const property = () => {\n setPropertyVisible(true);\n setApperanceVisible(false);\n setNudgesVisible(false);\n setPositionVisible(false);\n setFormVisible(false);\n setLanguageVisible(false);\n setPublishVisible(false);\n setPersistentMenuVisible(false);\n };\n\n const appearance = () => {\n setPropertyVisible(false);\n setApperanceVisible(true);\n setNudgesVisible(false);\n setPositionVisible(false);\n setFormVisible(false);\n setLanguageVisible(false);\n setPublishVisible(false);\n setPersistentMenuVisible(false);\n };\n\n const nudges = () => {\n setPropertyVisible(false);\n setApperanceVisible(false);\n setNudgesVisible(true);\n setPositionVisible(false);\n setFormVisible(false);\n setLanguageVisible(false);\n setPublishVisible(false);\n setPersistentMenuVisible(false);\n };\n\n const chatForm = () => {\n setPropertyVisible(false);\n setApperanceVisible(false);\n setNudgesVisible(false);\n setPositionVisible(false);\n setFormVisible(true);\n setLanguageVisible(false);\n setPublishVisible(false);\n setPersistentMenuVisible(false);\n };\n\n const publishCode = () => {\n setPropertyVisible(false);\n setApperanceVisible(false);\n setNudgesVisible(false);\n setPositionVisible(false);\n setFormVisible(false);\n setLanguageVisible(false);\n setPublishVisible(true);\n setPersistentMenuVisible(false);\n };\n const setPosition = () => {\n setPropertyVisible(false);\n setApperanceVisible(false);\n setNudgesVisible(false);\n setPositionVisible(true);\n setFormVisible(false);\n setLanguageVisible(false);\n setPublishVisible(false);\n setPersistentMenuVisible(false);\n };\n const setLanguage = () => {\n setPropertyVisible(false);\n setApperanceVisible(false);\n setNudgesVisible(false);\n setPositionVisible(false);\n setFormVisible(false);\n setLanguageVisible(true);\n setPublishVisible(false);\n setPersistentMenuVisible(false);\n };\n const persistentMenu = () => {\n setPropertyVisible(false);\n setApperanceVisible(false);\n setNudgesVisible(false);\n setPositionVisible(false);\n setFormVisible(false);\n setLanguageVisible(false);\n setPublishVisible(false);\n setPersistentMenuVisible(true);\n };\n\n useEffect(() => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_MembershipTags}?propertyId=${propertyId}`,\n })\n .then((res) => { \n if(res.data!== undefined && res.data.tags !== undefined)\n setMembershipTags(res.data.tags);\n setPropertyVisible(true);\n }); \n AxiosAPI({\n method: 'get',\n url: `${gAPI_Ingetration}/${integrationId}?group_id=${getGroupID()}`,\n })\n .then((res) => {\n \n setIntegration(res.data);\n })\n .catch((err) => console.log('err', err));\n }, [integrationId]);\n\n useEffect(() => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Property_List}/?group_id=${getGroupID()}`,\n }).then((res) => {\n setAllProperties(res.data);\n });\n }, []);\n\n const saveIntegration = (data) => {\n const { list, name, botSetting,isShowMembership,selectedMemberShipTags } = data; \n if (botSetting) {\n updateModel.botSettings = botSetting;\n }\n if (list) {\n updateModel.properties = list;\n }\n if (name) {\n updateModel.name = name;\n if(isShowMembership !== undefined)\n updateModel.ismembership=isShowMembership;\n\n if(selectedMemberShipTags !== undefined)\n updateModel.membershipTags=selectedMemberShipTags.map((m)=>m.value);\n }\n \n\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Ingetration}/${integration.id\n }?group_id=${getGroupID()}`,\n data: updateModel,\n })\n .catch((err) => console.error(err))\n .then(\n setTimeout(() => {\n window.location.reload();\n }, 2000)\n );\n };\n\n const RedirectToDemo = () => {\n var url = `${process.env.REACT_APP_VOUCHER_URL\n }?gid=${getGroupID()}&iid=${integrationId}`;\n window.open(url, '_blank');\n };\n\n const modelNudges = integration\n ? integration.channelDetails.initiationRuleset[0].nudges.map((nudge) => {\n if (nudge.eyeCatcher && nudge.greeting) {\n return {\n eyeCatcher: {\n code: nudge.eyeCatcher.query.code,\n filterTags: null,\n },\n greeting: {\n code: nudge.greeting.query.code,\n filterTags: null,\n },\n delayInMilliseconds: nudge.delayInMilliseconds,\n buttons: nudge.buttons,\n };\n }\n })\n : null;\n const updateModel = integration\n ? {\n name: integration.name,\n level: integration.level,\n properties: [...integration.properties],\n sessionTimeoutInSeconds: integration.sessionTimeoutInSeconds,\n baseUrl: integration.channelDetails.baseUrl,\n homePageRoute: integration.channelDetails.homePageRoute,\n defaultLanguage: 'en-US',\n defaultRuleDescription: 'Default',\n defaultRuleNudges: [...modelNudges],\n botSettings: { ...integration.botSettings },\n menuEnabled: integration.channelDetails.menuEnabled,\n persistentMenu: integration.channelDetails.persistentMenu\n }\n : null;\n\n const generateDeleteButton = () => {\n return (\n \n \n
\n \n Select properties\n
\n\n Select the properties that are visible through this\n integration\n
\n\n
\n \n
\n \n Appearance\n
\n\n Choose your digital assistant's name, avatar and\n setup your colours\n
\n\n
\n \n
\n \n Nudges\n
\n\n Setup proactive messages to engage the website\n visitors\n
\n\n
\n \n
\n \n Position\n
\n\n Control the position of chat widget on your website\n
\n\n
\n \n
\n \n Pre & Post Chat form\n
\n\n Collect website visitor details, before they can\n start the chat\n
\n\n
\n \n
\n \n Persistent Menu\n
\n\n Setup your persistent menu\n
\n\n
\n \n
\n \n Language\n
\n\n Select the languages for the chat widget\n
\n\n
\n \n
\n \n Publish your digital assistant\n
\n\n Copy the code snippet to install your digital\n assistant\n
\n\n
\n \n \n Preview\n \n\n
\n \n \n Archive\n \n\n
\n \n
\n a voucher distribution system for savvy tourism businesses
\n\n Please enter the new password.\n
\n\n \n Change Password\n \n
\n \n
\n \n Your password must contain
\n- \n
- Atleast 12 Characters (16 Maximum). \n
- Atleast one upper case letter. \n
- Atleast one lower case letter. \n
- Atleast one number. \n
- Atleast one of the following symbols (?=.*[@#$%^&-+=()]). \n
{this.state.message}
\n\n
\n a voucher distribution system for savvy tourism businesses
\n\n Please enter the new pin.\n
\n\n \n {this.props.checkPin ===true ? 'Change Pin' : 'Create Pin'}\n \n \n
\n {JSON.stringify(addOnsData, null, 2)} */}\n \n \n \n \n handleInputChange(event)}\n />\n \n
\n {inviteData !== '' ? (\n \n \n setCopied(true)}\n >\n \n Copy the code snippet\n \n \n {copied ? \n
\n ) : (\n ''\n )}\n\n \n \n \n handleChange(event)}\n />\n \n \n \n handleChange(event)}\n />\n \n \n \n handleChange(event)}\n />\n \n \n \n handleChange(event)}\n />\n \n \n \n \n
\n\n \n
\n )}\n Send Account Creation Invitation
\n\n \n {inviteData}\n \n
\n Copied.
: null}\n Stripe Integration
\n\n {\n setVisible(!visible);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Create a New Group\n \n {\n setVisible(!visible);\n }}\n submit={handleSubmit}\n />\n {setOpen(!open)}}> \n
\n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(CreateGroupsForm));\n","import React, { useState } from 'react';\nimport { GroupsForm } from './GroupsForm';\nimport { Button } from 'reactstrap';\nimport { AxiosAPI } from '../../../../../../../helpers/AxiosAPI';\nimport { putAPI_Update_Group } from '../../../../../../../constants/APIs';\nimport Validation from '../../../../../../../components/Validation';\nexport default function UpdateGroupsForm({ id }) {\n const [isUpdating, setIsUpdating] = useState(false);\n const [open,setOpen] = useState(false);\n const [msg,setMsg] =useState([]);\n const handleSubmit = (data) => {\n const formmatedData = { ...data, updater: 'admin' };\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Group}/${id}`,\n data: formmatedData,\n }).then((res) => {\n if (res.data.HttpStatusCode !== undefined && res.data.HttpStatusCode === 400 && res.data.Messages !== undefined\n && res.data.Messages !== null && res.data.Messages.length > 0) {\n setMsg(res.data.Messages);\n setOpen(true);\n }\n else {\n setTimeout(() => {\n window.location.reload();\n }, 300);\n }\n }\n );\n };\n\n return (\n \n setIsUpdating(!isUpdating)}\n >\n Edit\n \n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n id={id}\n submit={handleSubmit}\n />\n )}\n {setOpen(!open)}}> \n
\n );\n}\n","import React, { useState, useEffect, Fragment } from 'react';\nimport {\n Button,\n Row,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n Label,\n Spinner,\n} from 'reactstrap';\nimport { Colxx } from '../../../../../../../components/common/CustomBootstrap';\nimport { AxiosAPI } from '../../../../../../../helpers/AxiosAPI';\nimport {\n gAPI_OnboardGroup_By_Id,\n putAPI_UpdateStatus_Group,\n} from '../../../../../../../constants/APIs';\n\nexport default function OnBoardDetail({\n groupId,\n visible,\n toggle,\n LoadGroups,\n}) {\n const [cancelVisible, setCancelVisible] = useState(false);\n const [groupData, setGroupData] = useState();\n useEffect(() => {\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_OnboardGroup_By_Id}/${groupId}\n`,\n })\n .then((res) => {\n // console.log('res.data', res.data);\n // TODO:\n setGroupData(res.data);\n })\n .catch((err) => console.log('err', err));\n }, [groupId]);\n\n const ApproveGroup = () => {\n let data = {\n status: 'Approved',\n Updater: 'Super Admin',\n };\n AxiosAPI({\n method: 'put',\n url: `${putAPI_UpdateStatus_Group}/${groupId}`,\n data: data,\n })\n .then((data) => {\n LoadGroups();\n toggle();\n })\n .catch((err) => {\n console.log('err', err);\n });\n };\n\n const ArchiveGroup = () => {\n let data = {\n status: 'Archived',\n Updater: 'Super Admin',\n };\n AxiosAPI({\n method: 'put',\n url: `${putAPI_UpdateStatus_Group}/${groupId}`,\n data: data,\n })\n .then((data) => {\n LoadGroups();\n toggle();\n })\n .catch((err) => {\n console.log('err', err);\n });\n };\n\n const toggleCancelBooking = () => {\n setCancelVisible(!cancelVisible);\n };\n\n const generateArichveGroup = () => {\n return (\n Detail
\n {groupData.name}
\n {groupData.type}
\n {groupData.website}
\n {groupData.country}
\n {groupData.timeZone}
\n {groupData.subscription}
\n {groupData.promoCode}
\n User
\n{groupData.firstName}
\n {groupData.lastName}
\n {groupData.email}
\n {groupData.mobileNumber}
\n \n
\n )}\n Loading Data...
\n\n setIsUpdating(!isUpdating)}\n >\n Detail\n \n {isUpdating && (\n setIsUpdating(!isUpdating)}\n />\n )}\n
\n );\n}\n","import React, { useState, useEffect, Fragment } from 'react';\nimport { Row, Card, CardBody, Input, CustomInput } from 'reactstrap';\nimport { Colxx } from '../../../../../components/common/CustomBootstrap';\nimport { AxiosAPI, getUserID } from '../../../../../helpers/AxiosAPI';\nimport {\n gAPI_Groups,\n gAPI_CheckUser_Groups,\n} from '../../../../../constants/APIs';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\nimport CreateGroupsForm from './components/forms/CreateGroupsForm';\nimport UpdateGroupsForm from './components/forms/UpdateGroupsForm';\nimport DetailButton from './components/forms/DetailButton';\n\nfunction Index({ propertyId, history }) {\n const [groupList, setGroupsList] = useState([]);\n const [loading, setLoading] = useState(true);\n const [showApprovalGroups, setShowApprovalGroups] = useState(false);\n\n useEffect(() => {\n LoadGroups();\n }, [propertyId]);\n\n const LoadGroups = () => {\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_CheckUser_Groups}/${getUserID()}`,\n })\n .then((res) => {\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Groups}`,\n })\n .then((res) => {\n setGroupsList(res.data);\n setLoading(false);\n })\n .catch((err) => console.log('err', err));\n })\n .catch((err) => history.push('/app/error'));\n };\n\n if (loading) {\n return (\n Loading...
\n\n
\n \n
\n \n {group.name}\n
\n\n {group.groupId}\n
\n\n {group.status}\n
\n\n {group.country}\n
\n\n
\n \n
\n \n
\n \n
\n \n {group.name}\n
\n\n {group.groupId}\n
\n\n {group.status}\n
\n\n {group.country}\n
\n\n
\n {title}
{message}
{props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Voucher',\n accessor: 'name',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Voucher#',\n accessor: 'voucherNumber',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Order#',\n accessor: 'orderNumber',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Status',\n accessor: 'status',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Retail Price',\n accessor: 'price',\n Cell: props =>{props.row._original.currency.toUpperCase()} {props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Discount',\n accessor: 'discount',\n Cell: props =>{props.value}%
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Discounted Price',\n accessor: 'discountedPrice',\n Cell: props =>{props.row._original.currency.toUpperCase()} {props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Fee',\n accessor: 'processingFee',\n Cell: props =>$ {(parseFloat(props.row._original.processingFee))}
,\n style: { 'whiteSpace': 'unset' }\n }\n , {\n Header: 'Gifted',\n accessor: 'gifted',\n Cell: props =>{props.row._original.gifted ? \"Yes\" : \"No\"}
,\n style: { 'whiteSpace': 'unset', }\n },\n {\n Header: 'Integration Name',\n accessor: 'intregationName',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Discount',\n accessor: 'discount',\n Cell: props =>{props.value + ' %'}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Status',\n accessor: 'redeem',\n Cell: props =>\n
,\n style: { 'whiteSpace': 'unset' }\n },\n\n {\n Header: 'Order Email',\n accessor: 'email',\n Cell: props => {props.value}\n {(props.value === \"Void\" || props.value === \"Refund\") && props.row._original.voidReason !==\"\" && {props.row._original.voidReason}}\n
\n {props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Created Date',\n accessor: 'createdDate',\n Cell: props =>{moment(props.value).format(\"DD-MM-YYYY hh:mm:ss A\")}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: '',\n accessor: 'discountedPrice',\n Cell: props =>\n \n \n more\n \n \n handleClick(props.row._original)}\n >\n Redeem voucher\n \n handleVoid(props.row._original)}\n >\n Void voucher\n \n handleRefund(props.row._original)}\n \n >\n Refund voucher\n \n\n { showResendEmail(props.row._original) }}\n >\n Resend email\n \n { \n setSettlementData({...settlementData,email:props.row._original.email,\n voucherNumber:props.row._original.voucherNumber,saleDate:props.row._original.createdDate,amount:props.value});\n setSettlementodal(true); }}\n >\n Reconcile Payment\n \n \n \n
\n {/* //: null} */}\n \n {\n setSearchOrder(e.target.value);\n handleSearchfilter(e.target.value, dropDown);\n }}>
\n \n {orderList ? (\n
\n Resend Email
\n \n \n Email
\n \n \n {emailData.map((m, index) => (\n \n \n \n {\n handleChange(index, e);\n }} />\n \n\n \n \n \n
\n ))}\n \n \n \n + Add email\n \n \n
\n
\n \n deleteEmail(m.id)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n X\n \n
\n Voucher
\n \n setReason(e.target.value)}>\n \n
Refund Voucher
\n \n setReason(e.target.value)}>\n \n
Reconcile Payment
\nKeep your records up to date. Mark the date you received the vouchers payment from aiva.\n
\n \n \n \n setSettlementData({...settlementData,date:e})}\n placeholderText=\"Start Date\"\n dateFormat=\"DD/MM/YYYY\"\n /> \n \n \n \n null} disabled={true}>\n \n \n
\n Voucher Number : {settlementData.voucherNumber !==undefined?settlementData.voucherNumber :\"\"}\n Customer : {settlementData.email !==undefined ?settlementData.email:\"\"}\n Sale Date : {settlementData.saleDate !==undefined ?moment(settlementData.saleDate).format('YYYY-MM-DD HH:mm:ss'):\"\"}\n \n\n\n
\n \n
\n\n {showStatement !==undefined && showStatement===false && showOrdeList && (\n \n {\n setShowStatement(false);\n }}\n style={{ width: '100%', borderRadius: '6px',backgroundColor:`${ showStatement===false ? \"#EF4A81 \":\"\" }` }}\n >\n Order History\n \n
\n \n {\n setShowStatement(true);\n }}\n style={{ width: '100%', borderRadius: '6px',backgroundColor:`${ showStatement===true ? \"#EF4A81 \":\"\" }` }}\n >\n Statement\n \n
\n \n \n {inputFields.map((contact, index) => (\n \n \n \n handleInputChange(index, event)}\n >\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n handleInputChange(index, event)}\n />\n \n \n \n handleInputChange(index, event)}\n />\n \n \n \n handleInputChange(index, event)}\n />\n \n \n \n handleCheckChange(index, e)}\n />\n \n\n \n \n \n \n ))}\n
\n \n + Add Contact\n \n {isEditing && (\n \n Save Contacts\n \n )}\n { setOpen(!open) }}> \n
\n );\n}\n","import React, { useState, Fragment } from 'react';\nimport { Row, Input, Label, Button, FormGroup } from 'reactstrap';\nimport { Colxx } from '../../../../../../../components/common/CustomBootstrap';\nimport { AxiosAPI } from '../../../../../../../helpers/AxiosAPI';\nimport { putAPI_Update_Domains } from '../../../../../../../constants/APIs';\nimport Validation from '../../../../../../../components/Validation';\nexport default function DomainsForm({ domains, id }) {\n const [inputFields, setInputFields] = useState(domains);\n const [isEditing, setIsEditing] = useState(false);\n const [open,setOpen] = useState(false);\n const [msg,setMsg] =useState([]);\n const handleAddFields = () => {\n const values = [...inputFields];\n values.push({\n type: 'AccommodationProviders',\n priority: 1,\n });\n setInputFields(values);\n setIsEditing(true);\n };\n\n const handleRemoveFields = (index) => {\n const values = [...inputFields];\n values.splice(index, 1);\n setInputFields(values);\n setIsEditing(true);\n };\n\n const handleInputChange = (index, event) => {\n const values = [...inputFields];\n if (event.target.name === 'priority') {\n values[index].priority = event.target.value;\n } else {\n values[index].type = event.target.value;\n }\n\n setInputFields(values);\n setIsEditing(true);\n };\n\n const handleSubmit = (e) => {\n e.preventDefault();\n const data = { domains: [...inputFields], updater: 'admin' };\n //console.log(data);\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Domains}/${id}`,\n data,\n }).then((res) =>{\n if (res.data.HttpStatusCode !== undefined && res.data.HttpStatusCode === 400 && res.data.Messages !== undefined\n && res.data.Messages !== null && res.data.Messages.length > 0) {\n setMsg(res.data.Messages);\n setOpen(true);\n }\n else {\n setTimeout(() => {\n window.location.reload();\n }, 300);\n }}\n );\n };\n\n return (\n Contacts
\n {/*{JSON.stringify(inputFields, null, 2)} */}\n \n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n \n \n {inputFields.map((domain, index) => (\n \n \n \n handleInputChange(index, event)}\n >\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n handleInputChange(index, e)}\n />\n \n \n \n \n \n \n ))}\n
\n \n + Add Domain\n \n {isEditing && (\n \n Save Domains\n \n )}\n {setOpen(!open)}}> \n
\n );\n}\n","import React, { useState, Fragment, useEffect } from 'react';\nimport {\n Row,\n Input,\n Label,\n CustomInput,\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n FormGroup,\n InputGroup,\n InputGroupAddon,\n InputGroupText, Tooltip\n} from 'reactstrap';\nimport DatePicker from 'react-datepicker';\nimport 'react-datepicker/dist/react-datepicker.css';\nimport ImageGallery from '../../../../propinfo/gallery/index';\nimport { Colxx } from '../../../../../../../components/common/CustomBootstrap';\nimport timeZoneOptions from '../../../../../../../data/timeZone';\nimport currencies from '../../../../../../../data/currencies';\nimport ContactsForm from './ContactsForm';\nimport DomainsForm from './DomainsForm';\nimport { AxiosAPI } from '../../../../../../../helpers/AxiosAPI';\nimport { gAPI_Internal_Property_By_Id } from '../../../../../../../constants/APIs';\nimport Select from 'react-select';\nimport country from '../../../../../../../data/country';\nimport { reactSelectOptionDiffrentPro } from '../../../../../../../helpers/Utils';\nimport timeZoneList from '../../../../../../../data/timeZoneList';\nimport currencyList from '../../../../../../../data/currencyList';\nimport Rating from '../../../../../../../components/common/Rating';\nimport moment from 'moment';\n\nexport function PropertyForm({\n visible,\n toggle,\n formLabel,\n submit,\n updatepropertyData,\n id, check,\n groupId,\n}) {\n const [selectedCountry, setSelectedCountry] = useState({\n value: '',\n label: 'Please Select',\n });\n useEffect(() => {\n if (id !== undefined) {\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Internal_Property_By_Id}/${id}?group_id=${groupId}`,\n })\n .then((res) => {\n \n setStartDate(moment(res.data.activationDate).format('MMM DD, YYYY') === 'Jan 01, 0001' ? null\n : moment(res.data.activationDate));\n setpropertyData(res.data);\n // let currency = currencyList.filter(item => item.countryCode === res.data.country);\n let timeZones = timeZoneList.filter(\n (item) => item.IsoAlpha2 === res.data.country\n );\n const countryGroup = country.filter(\n (item) => item.code === res.data.country\n );\n let countrySelected = {\n value: countryGroup[0].code,\n label: countryGroup[0].name,\n };\n setSelectedCountry(countrySelected);\n // setpropertyData({\n // ...propertyData,\n // country: value.value,\n // currency: currency[0].currencyCode\n // });\n\n \n setSelectZones(\n timeZones[0].TimeZones.map((zone) => {\n return ;\n })\n );\n })\n .catch((err) => console.log('err', err));\n }\n }, [id]);\n const [selectZones, setSelectZones] = useState();\n const [startDate, setStartDate] = useState(null);\n const [galleryVisible, setGalleryVisible] = useState(false);\n let [propertyData, setpropertyData] = useState(\n updatepropertyData || {\n groupId: groupId,\n type: 'hotel',\n name: '',\n currency: 'NZD',\n inventoryProvider: 'None',\n ratesProvider: 'None',\n bookingProvider: 'None',\n timeZone: 'None',\n ariUrl: '',\n bookingUrl: '',\n creator: 'Manually',\n isTemplate: false,\n displayOrder: 1,\n country: 'NZ',\n status: 'Active',\n websiteLink: '',\n rooms: 0,\n starRating: 0,\n images: 'https://via.placeholder.com/150/',\n bmbAccountManager: '',\n bmbVoucherProcessingFee: 0,\n customerSuccessManager: '',\n isBmb: false,\n isAiva: false,\n isVirtualFrontDesk: false,\n isRateBooking: false,\n activationDate: null,\n redeemAddress: '',\n averageDailyRate: 0,\n notSendApplicationFeeToStripe:false\n }\n );\n const [tooltipOpen, setTooltipOpen] = useState(false);\n const handleChange = (e) => {\n setpropertyData({\n ...propertyData,\n [e.target.name]: e.target.value,\n });\n };\n const handleRateChange = (e) => {\n setpropertyData({\n ...propertyData,\n starRating: e.rating,\n });\n };\n const handleCheckedChange = (e) => {\n setpropertyData({\n ...propertyData,\n [e.target.name]: e.currentTarget.checked,\n });\n };\n const togglegallery = () => {\n // setImageIndex(index);\n setGalleryVisible(!galleryVisible);\n };\n\n\n const selectedImage = (image) => {\n\n setpropertyData({\n ...propertyData,\n images: image.src,\n });\n };\n \n const ImageGalleryButton = () => {\n return (\n Domains
\n {/*{JSON.stringify(inputFields, null, 2)} */}\n \n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n {JSON.stringify(propertyData, null, 2)} */}\n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n Logo
\n\n {\n setVisible(!visible);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Create a New Property\n \n {\n setVisible(!visible);\n }}\n submit={handleSubmit}\n groupId={groupId}\n />\n {setOpen(!open)}}> \n
\n \n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(CreatePropertyForm));\n","import React, { useState } from 'react';\nimport { Button } from 'reactstrap';\nimport { AxiosAPI } from '../../../../../../../helpers/AxiosAPI';\nimport { postAPI_Update_Property } from '../../../../../../../constants/APIs';\nimport { PropertyForm } from './PropertyForm';\nimport Validation from '../../../../../../../components/Validation';\n\nexport default function UpdatePropertyForm({ id, groupId }) {\n const [isUpdating, setIsUpdating] = useState(false);\n const [visible, setVisible] = useState(false);\n const [open,setOpen] = useState(false);\n const [msg,setMsg] =useState([]);\n const handleSubmit = (data) => {\n const formmatedData = { ...data, updater: 'admin' }; \n AxiosAPI({\n method: 'put',\n url: `${postAPI_Update_Property}/${id}`,\n data: formmatedData,\n }).then(\n (res) =>{\n if (res.data.HttpStatusCode !== undefined && res.data.HttpStatusCode === 400 && res.data.Messages !== undefined\n && res.data.Messages !== null && res.data.Messages.length > 0) {\n setMsg(res.data.Messages);\n setOpen(true);\n }\n else {\n setVisible(false);\n setTimeout(() => {\n window.location.reload();\n }, 1000);\n }\n }\n );\n };\n\n return (\n \n setIsUpdating(!isUpdating)}\n >\n Edit\n \n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n id={id}\n submit={handleSubmit}\n groupId={groupId}\n />\n )}\n {setOpen(!open)}}> \n
\n );\n}\n","import React, { useState, useEffect, Fragment } from 'react';\nimport { Row, Card, CardBody } from 'reactstrap';\nimport Select from 'react-select';\nimport { Colxx } from '../../../../../components/common/CustomBootstrap';\nimport {\n AxiosAPI,\n getGroupID,\n getSelectedGroup,\n setSelectedGroup,\n getUserID,\n} from '../../../../../helpers/AxiosAPI';\nimport {\n gAPI_Internal_Property_List,\n gAPI_CheckUser_Property,\n} from '../../../../../constants/APIs';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\nimport CreatePropertyForm from './components/forms/CreatePropertyForm';\nimport UpdatePropertyForm from './components/forms/UpdatePropertyForm';\nimport { gAPI_Groups } from '../../../../../constants/APIs';\nimport { reactSelectOptionDiffrentProWithKeyValue } from '../../../../../helpers/Utils';\n\nfunction Index({ propertyId, history }) {\n const [propertiesList, setPropertiesList] = useState([]);\n const [groupList, setGroupsList] = useState([]);\n const [groupId, setGroupId] = useState(getGroupID());\n const [SelectedValue, DropdownSelectedValue] = useState(getSelectedGroup());\n const [loading, setLoading] = useState(true);\n\n useEffect(() => {\n const group = getSelectedGroup();\n if (group) {\n DropdownSelectedValue(group);\n }\n fetchProperties();\n }, [propertyId]);\n\n const fetchProperties = () => {\n setLoading(true);\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_CheckUser_Property}/${getUserID()}`,\n })\n .then((res) => {\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Groups}`,\n })\n .then((res) => {\n setLoading(false);\n setGroupsList(res.data);\n })\n .catch((err) => console.log('err', err));\n if (typeof groupId === 'object' || SelectedValue) {\n const selectedGroupId = SelectedValue.value || groupId;\n setGroupId(selectedGroupId);\n setLoading(true);\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Internal_Property_List}?group_id=${selectedGroupId}`,\n })\n .then((res) => {\n setPropertiesList(res.data);\n setLoading(false);\n })\n .catch((err) => console.log('err', err));\n }\n })\n .catch((err) => history.push('/app/error'));\n };\n\n if (loading) {\n return (\n Loading...
\n\n \n {SelectedValue &&\n SelectedValue.label &&\n SelectedValue.value &&\n SelectedValue.label + ' (' + SelectedValue.value + ')'}\n \n
\n \n
\n \n
\n \n {property.name}\n
\n\n {property.type}\n
\n\n {property.id}\n
\n\n {property.inventoryProvider}\n
\n\n
\n \n
\n\n \n {/*
\n \n
*/}\n \n
\n \n \n \n more\n \n \n setUpdateModal(item)}>\n \n exportData(item)}>\n \n setGalleryVisible(item)}>\n \n \n\n \n
\n \n {item.title}\n\n
\n\n {item.subTitle}\n
\n\n {item.status}\n
\n\n {moment(item.startDate).format('YYYY-MM-DD')}\n
\n\n {moment(item.endDate).format('YYYY-MM-DD')}\n
\n\n {item.category}\n
\n\n Change Status\n
\n\n Export\n
\n\n Import\n
\nLoading...
\n\n \n \n {dropDownToggle}\n \n \n {\n setItem({ ...item, status: 1 });\n setDropDownToogle('Active');\n }}>\n Active\n \n {\n setItem({ ...item, status: 2 });\n setDropDownToogle('Inactive');\n }}>\n Inactive\n \n {\n setItem({ ...item, status: 3 });\n setDropDownToogle('Archieved');\n }}>\n Archieved\n \n \n \n
\n Status :
\n\n \n \n
\n);\nexport default UI;\n","import React from 'react';\nimport { CardImg } from 'reactstrap';\n\nconst ProductListItem = ({\n item,\n SelectedProduct,\n SelectedProductID,\n EnabledSelection,\n togglePopUp,\n voucher,\n}) => {\n return (\n \n
\n \n \n );\n};\n\nexport default React.memo(ProductListItem);\n","import React, { useState, useEffect, Fragment } from 'react';\nimport {\n Row,\n Button,\n CardImg,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n} from 'reactstrap';\nimport {\n Colxx,\n Separator,\n} from '../../../../../components/common/CustomBootstrap';\nimport {\n AxiosAPI,\n getGroupID,\n AxiosStripeAPI,\n getUserID,\n} from '../../../../../helpers/AxiosAPI';\nimport {\n gAPI_Products_List,\n gAPI_Subscription_By_Group_Id,\n postAPI_Create_Subscription,\n gAPI_Users_By_Id,\n putAPI_Update_Subscription,\n gAPI_Group_By_Id,\n} from '../../../../../constants/APIs';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\nimport ProductListItem from './components/ProductListItem';\n\nfunction Index({ propertyId, isVoucherEngine }) {\n const [productsList, setProductsList] = useState([]);\n const [cancelPopUp, setPopUp] = useState(false);\n const [selectedSubscription, setSelectedSubscription] = useState({\n stripeCustomerId: '',\n stripeSubscriptionId: '',\n stripeProductId: '',\n stripePriceId: '',\n productId: 0,\n priceId: 1,\n status: 'Active',\n Updater: 'dashboard',\n });\n\n const [selectedSubscriptionID, setSelectedSubscriptionID] = useState('');\n const [selectedProductID, setSelectedProductID] = useState('');\n const [selectedStripeSubscriptionID, setSelectedStripeSubscriptionID] =\n useState('');\n const [customerID, setcustomerID] = useState('');\n const [selectedProduct, setSelectedProduct] = useState();\n const [productChosen, setproductChosen] = useState(false);\n const [enabledSelection, setEnabledSelection] = useState(false);\n const [loading, setLoading] = useState(true);\n\n const togglePopUp = () => {\n //console.log(cancelPopUp);\n setPopUp(!cancelPopUp);\n };\n\n useEffect(() => {\n LoadData();\n }, [propertyId]);\n\n const LoadData = () => {\n let type = 'Website';\n if (isVoucherEngine) {\n type = 'Voucher';\n }\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Subscription_By_Group_Id}?groupid=${getGroupID()}`,\n })\n .then((subscriptionResponse) => {\n //console.log(subscriptionResponse.data)\n setSelectedSubscriptionID(subscriptionResponse.data.id);\n setcustomerID(subscriptionResponse.data.stripeCustomerId);\n setSelectedProductID(subscriptionResponse.data.stripeProductId);\n setSelectedStripeSubscriptionID(\n subscriptionResponse.data.stripeSubscriptionId\n );\n\n if (subscriptionResponse.data.productId !== 0) {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Group_By_Id}/${getGroupID()}`,\n }).then((res) => {\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Products_List}?currency=${res.data.billingCurrency}&type=${type}`,\n })\n .then((res) => {\n setProductsList(res.data);\n //console.log(res.data)\n setLoading(false);\n })\n .catch((err) => console.log('err', err));\n });\n } else {\n setLoading(false);\n }\n })\n .catch((err) => console.log('err', err));\n };\n\n const CheckExistingSubcription = (productsData) => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Subscription_By_Group_Id}?groupid=${getGroupID()}`,\n })\n .then((subscriptionResponse) => {\n // console.log(subscriptionResponse.data)\n setSelectedSubscriptionID(subscriptionResponse.data.id);\n setcustomerID(subscriptionResponse.data.stripeCustomerId);\n setSelectedProductID(subscriptionResponse.data.stripeProductId);\n setSelectedStripeSubscriptionID(\n subscriptionResponse.data.stripeSubscriptionId\n );\n })\n .catch((err) => console.log('err', err));\n };\n\n const SelectedProduct = (\n e,\n stripeProductId,\n stripePriceId,\n productId,\n priceId\n ) => {\n if (e.target.tagName !== 'A') {\n setSelectedSubscription({\n ...selectedSubscription,\n stripeProductId: stripeProductId,\n stripePriceId: stripePriceId,\n productId: productId,\n priceId: priceId,\n });\n //console.log(productsList)\n const product = productsList.find(\n (elem) => elem.productStripeId == stripeProductId\n );\n //console.log(product)\n setSelectedProduct(product);\n setproductChosen(true);\n }\n };\n\n const Cancel = () => {\n setproductChosen(false);\n };\n\n const Subscribe = () => {\n setLoading(true);\n var qs = require('qs');\n if (selectedStripeSubscriptionID === '') {\n var data = qs.stringify({\n customer: customerID,\n 'items[0][price]': selectedSubscription.stripePriceId,\n collection_method: 'send_invoice',\n days_until_due: '10',\n });\n AxiosStripeAPI({\n method: 'post',\n url: `v1/subscriptions`,\n data: data,\n })\n .then((stripeResponse) => {\n //console.log(stripeResponse.data)\n let subscriptionUpdate = {\n stripeCustomerId: customerID,\n stripeSubscriptionId: stripeResponse.data.id,\n stripeProductId: selectedSubscription.stripeProductId,\n stripePriceId: selectedSubscription.stripePriceId,\n productId: selectedSubscription.productId,\n priceId: selectedSubscription.priceId,\n status: 'Active',\n Updater: 'dashboard',\n };\n console.log(subscriptionUpdate);\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Subscription}/${selectedSubscriptionID}`,\n data: subscriptionUpdate,\n })\n .then((res) => {\n console.log(res.data);\n setSelectedProductID(selectedSubscription.stripeProductId);\n setproductChosen(false);\n setLoading(false);\n })\n .catch((err) => console.log('err', err));\n })\n .catch((err) => console.log('err', err));\n } else {\n AxiosStripeAPI({\n method: 'get',\n url: `v1/subscriptions/${selectedStripeSubscriptionID}`,\n }).then((stripeGetResponse) => {\n //console.log(stripeGetResponse.data.items.data[0].id)\n var data = qs.stringify({\n 'items[0][id]': stripeGetResponse.data.items.data[0].id,\n 'items[0][price]': selectedSubscription.stripePriceId,\n cancel_at_period_end: false,\n proration_behavior: 'create_prorations',\n collection_method: 'send_invoice',\n days_until_due: '10',\n });\n AxiosStripeAPI({\n method: 'post',\n url: `v1/subscriptions/${selectedStripeSubscriptionID}`,\n data: data,\n })\n .then((stripeResponse) => {\n //console.log(stripeResponse.data)\n let subscriptionUpdate = {\n stripeCustomerId: customerID,\n stripeSubscriptionId: stripeResponse.data.id,\n stripeProductId: selectedSubscription.stripeProductId,\n stripePriceId: selectedSubscription.stripePriceId,\n productId: selectedSubscription.productId,\n priceId: selectedSubscription.priceId,\n status: 'Active',\n Updater: 'dashboard',\n };\n //console.log(subscriptionUpdate)\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Subscription}/${selectedSubscriptionID}`,\n data: subscriptionUpdate,\n })\n .then((res) => {\n // console.log(res.data);\n setSelectedProductID(selectedSubscription.stripeProductId);\n setproductChosen(false);\n setLoading(false);\n })\n .catch((err) => console.log('err', err));\n })\n .catch((err) => console.log('err', err));\n });\n }\n };\n\n const StripeCustmerPortal = () => {\n var qs = require('qs');\n var data = qs.stringify({\n customer: customerID,\n return_url: window.location.href,\n });\n AxiosStripeAPI({\n method: 'post',\n url: `v1/billing_portal/sessions`,\n data: data,\n }).then((stripeResponse) => {\n window.open(\n stripeResponse.data.url,\n '_blank' // <- This is what makes it open in a new window.\n );\n });\n };\n\n return (\n \n \n ) : null}\n {/*
\n \n {item.name}\n
\n\n {item.description}\n
\n {item.imageUrl !== '' && (\n\n
\n {item.currency}\n {item.price}\n
\n ) : (\n\n
\n
\n {/* - \n {item.features.map((feature, index) => {\n return (\n
- \n
{feature.name}
\n \n );\n })}\n
\n {SelectedProductID != item.productStripeId && ( SelectedProduct(item.productStripeId, item.priceStripeId, item.productId, item.pricingId)} className=\"btn btn-link btn-empty btn-lg active\">\n SUBSCRIBE\n \n )}\n
*/}\n Subscription
\n\n {!loading ? (\n productsList.map((item, index) => {\n return (\n
\n Selected Subscription
\n\n
\n ) : (\n \n )}\n\n \n
\n \n
\n \n
\n \n \n {selectedProduct.description}\n \n {selectedProduct.imageUrl !== '' && (\n \n {/*
\n \n {selectedProduct.name}\n
\n\n
\n {selectedProduct.currency}\n {selectedProduct.price}\n
\n ) : (\n\n
\n
\n - \n {selectedProduct.features.map((feature, index) => {\n return (\n
- \n
{feature.name}
\n \n );\n })}\n
\n Please subscribe to subscription first.\n
)}\n\n \n \n
\n);\nexport default UI;","import React from 'react';\nimport { Badge } from 'reactstrap';\n\nexport default function DialogInformation({ elem }) {\n return (\n \n \n {elem.name}\n \n
\n );\n}\n","import React, { useState, Fragment } from 'react';\nimport {\n Row,\n Modal,\n ModalHeader,\n ModalBody,\n Button,\n Collapse,\n Card,\n CardBody,\n CardTitle,\n Input,\n} from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\nimport {\n faCommentDots,\n faEdit,\n faTrashAlt,\n faLaptopCode,\n} from '@fortawesome/free-solid-svg-icons';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\n\nfunction ApiMessageResponse({\n dialogUpdate,\n elem,\n dialogIndex,\n codeIndex,\n apiCode,\n}) {\n const [isEditing, setIsEditing] = useState(false);\n const [messageInput, setMessageInput] = useState(apiCode);\n const [deleteVisible, setDeleteVisible] = useState(false);\n const [postData, setPostData] = useState(elem);\n const handleEdit = () => {\n setIsEditing(true);\n };\n const toggle = () => {\n setDeleteVisible(!deleteVisible);\n };\n const handleDelete = () => {\n const data = { ...postData };\n data.messages.splice(codeIndex, 1);\n dialogUpdate(postData, dialogIndex);\n toggle();\n };\n const handleTextChange = (e) => {\n setMessageInput(e.target.value);\n const data = { ...postData };\n data.messages[codeIndex].apiCode = e.target.value;\n setPostData(data);\n };\n const handleSave = () => {\n dialogUpdate(postData, dialogIndex);\n setIsEditing(false);\n };\n const handleCancel = () => {\n setIsEditing(false);\n const data = { ...postData };\n data.messages[codeIndex].apiCode = apiCode;\n setPostData(data);\n setMessageInput(apiCode);\n };\n return (\n {elem.displayName}
\n{JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n {messageInput}
\n{JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n {apiCodeText}
\n{JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n {suggestionText}
\n\n
\n \n \n Save\n \n \n \n Cancel\n \n
\n \n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n \n
\n \n \n Save\n \n \n \n Cancel\n \n
\n {JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n {messageInput}
\n{JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n handleRemoveFields(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n \n
\n \n Title: {message.title}{' '}\n
\n )}\n {message.subtitle && (\n\n Subtitle: {message.subtitle}{' '}\n
\n )}\n {message.imageURL && (\n\n
\n Title: {action.title} Type: {action.type}{' '}\n
\n );\n })}\n \n
\n \n {' '}\n
\n Type: {complex.type}{' '}\n {complex.intents && (\n \n Intents: {complex.intents}\n \n )}{' '}\n {complex.minScore && (\n \n Min Score: {complex.minScore}\n \n )}\n
\n );\n })}\n \n {' '}\n {trigger.complexPriority && (\n
\n
\n {' '}\n
\n
\n
\n \n Save\n \n \n \n Cancel\n \n
\n {JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n {JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n \n Target: \n {messageInput.target}\n
\n {messageInput.compA && (\n\n Compare A: \n {messageInput.compA}\n
\n )}\n {messageInput.comp && (\n\n Equation: \n {messageInput.comp}\n
\n )}\n {messageInput.compB && (\n\n Compare B: \n {messageInput.compB}\n
\n )}\n{JSON.stringify(postData, null, 2)} */}\n \n \n Save\n \n \n \n Cancel\n \n
\n \n
\n \n Question: \n {messageInput.question}\n
\n {messageInput.slot && (\n\n Save to Slot: \n {messageInput.slot}\n
\n )}\n {messageInput.after && (\n\n Say After: \n {messageInput.after}\n
\n )}\n {messageInput.alwaysask !== undefined && (\n\n Always Ask: \n {messageInput.alwaysask.toString()}\n
\n )}\n {messageInput.showButtons !== undefined && (\n\n Show Buttons: \n {messageInput.showButtons.toString()}\n
\n )}\n\n
\n \n
\n \n \n Save\n \n \n \n Cancel\n \n
\n \n \n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n Publish\n \n
\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class DrPrimaryDialog extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class HhAmenties extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class HpContactInfo extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class RhPropertyInfo extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class QBotPrimaryDialog extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class SalonServices extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class VvnAboutAssitant extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class TourismPrimaryDialog extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React, { Component, Fragment } from 'react';\nimport { Card, CardBody } from 'reactstrap';\n\nimport JsonBlockGenerator from '../components/JsonBlockGenerator';\n\nexport default class NorthableDialog extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default UI;\n","import React from 'react';\nimport { Redirect, Route, Switch } from 'react-router-dom';\n\nimport AccommodationProviders from './AccommodationProviders';\nimport Doctors from './Doctors';\nimport HolidayHomes from './HolidayHomes';\nimport HolidaysPark from './HolidaysPark';\nimport RetirementHomes from './RetirementHomes';\nimport QuarantineBot from './QuarantineBot';\nimport Salons from './Salons';\nimport VirtualVetNurse from './VirtualVetNurse';\nimport Tourism from './Tourism';\nimport Northable from './Northable';\n\nconst UI = ({ match }) => (\n \n \n \n
\n);\nexport default UI;\n","\nimport React, { useState,Fragment } from 'react'\nimport {\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n} from 'reactstrap';\nimport { putAPI_Invitation } from '../../../../../../../constants/APIs';\nimport { AxiosAPI, getGroupID } from '../../../../../../../helpers/AxiosAPI';\nconst ApproveInvitation = ({ isVisible, invitation, toggle, LoadData, handleConnectedVoucher, propertyId }) => {\n let [invitationData, setInvitationData] = useState({\n 'invitationId': invitation.invitationId,\n 'sellerGroupId': invitation.groupId,\n 'sellerPropertyId': invitation.propertyId,\n 'status': '',\n 'ProcessingFee': invitation.processingFee,\n 'groupId': getGroupID(),\n 'propertyId': propertyId,\n 'sellFutureVouchers': invitation.sellFutureVouchers,\n 'createdBy': 'Admin',\n 'type': 'Sell',\n 'relationId': invitation.relationId,\n 'groups': invitation.groups,\n \"propertys\": invitation.propertys\n });\n const onAcceptClick = () => {\n invitationData.status = 'Accepted';\n handleInvitationApprove();\n toggle();\n };\n const onRejectClick = () => {\n invitationData.status = 'Rejected';\n AxiosAPI({\n url: `${putAPI_Invitation}`,\n method: 'put',\n data: invitationData\n }).then(res => {\n LoadData();\n });\n toggle();\n };\n const handleInvitationApprove = () => {\n AxiosAPI({\n url: `${putAPI_Invitation}`,\n method: 'put',\n data: invitationData\n }).then(res => {\n LoadData();\n })\n };\n return (\n \n \n \n Approve {invitation.propertyName} to sell your voucher\n \n \n Increase your sales by launching your own beautiful voucher store\n and let your customers purchases gift voucher directly from your website.\n\n \n \n {/* */}\n \n \n \n\n
\n );\n};\nexport default ApproveInvitation;\n","\nimport React from 'react'\nimport {\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter\n} from 'reactstrap';\n\nconst ShowInvitations = ({ showModal, hideModal, invitations, propertyId, voucherList, handleConnectedVoucher }) => {\n return (\n \n {invitation.processingFee > 0 &&
Pending Vouchers invitations
\n
\n )\n }\n })\n }\n \n
\n {m.propertyName}
\n\n
\n${data}
Breakfast
\n \n {(!isCheckoutView && isShow && room !== null) && (\n
\n {/* Condition of voucher at preview page */}\n \n
\n \n \n \n
\n \n {\n close_clicked();\n }}\n >\n \n {\" \"}\n
\n {room.giftEnabled && (\n \n \n {slides.length > 0 && (\n \n \n \n {\" \"}\n
\n \n \n \n {\" \"}\n
\n X
\n \n\n
}\n {/* Detials of voucher at preview page */}\n \n
\n {/* Summary of voucher at preview page */}\n {(room.introduction !== null && room.introduction.length > 0 && room.introduction[0].statement !== '\n
\n \n
\n \n \n {room.name[0].statement !== undefined && room.name[0].statement.length > 80\n ? room.name[0].statement.substring(0, 80) + \" ...\"\n : room.name[0].statement}\n \n
\n\n \n {ReactHtmlParser(room.introduction[0].statement)}\n
\n \n Summary\n {\n if (summaryTab === 1) {\n setSummaryTab(0);\n } else {\n setSummaryTab(1);\n }\n }}\n >\n \n
\n \n \n {ReactHtmlParser(room.details[0].statement)}\n
\n \n Details\n {\n if (detailTab === 2) {\n setDetailTab(0);\n } else {\n setDetailTab(2);\n }\n }}\n >\n \n
\n\n\n \n \n {ReactHtmlParser(room.conditions[0].statement)}\n
\n \n\n\n\n {/* IncludedItems of voucher at preview page */}\n {room.icons !== undefined && room.icons !== null && room.icons.length > 0 && (\n \n Conditions\n {\n if (conditionsTab === 3) {\n setContionTab(0);\n } else {\n setContionTab(3);\n }\n }}\n >\n \n
\n\n \n
\n )}\n \n \n \n
\n \n
\n \n
\n What's Included
\n\n {room.icons !== undefined && room.icons !== null && room.icons.length > 0 && (\n
\n \n
)}\n \n {/* {room.includedItems.split(\",\").includes(\"Night Stay\") && (
\n \n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Breakfast\") && (\n \n
\nNight Stay
\n
)}\n {room.includedItems.split(\",\").includes(\"boatRamp\") && (\n \n\n \n\n
\nBreakfast
\n
)}\n {room.includedItems.split(\",\").includes(\"Transfers\") && (\n \n \n
Boat Ramp
\n\n
)}\n {room.includedItems.split(\",\").includes(\"Dailydelegate\") && (\n \n \n
\nTransfers
\n
)}\n\n {room.includedItems.split(\",\").includes(\"DivingEquipment\") && (\n \n
\nDaily delegate
\n
)}\n\n {room.includedItems.split(\",\").includes(\"Diving\") && (\n \n
\nDiving equipment
\n
)}\n\n {room.includedItems.split(\",\").includes(\"Facial\") && (\n
\nDiving
\n
)}\n {room.includedItems.split(\",\").includes(\"Fitness Club\") && (\n \n \n
Facial
\n\n
)}\n\n\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Bike Hire\") && (\n \n
Fitness Club
\n\n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Drinks\") && (\n
\nBike Hire
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Pool\") && (\n \n
\nDrinks
\n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Shopping\") && (\n
\nPool
\n\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"High Tea\") && (\n
Shopping
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Golf\") && (\n
\nHigh Tea
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"helicopterRide\") && (\n
\nGolf
\n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Shuttleride\") && (\n \n
Helicopter Ride
\n\n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"FitnessClub\") && (\n
\nShuttle ride
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Restaurant\") && (\n \n
Fitness Club
\n\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Room\") && (\n \n
\nRestaurant
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Beach Access\") && (\n
\nRoom
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Camping Site\") && (\n
\nBeach Access
\n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Latecheckout\") && (\n
\nCamping Site
\n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Laundry\") && (\n \n
\nLate check out
\n
)}\n\n\n\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Massage\") && (\n \n
Laundry
\n\n\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Skyjump\") && (\n \n
\nMassage
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Salon\") && (\n \n \n
Skyjump
\n\n
)}\n\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Ski\") && (\n \n
Salon
\n\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Parking\") && (\n
\nSki
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Hiking\") && (\n
\nParking
\n
)}\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Laundry \") && (\n \n
Hiking
\n\n
)}\n\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Late check out \") && (\n \n \n
Laundry
\n\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Dinner\") && (\n \n
\nLate check out
\n\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Pets Allowed\") && (\n
\nDinner
\n
)}\n\n {room.includedItems !== \"\" && room.includedItems.split(\",\").includes(\"Sauna/Hot Tub\") && (\n
\nPets Allowed
\n
)} */}\n\n {/* {loadedIcons !== undefined && loadedIcons.length > 0 && loadedIcons.map((m) => {\n return m;\n }\n )} */}\n {room.icons !== undefined && room.icons !== null && room.icons.length > 0 && room.icons.map((m)=>\n \n
\nSauna/Hot Tub
\n
\n )}\n \n \n \n\n\n {/* */}\n
\n{m.title}
\n\n
\n \n \n )\n }\n \n \n \n {!isCheckoutView && option == \"-1\" && false ? (\n \n \n ) : (\n \"\"\n )}\n {room.options === true && room.buyOptions !== undefined &&\n room.buyOptions.length > 1 &&\n room.buyOptions.length > 0 &&\n room.buyOptions.filter((f) => f.status === \"Active\").length >\n 0 ? (\n \n {room.buyOptions.map((e) => {\n if (e.status === \"Active\") {\n options.push({\n value: e.id,\n label: e.option,\n select: true,\n });\n }\n })}\n {\n setOption(e.value);\n }}\n defaultValue={options[0]}\n />\n \n ) : (\n \"\"\n )}\n\n
\n Please Choose One Options
\n \n
\n \n {room.isCard == false && (\n \n \n )}\n
\n\n \n {propertyData.currency}\n {room.discountedPrice}\n
\n\n {room.taxIncluded ? \"Including\" : \"Excluding\"} all taxes &\n service charges\n
\n\n {\n \n }\n
\n \n\n {check !== undefined && check ?\n {\n onClickPrev(previous, steps, step);\n }}\n >\n {prevLabel}\n : {\n onClickPrev(previous, steps, step);\n }}\n >\n {prevLabel}\n }\n = steps.length - 1 ? 'disabled' : '' + (aiva !== undefined ? ' aiva-background text-white' : '') +\n (check !== undefined && check ? 'invitation-button' : '')\n }\n onClick={() => {\n onClickNext(next, steps, step);\n }}\n >\n {nextLabel}\n \n
\n )}\n />\n );\n};\nexport default BottomNavigation;\n","/* eslint-disable react/no-array-index-key */\n/* eslint-disable no-unused-vars */\n/* eslint-disable no-param-reassign */\nimport React, { Fragment } from 'react';\nimport { WithWizard } from 'react-albus';\nimport { NavLink } from 'react-router-dom';\n\nconst TopNavigation = ({ className, disableNav, topNavClick, aiva }) => {\n\n const getClassName = (steps, step, index, stepItem) => {\n if (steps.indexOf(step) === index) {\n return 'step-doing';\n }\n if (steps.indexOf(step) > index || stepItem.isDone) {\n stepItem.isDone = true;\n return 'step-done';\n }\n return 'step';\n };\n\n const itemClick = (stepItem, push) => {\n if (disableNav) {\n return;\n }\n topNavClick(stepItem, push);\n };\n\n return (\n {stepItem.name}
\n {stepItem.desc}
\n \n f.value === props.value).length > 0 ? true : false}\n onChange={() => setInviteeData({ ...inviteeData, voucherList: [] })}\n />{\" \"}\n \n \n
\n );\n };\n\n const LoadData = () => {\n };\n const handleDropDown = (e) => {\n setTypeofVoucher(e.target.value);\n if (e.target.value === 'All current & future vouchers')\n setInviteeData({ ...inviteeData, sellFutureVouchers: true });\n else\n setInviteeData({ ...inviteeData, sellFutureVouchers: false });\n\n }\n return (\n \n
\n \n
\n\n\n {SendInviation(); }}>\n \n \n
\n
Growing your aiva network!
\n \n\n {/*\n Sign up and you will get an email within 24 hrs with your\n account information\n
*/}\n\nYou’ve decided to tap into the aiva network by inviting like minded businesses to sell your vouchers on their website smart move! You’ll have a bigger reach and more exposure and sales eternal happiness is not far off now. In return they get commission and value add to their experience.\n
\nRemember you are in total control of your vouchers. You can select which businesses you invite, the vouchers you would like them to sell and the commission amount.
\n \n\n Select the vouchers you want your new tourism partner to sell.\n
\n\n\n It’s time to select the commission rate (as a percentage) that you’ll offer your new aiva partner. This will apply to each voucher selected. Commission can be adjusted at any time.\n
\n\n aiva’s processing fee is standard and includes the Stripe and merchant/credit card processing fees.\n
\n\n Hint: If you want to offer different commission rates for different vouchers, you can either send separate requests to your new aiva partner, or adjust each voucher at a later time.\n
\n\n You are nearly there! We just need to know who to send your invite to.
\n\nWow, you’ve done it, you’ve reached out to a like-minded tourism business.
\nWe’ll let you know once its approved and it will then feature on their website. OMG you will be one step closer to eternal happiness!\n
\n{errorMsg}
\n\n \n
\n \n Drop files here to upload, or click to select files\n\n \n
\n\n \n \n
\n\n {files.map((file, index) => (\n
\n \n
\n\n ))}\n \n handleTagChange(index, event)}\n />\n handleChange(index, event)}\n /> */}\n
\n\n handleRemoveFields(index)}\n >\n {\" \"}\n {\" \"}\n \n \n
\n \n \n
\n \n \n
\n {/* \n {\" \"}\n {file.img.name}{\" \"}\n
\n {file.img.size}
\n \n {\n setAgree(!isAgree);\n }}\n >\n I have copyright or permissions to use this image\n\n \n
\n \n
\n Please check the copyright or permissions check box
\n\n \n handleOnClick(photo.id, event)}\n />\n {/* \n {\" \"}\n {\" \"}\n */}\n \n {\" \"}\n {\" \"}\n \n \n {generateDeleteButton()}\n {generateEditButton()}\n \n {photo.caption}\n \n
\n \n );\n};\n\nexport default SelectedIcon;\n","import React, { useState, useEffect } from \"react\";\nimport { AxiosAPI } from '../../../../../../helpers/AxiosAPI';\nimport { putAPI_Update_Image, dAPI_Vouchers_Icons } from '../../../../../../constants/APIs';\nimport TagsInput from \"react-tagsinput\";\nimport \"react-tagsinput/react-tagsinput.css\";\nimport {\n Row,\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n Input\n} from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\n\n\nconst Checkmark = ({ selected }) => (\n \n
\n );\n};\n\nexport default UserUploadSelectedImage;\n","import React, { useState, useEffect, Fragment, useCallback } from 'react';\nimport {\n Card, CardBody, Button, TabContent, TabPane, NavItem, CardHeader, Nav, Row,\n UncontrolledDropdown,\n DropdownMenu,\n DropdownItem,\n DropdownToggle,\n} from 'reactstrap';\nimport { Colxx } from '../../../../../components/common/CustomBootstrap';\nimport { AxiosAPI, getGroupID, getUserID } from '../../../../../helpers/AxiosAPI';\nimport { gAPI_Vouchers_Icons, gAPI_BmbUploads } from '../../../../../constants/APIs';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\nimport { NavLink } from \"react-router-dom\";\nimport classnames from \"classnames\";\nimport UploadImagesButton from './components/UploadIconsButton';\nimport Gallery from \"react-photo-gallery\";\nimport SelectedIcon from './components/SelectedIcon'\nimport UserUploadSelectedImage from './components/UserUploadSelectedIcons'\nimport Pagination from \"../../../../../containers/pages/Pagination\";\nimport { ConsoleLogger } from '@microsoft/signalr/dist/esm/Utils';\n\nfunction IconGallery({ propertyId, selectedImage, togglegallery, hideUserUploads, searchText ,direct }) {\n\n if (hideUserUploads === undefined) {\n hideUserUploads = false;\n }\n if (searchText === undefined) {\n searchText = '';\n }\n\n const [activeTab, setActiveTab] = useState('embed');\n const [loading, setLoading] = useState(true);\n const [bmbloading, setbmbLoading] = useState(true);\n const [photos, setphotos] = useState([]);\n const [bmbphotos, setbmbphotos] = useState([]);\n const [chosenImage, setchosenImage] = useState('');\n const [bmbsearch, setBmbSearch] = useState(searchText);\n const [myUploadSearch, setmyUploadSearch] = useState('');\n const [bmbpageSizes, setbmbpageSizes] = useState([10, 15, 20, 25]);\n const [bmbcurrentPage, setbmbcurrentPage] = useState(1);\n const [bmbSelectedPageSize, setbmbSelectedPageSize] = useState(10);\n const [bmbTotalItems, setbmbTotalItems] = useState(0);\n const [bmbTotalPages, setbmbTotalPages] = useState(1);\n const [bmbUploadButton, setBmbUploadButton] = useState(false);\n const [userpageSizes, setuserpageSizes] = useState([10, 15, 20, 25]);\n const [usercurrentPage, setusercurrentPage] = useState(1);\n const [userSelectedPageSize, setuserSelectedPageSize] = useState(10);\n const [userTotalItems, setuserTotalItems] = useState(0);\n const [userTotalPages, setuserTotalPages] = useState(1);\n\n const toggleAppMenu = tab => {\n setActiveTab(tab)\n };\n useEffect(() => {\n if(activeTab === \"embed\")\n LoadData();\n }, [propertyId, activeTab, usercurrentPage, userSelectedPageSize]);\n\n useEffect(() => {\n if(activeTab === \"standard\"){\n ShowUploadButton();\n LoadBmbData();\n }\n }, [propertyId, activeTab,bmbcurrentPage, bmbSelectedPageSize]);\n\n const ShowUploadButton = () => {\n const userId = getUserID();\n if (userId == \"0b264b20-dc1a-40e9-87d2-8877b5a0e089\" || userId == \"6fc9447c-ddc3-4b0c-9af5-464471e5cd55\" || userId == \"a98e69d8-9c90-48cd-ae61-de4628be2b15\") {\n setBmbUploadButton(true);\n }\n };\n const [selectAll, setSelectAll] = useState(false);\n const imageRenderer = useCallback(\n ({ index, left, top, key, photo }) => (\n \n handleOnClick(photo.id, event)}\n />\n {/* \n {\" \"}\n {\" \"}\n */}\n \n {\" \"}\n {\" \"}\n \n \n {generateDeleteButton()}\n {/* {generateEditButton()} */}\n \n {photo.caption}\n \n
\n \n onSearchKey(e)}\n style={{ width: '60%' }}\n />\n
*/}\n\n \n {`${startBmbIndex}-${endBmbIndex} of ${bmbTotalItems} `}\n \n \n {bmbSelectedPageSize}\n \n \n {bmbpageSizes.map((size, index) => {\n return (\n changeBmbPageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n \n {bmbphotos && bmbphotos.map((img, index) => (\n
\n \n
\n ))}\n \n \n Add to my Chatbot\n \n
\n )}\n \n onSearchKeyUserUploads(e)}\n style={{ width: '100%' }}\n />\n
\n \n {`${startUserIndex}-${endUserIndex} of ${userTotalItems} `}\n \n \n {userSelectedPageSize}\n \n \n {userpageSizes.map((size, index) => {\n return (\n changeUserPageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n \n {photos && photos.map((img, index) => (\n
\n \n
\n ))}\n \n \n Add to my Chatbot\n \n
)}\n \n
\n \n {formLabel}\n
\n \n
\n Need inspiration?
\n \n {JSON.stringify(voucherData, null, 2)} */}\n Optional Icons For What`s Included
\n\n \n handleIconChange(e, index)}\n value={image.color}\n />\n \n {\n let icons = [...voucherData.icons];\n icons[index].isEditMode = true;\n setVoucherData({ ...voucherData, icons: icons });\n }\n } className=\"color-square\" style={setBackGroundColor(image.color)}> \n \n \n
\n \n
}\n \n {\n let icons = [...voucherData.icons];\n icons[index].color = e.hex;\n setVoucherData({ ...voucherData, icons: icons });\n }\n }\n />\n
\n \n { e.stopPropagation(); deleteIcon(index) }}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n Images
\n\n deleteImage(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n What`s Included ?
\nApplicability Conditions
\n\n \n {dayValidity.length > 0 && dayValidity.map((m) => )}\n \n \n {monthValidity.length > 0 && monthValidity.map((m) => )}\n \n \n {voucherData.startYearValidity == 0 &&\n \n }\n {yearValidity.length > 0 && yearValidity.map((m) => )}\n \n
\n \n \n {dayValidity.length > 0 && dayValidity.map((m) => )}\n \n \n {monthValidity.length > 0 && monthValidity.map((m) => )}\n \n \n {voucherData.endYearValidity == 0 &&\n \n }\n\n {yearValidity.length > 0 && yearValidity.map((m) => )}\n \n
\n \n
Voucher PDF
\n\n
Pricing & Inventory
\n\n
Redeem Instructions
\n\n
}\n {isHostedPageIntegration !== undefined && isHostedPageIntegration &&\n \n\n
Redeem Instructions
\n\n The Voucher has been saved as draft as some of the mandatory information is missing.\n Please complete and make the Voucher Active when ready\n
\n\n { setOwnTag(e.target.value) }}\n />\n
\n \n { setOwnTag(e.target.value) }}\n />\n
\n \n
\n {isBuyOption ? setisBuyOptionForm(!isBuyOptionForm)}\n >\n Edit\n :\n setIsUpdating(!isUpdating)}\n >\n Edit\n }\n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n id={id}\n submit={handleSubmit}\n propertyId={propertyId}\n />\n )}\n {isBuyOptionForm && ( {\n setisBuyOptionForm(!isBuyOptionForm);\n }}\n id={id}\n amadeus={amadeus}\n xolaIntegration={xolaIntegration}\n optionId={optionId}\n submit={handleSubmit}\n voucherName={voucherName}\n propertyId={propertyId}\n extractData={extractData}\n update={true}\n />)}\n { setOpen(!open) }}> \n
\n );\n}\n\nUpdateVouchersForm.propTypes = {\n id: PropTypes.string.isRequired,\n};\n","import React, { useState } from 'react';\nimport VouchersForm from './VouchersForm';\nimport {\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter\n} from 'reactstrap';\nimport { AxiosAPI } from '../../../../../../../helpers/AxiosAPI';\nimport { putAPI_Update_Vouchers, gAPI_Vouchers_By_Id } from '../../../../../../../constants/APIs';\nimport PropTypes from 'prop-types';\nimport BuyOptionForm from './BuyoptionForm';\nexport default function DeleteVoucherForm({ id, propertyId, optionId, handleDeleteForm, LoadData }) {\n const [isShow, setisShow] = useState(true);\n\n const handleSubmit = () => {\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Vouchers_By_Id}/${id}`,\n })\n .then((res) => {\n res.data.sellingOptions = res.data.sellingOptions.filter((m) => {\n if (m.id === optionId) {\n m.status = 'Archived';\n }\n return m;\n })\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Update_Vouchers}/${id}`,\n data: res.data,\n }).then(() => {\n LoadData();\n setisShow(!isShow);\n handleDeleteForm();\n });\n });\n handleDeleteForm();\n };\n return (\n \n { setisShow(!isShow); handleDeleteForm(); }}\n size=\"lg\"\n style={{ maxWidth: '50%' }}\n >\n { setisShow(!isShow); handleDeleteForm(); }}> \n \n \n \n \n \n
\n );\n}\n\nDeleteVoucherForm.propTypes = {\n id: PropTypes.string.isRequired,\n};\n","import React, { useState } from 'react';\nimport { Card, Button } from 'reactstrap';\nimport { Colxx } from '../../../../../../components/common/CustomBootstrap';\nimport UpdateVouchersForm from './forms/UpdateVouchersForm';\nimport DeleteVoucherForm from './forms/DeleteVouchersForm';\nconst BuyOptionList = ({ item, extractData, propertyId, isBuyOption,amadeus,xolaIntegration, voucherId, currency,voucherName }) => {\n const [isshowDelete, setIshowDelete] = useState(false);\n const handleDeleteForm = () => {\n setIshowDelete(false);\n }; \n return (\n Delete Confirmation
Are you sure you want to delete the voucher buy option ?
\n
\n \n
\n \n {item.option}\n
\n\n {item.status}\n
\n\n {currency} {item.price}\n
\n\n {item.discount}%\n
\n {/*\n \n
\n\n \n
*/}\n\n {currency}\n {item.discountedPrice}\n
\n\n
\n \n setIshowDelete(true)}\n >\n Delete\n \n
\n \n \n \n Accept {invitation.propertyName} invitation to sell voucher\n\n \n \n Increase your sales by launching your own beautiful voucher store\n and let your customers purchases gift voucher directly from your website.\n\n \n \n {/* */}\n \n \n \n\n
\n );\n};\nexport default AcceptInvitation;\n","import React, { Component, Fragment, useEffect, useState } from \"react\";\nimport {\n Row, Card,\n CardTitle, Label,\n Input, Button,\n FormGroup, Modal,\n ModalBody, InputGroup,\n InputGroupAddon,\n InputGroupText,\n Col,\n ModalHeader,\n ModalFooter,\n} from 'reactstrap';\nimport { Colxx } from \"../../../../../../../components/common/CustomBootstrap\";\nimport { components } from \"react-select\";\nimport { Wizard, Steps, Step } from \"react-albus\";\nimport BottomNavigation from \"../../../../../../../components/wizard/BottomNavigation\";\nimport TopNavigation from \"../../../../../../../components/wizard/TopNavigation\";\nimport { postAPI_Invitation, postAPI_EmailCheck } from \"../../../../../../../constants/APIs\";\nimport { AxiosAPI, getGroupID } from \"../../../../../../../helpers/AxiosAPI\";\nimport { default as ReactSelect } from \"react-select\";\nimport { NotificationManager } from \"../../../../../../../components/common/react-notifications\";\nimport Validation from \"../../../../../../../components/Validation\";\n\nexport default function SellVoucher({ toggle, isvisible, propertydata, userData, propertyId, voucherList, locale }) {\n const [widthDiv, setwidthDiv] = useState('95%');\n const [open, setOpen] = useState(false);\n const [msg, setMsg] = useState([]);\n const [bottomNavHidden, setBottomNavHidden] = useState(true);\n const [optionSelected, setOptionSelected] = useState([]);\n const [errorMsg, setErrorMsg] = useState(false);\n const [errorModel, setErrorModel] = useState(false);\n const [propertyData, setPropertyData] = useState(propertydata);\n const [typeofVoucher, setTypeofVoucher] = useState('Please Select');\n let [inviteeData, setInviteeData] = useState({\n \"groupId\": getGroupID(),\n \"senderName\": propertyData.name,\n \"senderEmail\": userData.email ? userData.email : '',\n \"inviteeEmail\": '',\n \"senderGroupId\": getGroupID(),\n \"senderPropertyId\": propertyId,\n \"invitationStatus\": 'Invited',\n \"processingFee\": '',\n \"sellFutureVouchers\": '',\n \"status\": 'Active',\n \"createdBy\": 'Admin',\n \"type\": 'Sell',\n 'EmailType': '',\n });\n let options = [];\n const SendInviation = () => {\n if (!bottomNavHidden) {\n AxiosAPI({\n method: 'post',\n url: `${postAPI_EmailCheck}`,\n data: {\n email: inviteeData.inviteeEmail,\n },\n })\n .then((res) => {\n if (res.data.exists) {\n inviteeData.EmailType = 'Multiple';\n }\n AxiosAPI({\n url: `${postAPI_Invitation}`,\n method: 'post',\n data: inviteeData\n }).then(res => {\n if (res.data.HttpStatusCode !== undefined && res.data.HttpStatusCode === 400 && res.data.Messages !== undefined\n && res.data.Messages !== null && res.data.Messages.length > 0) {\n setMsg(res.data.Messages);\n setOpen(true);\n }\n else {\n toggle();\n if (res.data.status !== 'Failed') {\n NotificationManager.success(\n \"\",\n \"Invitation sent successfully\",\n 3000,\n null,\n null,\n \"success\"\n );\n } else {\n NotificationManager.success(\n \"\",\n \"Something went wrong\",\n 3000,\n null,\n null,\n \"danger\"\n );\n }\n }\n }).catch();\n })\n .catch((err) => null);\n }\n };\n const onClickNext = (goToNext, steps, step) => {\n if (step.id === 'step1')\n LoadData();\n\n if (step.id === 'step3') {\n if (inviteeData.processingFee === '') {\n\n setErrorModel(true);\n setErrorMsg('Please enter partner’s commission rate');\n return;\n }\n }\n if (step.id === 'step4') {\n if (inviteeData.inviteeEmail === '') {\n setErrorModel(true);\n setErrorMsg('Please enter the email address');\n return;\n }\n }\n if (steps.length - 1 <= steps.indexOf(step)) {\n return;\n }\n let list = [];\n if (step.id === 'step4') {\n setBottomNavHidden(false);\n }\n inviteeData.voucherList = list;\n setInviteeData({ ...inviteeData, sellFutureVouchers: (typeofVoucher === \"All current & future vouchers\" ? true : false) });\n goToNext();\n };\n const handleChange = async (selected) => {\n if (selected.length > 0) {\n selected.map((s) => {\n\n if (optionSelected.filter((f) => f.value === s.value).length > 0) {\n let list = optionSelected.filter((f) => f.value !== s.value);\n setOptionSelected(list);\n } else {\n let list = optionSelected;\n list.push({ value: s.value, label: s.label, isSelected: true });\n setOptionSelected(list);\n }\n })\n } else {\n setOptionSelected([]);\n }\n };\n const onClickPrev = (goToPrev, steps, step) => {\n setwidthDiv('95%');\n if (steps.indexOf(step) <= 0) {\n return;\n }\n goToPrev();\n };\n const Option = (props) => {\n return (\n \n\n {invitation.processingFee > 0 &&
\n \n f.value === props.value).length > 0 ? true : false}\n onChange={() => setInviteeData({ ...inviteeData, voucherList: [] })}\n />{\" \"}\n \n \n
\n );\n };\n\n const LoadData = () => {\n };\n const handleDropDown = (e) => {\n setTypeofVoucher(e.target.value);\n if (e.target.value === 'All current & future vouchers')\n setInviteeData({ ...inviteeData, sellFutureVouchers: true });\n else\n setInviteeData({ ...inviteeData, sellFutureVouchers: false });\n\n }\n return (\n \n
\n \n
\n\n\n { SendInviation(); }}>\n \n \n
\n
Growing your aiva network!
\n \n\n {/*\n Sign up and you will get an email within 24 hrs with your\n account information\n
*/}\n\nYou’ve decided to tap into the aiva network by inviting like minded businesses to sell their vouchers on your website... smart move! You’ll have a bigger range to offer your website visitors and in return you can offer commission to the partner business..\n
\nRemember you are in total control of your sales channels. You can select which businesses you invite, which of their vouchers you would like to sell and the commission amount.
\n \n\n It’s time to select the commission rate (as a percentage) that you’ll offer your new aiva partner. This will apply to each voucher selected. Commission can be adjusted at any time.\n
\n\n aiva’s processing fee is standard and includes the Stripe and merchant/credit card processing fees.\n
\n\n Hint: If you want to offer different commission rates for different vouchers, you can either send separate requests to your new aiva partner, or adjust each voucher at a later time.\n
\n\n You are nearly there! We just need to know who to send your invite to.
\n\nWow, you’ve done it, you’ve reached out to a like-minded tourism business.
\nWe’ll let you know once its approved and it will then feature on their website. OMG you will be one step closer to eternal happiness!\n
\n{errorMsg}
\n\n
\n \n {formLabel}\n
\n \n
\n Need inspiration?
\n \n {JSON.stringify(voucherData, null, 2)} */}\n \n \n {dayValidity.length > 0 && dayValidity.map((m) => )}\n \n \n {monthValidity.length > 0 && monthValidity.map((m) => )}\n \n
\n \n \n {dayValidity.length > 0 && dayValidity.map((m) => )}\n \n \n {monthValidity.length > 0 && monthValidity.map((m) => )}\n \n
\n Choose E-Gift Card Images
\nYou can choose one or more designs from our library below, or upload your own. You will later be able to enable/disable designs for specific periods of the year
\n\n deleteImage(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n \n
Pricing & Inventory
\nPrimary Amounts Offered
\n\n RemoveSelectedAmount(index)}\n style={{ color: 'red', borderColor: 'red', margin: '-2px', padding: '8px' }}\n size=\"s\"\n outline\n >\n - Remove\n \n
\n \n AddSelectedAmount()}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n + Add Amount\n \n
\n \n
Redeem Instructions
\n\n The Voucher has been saved as draft as some of the mandatory information is missing.\n Please complete and make the Voucher Active when ready\n
\n\n { setOwnTag(e.target.value) }}\n />\n
\n \n { setOwnTag(e.target.value) }}\n />\n
\n \n
\n \n {formLabel}\n
\n {voucherData.title === '' ? \"Your Advert Title\" :voucherData.title}
\n {/*You can hire a nanny anytime at a short notice. We will love to support you \n have a great time while we look after you little one \n
*/}\n{voucherData.subTitle === '' ? \"Subtitle about the Advert\" :voucherData.subTitle}
\n \n{voucherData.title === '' ? \"Your Advert Title\" :voucherData.title}
\n {/*You can hire a nanny anytime at a short notice. We will love to support you \n have a great time while we look after you little one \n
*/}\n{voucherData.subTitle === '' ? \"Subtitle about the Advert\" :voucherData.subTitle}
\n\n
0 ? voucherData.images[0].url:\"https://via.placeholder.com/250x150\"} style={{ width: '100%', height: '10rem' }}>\n \n\n\n Images
\n\n deleteImage(index)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n -\n \n
\n Advertising Charges
\n\n The Voucher has been saved as draft as some of the mandatory information is missing.\n Please complete and make the Voucher Active when ready\n
\n\n { setOwnTag(e.target.value) }}\n />\n
\n \n { setOwnTag(e.target.value) }}\n />\n
\n \n {!isBuyOption && !isCustomCode && \n \n + New\n \n \n {\n setVisible(!visible);\n }}>\n + Voucher\n \n {\n setGiftCard(!giftCard);\n }}>\n + E-Gift Card\n \n {\n setAdsForm(!adsFrom);\n }}>\n + Advertisement\n \n \n }\n\n {!isBuyOption && !isCustomCode && \n \n + Partner\n \n \n {\n ShowInviteVoucher(!inviteVoucher);\n }}>\n + Invite a business to sell your vouchers\n \n {\n setSellVoucher(!sellVoucher);\n }}>\n + Resell vouchers of a partner business\n \n \n }\n\n {websiteIntregation.length === 1 && !isCustomCode && (isBuyOption === undefined || isBuyOption === false) &&\n \n \n Preview\n \n \n { handlePreview(); }}\n >\n Preview your vouchers store\n \n \n }\n\n {/* {!isBuyOption && !isCustomCode && {\n setVisible(!visible);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Create a voucher\n } */}\n\n {/* {!isBuyOption && !isCustomCode && \n \n Preview\n \n \n {websiteIntregation.map((m) =>\n {\n setWebsiteIntregationId(m.value);\n var url = `${process.env.REACT_APP_VOUCHER_URL}/vhp?iid=${m.id}&gid=${getGroupID()}`;\n window.open(url, '_blank');\n }}>\n {m.name !== '' ? m.name : \"Standalone Store\"}\n \n )}\n \n \n // {\n setVisible(!visible);\n }}\n submit={handleSubmit}\n inviteVoucher={inviteVoucher}\n ShowInviteVoucher={ShowInviteVoucher}\n propertyId={propertyId}\n />}\n\n {giftCard && {\n setGiftCard(!giftCard);\n }}\n submit={handleSubmit}\n inviteVoucher={inviteVoucher}\n ShowInviteVoucher={ShowInviteVoucher}\n propertyId={propertyId}\n />}\n {\n buyOptionvisible && isBuyOption && !codeVisible && {\n setbuyOptionVisible(!buyOptionvisible);\n }}\n update={false}\n LoadData={LoadData}\n amadeus={amadeus}\n xolaIntegration={xolaIntegration}\n id={voucherId}\n submit={handleSubmit}\n voucherName={voucherName}\n updateVoucherData={voucher}\n propert\n\n yId={propertyId}\n />\n }\n {\n inviteVoucher && !codeVisible && ShowInviteVoucher(!inviteVoucher)}\n />\n }\n {\n sellVoucher && !codeVisible && setSellVoucher(!sellVoucher)}\n />\n }\n {\n adsFrom && {\n setAdsForm(!adsFrom);\n }}\n submit={handleSubmit}\n inviteVoucher={inviteVoucher}\n ShowInviteVoucher={ShowInviteVoucher}\n propertyId={propertyId}\n />\n }\n {codeVisible && {\n setCodeVisible(!codeVisible);\n }}\n update={false}\n LoadData={LoadData}\n amadeus={amadeus}\n xolaIntegration={xolaIntegration}\n id={voucherId}\n submit={handleSubmit}\n voucherName={voucherName}\n updateVoucherData={voucher}\n propertyId={propertyId}\n />}\n\n { setOpen(!open) }}> \n
\n );\n}\n\nconst mapStateToProps = ({ settings }) => {\n const { propertyId } = settings;\n return {\n propertyId,\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(CreateVouchersForm));\n\n// CreatePromosForm.propTypes = {\n// propertyId: PropTypes.string.isRequired,\n// };\n","import React, { useState, useEffect, Fragment } from 'react';\nimport {\n Row, Card, CustomInput,\n CardTitle, Label,\n Input, Button,\n CardImg, Modal,\n ModalBody, InputGroup,\n InputGroupAddon,\n InputGroupText,\n\n Col,\n ModalHeader,\n ModalFooter,\n} from 'reactstrap';\nimport { default as ReactSelect } from \"react-select\";\nimport CustomSelectInput from '../../../../../../../components/common/CustomSelectInput';\nimport moment from 'moment';\nimport VoucherInfo from './VoucherInfo';\nimport { components } from \"react-select\";\nimport parse from 'htmlparser2';\nimport { Colxx } from '../../../../../../../components/common/CustomBootstrap';\nimport { getGroupID, AxiosAPI } from '../../../../../../../helpers/AxiosAPI';\nimport {\n putAPI_approve_voucher\n} from '../../../../../../../constants/APIs';\n\nconst VoucherConnection = ({ invitation, handleShow, voucherList, handleApproval,\n voucherId, toggle, visible, LoadData, extractData, groups, property, propertyId\n , invitationtype }) => {\n const [selectedGroup, setSelectedGroup] = useState(getGroupID());\n const [selectedProperty, setSelectedProperty] = useState(propertyId);\n let [connectedItem, setConnectedItem] = useState([{\n 'groupId': '',\n 'propertyId': ''\n }]);\n let [optionSelected, setOptionSelected] = useState({\n selectedGroups: [],\n selectedProperties: []\n });\n // if (groups.length === 1) {\n // setOptionSelected({ ...optionSelected, selectedGroups: { value: groups[0].groupId, label: groups[0].groupName } });\n // }\n // if (property.length === 1) {\n // setOptionSelected({ ...optionSelected, selectedProperties: { value: property[0].propertyId, label: property[0].propertyName } });\n // }\n const [done, setDone] = useState(true);\n let groupOptions = [];\n groupOptions.push({ value: '-1', label: 'select all', key: '1' });\n let propertyOptions = [];\n propertyOptions.push({ value: '-1', label: 'select all', key: '1' });\n const [properties, setProperties] = useState(property);\n const handleProperties = (selected) => {\n if (selected.length > 0) {\n let list = [];\n if (selected[0].value !== \"-1\") {\n selected.map((g) => {\n property.map((p) => {\n if (p.groupId === g.value) {\n list.push(p);\n }\n });\n setProperties(list);\n\n });\n } else {\n groups.map((g) => {\n property.map((p) => {\n if (p.groupId === g.groupId) {\n list.push(p);\n }\n });\n setProperties(list);\n });\n }\n }\n };\n useEffect(() => {\n if (done) {\n if (groups.length === 1) {\n setOptionSelected({\n ...optionSelected, selectedGroups: [{ value: groups[0].groupId, label: groups[0].groupName }]\n });\n }\n if (properties.length === 1) {\n setOptionSelected({\n ...optionSelected, selectedProperties: [{ value: properties[0].propertyId, label: properties[0].propertyName }]\n });\n }\n setDone(false);\n }\n }, [optionSelected]);\n const handleSave = () => {\n let list = [];\n let propertylist = [];\n let voucher = voucherList.filter((v) => v.id === voucherId && v.invitationId ===\n invitation.invitationId && v.approvalStatus === '1');\n if (groups.length === 1 && property.length === 1) {\n handleApproval(voucher[0].id, voucher[0].invitationId);\n toggle();\n extractData()\n return;\n }\n if (optionSelected.selectedGroups.length > 0 && optionSelected.selectedProperties.length > 0) {\n if (optionSelected.selectedGroups[0].value === \"-1\" && optionSelected.selectedProperties[0].value === \"-1\") {\n groups.map((g) => {\n properties.map((p) => {\n voucherList.map((v) => {\n if (v.thirdPartyVoucher && v.approvalStatus === '1' && v.id === voucherId) {\n if (g.groupId === p.groupId && (invitation.groupId !== g.groupId || invitation.propertyId !== p.propertyId)) {\n propertylist.push({\n 'invitationId': invitation.invitationId,\n 'groupId': invitation.groupId,\n 'propertyId': invitation.propertyId,\n 'sellerGroupId': g.groupId,\n 'sellerPropertyId': p.propertyId,\n 'voucherId': v.id,\n 'processingFee': invitation.processingFee,\n 'sellFutureVouchers': invitation.sellFutureVouchers\n });\n }\n }\n });\n })\n });\n }\n else if (optionSelected.selectedGroups[0].value !== \"-1\" && optionSelected.selectedProperties[0].value === \"-1\") {\n optionSelected.selectedGroups.map((g) => {\n properties.map((p) => {\n voucherList.map((v) => {\n if (v.thirdPartyVoucher && v.approvalStatus === '1' && v.id === voucherId) {\n if (g.value !== \"-1\" && p.groupId === g.value && invitation.propertyId !== p.propertyId) {\n propertylist.push({\n 'invitationId': invitation.invitationId,\n 'groupId': invitation.groupId,\n 'propertyId': invitation.propertyId,\n 'sellerGroupId': g.value,\n 'sellerPropertyId': p.propertyId,\n 'processingFee': invitation.processingFee,\n 'voucherId': v.id,\n 'sellFutureVouchers': invitation.sellFutureVouchers\n });\n }\n }\n });\n })\n });\n }\n else if (optionSelected.selectedGroups[0].value === \"-1\" && optionSelected.selectedProperties[0].value !== \"-1\") {\n groups.map((g) => {\n optionSelected.selectedProperties.map((p) => {\n voucherList.map((v) => {\n // console.log(v.thirdPartyVoucher && v.approvalStatus === '1' && v.id === voucherId);\n if (v.thirdPartyVoucher && v.approvalStatus === '1' && v.id === voucherId) {\n // console.log(p.value !== \"-1\" && invitation.propertyId !== p.value);\n if (p.value !== \"-1\" && invitation.propertyId !== p.value) {\n propertylist.push({\n 'invitationId': invitation.invitationId,\n 'groupId': invitation.groupId,\n 'propertyId': invitation.propertyId,\n 'sellerGroupId': g.groupId,\n 'voucherId': v.id,\n 'processingFee': invitation.processingFee,\n 'sellerPropertyId': p.value,\n 'sellFutureVouchers': invitation.sellFutureVouchers\n });\n }\n }\n });\n })\n });\n }\n else if (optionSelected.selectedGroups[0].value !== \"-1\" && optionSelected.selectedProperties[0].value !== \"-1\") {\n optionSelected.selectedGroups.map((g) => {\n optionSelected.selectedProperties.map((p) => {\n voucherList.map((v) => {\n if (v.thirdPartyVoucher && v.approvalStatus === '1' && v.id === voucherId) {\n if (invitation.propertyId !== p.propertyId) {\n // console.log(v.thirdPartyVoucher && v.approvalStatus === '1' && v.id === voucherId);\n propertylist.push({\n 'invitationId': invitation.invitationId,\n 'groupId': invitation.groupId,\n 'propertyId': invitation.propertyId,\n 'sellerGroupId': g.value,\n 'sellerPropertyId': p.value,\n 'voucherId': v.id,\n 'processingFee': invitation.processingFee,\n 'sellFutureVouchers': invitation.sellFutureVouchers\n });\n }\n }\n });\n })\n });\n }\n\n // console.log(invitation, voucher, propertylist\n // );\n propertylist = propertylist.filter((f) => f.sellerPropertyId !== invitation.propertyId\n );\n AxiosAPI({\n url: `${putAPI_approve_voucher}`,\n method: 'put',\n data: {\n 'propertylist': propertylist, 'VoucherList': [({\n 'invitationId': invitation.invitationId,\n 'status': 'Approve',\n 'voucherId': voucher.length > 0 ? voucher[0].id : '0',\n 'groupId': invitation.groupId,\n 'propertyId': invitation.propertyId,\n 'Type': 'Invite',\n })]\n }\n }).then((data) => {\n extractData();\n handleShow();\n toggle();\n\n });\n }\n }\n const handleGroupChange = async (selected) => {\n setOptionSelected({ ...optionSelected, selectedGroups: selected });\n handleProperties(selected);\n };\n const hanldePropertyChange = async (selected) => {\n setOptionSelected({ ...optionSelected, selectedProperties: selected });\n };\n return (\n \n {\n setGiftCard(!giftCard);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Create a E-Gift Card\n \n
} */}\n {isBuyOption && !isCustomCode && \n {\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Vouchers_By_Id}/${voucherId}`,\n })\n .then((res) => {\n setVoucher(res.data);\n setbuyOptionVisible(!buyOptionvisible);\n })\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Add a variant\n
}\n {/* {!isBuyOption && !isCustomCode && \n {\n setAdsForm(!adsFrom);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + New Advertisement\n \n
} */}\n\n {/* \n {!isBuyOption && !isCustomCode && {\n \n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n \n }\n
\n \n {!isBuyOption && !isCustomCode && { setSellVoucher(!sellVoucher); }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Resell vouchers of a partner business\n }\n\n
*/}\n {/* {websiteIntregation.length === 1 && !isCustomCode && (isBuyOption === undefined || isBuyOption === false) &&\n \n { handlePreview(); }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n Preview your vouchers store\n \n
} */}\n {websiteIntregation.length >= 2 && !isCustomCode && (isBuyOption === undefined || isBuyOption === false) &&\n\n \n // {\n // setWebsiteIntregationId(m.value);\n // var url = `${process.env.REACT_APP_VOUCHER_URL}/vhp?iid=${m.value}&gid=${getGroupID()}`;\n // window.open(url, '_blank'); \n // }}\n // options={\n // websiteIntregation && websiteIntregation.length > 0\n // ? reactSelectOptionDiffrentPro(\n // websiteIntregation,\n // true,\n // 'id',\n // 'name',\n // ''\n // )\n // : []\n // }\n // />\n //
\n }\n\n {visible && {invitation.propertyName} invitation to sell your voucher
\n :{invitation.propertyName} invitation to sell their voucher
\n )}\n\n {groups.map((m, index) => {\n groupOptions.push({ value: m.groupId, label: m.groupName, key: m.groupId });\n })}\n {groups.length > 1 ? \n :\n }\n
\n \n \n\n
\n \n
\n\n \n
\n \n
\n \n
\n \n {/* {item.thirdPartyVoucher && item.approvalStatus === '1' && (\n \n \n \n \n )} */}\n \n \n more\n \n \n {!item.thirdPartyVoucher && {\n if (item.isCard === false) {\n setId(item.id);\n setIsUpdating(!isUpdating);\n } else {\n setId(item.id);\n setIsGiftCard(!isgiftCard);\n }\n }}\n >Edit\n }\n {!item.thirdPartyVoucher && setDeleteVisible(true)}\n >Delete\n }\n {item.options && !item.thirdPartyVoucher && {\n handleBuyOptionSetings(true, item.id, item.name);\n }}\n > Manage Variants\n }\n {!item.thirdPartyVoucher && {\n handleDuplicateVoucher(item.id);\n }}\n >Duplicate\n }\n\n \n \n {!item.thirdPartyVoucher && { handleWebsiteLink();}}\n >\n Post on Social Media\n }\n \n\n :\n \n \n more\n \n \n {item.thirdPartyVoucher && item.approvalStatus === '1' ? (\n {\n // if (item.invitationtype === 'Sell')\n // handleApproval(item.id, item.invitationId);\n // else {\n handleConnectedVoucher(item.invitationId);\n }}\n >Accept\n \n {\n handleReject(item.id, item.invitationId, 'Reject', item.processingFee);\n }}\n >\n Reject\n \n ) : \n\n }\n {item.thirdPartyVoucher && item.approvalStatus === '2' &&\n < DropdownItem\n key='Selling'\n onClick={() => {\n handleReject(item.id, item.invitationId, 'StopSelling', item.processingFee);\n }}\n >\n Stop Selling\n \n }\n {item.thirdPartyVoucher && item.approvalStatus === '4' &&\n < DropdownItem\n key='Reject'\n onClick={() => {\n handleReject(item.id, item.invitationId, 'StartSelling', item.processingFee);\n }}\n >\n Start Selling\n \n }\n {item.thirdPartyVoucher && { handleViewDetails(item.invitationId, item.connectionId, item.approvalStatus); setId(item.id); setIsShow(!isShow); }}\n >\n View details\n }\n {!item.thirdPartyVoucher && \n \n {item.isHostedPage === true && { handleWebsiteLink();}}\n >\n Post on Social Media\n\n }\n \n\n \n }\n
\n \n {item.name}\n\n
\n\n {item.thirdPartyVoucher && item.approvalStatus === '1' ?\n Waiting for approval\n : {item.status === 'ActiveMembers' ? 'MembersOnly' : item.status}}\n
\n\n {currency} {item.price}\n
\n\n {item.discount}%\n
\n\n \n
\n\n \n
\n\n {currency}\n {item.discountedPrice}\n
\n {item.isCard === true ? \n\n \n
\n \n \n Voucher\n \n
}\n {/* {!item.thirdPartyVoucher ? (\n
) : } */}\n {!item.thirdPartyVoucher && item.approvalStatus !== 1 ?\n handlePreview()}>\n Preview\n
\n{ handleVoucherName(item.name, item.id); handleGenerateCode(true) }}>\n\n Pre-generate Codes\n
\n\n }\n {item.isHostedPage === true &&{ handleVoucherName(item.name, item.id); handleGenerateCode(true) }}>\n\n Pre-generate Codes\n
\n\n }\n\nhandlePreview()}>\n Preview\n
\n\n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n id={id}\n amadeus={amadeus}\n mews={mews}\n submit={handleSubmit}\n inviteVoucher={inviteVoucher}\n isHostedPageIntegration={isHostedPageIntegration}\n approvalStatus={voucherData.approvalStatus}\n invitationId={item.invitationId}\n voucherName={item.name}\n thirdPartyVoucher={item.thirdPartyVoucher}\n handleReject={handleReject}\n ShowInviteVoucher={ShowInviteVoucher}\n propertyId={propertyId}\n groupId={voucherData.groupId}\n />\n )}\n
\n \n {isgiftCard && (\n {\n setIsGiftCard(!isgiftCard);\n }}\n id={id}\n amadeus={amadeus}\n mews={mews}\n submit={handleSubmit}\n reportingTagData={reportingTagData}\n inviteVoucher={inviteVoucher}\n isHostedPageIntegration={isHostedPageIntegration}\n approvalStatus={voucherData.approvalStatus}\n invitationId={item.invitationId}\n voucherName={item.name}\n thirdPartyVoucher={item.thirdPartyVoucher}\n handleReject={handleReject}\n ShowInviteVoucher={ShowInviteVoucher}\n propertyId={propertyId}\n groupId={voucherData.groupId}\n />\n )}\n
\n \n \n
}\n \n
\n \n {item.images !== null &&\n
\n \n
\n \n\n \n more\n \n \n {!item.thirdPartyVoucher && {\n setId(id);\n setIsUpdating(!isUpdating)\n }} \n >Edit\n }\n {!item.thirdPartyVoucher && setDeleteVisible(true)}\n >Delete\n }\n \n\n :\n \n \n more\n \n \n {item.thirdPartyVoucher && item.approvalStatus === '1' ? (\n {\n // if (item.invitationtype === 'Sell')\n // handleApproval(item.id, item.invitationId);\n // else {\n handleConnectedVoucher(item.invitationId);\n }}\n >Accept\n \n {\n handleReject(item.id, item.invitationId, 'Reject', item.processingFee);\n }}\n >\n Reject\n \n ) : \n\n }\n {item.thirdPartyVoucher && item.approvalStatus === '2' &&\n < DropdownItem\n key='Selling'\n onClick={() => {\n handleReject(item.id, item.invitationId, 'StopSelling', item.processingFee);\n }}\n >\n Stop Showing\n \n }\n {item.thirdPartyVoucher && item.approvalStatus === '4' &&\n < DropdownItem\n key='Reject'\n onClick={() => {\n handleReject(item.id, item.invitationId, 'Approve', item.processingFee);\n }}\n >\n Start Showing\n \n }\n {item.thirdPartyVoucher && { handleViewDetails(item.invitationId, item.connectionId, item.approvalStatus); setId(item.id); setIsShow(!isShow); }}\n >\n View details\n } \n \n \n\n \n }\n
\n \n \n {item.title}\n
\n {item.thirdPartyVoucher && item.approvalStatus === '1' ?\n\n Waiting for approval \n
\n : null}\n\n\n {moment(item.startDate).format('YYYY-MM-DD')}\n
\n\n {moment(item.expiryDate).format('YYYY-MM-DD')}\n
\n\n {item.status}\n
\n\n Ad\n
\n {!item.thirdPartyVoucher && item.approvalStatus !== 1 ?\n < UncontrolledDropdown className=\"w-15 text-center w-sm-100\">\nSHARE VOUCHER
\n Url for your facebook post
\n \n {\n setWebsiteLink(event.target.value);\n }}\n disabled={true}\n />\n
\n \n \n
\n
\n Url for your twitter post
\n \n {\n setWebsiteLink(event.target.value);\n }}\n disabled={true}\n />\n
\n Quote for your twitter post
\n \n {\n setTwitterQuote(event.target.value);\n }} \n />\n
\n \n \n
\n
\n {/* \n Url for your WhatsApp post
\n \n {\n setDiretLinkUrl(event.target.value);\n }}\n disabled={true}\n />\n \n
\n {/* Quote for your WhatsApp post
\n \n {\n setWhatsAppQuote(event.target.value);\n }}\n \n />\n
\n \n \n
\n
\n {isHostedPageIntegration !== undefined && isHostedPageIntegration === true && \n Url for Direct Link
\n \n {\n setWebsiteLink(event.target.value);\n }}\n disabled={true}\n />\n
\n \n {\n NotificationManager.success(\n '',\n 'Successfully copied to clipboard.',\n 3000,\n null,\n null,\n 'success'\n );\n }}>\n \n Copy the Url\n \n \n
\n
}\n \n\n Quote for your twitter post
\n \n {\n setTwitterQuote(event.target.value);\n }}\n />\n
\n \n \n
\n
\n\n\n \n \n
\n {/* \n \n
*/}\n \n {\n NotificationManager.success(\n '',\n 'Successfully copied to clipboard.',\n 3000,\n null,\n null,\n 'success'\n );\n }}>\n \n Copy Url\n \n \n
\n\n {props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Voucher',\n accessor: 'name',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Voucher#',\n accessor: 'voucherNumber',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Order#',\n accessor: 'orderNumber',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Status',\n accessor: 'status',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Retail Price',\n accessor: 'price',\n Cell: props =>{props.row._original.currency.toUpperCase()} {props.value}
,\n style: { 'whiteSpace': 'unset', \"width\": \"100px\" }\n },\n {\n Header: 'Chosen Option',\n accessor: 'optionName',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Discount',\n accessor: 'discount',\n Cell: props =>{props.value}%
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Discounted Price',\n accessor: 'discountedPrice',\n Cell: props =>{props.row._original.currency.toUpperCase()} {props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Fee',\n accessor: 'processingFee',\n Cell: props =>$ {(parseFloat(props.row._original.processingFee))}
,\n style: { 'whiteSpace': 'unset' }\n }\n , {\n Header: 'Gifted',\n accessor: 'gifted',\n Cell: props =>{props.row._original.gifted ? \"Yes\" : \"No\"}
,\n style: { 'whiteSpace': 'unset', }\n },\n {\n Header: '',\n accessor: 'redeem',\n Cell: props =>\n \n \n more\n \n \n handleClick(props.row._original)}\n >\n Redeem voucher\n \n handleVoid(props.row._original)}\n >\n Void voucher\n \n { handleViewDetails(item.invitationId, item.connectionId, item.approvalStatus); setId(item.id); setIsShow(!isShow); }}\n >\n Refund voucher \n \n\n { showResendEmail(props.row._original) }}\n >\n Resend email\n \n \n \n
:null}\n {\n setSearchVoucher(e.target.value);\n handleSearchfilter(e.target.value);\n }}>\n
\n \n
\n {!isLoading && orderList ? (\n
\n Voucher
\n \n setVoidReason(e.target.value)}>\n \n
Resend Email
\n \n \n Email
\n \n \n {emailData.map((m, index) => (\n \n \n \n { \n handleChange(index,e);\n }}/>\n \n\n \n \n \n
\n ))}\n \n \n \n + Add email\n \n \n
\n
\n \n deleteEmail(m.id)}\n color=\"secondary\"\n size=\"xs\"\n outline\n style={{ margin: '6px' }}\n >\n X\n \n
\n \n {\n setCodeVisible(!codeVisible);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Generate Codes\n \n
\n \n {codelist !== undefined && codelist.length > 0 ?\n \n \n + Download\n \n :\n \n + Download\n \n }\n
\n \n
\n \n
\n \n {voucherName}\n
\n\n {m.codeId}\n
\n\n {m.purpose}\n
\n\n {m.voucherCodeStatus}\n
\n\n {moment(m.createdDate).format('LL')}\n
\n\n {(m.voucherCodeStatus !== 'Void' && m.voucherCodeStatus !== 'Refunded' )&&
Voucher
\n \n setReason(e.target.value)}>\n \n
Refund Voucher
\n \n setReason(e.target.value)}>\n \n
\n
\n \n {formLabel}\n
\n \n
\n \n \n more\n \n \n handleUpdate(item.id)}\n >Edit\n \n {/* setDeleteVisible(true)}\n >Delete\n */}\n\n \n\n \n
\n \n {item.promoCode}\n
\n {item.promoType === 'Amount' ?\n\n {currency} {item.promoCodeValue}\n
:\n\n {item.promoCodeValue}%\n
}\n\n\n {moment(item.startDate).format('YYYY-MM-DD')}\n
\n\n {moment(item.endDate).format('YYYY-MM-DD')}\n
\n\n\n {item.promoStatus === 'Active' ? {item.promoStatus} :\n {item.promoStatus}}\n
\n\n < UncontrolledDropdown className=\"w-15 text-center w-sm-100\">\n\n {isUpdating && (\n {\n setIsUpdating(!isUpdating);\n }}\n id={id}\n handleSubmit={handlePromoCode}\n />\n )}\n
\n \n {\n ShowPromoCode(!promoCode);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n + Add Promo Code\n \n
\n \n
\n \n \n \n Status\n {\" \"}{codeStatus.label}\n \n \n {statusOptions.map((order, index) => {\n return (\n setCodeStatus(order)}\n >\n {order.label}\n \n );\n })}\n \n \n {/*
\n \n setCodeSearch(e.target.value)}\n />\n
*/}\n \n {`${startIndex}-${endIndex} of ${TotalItems} `}\n \n \n {SelectedPageSize}\n \n \n {pageSizes.map((size, index) => {\n return (\n changePageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n \n {promoList !== undefined && promoList.length > 0 && promoList.map((m) =>\n onChangePage(i)}\n />\n
\n\n {props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'processingFee',\n accessor: 'processingFee',\n Cell: props =>{props.value} %
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Status',\n accessor: 'status',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n }\n ];\n return (\n\n {HistoryData ? (\n
\n {props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Invitee Name',\n accessor: 'inviteeName',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Invitee Email',\n accessor: 'inviteeEmail',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Status',\n accessor: 'status',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Created Date',\n accessor: 'date',\n Cell: props =>{moment(props.value).format(\"DD-MM-YYYY hh:mm:ss A\")}
,\n style: { 'whiteSpace': 'unset' }\n },\n ];\n return (\n\n {HistoryData ? (\n
\n {props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Sender Email',\n accessor: 'senderEmail',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Invitee Name',\n accessor: 'inviteeName',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n\n {\n Header: 'Invitee Email',\n accessor: 'inviteeEmail',\n Cell: props =>{props.value}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: 'Processing Fee',\n accessor: 'processingFee',\n Cell: props =>{props.value} %
,\n style: { 'whiteSpace': 'unset' }\n },\n // {\n // Header: 'Sell Future Vouchers',\n // accessor: 'sellFutureVouchers',\n // Cell: props =>{props.value ? \"True\" : \"False\"}
,\n // style: { 'whiteSpace': 'unset' }\n // },\n {\n Header: 'Created Date',\n accessor: 'createdDate',\n Cell: props =>{moment(props.value).format(\"DD-MM-YYYY hh:mm:ss A\")}
,\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: '',\n accessor: 'invitationId',\n Cell: props =>,\n\n style: { 'whiteSpace': 'unset' }\n },\n {\n Header: '',\n accessor: 'invitationId',\n Cell: props =>
,\n style: { 'whiteSpace': 'unset' }\n },\n\n ];\n const handleVoucher = (id) => {\n invitationData.map((m) => {\n if (m.invitationId === id) {\n setData(m.connectedVoucher);\n }\n });\n setShowVoucher(true);\n };\n const handleHistory = (id) => {\n invitationData.map((m) => {\n if (m.invitationId === id) {\n setData(m.invitationHistory);\n }\n });\n setShowPopup(true);\n }\n return (\n
\n {invitationData && invitationData.length > 0 ? (\n
\n \n {invitationData !== undefined && invitationData.length > 0 ?\n ![]()
window.location.href = \"/app/pages/vouchers\"} src={no_invitations} alt=\"\">\n }\n
\n );\n}\nconst mapStateToProps = ({ settings }) => {\n const { propertyId, locale, currency,email } = settings;\n return {\n propertyId,\n locale,\n currency,\n email\n };\n};\n\nexport default injectIntl(connect(mapStateToProps, {})(Invitations));\n","import React, { useState, useEffect, Fragment } from 'react';\nimport {\n Row,\n Card,\n CardBody,\n UncontrolledDropdown,\n DropdownMenu,\n DropdownItem,\n DropdownToggle,\n Spinner,\n Button,\n Modal,\n ModalHeader,\n ModalBody,\n ModalFooter,\n InputGroup,\n InputGroupAddon,\n TabPane,\n TabContent,\n Nav,\n CardHeader,\n NavItem,\n NavLink\n} from 'reactstrap';\nimport ApproveInvitation from './components/forms/ApproveInvitation';\nimport no_vouchers from '../../../../../assets/no_vouchers.png';\nimport {\n Colxx,\n Separator,\n} from '../../../../../components/common/CustomBootstrap';\nimport { AxiosAPI, getGroupID, getUserID } from '../../../../../helpers/AxiosAPI';\nimport {\n gAPI_Vouchers_List, gAPI_Internal_Property_By_Id,\n gAPI_Users_By_Id, gAPI_Vouchers_By_Id, gAPI_MembershipTags,\n gAPI_Invitation_By_Email, postAPI_TrackEvent,\n putAPI_approve_voucher, gAPI_Orders_Voucher,\n API_Ingetration, gAPI_Property_List, putAPI_Vouchers_Order\n} from '../../../../../constants/APIs';\nimport { injectIntl } from 'react-intl';\nimport { connect } from 'react-redux';\nimport ShowInvitations from './components/forms/ShowInvitations';\nimport BuyOptionList from './components/BuyOptionList';\nimport AcceptInvitation from './components/forms/AcceptInvitation';\nimport moment from 'moment';\nimport CreateVoucherForm from './components/forms/CreateVouchersForm';\nimport Pagination from '../../../../../containers/pages/Pagination';\nimport VoucherListItem from './components/VoucherListItem';\nimport PurchasedVoucher from './components/PurchasedVouchers';\nimport ViewOrders from '../orders/Components/ViewOrders';\nimport PreviewVoucherList from './components/forms/PreviewVoucherList';\nimport ReactDragListView from \"react-drag-listview\";\nimport CodeList from './components/CodeList';\nimport { List, Typography } from \"antd\";\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faSearch } from '@fortawesome/free-solid-svg-icons';\nimport classnames from 'classnames';\nimport PromoCodes from './components/forms/PromoCodes';\nimport Gallery from '../../propinfo/gallery';\nimport Invitations from '../invitations';\nimport IconGallery from '../../propinfo/iconGallery';\nimport Validation from '../../../../../components/Validation';\nfunction Index({ propertyId, locale, currency }) {\n const [open, setOpen] = useState(false);\n const [msg, setMsg] = useState([]);\n const [voucherList, setVoucherList] = useState([]);\n const [loading, setLoading] = useState(true);\n const [activeTab, setActiveTab] = useState('vouchers');\n\n const [search, setSearch] = useState('');\n const [showInvitations, setShowInvitations] = useState(false);\n const [pageSizes, setpageSizes] = useState([10, 15, 20, 25, 50]);\n const [currentPage, setcurrentPage] = useState(1);\n const [SelectedPageSize, setSelectedPageSize] = useState(50);\n const [visible, setVisible] = useState(false);\n const [voucherId, setVoucherId] = useState(\"\");\n const [ispurchaseVoucherVisible, setIsPrchaseVoucherVisible] = useState(false);\n const [propertydata, setPropertyData] = useState([]);\n const [userData, setUserData] = useState([]);\n const [voucherFilter, setVoucherFilter] = useState('');\n const [showRedeem, setShowRedeem] = useState([]);\n const [startDate, setStartDate] = useState(moment().subtract(15, 'days'));\n const [endDate, setEndDate] = useState(moment());\n const [orderList, setOrderList] = useState([]);\n const [showCreateVoucherButton, setShowCreateVoucherButton] = useState(true);\n const [showVoucherList, setShowVoucherList] = useState(true);\n const [dropDown, setDropDown] = useState(\"\");\n const [orderListByNumber, setOrderListByNumber] = useState([]);\n const [orderdataById, setOrderDataById] = useState([]);\n const [showOrderData, setShowOrderData] = useState(false);\n const [inviteVoucher, setinviteVoucher] = useState(false);\n const [buyOptionLoading, setbuyOptionLoading] = useState(true);\n const [xolaIntegration, setXolaIntegration] = useState();\n const [mewsIntegration, setMewsIntegration] = useState();\n const [reportingTagData, setReportingTagData] = useState([]);\n const [SelectedStatus, setSelectedStatus] = useState({\n column: 'All',\n label: 'All',\n });\n const [TotalItems, setTotalItems] = useState(0);\n const [TotalPages, setTotalPages] = useState(1);\n const statusOptions = [\n { column: 'All', label: 'All' },\n { column: 'Active', label: 'Active' },\n { column: 'ActiveMembers', label: 'Active - Members Only' },\n { column: 'Draft', label: 'Draft' },\n { column: 'Inactive', label: 'Inactive' },\n { column: 'Archived', label: 'Archived' },\n ];\n const [propertyVouchers, setPropertyVouchers] = useState([]);\n const [buyOption, setBuyOption] = useState([]);\n const [isBuyOption, setisBuyOption] = useState(false);\n const [showInvitation, SetShowinvitation] = useState(true);\n const [showPreviewModal, setShowPreviewModal] = useState(false);\n const [voucherName, setVoucheName] = useState('');\n const [websiteIntregation, setWebsiteIntregation] = useState([]);\n const [websiteIntregationId, setWebsiteIntregationId] = useState('');\n const [isHostedPageIntegration, setisHostedPageIntegration] = useState(false);\n const [amadeus, setAmadeus] = useState();\n const [memberShipTags, setMembershipTags] = useState([]);\n const [invitation, setInvitation] = useState({\n 'propertyName': 'Abc',\n 'propertyId': '',\n 'groupId': '',\n 'sellFutureVouchers': 'false',\n 'invitationId': '',\n 'processingFee': 7,\n });\n const [showConnectedVoucher, setShowConnectedVoucher] = useState({\n 'groups': [],\n 'property': [],\n 'id': [],\n 'senderGroupId': '',\n 'senderPropertyId': '',\n 'isShow': false,\n 'invitationtype': ''\n });\n const [showListType, setShowListType] = useState('');\n \n const ShowInviteVoucher = (type) => {\n setinviteVoucher(type);\n };\n const handlePreviewVoucher = (val) => {\n // setPreviewVoucher(val);\n setShowPreviewModal(val);\n }\n const handleDropDown = (name) => {\n setDropDown(name);\n }\n \n const handleVoucherFilter = (name) => {\n setVoucherFilter(name);\n }\n\n const handleCreateVoucherButtonShow = () => {\n setShowCreateVoucherButton(!showCreateVoucherButton);\n };\n\n useEffect(() => {\n localStorage.removeItem('Invitation');\n\n AxiosAPI({\n method: 'post',\n url: `${postAPI_TrackEvent}`,\n data: {\n eventName: 'aiva Vouchers',\n email: userData.email,\n },\n }).then(\n (res) => { },\n (error) => {\n console.log(error);\n }\n );\n extractData();\n return () => {\n try {\n if (document.getElementById('voucherbotiframe') !== undefined && document.getElementById('voucherbotiframe') !== null)\n document.getElementById('voucherbotiframe').remove();\n\n\n if (document.getElementById('bmb_webview') !== undefined && document.getElementById('bmb_webview') !== null)\n document.getElementById('bmb_webview').remove();\n\n\n if (document.getElementById('bmb_voucher_nudges_container') !== undefined && document.getElementById('bmb_voucher_nudges_container') !== null)\n document.getElementById('bmb_voucher_nudges_container').remove();\n } catch {\n\n }\n };\n }, [propertyId, search, currentPage, SelectedPageSize, SelectedStatus]);\n\n const loadTags = () => {\n let body = {\n channels: ['VoucherHostedPage', 'VoucherStandAlonePage', 'Xola', 'Mews', 'Amadues']\n };\n AxiosAPI({\n method: 'post',\n url: `${API_Ingetration}?group_id=${getGroupID()}`,\n data: body\n }).then((res) => {\n const webIntegrationData = res.data.filter(\n (k) => (k.channel === 'VoucherHostedPage' || k.channel === 'VoucherStandAlonePage')\n && k.disabled === false && k.properties !== undefined && k.properties.includes(propertyId)\n );\n const xolaIntegrationData = res.data.filter(\n (k) => k.channel === 'Xola' && k.disabled === false && k.properties !== undefined && k.properties.includes(propertyId)\n );\n const mewsIntegrationData = res.data.filter(\n (k) => k.channel === 'Mews' && k.disabled === false && k.properties !== undefined && k.properties.includes(propertyId)\n );\n\n const integratioData = res.data.filter(\n (k) => k.channel === 'VoucherWebsite' && k.disabled === false && k.properties !== undefined && k.properties.includes(propertyId)\n );\n AxiosAPI({\n method: 'get',\n url: `${gAPI_MembershipTags}?propertyId=${propertyId}`,\n })\n .then((res) => {\n let tempTags = [];\n if (res.data !== undefined && res.data.tags !== undefined)\n tempTags = (res.data.tags);\n\n if (integratioData.length > 0) {\n integratioData.map((m) => {\n if (m.membershipTags.length > 0) {\n m.memberShipTags.map((t) => {\n if (tempTags.filter(f => f === t).length > 0)\n tempTags.push(t);\n });\n }\n });\n\n }\n setMembershipTags(tempTags);\n });\n\n\n\n if (mewsIntegrationData.length > 0)\n setMewsIntegration(mewsIntegrationData[0]);\n\n if (xolaIntegrationData.length > 0)\n setXolaIntegration(xolaIntegrationData[0]);\n\n const voucherHostedPageIntegration = res.data.filter(\n (k) => (k.channel === 'VoucherHostedPage' || k.channel === 'VoucherStandAlonePage') && k.disabled === false && k.properties !== undefined && k.properties.includes(propertyId)\n );\n if (voucherHostedPageIntegration.length > 0)\n setisHostedPageIntegration(true);\n\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Property_List}/?group_id=${getGroupID()}`,\n }).then((result) => {\n\n const amadeusIntegration = res.data.filter(\n (k) => k.channel === \"Amadues\" && k.disabled === false &&\n result.data.filter((a) => k.properties.includes(a.id) && a.isAiva === true).length > 0\n );\n if (amadeusIntegration.length > 0)\n setAmadeus(amadeusIntegration[0]);\n setWebsiteIntregation(webIntegrationData);\n if (webIntegrationData.length === 1)\n setWebsiteIntregationId(webIntegrationData[0].id);\n\n\n });\n });\n }\n const extractData = async () => {\n loadTags();\n setBuyOption([]);\n setVoucherList([]);\n setLoading(true);\n await AxiosAPI({\n method: 'get',\n url: `${gAPI_Users_By_Id}/${getUserID()}?gid=${getGroupID()}`,\n })\n .then((res) => {\n setUserData(res.data);\n LoadInvitation(getUserID());\n LoadData(getGroupID(), propertyId, res.data.email);\n });\n await AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Internal_Property_By_Id}/${propertyId}?group_id=${getGroupID()}`,\n })\n .then((res) => {\n setPropertyData(res.data);\n });\n };\n\n const LoadInvitation = (email) => {\n let invitation_id = localStorage.getItem(\"Invitation\");\n AxiosAPI({\n url: `${gAPI_Invitation_By_Email}?id=${email}&group_id=${getGroupID()}&property_id=${propertyId}`,\n mehthod: 'get',\n }).then((res) => {\n localStorage.setItem(\"invitation_data\", res.data);\n if (invitation_id !== '') {\n res.data.map((m) => {\n if (m.invitationId === invitation_id) {\n handleConnectedVoucher(m.invitationId, m.groups, m.propertys, m.groupId, m.propertyId, m.type);\n\n }\n });\n }\n\n setInvitation(res.data);\n\n })\n .catch((err) => null);\n\n };\n const LoadData = (gid, pid, email) => {\n setLoading(true);\n setbuyOptionLoading(true);\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Vouchers_List}?groupId=${gid === undefined ? getGroupID() : gid}&propertyId=${pid === undefined ? propertyId : pid}&languageCode=${locale}&search=${search}&status=${SelectedStatus.column\n }&pageNumber=${currentPage}&pageSize=${SelectedPageSize}&email=${email !== undefined ? email : userData.email}`,\n })\n .then((res) => {\n setShowListType('voucherList');\n setVoucherList(res.data.vouchers);\n setLoading(false);\n setShowCreateVoucherButton(true);\n setTotalItems(res.data.totalItems);\n setTotalPages(res.data.totalPages);\n let tags = reportingTagData;\n let ownVouchers = [];\n res.data.vouchers.map((m) => {\n if (m.status == 'Active' && m.thirdPartyVoucher == false) {\n ownVouchers.push({\n label: m.name,\n value: m.id,\n key: m.id,\n });\n }\n });\n setPropertyVouchers(ownVouchers);\n res.data.vouchers.map((m) => {\n\n if (m.reportingTags.length > 0)\n m.reportingTags.map((n) => {\n if (tags.filter((f) => f === n).length === 0)\n tags.push(n);\n })\n });\n\n setReportingTagData(tags);\n if (showListType === 'optionsList') {\n let values = [];\n res.data.vouchers.map((m) => {\n if (m.id === voucherId && m.thirdPartyVoucher === false) {\n m.buyOptions.map((item) => {\n values.push(item);\n })\n }\n });\n setbuyOptionLoading(false);\n setBuyOption(values);\n }\n })\n .catch((err) => null);\n };\n\n\n const handleBackClick = () => {\n setShowListType('voucherList');\n extractData();\n }\n\n const handleVoucherName = (name, id) => {\n setVoucheName(name);\n setVoucherId(id);\n };\n const handleBuyOptionSetings = (value, Id, name) => {\n setbuyOptionLoading(true);\n AxiosAPI({\n methhod: 'get',\n url: `${gAPI_Vouchers_By_Id}/${Id}`,\n }).then((res) => {\n setbuyOptionLoading(false);\n setShowListType('optionsList');\n setVoucheName(name);\n setBuyOption(res.data.sellingOptions);\n setVoucherId(Id);\n setLoading(false);\n });\n\n }\n\n const changePageSize = (size) => {\n setSelectedPageSize(size);\n setcurrentPage(1);\n };\n\n const onChangePage = (page) => {\n setcurrentPage(page);\n };\n\n const changeStatus = (column) => {\n setSelectedStatus(statusOptions.find((x) => x.column === column));\n };\n\n const onSearchKey = (e) => {\n if (e.key === 'Enter') {\n setSearch(e.target.value.toLowerCase());\n }\n };\n const toggleModal = () => {\n setVisible(!visible);\n };\n const startIndex = (currentPage - 1) * SelectedPageSize;\n const endIndex = currentPage * SelectedPageSize;\n const onOrdersVoucher = () => {\n setShowListType('orderVouchers');\n setShowVoucherList(false);\n setLoading(false);\n };\n\n const handleOrdersVoucherSubmit = () => {\n onOrdersVoucher();\n BindOrders(startDate, endDate, showRedeem, voucherId);\n };\n const handleVoucherPaymentsById = (voucherId, redeem) => {\n let item = voucherList.map((f) => { if (f.id === voucherId) { return (f.name); } });\n onOrdersVoucher();\n setVoucherId(voucherId);\n setDropDown(item);\n setShowCreateVoucherButton(false);\n if (redeem !== undefined && redeem !== 'All') {\n setShowRedeem(redeem);\n }\n let temp = [];\n // LoadSearchOrderVoucherData(voucherId, redeem === undefined ? showRedeem : redeem, ' ');\n\n BindOrders(startDate, endDate, redeem === undefined ? showRedeem : redeem, voucherId);\n };\n const handleVoucherPaymentsByIdforthirdParty = (voucherId, redeem, gid, pid) => {\n let item = voucherList.map((f) => { if (f.id === voucherId) { return (f.name); } });\n onOrdersVoucher();\n setVoucherId(voucherId);\n setDropDown(item);\n setShowCreateVoucherButton(false);\n if (redeem !== undefined && redeem !== 'All') {\n setShowRedeem(redeem);\n }\n BindOrders(startDate, endDate, redeem === undefined ? showRedeem : redeem, voucherId);\n\n //LoadSearchOrderVoucherDataForThridParty(voucherId, redeem === undefined ? showRedeem : redeem, 'B', gid, pid);\n };\n const onstartDateChnage = (date) => {\n setStartDate(date);\n };\n\n const handleSearchfilter = (search) => {\n if (search.length > 0) {\n LoadSearchOrderVoucherData(voucherId, showRedeem, search);\n } else {\n BindOrders(startDate, endDate, showRedeem, voucherId);\n }\n }\n const handleApproval = (id, invitation_id) => {\n let body = ([{\n groupId: getGroupID(), propertyId: propertyId,\n voucherId: id, status: 'Approve'\n }]);\n AxiosAPI({\n url: `${putAPI_approve_voucher}`,\n method: 'put',\n data: { 'VoucherList': body }\n }).then((res) => {\n if (res.data.HttpStatusCode !== undefined && res.data.HttpStatusCode === 400 && res.data.Messages !== undefined\n && res.data.Messages !== null && res.data.Messages.length > 0) {\n setMsg(res.data.Messages);\n setOpen(true);\n }\n else { LoadData() }\n })\n .catch((err) => null);\n LoadData();\n };\n\n const handleReject = (id, invitation_id, status, fee) => {\n let body = ([{\n groupId: getGroupID(), propertyId: propertyId,\n voucherId: id, status: status, invitationId: invitation_id, processingFee: fee\n }]);\n AxiosAPI({\n url: `${putAPI_approve_voucher}`,\n method: 'put',\n data: { 'voucherList': body }\n }).then((data) => LoadData())\n .catch((err) => null);\n\n };\n const onEndDateChnage = (date) => {\n setEndDate(date);\n };\n\n function BindOrders(startdate, enddate, redeem, voucherId) {\n setOrderList([]);\n let fromDate = startdate ? startDate.format('YYYY-MM-DD') + ' 00:00:00' : '';\n let toDate = enddate ? endDate.format('YYYY-MM-DD') + ' 23:59:59' : '';\n let temp = [];\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Orders_Voucher}/voucher?redeem=${redeem}&voucherId=${voucherId}&fromDate=${fromDate}&toDate=${toDate}&groupId=${temp.length > 0 ? temp[0].groupId : getGroupID()}&propertyId=${temp.length > 0 ? temp[0].propertyId : propertyId}`,\n })\n .then(res => {\n setOrderList(res.data);\n })\n .catch(err => null);\n }\n\n const handleConnectedVoucher = (id, groups, property, senderGroup, senderProperty, type) => {\n setShowConnectedVoucher({\n groups: groups, property: property, id: id, isShow: true, senderGroupId: senderGroup,\n senderPropertyId: senderProperty, invitationtype: type\n });\n };\n\n const LoadSearchOrderVoucherData = (voucherId, redeem, search) => {\n setOrderList([]);\n AxiosAPI({\n method: 'get',\n url: `${gAPI_Orders_Voucher}/search/voucher?redeem=${redeem}&voucherId=${voucherId}&search=${search}&groupId=${getGroupID()}&propertyId=${propertyId}`,\n })\n .then(res => {\n\n setOrderList(res.data);\n setLoading(false);\n })\n .catch(err => null);\n }\n\n const handleRedeemVoucher = (number, status) => {\n if (number !== undefined || null) {\n let date = moment();\n let redeemdate = date.format('YYYY-MM-DD HH:mm:ss');\n\n AxiosAPI({\n method: 'PUT',\n url: `${gAPI_Orders_Voucher}/voucher/redeem?id=00000000-0000-0000-0000-000000000000&status=2&voucherNumber=${number}&status=${status}&redeemDate=${redeemdate}`,\n })\n .then(res => {\n\n if (res.data.redeem) {\n BindOrders(startDate, endDate, showRedeem, voucherId);\n }\n })\n .catch(err => null);\n }\n };\n\n const handleBack = () => {\n LoadData();\n setShowListType('orderVouchers');\n }\n\n const reorder = (list, startIndex, endIndex) => {\n const result = Array.from(list);\n const [removed] = result.splice(startIndex, 1);\n result.splice(endIndex, 0, removed);\n return result;\n };\n\n const onDragEnd = (fromIndex, toIndex) => {\n if (toIndex < 0) return;\n const result = Array.from(voucherList);\n const [removed] = result.splice(fromIndex, 1);\n result.splice(toIndex, 0, removed);\n setVoucherList(result);\n var data = [];\n result.map((item, i) => {\n data.push({\n id: item.id,\n order: i\n })\n });\n AxiosAPI({\n method: 'put',\n url: `${putAPI_Vouchers_Order}`,\n data: { data: data },\n }).then((res) => {\n }).catch((err) => {\n console.log('err', err);\n });\n };\n \n return (\n \n {loading !== undefined && !loading && showCreateVoucherButton &&
\n \n
\n \n \n \n Status\n {\" \"}{SelectedStatus.label}\n \n \n {statusOptions.map((order, index) => {\n return (\n changeStatus(order.column)}\n >\n {order.label}\n \n );\n })}\n \n \n
\n \n onSearchKey(e)}\n />\n
\n \n {`${startIndex}-${endIndex} of ${TotalItems} `}\n \n \n {SelectedPageSize}\n \n \n {pageSizes.map((size, index) => {\n return (\n changePageSize(size)}\n >\n {size}\n \n );\n })}\n \n \n
\n - \n \n
\n
\n )\n }\n\n \n
\n }\n\n\n
\n Please create a voucher first to start seeing how it will look on your website
\n\n
\n Layout
\n\n
\n \n {\n setLayout({layoutType: 0 })\n }}\n >\n 
Collage Layout\n \n
\n \n {\n setLayout({layoutType: 1 })\n }}\n >\n 
Masonry Layout\n \n
\n \n {\n setLayout({layoutType: 2 })\n }}\n >\n 
Grid Layout\n \n
\n \n {\n setLayout({layoutType: 3 })\n }}\n >\n 
Thumbnails Layout\n \n
\n \n {\n setLayout({layoutType: 4 })\n }}\n >\n 
Slider Layout\n \n
\n \n {\n setLayout({layoutType: 5 })\n }}\n >\n 
SlideShow Layout\n \n
\n \n {\n setLayout({layoutType: 6})\n }}\n >\n 
Panorama Layout\n \n
\n \n {\n setLayout({layoutType: 7})\n }}\n >\n 
Column Layout\n \n
\n \n {\n setLayout({layoutType: -1})\n }}\n >\n 
Pro Layout\n \n
\n \n \n\n \n
\n \n
\n Embed Page Appearance
\nFont Settings
\n \n\n Arrow Type
\n \n
\n \n {\n setArrowType(1);\n }}\n >\n \n
\n \n {\n setArrowType(2);\n }}\n >\n \n
\n\n \n {\n setArrowType(3);\n }}\n > \n
\n \n \n {\n setArrowType(4);\n }}\n >\n \n
\n \n \n {\n setArrowType(5);\n }}\n >\n \n
\n \n \n {\n setArrowType(6);\n }}\n >\n \n
\n \n \n {\n setArrowType(0);\n }}\n >\n \n
\n \n \n\n Arrow Size
\n\n \n Size\n
\n
\n \n
\n setArrowSize(e.target.value)}> {arrowSize}
\n Arrow Color
\n \n\n\n \n\n \n \n\n
\n
\n \n
\n {iseditMode.arrowColor && { e.stopPropagation(); }}>\n \n
\n \n \n {\n setArrowColor(e.target.value);\n }}\n value={arrowColor}\n />\n \n {\n setEditMode({ ...iseditMode, arrowColor: !iseditMode.arrowColor });\n }\n } className=\"color-square\" style={setBackGroundColor(arrowColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n if (edit) {\n setArrowColor(e.hex);\n } else setError(true);\n }\n }\n />\n
\n Display Vouchers
\n\n \n
\n \n setDisplayVouchers(e.target.value)}>\n \n \n \n
\n \n
\n {iseditMode.buttonTextColor && { e.stopPropagation(); }}>\n
\n Button Text Color
\n \n \n {\n let colours = setting.colours;\n colours.buttonTextColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.buttonTextColor}\n />\n \n {\n setEditMode({ ...iseditMode, buttonTextColor: !iseditMode.buttonTextColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.buttonTextColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.buttonTextColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemTextColor && { e.stopPropagation(); }}>\n
\n Redeem Text Color
\n \n \n {\n let colours = setting.colours;\n colours.redeemTextColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.redeemTextColor}\n />\n \n {\n setEditMode({ ...iseditMode, redeemTextColor: !iseditMode.redeemTextColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.redeemTextColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.redeemTextColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.primaryColor && { e.stopPropagation(); }}>\n
\n Primary Color
\n \n \n {\n let colours = setting.colours;\n colours.primaryColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.primaryColor}\n />\n \n {\n setEditMode({ ...iseditMode, primaryColor: !iseditMode.primaryColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.primaryColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.primaryColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.buttonColor && { e.stopPropagation(); }}>\n
\n Button Color
\n \n \n {\n let colours = setting.colours;\n colours.buttonColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.buttonColor}\n />\n \n {\n setEditMode({ ...iseditMode, buttonColor: !iseditMode.buttonColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.buttonColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.buttonColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemBar && { e.stopPropagation(); }}>\n
\n Redeem Bar
\n \n \n {\n let colours = setting.colours;\n colours.redeemBar = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.redeemBar}\n />\n \n {\n setEditMode({ ...iseditMode, redeemBar: !iseditMode.redeemBar });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.redeemBar)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.redeemBar = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemButton && { e.stopPropagation(); }}>\n
\n Redeem Button
\n \n \n {\n let colours = setting.colours;\n colours.redeemButton = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.redeemButton}\n />\n \n {\n setEditMode({ ...iseditMode, redeemButton: !iseditMode.redeemButton });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.redeemButton)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.redeemButton = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n \n {iseditMode.shoppingBar && { e.stopPropagation(); }}>\n \n {\n let colours = setting.colours;\n colours.shoppingBar = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n />\n \n {\n setEditMode({ ...iseditMode, shoppingBar: !iseditMode.shoppingBar });\n }} className=\"color-square\" style={setBackGroundColor(setting.colours.shoppingBar)}> \n \n \n
\n Shopping Bar
\n < div className='col-md-6' >\n \n
}\n { e.stopPropagation(); }}>\n {\n if (edit) {\n let colours = setting.colours;\n colours.shoppingBar = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n
\n \n {iseditMode.shoppingBarText && { e.stopPropagation(); }}>\n \n {\n let colours = setting.colours;\n colours.shoppingBarText = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n />\n \n {\n setEditMode({ ...iseditMode, shoppingBarText: !iseditMode.shoppingBarText });\n }} className=\"color-square\" style={setBackGroundColor(setting.colours.shoppingBarText)}> \n \n \n
\n Shopping Bar Text
\n < div className='col-md-6' >\n \n
}\n { e.stopPropagation(); }}>\n {\n if (edit) {\n let colours = setting.colours;\n colours.shoppingBarText = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
Font Settings
\n \n \n }\n
\n \n
\n {embedVoucher.fonts !== undefined && \n
\n
\n \n Website Font Name \n
\n \n
\n setFont(e.target.value)}> \n
\n \n
\n \n
\n
\n \n Title Font \n
\n \n
\n setFontsList({ ...fontsList, title: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Subtitle Font \n
\n \n
\n setFontsList({ ...fontsList, subTitle: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Button Font \n
\n \n
\n setFontsList({ ...fontsList, buttonText: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Voucher Title Font \n
\n \n
\n setFontsList({ ...fontsList, voucherTitle: e.target.value })}> \n
\n \n
\n \n
\n
\n \n Voucher Description Font \n
\n \n
\n setFontsList({ ...fontsList, voucherDescription: e.target.value })}> \n
\n \n e.target.checked === true ? setIsFooterHide(true) : setIsFooterHide(false)}\n >Hide \"Grow with aiva\"\n
\n \n e.target.checked === true ? setApplyPromoCode(true) : setApplyPromoCode(false)}\n >Show \"Gift card or promo code\" option\n
\n \n {\n handleColoursReset();\n }}\n >\n Reset to default font and colors\n \n
\n \n Font Size
\n\n \n Size\n
\n
\n \n
\n setFontSize(e.target.value)}> {fontSize}
\n \n \n \n {\n CloseColorBox();\n }}\n >\n Cancel\n \n \n
\n Publish your Embed Page
\n\n \n {' '}\n <!-- This is start of the aiva voucher\n assistant code -->\n \n <script>\n \n var aiva_Voucher_domain ='{process.env.REACT_APP_VOUCHER_URL}/';\n \n \n var aiva_Voucher_botHTMLPath =\n aiva_Voucher_domain;\n \n \n var aiva_Voucher_head =\n document.getElementsByTagName('head')[0];\n \n \n var aiva_Voucher_script =\n document.createElement('script');\n \n \n aiva_Voucher_script.type =\n 'text/javascript';\n \n \n aiva_Voucher_script.src =\n aiva_Voucher_domain + 'embedVoucherPlugin.js';\n \n \n aiva_Voucher_head.appendChild(aiva_Voucher_script);\n \n \n var aiva_Voucher_gid = '{getGroupID()}\n ';\n \n \n var aiva_Voucher_iid = '\n {integration.id}';\n \n var aiva_Voucher_pid = '';\n </script>\n \n {' '}\n <!-- This is end of the aiva voucher\n assistant code -->{' '}\n \n
\n \n setShowEmailBox(!showEmailBox)}\n >\n Email to developer\n \n setEmbedScriptCopied(true)}>\n \n Copy the code snippet\n \n \n {embedScriptcopied ?
\n \n \n Copy and paste this code before the closing </body>\n tag on every page of your website.\n \n
\n Copied.
: null}\n Embed your Assistant
\n\n \n <iframe frameborder=\"0\" style=\"bottom: 0; right: 0; margin:\n 0; z-index: 2000001;height:630px;width:390px;\"\n id=\"voucherFrame\" src=\"{process.env.REACT_APP_VOUCHER_URL}/embedVoucher?location=&title=&referrer=&iid=\n {integration.id}&gid={getGroupID()}\n &mobile=false&open=1&embed=1&custom=1\"></iframe>\n \n
\n \n setEmbedIframeCopied(true)}\n >\n \n Copy the code snippet\n \n \n {/* \n Preview\n */}\n {embedIframecopied ?
\n \n \n Copy and paste this code at desired location on the page of\n your website.\n \n
\n\n Copied.
: null}\n \n Your developer teammate will receive an e-mail containing the code\n and necessary instructions to implement it.\n
\n\n
\n \n );\n })}\n \n Add Fonts\n \n handleSave()}\n >\n Save\n \n
\n {ImageGalleryButton()}\n \n Upload Fonts\n
\n\n
\n \n
\n Font Name
\n\n handleSaveName(e,m.id)}\n name=\"name\"\n />\n
\n \n
\n\n Font Link
\n\n handleSaveLink(e,m.id)}\n name=\"name\"\n />\n
\n \n togglegallery(m.id)}\n >\n Browse Fonts\n \n RemoveFonts(m.id)}\n >\n Remove Fonts\n \n
\n \n Font file is not valid. Try again after some time.\n
\n\n
\n Bulk Purchase
\n\n handleSwitchChange(e.target.checked)}\n >Purchase vouchers in bulk and have them sent to a list of recipients\n
\n \n \n \n setIsEditing(!isEditing)}\n >\n Cancel\n \n \n
\n \n
\n Social Sharing
\n\n Let your customers spread the word\n
\n\n
\n \n
\n Enable
\n\n setData({ ...data, isEnable: primary })}\n />\n
\n \n
\n \n Select the social platform to enable social sharing icons on your Vouchers and Gift Cards
\n\n \n \n setData({ ...data, showFacebook: e.target.checked })}\n checked={data.showFacebook}\n className=\"text-left\"\n >\n Facebook\n \n \n
\n \n setData({ ...data, facebookLink: e.target.value })}\n >\n\n \n
\n
\n \n \n \n setData({ ...data, showTwitter: e.target.checked })}\n checked={data.showTwitter}\n className=\"text-left\"\n >\n Twitter\n \n \n
\n \n setData({ ...data, twitterLink: e.target.value })}\n >\n\n \n
\n
\n \n \n \n setData({ ...data, showLinkdin: e.target.checked })}\n checked={data.showLinkdin} \n className=\"text-left\"\n >\n Linkedin\n \n \n
\n \n setData({ ...data, linkdinLink: e.target.value })}\n >\n\n \n
\n
\n \n \n \n \n \n
\n Email & Attachment
\n\n Make the voucher emails easy to recognize by replacing the sender’s name with \"{allProperties.filter((m) => m.id === propertyId)[0].name}\", otherwise shows as \"aiva\"\n
\n \n setShowBusinessAddress(!showBusinessAddress)}\n >Replace the business name and address in the email footer with your business address, otherwise shows as Myma.ai\n
\n \n \n \n \n setPdfTemplate(e.target.value)}\n >\n \n \n \n\n \n \n \n \n \n
\n
\n {pdfTemplate === 'SinglePageDesign1' &&\n Single page A4 landscape design #1}\n {pdfTemplate === 'SinglePageDesign2' &&\n Single page A4 landscape design #2}\n {pdfTemplate === 'MultiPageDesign' &&\n Multipage A4 portrait with details and full terms}\n \n \n
\n
\n \n
\n {pdfTemplate === 'SinglePageDesign1' &&\n Single page A4 landscape design #1}\n {pdfTemplate === 'SinglePageDesign2' &&\n Single page A4 landscape design #2}\n {pdfTemplate === 'MultiPageDesign' &&\n Multipage A4 portrait with details and full terms}\n
\n {pdfTemplate === 'SinglePageDesign2' &&\n
\n \n togglegallery(false)}\n >\n Browse Background\n \n
}\n \n \n \n \n setGiftTemplateSettings({...giftPdfTemplateSettings,pdfGiftTemplate: e.target.value})}\n >\n \n \n \n \n\n \n \n\n\n \n \n \n \n \n
\n
\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign1' &&\n Single page A4 landscape design #1}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign1WithMessage' &&\n Single page A4 landscape design #1 with personal message}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'MultiPageDesign' &&\n Multipage A4 portrait with details and full terms}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SimplisticDesign' &&\n Simplistic 8.5x11 inch with personal message}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign2' &&\n Single page A4 landscape design #2}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign2WithMessage' &&\n Single page A4 landscape design #2 with personal message}\n \n \n
\n
\n \n
\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign1' &&\n Single page A4 landscape design #1}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign1WithMessage' &&\n Single page A4 landscape design #1 with personal message}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'MultiPageDesign' &&\n Multipage A4 portrait with details and full terms}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SimplisticDesign' &&\n Simplistic 8.5x11 inch with personal message}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign2' &&\n Single page A4 landscape design #2}\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SinglePageDesign2WithMessage' &&\n Single page A4 landscape design #2 with personal message}\n
\n {giftPdfTemplateSettings?.pdfGiftTemplate === 'SimplisticDesign' &&\n
\n\n\n \n togglegallery(true)}\n >\n Browse Background\n \n
}\n \n \n \n \n
\n\n {ImageGalleryButton()}\n \n \n
\n \n Select Businesses \n
\n\n Select the businesses that are visible through this voucher store\n
\n\n
\n \n \n
\n \n Select layout\n
\n\n Select the layout that are visible through this\n integration\n
\n\n
\n \n \n
\n \n Email & Attachment\n
\n\n Customize the voucher email & pdf attachment\n
\n\n
\n \n \n
\n \n Bulk Purchase\n
\n\n Purchase vouchers in bulk\n
\n\n
\n \n \n
\n \n Social Sharing\n
\n\n Let your customers spread the world\n
\n\n
\n \n
\n \n Appearance\n
\n\n Choose your digital assistant's name, avatar and\n setup your colours\n
\n\n
\n \n
\n \n Custom Fonts\n
\n\n Control the fonts of aiva widget on your website\n
\n\n
\n \n
\n \n Custom Emails\n
\n\n Select the languages for the chat widget\n
\n\n
\n \n
\n \n Publish your digital assistant\n
\n\n Copy the code snippet to install your digital\n assistant\n
\n\n
\n \n {/* \n Preview\n */}\n\n
\n \n \n Archive\n \n\n
\n \n
\n \n Layout
\n\n
\n \n {\n setLayout({...layout,layoutType: 0 })\n }}\n >\n Collage Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 1 })\n }}\n >\n Masonry Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 2 })\n }}\n >\n Grid Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 3 })\n }}\n >\n Thumbnails Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 4 })\n }}\n >\n Slider Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 5 })\n }}\n >\n SlideShow Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 6})\n }}\n >\n Panorama Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 7})\n }}\n >\n Column Layout\n \n
\n \n {\n setLayout({...layout,layoutType: -1})\n }}\n >\n 
Pro Layout\n \n
\n \n {\n setLayout({...layout,layoutType: 8})\n }}\n >\n 
Custom Layout\n \n
\n \n \n \n\n \n
\n \n
\n Standalone Page Appearance
\n\n \n Browse Logo\n \n
\n\n \n Title\n
\n setAvatarName(e.target.value)}\n />\n
\n\n \n
\n Subtitle\n
\n setSubTitle(e.target.value)}\n />\n
\n\n \n
\n Logo Target Link\n
\n setLogoLink(e.target.value)}\n />\n
\n\n \n
\n \n \n \n \n\n \n \n {/* \n */}\n\n \n
\n {iseditMode.shoppingBar && Colour Settings
\n \n\n\n \n \n \n \n \n\n \n \n \n
\n {iseditMode.subTitle && \n
\n {iseditMode.primaryColor && { e.stopPropagation(); }}>\n
\n Primary Color
\n \n \n {\n let colours = setting.colours;\n colours.primaryColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.primaryColor}\n />\n \n {\n setEditMode({ ...iseditMode, primaryColor: !iseditMode.primaryColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.primaryColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.primaryColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.buttonTextColor && { e.stopPropagation(); }}>\n
\n Button Text Color
\n \n \n {\n let colours = setting.colours;\n colours.buttonTextColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.buttonTextColor}\n />\n \n {\n setEditMode({ ...iseditMode, buttonTextColor: !iseditMode.buttonTextColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.buttonTextColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.buttonTextColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.title && { e.stopPropagation(); }}>\n
\n Title Text
\n \n \n {\n let colours = setting.colours;\n colours.title = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.title}\n />\n \n {\n setEditMode({ ...iseditMode, title: !iseditMode.title });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.title)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.title = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n { e.stopPropagation(); }}>\n \n {\n let colours = setting.colours;\n colours.subTitle = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n />\n \n {\n setEditMode({ ...iseditMode, subTitle: !iseditMode.subTitle });\n }} className=\"color-square\" style={setBackGroundColor(setting.colours.subTitle)}> \n \n \n
\n Subtitle Text
\n < div className='col-md-6' >\n \n
}\n \n\n { e.stopPropagation(); }}>\n {\n if (edit) {\n let colours = setting.colours;\n colours.subTitle = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n
\n {iseditMode.redeemButton && { e.stopPropagation(); }}>\n
\n Redeem Button
\n \n \n {\n let colours = setting.colours;\n colours.redeemButton = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.redeemButton}\n />\n \n {\n setEditMode({ ...iseditMode, redeemButton: !iseditMode.redeemButton });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.redeemButton)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.redeemButton = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemTextColor && { e.stopPropagation(); }}>\n
\n Redeem Button Text
\n \n \n {\n let colours = setting.colours;\n colours.redeemTextColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.redeemTextColor}\n />\n \n {\n setEditMode({ ...iseditMode, redeemTextColor: !iseditMode.redeemTextColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.redeemTextColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.redeemTextColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.buttonColor && { e.stopPropagation(); }}>\n
\n Button Color
\n \n \n {\n let colours = setting.colours;\n colours.buttonColor = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.buttonColor}\n />\n \n {\n setEditMode({ ...iseditMode, buttonColor: !iseditMode.buttonColor });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.buttonColor)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.buttonColor = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n {iseditMode.redeemBar && { e.stopPropagation(); }}>\n
\n Redeem Bar
\n \n \n {\n let colours = setting.colours;\n colours.redeemBar = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.redeemBar}\n />\n \n {\n setEditMode({ ...iseditMode, redeemBar: !iseditMode.redeemBar });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.redeemBar)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.redeemBar = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n \n
\n { e.stopPropagation(); }}>\n \n {\n let colours = setting.colours;\n colours.shoppingBar = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n />\n \n {\n setEditMode({ ...iseditMode, shoppingBar: !iseditMode.shoppingBar });\n }} className=\"color-square\" style={setBackGroundColor(setting.colours.shoppingBar)}> \n \n \n
\n Shopping Bar Button
\n < div className='col-md-6' >\n \n
}\n \n\n\n { e.stopPropagation(); }}>\n {\n if (edit) {\n let colours = setting.colours;\n colours.shoppingBar = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n
\n \n {iseditMode.shoppingBarText && { e.stopPropagation(); }}>\n \n {\n let colours = setting.colours;\n colours.shoppingBarText = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n />\n \n {\n setEditMode({ ...iseditMode, shoppingBarText: !iseditMode.shoppingBarText });\n }} className=\"color-square\" style={setBackGroundColor(setting.colours.shoppingBarText)}> \n \n \n
\n Shopping Bar Text
\n < div className='col-md-6' >\n \n
}\n { e.stopPropagation(); }}>\n {\n if (edit) {\n let colours = setting.colours;\n colours.shoppingBarText = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
Arrow Type
\n \n\n
\n \n {\n setArrowType(1);\n }}\n >\n \n
\n \n {\n setArrowType(2);\n }}\n >\n \n
\n\n \n \n {\n setArrowType(3);\n }}\n > \n
\n \n \n {\n setArrowType(4);\n }}\n >\n \n
\n \n \n {\n setArrowType(5);\n }}\n >\n \n
\n \n \n {\n setArrowType(6);\n }}\n >\n \n
\n \n \n {\n setArrowType(0);\n }}\n >\n \n
\n \n \n Arrow Size
\n\n \n Size\n
\n
\n \n
\n setArrowSize(e.target.value)}> {arrowSize}
\n Display Vouchers
\n \n setDisplayVouchers(e.target.value)}>\n \n \n \n
\n Arrow Color
\n \n\n\n \n\n \n \n\n
\n
\n
\n {iseditMode.arrow && { e.stopPropagation(); }}>\n \n
\n \n \n {\n let colours = setting.colours;\n colours.arrow = e.target.value;\n setSetting({ ...setting, colours: colours });\n }}\n value={setting.colours.arrow}\n />\n \n {\n setEditMode({ ...iseditMode, arrow: !iseditMode.arrow });\n }\n } className=\"color-square\" style={setBackGroundColor(setting.colours.arrow)}> \n \n \n
\n \n
}\n { e.stopPropagation(); }}>\n {\n\n if (edit) {\n let colours = setting.colours;\n colours.arrow = e.hex;\n setSetting({ ...setting, colours: colours });\n } else setError(true);\n }\n }\n />\n
\n Scroll Direction
\n \n \n\n \n {\n setSetting({ ...botSettings, scrollDirection: 1 });\n }}\n checked={\n setting.scrollDirection === 1 ? true : false\n }\n />\n \n\n \n {\n setSetting({ ...botSettings, scrollDirection: 0 });\n }}\n checked={\n setting.scrollDirection === 0 ? true : false\n }\n />\n \n
\n
\n \n\n\n
\n\n\n\n\n Font Settings
\n \n \n }\n
\n \n
\n
\n {setting.fonts !== undefined && \n Website Font Name \n
\n \n
\n setFont(e.target.value)}> \n
\n \n
\n
\n \n Title Font \n
\n \n
\n setFontsList({ ...fontsList, title: e.target.value })}> \n
\n \n
\n
\n \n Subtitle Font \n
\n \n
\n setFontsList({ ...fontsList, subTitle: e.target.value })}> \n
\n \n
\n
\n \n Button Font \n
\n \n
\n setFontsList({ ...fontsList, buttonText: e.target.value })}> \n
\n \n
\n
\n \n Voucher Title Font \n
\n \n
\n setFontsList({ ...fontsList, voucherTitle: e.target.value })}> \n
\n \n
\n
\n \n Voucher Description Font \n
\n \n
\n setFontsList({ ...fontsList, voucherDescription: e.target.value })}> \n
\n \n e.target.checked === true ? setIsFooterHide(true) : setIsFooterHide(false)}\n >Hide \"Grow with aiva\"\n
\n \n e.target.checked === true ? setHideSearchTags(true) : setHideSearchTags(false)}\n >Hide Customer Search Tags\n
\n \n e.target.checked === true ? setApplyPromoCode(true) : setApplyPromoCode(false)}\n >Show \"Gift card or promo code\" option\n
\n \n e.target.checked === true ? setShowPropertyName(true) : setShowPropertyName(false)}\n >Show business name\n
\n \n {\n handleColoursReset();\n }}\n >\n Reset to default font and colors\n \n
\n \n \n \n {\n CloseColorBox();\n }}\n >\n Cancel\n \n \n
\n \n Standalone Page
\n\n \n {process.env.REACT_APP_VOUCHER_URL}/vhp?iid=\n {integration.id}&gid={getGroupID()} \n \n
\n \n \n\n setDirectLinkCopied(true)}\n >\n \n Copy the URL\n \n \n {directLinkCopied ?
\n Copied.
: null}\n \n Your developer teammate will receive an e-mail containing the code\n and necessary instructions to implement it.\n
\n\n
\n \n );\n })}\n \n Add Fonts\n \n handleSave()}\n >\n Save\n \n
\n {ImageGalleryButton()}\n \n Upload Fonts\n
\n\n
\n \n
\n Font Name
\n\n handleSaveName(e,m.id)}\n name=\"name\"\n />\n
\n \n
\n\n Font Link
\n\n handleSaveLink(e,m.id)}\n name=\"name\"\n />\n
\n \n togglegallery(m.id)}\n >\n Browse Fonts\n \n RemoveFonts(m.id)}\n >\n Remove Fonts\n \n
\n \n Font file is not valid. Try again after some time.\n
\n \n
\n \n
\n Redeem
\n\n setFeatures({...features,manageRedeem:primary})}\n />\n
\n \n
\n \n
\n \n setFeatures({ ...features, manageGiftCard: primary })}\n />\n
\n Manage Gift Card
\n\n setFeatures({ ...features, giftCardTopUp: primary })}\n />\n
\n \n Gift Card Top Up
\n \n
\n \n \n \n )}\n {features.manageCurrency && (\n \n )} \n
\n \n \n
\n {features.manageCurrency && (\n Multi Currency
\n\n setFeatures({...features,manageCurrency:primary})}\n />\n
\n \n Default Currency\n
\n
\n \n
\n setFeatures({...features,defaultCurrency :e.target.value})}\n >\n {currencyList.map((elem, index) => (\n \n ))}\n \n\n
\n\n \n Choose Currency\n
\n\n {currencyList.map((elem, index) => (\n \n {' '}\n \n {elem.name}({elem.code})\n \n \n ))}\n
\n
\n \n
\n \n \n )}\n {features.manageLanguages && (\n \n \n )}\n
\n \n \n
\n {features.manageLanguages && (\n Multi Languages
\n\n setFeatures({...features,manageLanguages:primary})}\n />\n
\n \n Default Language\n
\n
\n \n
\n setFeatures({...features,defaultLanguage :e.target.value})}\n >\n {languageGPT3.map((elem, index) => (\n \n ))}\n \n\n
\n\n \n Choose Languages\n
\n\n {languageGPT3.map((elem, index) => (\n \n {' '}\n \n {elem.name}\n \n \n ))}\n
\n \n
\n \n
\n \n \n \n
\n \n
\n SEO Settings
\n\n Boost your voucher store’s SEO with Meta description\n
\n\n
\n \n setSettings({ ...settings, isEnabled: primary })}\n />\n
\n \n
\n \n \n Browse favicon\n \n
\n {settings.metaTitle}
\n{process.env.REACT_APP_VOUCHER_URL}{\"/vhp/\"}{settings.ownUrl}
\n{settings.metaDescription}
\nStandard URL
\n {process.env.REACT_APP_VOUCHER_URL + \"/vhp?gid=\" + getGroupID() + \"&iid=\" + integration.id}\n \n\n \n \n \n
\n\n \n {\"https://vouchers.getaiva.com\" + \"/vhp/\"}\n
\n \n handleGoToUrl()}>Go To URL\n
\n \n\n \n \n \n \n
\n\n \n \n \n \n \n \n
\n \n \n \n \n \n
\n \n \n
\n \n Select Businesses \n
\n\n Select the businesses that are visible through this voucher store\n
\n\n
\n \n \n
\n \n Features\n
\n\n Select the features that are visible on the vouchers page\n
\n\n
\n \n \n
\n \n Social Sharing\n
\n\n Let your customers spread the world\n
\n\n
\n \n \n
\n \n Email & Attachment\n
\n\n Customize the voucher email & pdf attachment\n
\n\n
\n \n \n
\n \n Select layout\n
\n\n Select the layout that are visible through this\n integration\n
\n\n
\n \n
\n \n Appearance\n
\n\n Choose your digital assistant's name, avatar and\n setup your colours\n
\n\n
\n \n
\n \n Custom Emails\n
\n\n Select the languages for the chat widget\n
\n\n
\n \n
\n \n Custom Fonts\n
\n\n Control the fonts of aiva widget on your website\n
\n\n
\n \n
\n \n SEO Settings\n
\n\n Boost your voucher store’s SEO with Meta description\n
\n\n
\n \n
\n \n Publish your Vouchers & eGift Store\n
\n\n Get to unique URL for your Digital Store\n
\n\n
\n \n \n Preview\n \n\n
\n \n \n Archive\n \n\n
\n \n
\n \n
\n Search for a gift card
\n\n
\n Balance
\n\n${voucherData.balance}
\n\n
\n Status
\n\n {voucherData.redeem == 2 && 'Available'} {voucherData.redeem == 1 && 'Void'} {voucherData.redeem == 0 && 'Redeemed'} {voucherData.redeem == 3 && 'Refunded'}\n
\n \n
\n Item Purchased
\n{voucherData.name}
\n\n
\n Recipient
\n{voucherData.email}
\n\n {\n setRedeemType(0);\n setUpdateModal(!updateModal);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n Fully Redeem\n \n
\n \n {\n setRedeemType(1);\n setUpdateModal(!updateModal);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n Partially Redeem\n \n
\n \n {\n setRedeemType(0);\n setUpdateModal(!updateModal);\n }}\n style={{ width: '100%', borderRadius: '6px' }}\n >\n Redeem\n \n
\n \n
\n Instructions
\n\n \n \n {ReactHtmlParser(voucherData.instructions)}\n \n \n
\n \n
\n History
\n\n
\n - \n {noteList != null && noteList.length > 0 && noteList.map((m) =>\n
- \n {m.note}\n {window.innerWidth < 700 ? {m.timegap} :\n {m.timegap}}\n\n \n
Voucher Status
\n Balance: ${voucherData != undefined && voucherData.balance}\n
\n \n Balance to Redeem:{redeemType == 0 ? ${voucherData.balance} :\n {voucherData.balance > 0 ?\n {\n if(voucherData.balance - e.target.value >= 0) {\n setRedeemAmount(e.target.value);\n setError('');\n }else{\n setError('Amount should be equal or less than the Balance');\n }\n\n }} > {error !== '' && Amount should be equal or less than the Balance} \n : $0}\n }\n
\n\n \n Remaining Balance:\n ${voucherData != undefined && (voucherData.balance - redeemAmount)}
\n Are you sure you want to redeem?
\nVoucher Status
{(voucherData !== undefined && voucherData.isCard === false) ? 'Voucher is already redeemed' : 'E-Gift is already redeemed'}
\naiva
The Voucher/Gift Card Code is invalid.
\naiva
You do not have access to process this voucher, please check with your business administrator.
\n\n \n \n
\n);\nexport default Pages;\n","import React, { Component, Fragment } from \"react\";\nimport { Row } from \"reactstrap\";\nimport IntlMessages from \"../../../helpers/IntlMessages\";\nimport { Colxx, Separator } from \"../../../components/common/CustomBootstrap\";\nimport Breadcrumb from \"../../../containers/navs/Breadcrumb\";\n\nexport default class Second extends Component {\n render() {\n return (\n \n \n \n
\n);\nexport default SecondMenu;\n","import React, { Component, Fragment } from \"react\";\nimport { Row } from \"reactstrap\";\nimport IntlMessages from \"../../helpers/IntlMessages\";\nimport { Colxx, Separator } from \"../../components/common/CustomBootstrap\";\nimport Breadcrumb from \"../../containers/navs/Breadcrumb\";\n\nexport default class BlankPage extends Component {\n render() {\n return (\n {this.props.children}
\n \n
\n \n AI-POWERED DIGITAL ASSISTANT FOR HOSPITALITY\n
\n\n Please use your credentials to login.\n
\n If you are not a member, please{' '}\n
\n \n {/* */}\n \n {' '}\n \n \n \n \n
\n \n
\n
\n \n
\n {!this.state.success && (Welcome to
\nthe world of aiva
\na voucher distribution network for savvy businesses!
\n\n
\n\n
\n \n
\n \n ![](\"/static/media/aiva_logo_large.f89ed2fe.jpg\")
\n \n \n \n
)}\n {this.state.success && ( \n \n
\n \n Your password must contain
\n- \n
- Atleast 12 Characters (16 Maximum). \n
- Atleast one upper case letter. \n
- Atleast one lower case letter. \n
- Atleast one number. \n
- Atleast one of the following symbols (?=.*[@#$%^&-+=()]). \n
\n \n ![](\"/assets/img/Bmb-logo.jpg\")
\n \n \n Your account is created successfully. Now you can login to dashboard.\n window.location.href = 'https://app.getaiva.com'} className=\"btn btn-link btn-empty btn-lg active\">\n CLICK HERE\n \n \n\n\n \n
)}\n \n \n {this.state.message}\n
\n\n
\n \n a voucher distribution system for savvy tourism businesses\n
\n\n Please use your e-mail to reset your password.\n
\n\n {!this.state.process && (\n \n \n \n {' '}\n \n \n \n \n \n )}\n\n {this.state.process &&\n (this.state.loading ? (\n
\n \n
\n ) : (\n Your request is in progress
\n\n
\n ))}\n \n Your password reset email has been sent!\n
\n\n We have sent a password reset email to your email address.\n Please check your inbox/junk to continue.\n
\n\n
\n \n a voucher distribution system for savvy tourism businesses\n
\nPlease enter the new password.
\n\n {!this.state.process && (\n \n \n \n {' '}\n \n \n Reset Password\n \n \n \n this.setState(prevState => ({\n tooltip: !prevState.tooltip\n }))}\n >\n \n )}\n {this.state.process &&\n (this.state.loading ? (\n
\n ))}\n {/* {this.state.loginbutton === true && (\n \n )} */}\n \n \n
\n Your password must contain
\n- \n
- Atleast 12 Characters (16 Maximum). \n
- Atleast one upper case letter. \n
- Atleast one lower case letter. \n
- Atleast one number. \n
- Atleast one of the following symbols (?=.*[@#$%^&-+=()]). \n
=12 && this.state.password.length <=16)?'green':'red'}`}}>![](\"https://webchat.bookmebob.com/res/close_cross.png\")
Be 12 to 16 characters long
Have atleast one upper case character
Have atleast one lower case character
Have atleast one number
?\\\\])/.test(this.state.password)?'green':'red'}`}}>Have atleast one special character
\n this.onUserResetPassword()}\n >\n
\n \n \n
\n ) : (\n Your request is in progress
\n\n this.onGoLogin()}\n >\n Return to log in screen\n
{' '}\n \n Password successfully reset
\n\n You have successfully reset your password\n
\n \n {' '}\n{this.state.message}
\n\n
\n {this.state.success && (AI-POWERED DIGITAL ASSISTANT FOR HOSPITALITY
\n\n \n \n \n \n You have been unsubscribed successfully.\n \n
)}\n \n \n
\n {this.state.success && (AI-POWERED DIGITAL ASSISTANT FOR HOSPITALITY
\n\n \n \n \n \n Booking confirmed successfully.\n \n
)}\n \n \n
\n \n \n );\n};\n\nexport default React.memo(ProductListItem);\n","import React from 'react';\nimport { CardImg } from 'reactstrap';\nimport { NavLink } from 'react-router-dom';\n\nconst ProductListItemCompact = ({\n item,\n SelectedProduct,\n SelectedProductID,\n toggle,\n w,\n voucher,\n}) => {\n return (\n \n \n ) : null}\n {voucher === true ? (\n
\n \n {item.name}\n
\n\n {item.description}\n
\n {item.imageUrl !== '' && (\n\n {item.currency}\n {item.price}\n
\n ) : (\n\n
+ 5% booking commission
*/}\n\n {/*\n {item.trialDays > 0 ?\n
\n {item.currency}{item.price}/{item.frequency}\n
*/}\n\n
\n - \n {item.features.map((feature, index) => {\n return (\n
- \n
{feature.name}
\n \n );\n })}\n
\n \n SelectedProduct(\n item.productStripeId,\n item.priceStripeId,\n item.productId,\n item.pricingId\n )\n }\n >\n SUBSCRIBE\n \n \n
\n \n \n ) : null}\n\n {voucher === true ? (\n
\n \n {item.name}\n
\n\n {item.description}\n
\n {item.imageUrl !== '' && (\n\n {item.currency}\n {item.price}\n
\n ) : (\n\n
+ 5% booking commission
*/}\n\n {/*\n {item.trialDays > 0 ?\n
\n {item.currency}{item.price}/{item.frequency}\n
*/}\n\n toggle()}\n >\n COMPARE PLANS\n \n \n
\n \n \n \n );\n};\n\nexport default React.memo(ProductListItemCompact);\n","import React from \"react\";\nimport { CardImg } from \"reactstrap\";\nimport { NavLink } from \"react-router-dom\";\n\nconst Genius = ({ SelectedProduct, SelectedProductID, toggle }) => {\n const ExternalLink = () => {\n window.open('https://www.bookmebob.com/contact')\n }\n return (\n \n
\n );\n};\n\nexport default React.memo(Genius);\n","import React, { useState, createRef, useEffect, Fragment } from 'react';\nimport {\n Row,\n Card,\n CardTitle,\n Label,\n Input,\n Button,\n FormGroup,\n Modal,\n ModalBody,\n ModalHeader,\n ModalFooter,\n Spinner,\n Alert,\n CustomInput,\n} from 'reactstrap';\nimport PasswordStrengthBar from 'react-password-strength-bar';\nimport { NavLink } from 'react-router-dom';\nimport { injectIntl } from 'react-intl';\nimport { postAPI_Onboard, postAPI_EmailCheck } from '../../constants/APIs';\nimport { Colxx } from '../../components/common/CustomBootstrap';\nimport { Wizard, Steps, Step } from 'react-albus';\nimport BottomNavigation from '../../components/wizard/BottomNavigation';\nimport TopNavigation from '../../components/wizard/TopNavigation';\nimport { Formik, Form, Field } from 'formik';\nimport Select from 'react-select';\nimport country from '../../data/country';\nimport timeZoneList from '../../data/timeZoneList';\nimport currencyList from '../../data/currencyList';\nimport { reactSelectOptionDiffrentPro } from '../../helpers/Utils';\nimport { AxiosPublicAPI } from '../../helpers/AxiosAPI';\nimport queryString from 'query-string'\nimport {\n gAPI_Products_List,\n gAPI_Stripe_PromoCode,\n} from '../../constants/APIs';\nimport ProductListItem from './components/ProductListItem';\nimport ProductListItemCompact from './components/ProductListItemCompact';\nimport GeniusPlan from './components/GeniusPlan';\nimport billingCurrencyList from '../../data/billingCurrencyList';\nimport { Tooltip } from 'reactstrap';\nimport { useTable } from 'react-table';\n\nfunction SignUp() {\n const [formErrors, setFormErrors] = useState({});\n const [propertyNameToolTip, setPropertyNameToolTip] = useState(false);\n const [nameToolTip, setNameToolTip] = useState(false);\n const [emailToolTip, setEmailToolTip] = useState(false);\n const [selectZones, setSelectZones] = useState();\n const [productsList, setProductsList] = useState([]);\n const forms = [createRef(null), createRef(null), createRef(null)];\n const [bottomNavHidden, setBottomNavHidden] = useState(false);\n const [loading, setLoading] = useState(false);\n const [productVisible, setProductVisible] = useState(false);\n const [terms, setTerms] = useState(false);\n const [widthDiv, setwidthDiv] = useState('60%');\n const [propertyData, setpropertyData] = useState({\n name: '',\n website: '',\n type: 'Hotel',\n country: '',\n timeZone: '',\n firstName: '',\n lastName: '',\n email: '',\n password: '',\n confirmPassword: '',\n phoneNumber: '',\n currency: '',\n stripeProductId: '',\n stripePriceId: '',\n productId: 0,\n priceId: 0,\n billingCurrency: '',\n promoId: '',\n promoCode: '',\n data: '',\n invitationType: ''\n });\n const [isShow, setIsShow] = useState(false);\n const [passwordStrength,setPasswordStrength]=useState('');\n\n const togglePropertyNameToolTip = () => {\n setPropertyNameToolTip(!propertyNameToolTip);\n };\n const toggleNameToolTip = () => {\n setNameToolTip(!nameToolTip);\n };\n const toggleEmailToolTip = () => {\n setEmailToolTip(!emailToolTip);\n };\n const toggle = () => {\n setProductVisible(!productVisible);\n };\n\n const LoadData = (currency) => {\n AxiosPublicAPI({\n methhod: 'get',\n url: `${gAPI_Products_List}?currency=${currency}&type=Website`,\n })\n .then((res) => {\n setProductsList(res.data);\n const params = new URLSearchParams(window.location.search);\n let product = params.get('product');\n\n if (product === null) {\n if (res.data.length >= 2) {\n let product = res.data[1];\n setpropertyData({\n ...propertyData,\n stripeProductId: product.productStripeId,\n stripePriceId: product.priceStripeId,\n productId: product.productId,\n priceId: product.pricingId,\n });\n setFormErrors({\n ...formErrors,\n productId: '',\n });\n }\n } else {\n let productArr = res.data.filter(\n (item) => item.productStripeId === product\n );\n if (productArr.length > 0) {\n setpropertyData({\n ...propertyData,\n stripeProductId: productArr[0].productStripeId,\n stripePriceId: productArr[0].priceStripeId,\n productId: productArr[0].productId,\n priceId: productArr[0].pricingId,\n });\n setFormErrors({\n ...formErrors,\n productId: '',\n });\n }\n }\n\n console.log(res.data);\n setLoading(false);\n })\n .catch((err) => console.log('err', err));\n };\n const handleCheckChange = (e) => {\n setTerms(e.target.checked);\n };\n const handleChange = (e) => {\n setpropertyData({\n ...propertyData,\n [e.target.name]: e.target.value,\n });\n setFormErrors({\n ...formErrors,\n [e.target.name]: '',\n });\n };\n\n const handlePasswordChange = (password) => {\n if (password.target.value.length > 0) {\n setPasswordStrength('Weak');\n }\n if (password.target.value.length > 8 && /[0-9]+/.test(password.target.value)) {\n setPasswordStrength('Medium' );\n }\n if (password.target.value.length > 12 && /[a-z]+/.test(password.target.value) && /[0-9]+/.test(password.target.value) &&\n /[^A-Za-z0-9]+/.test(password.target.value)) {\n setPasswordStrength('Strong');\n }\n \n setpropertyData({\n ...propertyData,\n password: password.target.value,\n });\n setFormErrors({\n ...formErrors,\n password : '',\n });\n };\n\n const asyncLoading = () => {\n setLoading(true);\n // setTimeout(() => {\n // setLoading(false);\n // }, 3000);\n };\n\n async function CheckEmail(email) {\n let isValid = true;\n await AxiosPublicAPI({\n method: 'post',\n url: `${postAPI_EmailCheck}`,\n data: {\n email: propertyData.email,\n },\n })\n .then((res) => {\n console.log(res.data);\n if (res.data.exists === true) {\n isValid = false;\n //errors.email = 'Email already registered with us.'\n }\n })\n .catch((err) => console.log('err', err));\n return isValid;\n }\n const onClickNext = (goToNext, steps, step) => {\n if (steps.length - 1 <= steps.indexOf(step)) {\n return;\n }\n const formIndex = steps.indexOf(step);\n const form = forms[formIndex].current;\n console.log(formIndex);\n setFormErrors({});\n form.submitForm().then(async () => {\n let isValid = true;\n let errors = {};\n // // console.log(propertyData)\n if (formIndex == 0) {\n if (propertyData.name === '') {\n isValid = false;\n errors.name = 'Please enter property name';\n }\n if (propertyData.website === '') {\n isValid = false;\n errors.website = 'Please enter property website';\n }\n if (propertyData.country === '') {\n isValid = false;\n errors.country = 'Please select country';\n }\n }\n if (formIndex == 1) {\n if (propertyData.firstName === '') {\n isValid = false;\n errors.firstName = 'Please enter first name';\n }\n if (propertyData.lastName === '') {\n isValid = false;\n errors.lastName = 'Please enter last name';\n }\n if (propertyData.email === '') {\n isValid = false;\n errors.email = 'Please enter email';\n }\n if (propertyData.phoneNumber === '') {\n isValid = false;\n errors.phoneNumber = 'Please enter phone number';\n }\n if (propertyData.password === '') {\n isValid = false;\n errors.password = 'Please enter password';\n } else if (propertyData.password.length >= 8 || propertyData.password.length <= 16) {\n isValid = false;\n errors.password = 'Password length must be in between of 8 to 16';\n }\n if (propertyData.confirmPassword === '') {\n isValid = false;\n errors.confirmPassword = 'Please enter confirm password';\n } else if (propertyData.password !== propertyData.confirmPassword) {\n isValid = false;\n errors.confirmPassword = 'Password and confirm password should match';\n }\n\n if (propertyData.email !== '') {\n if (\n !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\\.[A-Z]{2,4}$/i.test(\n propertyData.email\n )\n ) {\n errors.email = 'Invalid email address';\n } else {\n if ((await CheckEmail(propertyData.email)) === false) {\n isValid = false;\n errors.email = 'Email already registered with us.';\n }\n }\n }\n }\n let couponId = '';\n if (formIndex == 2) {\n if (propertyData.stripeProductId === '') {\n isValid = false;\n errors.productId = 'Please subscribe to any 1 package';\n }\n if (terms === false) {\n isValid = false;\n errors.terms = 'Please accept the terms and conditions first.';\n }\n if (propertyData.promoCode !== '') {\n await AxiosPublicAPI({\n methhod: 'get',\n url: `${gAPI_Stripe_PromoCode}?code=${propertyData.promoCode}`,\n }).then((res) => {\n if (res.data.promoCodes.length > 0) {\n couponId = res.data.promoCodes[0].coupon.id;\n } else {\n isValid = false;\n errors.promo = 'Promo code is invalid/expired. Please try again.';\n }\n });\n }\n }\n console.log(isValid);\n setFormErrors(errors);\n\n if (isValid) {\n if(propertyData.password.length >=8 && propertyData.length <=16)\n {\n if (formIndex === 0) {\n LoadData(propertyData.currency);\n setwidthDiv('60%');\n } else if (formIndex === 1) {\n setwidthDiv('100%');\n }\n goToNext();\n step.isDone = true;\n if (steps.length - 2 <= steps.indexOf(step)) {\n setBottomNavHidden(true);\n asyncLoading();\n if (formIndex == 2) {\n propertyData.promoId = couponId;\n try {\n let values = window.location.href.substring(window.location.href.lastIndexOf(\"=\") + 1\n , window.location.href.length);\n if (values !== '') {\n propertyData.data = values;\n propertyData.invitationType = 'SignUp';\n localStorage.removeItem('Invitation');\n }\n } catch { }\n AxiosPublicAPI({\n method: 'post',\n url: `${postAPI_Onboard}`,\n data: propertyData,\n })\n .then((res) => {\n if (res.data.invitationId !== undefined) {\n localStorage.removeItem('Invitation');\n localStorage.setItem(\"Invitation\", res.data.invitationId);\n }\n setLoading(false);\n })\n .catch((err) => console.log('err', err));\n }\n }\n } \n else\n setIsShow(true);\n }\n });\n };\n\n const onClickPrev = (goToPrev, steps, step) => {\n setwidthDiv('60%');\n if (steps.indexOf(step) <= 0) {\n return;\n }\n goToPrev();\n };\n const SelectedProduct = (\n e,\n stripeProductId,\n stripePriceId,\n productId,\n priceId\n ) => {\n if (e.target.tagName !== 'A') {\n setpropertyData({\n ...propertyData,\n stripeProductId: stripeProductId,\n stripePriceId: stripePriceId,\n productId: productId,\n priceId: priceId,\n });\n setFormErrors({\n ...formErrors,\n productId: '',\n });\n }\n };\n\n const handleChangeSelect = (value, { name }) => {\n setFormErrors({\n ...formErrors,\n country: '',\n });\n let timeZone = '';\n let timeZones = timeZoneList.filter(\n (item) => item.IsoAlpha2 === value.value\n );\n if (timeZones.length > 0) {\n if (timeZones[0].TimeZones.length === 1) {\n timeZone = timeZones[0].TimeZones[0];\n setSelectZones(\n timeZones[0].TimeZones.map((zone) => {\n return ;\n })\n );\n } else {\n timeZone = timeZones[0].TimeZones[0];\n setSelectZones(\n timeZones[0].TimeZones.map((zone) => {\n return ;\n })\n );\n }\n }\n\n let currency = currencyList.filter(\n (item) => item.countryCode === value.value\n );\n if (currency.length > 0) {\n let billingCurrencyarr = billingCurrencyList.filter(\n (item) => item.countryCode === value.value\n );\n setpropertyData({\n ...propertyData,\n country: value.value,\n timeZone: timeZone,\n currency: currency[0].currencyCode,\n billingCurrency: billingCurrencyarr[0].currencyCode,\n });\n }\n };\n\n return (\n \n
\n \n
\n \n
\n Genius
\nCustom pricing for groups with more than 5 properties
\n\n ExternalLink()}>\n REQUEST A QUOTE\n \n \n
\n \n
*/}\n Join many other smart accommodation providers converting seamless conversions into direct bookings
\n\n Please use this form to register.\n
\n\n- \n
- Boost Sales \n
- Provide a 5-Star Guest Experience \n
- Save Costs \n
\n \n \n {' '}\n \n \n Try Chatbot on your Website & Facebook page for free\n \n
\n \n Sign up and you will get an email within 24 hrs with your\n account information\n
\n\n { }}\n >\n {({ errors, touched }) => (\n \n )}\n \n
\n \n { }}\n >\n {({ errors, touched }) => (\n \n )}\n \n
\n \n { }}\n >\n {({ errors, touched }) => (\n \n )}\n \n
\n \n {loading ? (\n
\n \n
\n ) : (\n Your request is in progress
\n\n
\n )}\n Thank You!
\n\n Your registration completed successfully!. Once\n verified, you will get notified via email.\n
\nPassword length must be in between of 8 to 16.
\n {\n let obj = productId;\n if (selectedItem.filter((f) => f === '0').length === 0) {\n if (selectedItem.filter((f) => f === '2').length > 0) {\n obj = '2' + \",\" + '0';\n obj.trim(',');\n let val = ['2', '0'];\n handleSelecteditem(val);\n handleProductId(obj);\n } else {\n obj = '0';\n obj.trim(',');\n handleProductId(obj);\n let val = ['0'];\n handleSelecteditem(val);\n }\n } else {\n if (selectedItem.filter((f) => f === '2').length > 0) {\n obj = '2';\n obj.trim(',');\n let val = ['2'];\n handleSelecteditem(val);\n handleProductId(obj);\n }else{\n handleSelecteditem([]);\n handleProductId('');\n } \n } \n }}>\n f==='0').length > 0 ?'card col-md-12 aiva-border text-center':'card col-md-12 text-center temp-border'}\n >\n
\n \n \n
\n \n }\n
\n \n Pay-As-You-Go\n
\n\n
\n Access the most important aiva’s features...\n
\n\n
7%
\n \naiva Fee per voucher transaction
\n {/*+ 5% booking commission
*/}\n {selectedItem.filter((f)=>f==='0').length > 0 &&\n
\n - \n
- \n
Everything you need to manage and distribute vouchers\n \n - \n
No setup fee, monthly fees or hidden fees\n \n - \n
Integrate your existing Stripe or PayPal account\n \n - \n
Ongoing feature updates included\n \n - \n
Invoiced end of the month for vouchers sold \n \n
{\n let obj = productId;\n if (selectedItem.filter((f) => f === '1').length === 0) {\n if (selectedItem.filter((f) => f === '2').length > 0) {\n obj = '2' + \",\" + '1';\n obj.trim(',');\n let val = ['2', '1'];\n handleSelecteditem(val);\n handleProductId(obj);\n } else {\n obj = '1';\n obj.trim(',');\n handleProductId(obj);\n let val = ['1'];\n handleSelecteditem(val);\n }\n\n } else {\n if (selectedItem.filter((f) => f === '2').length > 0) {\n obj = '2';\n obj.trim(',');\n let val = ['2'];\n handleSelecteditem(val);\n handleProductId(obj);\n }else{\n handleSelecteditem([]);\n handleProductId('');\n } \n } \n }}>\n f==='1').length > 0 ?'card col-md-12 aiva-border text-center':'card col-md-12 text-center temp-border'}\n >\n
\n \n \n
\n \n }\n
\n \n Pay-As-You-Go Gateway\n
\n\n
\n Access the most important aiva’s features...\n
\n\n
9%
\n \naiva Fee per voucher transaction
\n {/*+ 5% booking commission
*/}\n {selectedItem.filter((f)=>f==='1').length > 0 &&\n
\n - \n
- \n
Everything you need to manage and distribute vouchers\n \n - \n
No setup fee, monthly fees or hidden fees\n \n - \n
Includes payment gateway/merchant fees using stripe\n \n - \n
Ongoing feature updates included\n \n - \n
The aiva Fee is automatically deducted from the voucher transaction and the remaining balance instantly paid to you through your Stripe account.\n \n
{\n let obj = productId;\n if (selectedItem.filter((f)=>f==='2').length > 0 ) {\n let val = [];\n\n if (selectedItem.filter((f) => f === '0').length > 0) {\n handleProductId('0');\n val.push('0')\n }\n if (selectedItem.filter((f) => f === '1').length > 0) {\n handleProductId('1');\n val.push('1');\n }\n handleSelecteditem(val);\n }\n else{\n let val = selectedItem;\n val.push('2');\n handleSelecteditem(val);\n obj =obj+ \",\"+ '2';\n obj.trim(',');\n handleProductId(obj);\n }\n\n }}>\n f==='2').length > 0 ?'card col-md-12 aiva-border text-center':'card col-md-12 text-center temp-border'}\n >\n
\n \n \n \n
\n \n }\n
\n \n Pay-As-You-Go Plus\n
\n\n
\n Optional features available on top of our simple...\n
\n\n
$29/month
\n Optional\n \naiva Fee per voucher transaction
\n {/*+ 5% booking commission
*/}\n {selectedItem.filter((f)=>f==='2').length > 0 &&\n
\n - \n
- \n
Completely align appearance to your website\n \n - \n
Upload your own fonts\n \n - \n
Online redemption with integration to popular booking engines\n \n - \n
Create and print offline vouchers\n \n
\n
\n );\n};\n\nexport default React.memo(CustomPlan);\n","import React, { useState, createRef, Fragment, useEffect } from 'react';\nimport {\n Row,\n Card,\n CardTitle,\n Label,\n Input,\n Button,\n FormGroup,\n Modal,\n ModalBody,\n ModalHeader,\n ModalFooter,\n UncontrolledDropdown,\n DropdownItem,\n DropdownToggle,\n DropdownMenu,\n Spinner,\n Alert,\n InputGroupAddon,\n CustomInput,\n InputGroup,\n} from 'reactstrap';\nimport PasswordStrengthBar from 'react-password-strength-bar';\nimport ReactHtmlParser from \"react-html-parser\";\nimport aiva_logo from \"./../../assets/aiva_logo.png\";\nimport { NavLink } from 'react-router-dom';\nimport { injectIntl } from 'react-intl';\nimport { postAPI_Onboard, postAPI_EmailCheck } from '../../constants/APIs';\nimport { Colxx } from '../../components/common/CustomBootstrap';\nimport { Wizard, Steps, Step } from 'react-albus';\nimport BottomNavigation from '../../components/wizard/BottomNavigation';\nimport TopNavigation from '../../components/wizard/TopNavigation';\nimport { Formik, Form, Field } from 'formik';\nimport Select from 'react-select';\nimport country from '../../data/country';\nimport CatgeoryData from './../../data/voucherCategory.json';\nimport timeZoneList from '../../data/timeZoneList';\nimport currencyList from '../../data/currencyList';\nimport { reactSelectOptionDiffrentPro } from '../../helpers/Utils';\nimport { AxiosAPI, AxiosPublicAPI } from '../../helpers/AxiosAPI';\nimport {\n gAPI_Products_List,\n gAPI_Stripe_PromoCode,\n} from '../../constants/APIs';\nimport ProductListItem from './components/ProductListItem';\nimport ProductListItemCompact from './components/ProductListItemCompact';\nimport CustomPlan from './components/CustomPlan';\nimport billingCurrencyList from '../../data/billingCurrencyList';\nimport { Tooltip } from 'reactstrap';\nimport AivaProductListItem from './components/AivaProductListItem';\n\nfunction VoucherSignup() {\n const [selectedItem,setSelectedItem]=useState([]); \n const [tooltip, setToolTip] = useState(false);\n const [formErrors, setFormErrors] = useState({});\n const [propertyNameToolTip, setPropertyNameToolTip] = useState(false);\n const [nameToolTip, setNameToolTip] = useState(false);\n const [emailToolTip, setEmailToolTip] = useState(false);\n const [selectZones, setSelectZones] = useState();\n const [productsList, setProductsList] = useState([]);\n const forms = [createRef(null), createRef(null), createRef(null)];\n const [bottomNavHidden, setBottomNavHidden] = useState(false);\n const [loading, setLoading] = useState(false);\n const [productVisible, setProductVisible] = useState(false);\n const [terms, setTerms] = useState(false);\n const [widthDiv, setwidthDiv] = useState('120%');\n const [buttonText, setButtonText] = useState(\"Go\"); \n const [countriesData, setCountriesData] = useState([]);\n const [isload, setIsload] = useState(true);\n const [isShow, setIsShow] = useState(false); \n let [title, settitle] = useState(\"Welcome to the world of aiva: a voucher distribution network for savvy tourism businesses!\");\n let [subTitle, setSubTitle] = useState(\"Are you ready to take control of your digital marketing? It’s easy just sign up now.\");\n const [propertyData, setpropertyData] = useState({\n name: '',\n website: '',\n type: 'Accommodation',\n country: '',\n timeZone: '',\n firstName: '',\n lastName: '',\n email: '',\n password: '',\n confirmPassword: '',\n phoneNumber: '',\n currency: '',\n stripeProductId: '',\n stripePriceId: '',\n address: '',\n productId: 0,\n aivaProductId:'',\n priceId: 0,\n billingCurrency: '',\n promoId: '',\n promoCode: '',\n images: '',\n isBmb: false,\n isAiva: true\n });\n\n useEffect(() => {\n if (isload) {\n AxiosPublicAPI({\n method: 'get',\n url: `${\"https://restcountries.com/v2/all\"}`,\n })\n .then((res) => { \n setCountriesData(res.data);\n });\n }\n setIsload(false);\n }, [countriesData]);\n const handleProductId=(val)=>{\n setpropertyData({...propertyData , aivaProductId : val});\n }\n const togglePropertyNameToolTip = () => {\n setPropertyNameToolTip(!propertyNameToolTip);\n };\n const toggleNameToolTip = () => {\n setNameToolTip(!nameToolTip);\n };\n const toggleEmailToolTip = () => {\n setEmailToolTip(!emailToolTip);\n };\n const toggle = () => {\n setProductVisible(!productVisible);\n };\n\n const LoadData = (currency) => {\n AxiosPublicAPI({\n methhod: 'get',\n url: `${gAPI_Products_List}?currency=${currency}&type=Voucher`,\n })\n .then((res) => {\n setProductsList(res.data);\n const params = new URLSearchParams(window.location.search);\n let product = params.get('product');\n if (product === null) {\n if (res.data.length >= 2) {\n let product = res.data[1];\n setpropertyData({\n ...propertyData,\n stripeProductId: product.productStripeId,\n stripePriceId: product.priceStripeId,\n productId: product.productId,\n priceId: product.pricingId,\n });\n setFormErrors({\n ...formErrors,\n productId: '',\n });\n }\n } else {\n let productArr = res.data.filter(\n (item) => item.productStripeId === product\n );\n if (productArr.length > 0) {\n setpropertyData({\n ...propertyData,\n stripeProductId: productArr[0].productStripeId,\n stripePriceId: productArr[0].priceStripeId,\n productId: productArr[0].productId,\n priceId: productArr[0].pricingId,\n });\n setFormErrors({\n ...formErrors,\n productId: '',\n });\n }\n }\n\n setLoading(false);\n })\n .catch((err) => null);\n };\n const handleCheckChange = (e) => {\n setTerms(e.target.checked);\n };\n const handleChange = (e) => {\n setpropertyData({\n ...propertyData,\n [e.target.name]: e.target.value,\n });\n setFormErrors({\n ...formErrors,\n [e.target.name]: '',\n });\n };\n\n const asyncLoading = () => {\n setLoading(true);\n // setTimeout(() => {\n // setLoading(false);\n // }, 3000);\n };\n\n async function CheckEmail(email) {\n let isValid = true;\n await AxiosPublicAPI({\n method: 'post',\n url: `${postAPI_EmailCheck}`,\n data: {\n email: propertyData.email,\n },\n })\n .then((res) => {\n if (res.data.exists === true) {\n isValid = false;\n //errors.email = 'Email already registered with us.'\n }\n })\n .catch((err) => null);\n return isValid;\n }\n\n const onClickNext = (goToNext, steps, step) => {\n // settitle(\"\");\n // setSubTitle(\"\");\n const formIndex = steps.indexOf(step);\n const form = forms[formIndex].current;\n setFormErrors({});\n form.submitForm().then(async () => {\n let isValid = true;\n let errors = {};\n // // console.log(propertyData)\n if (formIndex == 0) {\n if (propertyData.name === '') {\n isValid = false;\n errors.name = 'Please enter property name';\n }\n if (propertyData.website === '') {\n isValid = false;\n errors.website = 'Please enter property website';\n }\n if (propertyData.address === '') {\n isValid = false;\n errors.address = 'Please enter business address';\n }\n if (propertyData.country === '') {\n isValid = false;\n errors.country = 'Please select country';\n }\n }\n if (formIndex == 1) {\n var passwordPattern=/^(?=.*[a-z])(?=.*[A-Z])(?=.*\\d)(?=.*[@$!%*?&])[A-Za-z\\d@$!%*?&]{12,}$/; \n if (propertyData.firstName === '') {\n isValid = false;\n errors.firstName = 'Please enter first name';\n }\n if (propertyData.lastName === '') {\n isValid = false;\n errors.lastName = 'Please enter last name';\n }\n if (propertyData.email === '') {\n isValid = false;\n errors.email = 'Please enter email';\n }\n if (propertyData.phoneNumber === '') {\n isValid = false;\n errors.phoneNumber = 'Please enter phone number';\n }\n if (propertyData.password === '') {\n isValid = false;\n errors.password = 'Please enter password';\n } else {\n if (propertyData.password.length >= 12 && propertyData.password.length <= 16 &&\n /(?=.*[A-Z])/.test(propertyData.password) && /(?=.*[a-z])/.test(propertyData.password) &&\n /(?=.*[0-9])/.test(propertyData.password) && /(?=.*[-’/`~!#*$@_%+=.,^&(){}[\\]|;:”<>?\\\\])/.test(propertyData.password)) {\n isValid = true; \n }else{\n isValid = false;\n setIsShow(true);\n }\n }\n if (propertyData.confirmPassword === '') {\n isValid = false;\n errors.confirmPassword = 'Please enter confirm password';\n } else if (propertyData.password !== propertyData.confirmPassword) {\n isValid = false;\n errors.confirmPassword = 'Password and confirm password should match';\n }\n\n if (propertyData.email !== '') {\n if (\n !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\\.[A-Z]{2,4}$/i.test(\n propertyData.email\n )\n ) {\n errors.email = 'Invalid email address';\n } else {\n if ((await CheckEmail(propertyData.email)) === false) {\n isValid = false;\n errors.email = 'Email already registered with us.';\n }\n }\n }\n }\n let couponId = '';\n if (formIndex == 2) {\n // if (propertyData.stripeProductId === '') {\n // isValid = false;\n // errors.productId = 'Please subscribe to any 1 package';\n // }\n if (terms === false) {\n isValid = false;\n errors.terms = 'Please accept the terms and conditions first.';\n }\n if(propertyData.aivaProductId ==='' || propertyData.aivaProductId ==='2' || (propertyData.aivaProductId.includes(1)===false && propertyData.aivaProductId.includes(0)===false)){\n isValid = false;\n errors.productId = 'Please select one package from Pay-As-You-Go and Pay-As-You-Go Gateway';\n }\n if (propertyData.promoCode !== '') {\n await AxiosPublicAPI({\n methhod: 'get',\n url: `${gAPI_Stripe_PromoCode}?code = ${propertyData.promoCode} `,\n }).then((res) => {\n if (res.data.promoCodes.length > 0) {\n couponId = res.data.promoCodes[0].coupon.id;\n } else {\n isValid = false;\n errors.promo = 'Promo code is invalid/expired. Please try again.';\n }\n });\n }\n }\n if (parseInt(step.id) + 1 === 1 && isValid) {\n\n settitle(\"Welcome to the world of aiva : a voucher distribution network for savvy tourism businesses!\");\n setSubTitle(\"Are you ready to take control of your digital marketing? It’s easy just sign up now.\");\n }\n if (parseInt(step.id) + 1 === 2 && isValid) {\n settitle(\"Awesome you are a step closer. Now we just need to get to know you a bit better.\");\n setSubTitle(\"\");\n }\n if (parseInt(step.id) + 1 === 3 && isValid) {\n settitle(\"Almost there, we just need to know you agree to the fine print!\"); setButtonText(\"Good to go!\")\n setSubTitle(\"\");\n }\n setFormErrors(errors);\n\n if (isValid) {\n if (formIndex === 0) {\n LoadData(propertyData.currency);\n setwidthDiv('80%');\n } else if (formIndex === 1) {\n setwidthDiv('100%');\n }\n goToNext();\n step.isDone = true;\n if (steps.length - 2 <= steps.indexOf(step)) {\n setBottomNavHidden(true);\n asyncLoading();\n if (formIndex == 2) {\n propertyData.promoId = couponId;\n try {\n let values = window.location.href.substring(window.location.href.lastIndexOf(\"=\") + 1\n , window.location.href.length);\n if (values !== '') {\n propertyData.data = values;\n propertyData.invitationType = 'SignUp';\n localStorage.removeItem('Invitation');\n }\n } catch { }\n propertyData.phoneNumber=countriesData.filter(f=>f.alpha2Code ===propertyData.country)[0].callingCodes[0] + propertyData.phoneNumber;\n AxiosPublicAPI({\n method: 'post',\n url: `${postAPI_Onboard}`,\n data: propertyData,\n })\n .then((res) => {\n\n if (res.data.invitationId !== undefined) {\n localStorage.removeItem('Invitation');\n localStorage.setItem(\"Invitation\", res.data.invitationId);\n }\n setLoading(false);\n })\n .catch((err) => null);\n }\n }\n }\n });\n };\n const onClickPrev = (goToPrev, steps, step) => {\n if (parseInt(step.id) - 1 === 1) {\n settitle(\"Welcome to the world of aiva : a voucher distribution network for savvy tourism businesses!\");\n setSubTitle(\"Are you ready to take control of your digital marketing? It’s easy just sign up now.\");\n setButtonText(\"Go\");\n }\n else if (parseInt(step.id) - 1 === 2) {\n settitle(\"Awesome you are a step closer. Now we just need to get to know you a bit better.\");\n setSubTitle(\"\");\n setButtonText(\"Go\");\n }\n else if (parseInt(step.id) - 1 === 3) {\n settitle(\"Almost there, we just need to know you agree to the fine print!\");\n setSubTitle(\"\");\n setButtonText(\"Good to go!\")\n }\n else if (parseInt(step.id) - 1 === 4) {\n settitle(\"\");\n setSubTitle(\"\");\n setButtonText(\"Good to go!\")\n }\n setwidthDiv('80%');\n if (steps.indexOf(step) <= 0) {\n return;\n }\n goToPrev();\n };\n const SelectedProduct = (\n e,\n stripeProductId,\n stripePriceId,\n productId,\n priceId\n ) => {\n if (e.target.tagName !== 'A') {\n setpropertyData({\n ...propertyData,\n stripeProductId: stripeProductId,\n stripePriceId: stripePriceId,\n productId: productId,\n priceId: priceId,\n });\n setFormErrors({\n ...formErrors,\n productId: '',\n });\n }\n };\n\n const handleChangeSelect = (value, { name }) => {\n setFormErrors({\n ...formErrors,\n country: '',\n });\n let timeZone = '';\n let timeZones = timeZoneList.filter(\n (item) => item.IsoAlpha2 === value.value\n );\n if (timeZones.length > 0) {\n if (timeZones[0].TimeZones.length === 1) {\n timeZone = timeZones[0].TimeZones[0];\n setSelectZones(\n timeZones[0].TimeZones.map((zone) => {\n return ;\n })\n );\n } else {\n timeZone = timeZones[0].TimeZones[0];\n setSelectZones(\n timeZones[0].TimeZones.map((zone) => {\n return ;\n })\n );\n }\n }\n\n let currency = currencyList.filter(\n (item) => item.countryCode === value.value\n );\n if (currency.length > 0) {\n let billingCurrencyarr = billingCurrencyList.filter(\n (item) => item.countryCode === value.value\n );\n setpropertyData({\n ...propertyData,\n country: value.value,\n timeZone: timeZone,\n currency: currency[0].currencyCode,\n billingCurrency: billingCurrencyarr[0].currencyCode,\n });\n }\n }; \n\n return (\n \n
\n \n
\n \n
\n \n Custom\n
\n\n Have unique needs and payment gateway integrations?\n
\n {/*\n ExternalLink()}\n >\n REQUEST A QUOTE\n \n \n
\n \n \n \n {' '}\n window.open(\"https://www.getaiva.com\")} width=\"150\" />{' '}\n \n \n \n {ReactHtmlParser(title.split(':')[0])}\n\n \n\n
\n {ReactHtmlParser(title.split(':')[1])}
\n \n {ReactHtmlParser(subTitle)}\n
\n \n { }}\n >\n {({ errors, touched }) => (\n \n )}\n \n
\n \n { }}\n >\n {({ errors, touched }) => (\n \n )}\n \n
\n \n { }}\n >\n {({ errors, touched }) => (\n \n )}\n \n
\n \n {loading ? (\n
\n \n
\n ) : (\n Your request is in progress
\n\n
\n )}\n Thank You!
\n\n Your aiva signup completed successfully!. Once\n verified, you will get notified via email. This could take upto 2 business days.\n
\n\n \n
\n\n Who is aiva? window.open(\"https://www.getaiva.com\")} >Learn more \n
\n Password length must be in between of 12 to 16 characters and its must have 1 upper case,\n 1 lower case, 1 digit and 1 special characters.
\n\n
\n \n a voucher distribution system for savvy tourism businesses\n
\n\n Please use your e-mail to reset your pin.\n
\n\n {!this.state.process && (\n \n \n \n {' '}\n \n \n \n \n \n )}\n\n {this.state.process &&\n (this.state.loading ? (\n
\n \n
\n ) : (\n Your request is in progress
\n\n
\n ))}\n \n Your pin reset email has been sent!\n
\n\n We have sent a pin reset email to your email address.\n Please check your inbox/junk to continue.\n
\n\n
\n \n a voucher distribution system for savvy tourism businesses\n
\nPlease enter the new password.
\n\n {!this.state.process && (\n \n \n \n {' '}\n \n \n Reset Pin\n \n \n \n \n \n )}\n {this.state.process &&\n (this.state.loading ? (\n
\n ))}\n {/* {this.state.loginbutton === true && (\n \n )} */}\n \n \n this.onUserResetPassword()}\n >\n
\n \n \n
\n ) : (\n Your request is in progress
\n\n this.onGoLogin()}\n >\n Return to log in screen\n
{' '}\n \n Pin successfully reset
\n\n You have successfully reset your pin\n
\n \n {' '}\nRedirecting...
\n \n );\n }\n}\n\nexport default connect()(CallbackPage);\n","import React, { Component, Fragment } from \"react\";\nimport { Row, Card, CardTitle,Button } from \"reactstrap\";\nimport { NavLink } from \"react-router-dom\";\nimport { Colxx } from \"../components/common/CustomBootstrap\";\nimport IntlMessages from \"../helpers/IntlMessages\";\n\n\nclass Error extends Component {\n componentDidMount() {\n document.body.classList.add(\"background\");\n }\n componentWillUnmount() {\n document.body.classList.remove(\"background\");\n }\n render() {\n return (\n \n \n \n \n \n \n
\n
\n \n
\n MAGIC IS IN THE DETAILS
\nYes, it is indeed!
\n\n \n \n \n \n \n \n
\n \n
404
\n\n \n \n \n \n \n \n \n \n
\n );\n } \n else {\n return (\n \n \n \n \n \n \n \n \n \n
\n );\n }\n }\n}\n\nconst mapStateToProps = ({ authUser, settings, oidc }) => {\n const { user: loginUser } = authUser;\n const { locale } = settings;\n return { loginUser, locale, oidc };\n};\nconst mapActionsToProps = {};\n\nconst AppStore = connect(mapStateToProps, mapActionsToProps)(App);\n\nexport default withRouter(AppStore);\n","import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport * as serviceWorker from \"./serviceWorker\";\nimport { BrowserRouter } from 'react-router-dom';\nimport { Provider } from \"react-redux\";\nimport { OidcProvider } from 'redux-oidc';\nimport store from \"./redux/store\";\nimport userManager from './helpers/userManage';\nimport * as Sentry from '@sentry/react';\nimport App from \"./App\";\nimport { AuthProvider } from \"oidc-react\";\nif (process.env.NODE_ENV === 'production') {\n Sentry.init({\n dsn: 'https://790afc4895b1c1a081fde273379018b5@o880208.ingest.sentry.io/4506556928032768',\n integrations: [\n // new Sentry.BrowserTracing({\n // // Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled\n // tracePropagationTargets: ['localhost', /^https:\\/\\/yourserver\\.io\\/api/],\n // }),\n new Sentry.Replay({\n maskAllText: false,\n blockAllMedia: false,\n }),\n ],\n // Performance Monitoring\n tracesSampleRate: 1.0, // Capture 100% of the transactions\n // Session Replay\n replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.\n replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.\n });\n}\nReactDOM.render(\n