\n {children}\n {/* {!noFooter &&
\n {title}
\n \n )\n};\n\nPageTitle.propTypes = {\n /**\n * The page title.\n */\n title: PropTypes.string,\n /**\n * The page subtitle.\n */\n subtitle: PropTypes.string,\n /**\n * The page subtitle.\n */\n showBackArrow: PropTypes.bool\n};\n\nexport default PageTitle;\n","import Chart from 'chart.js';\n\nChart.defaults.LineWithLine = Chart.defaults.line;\nChart.controllers.LineWithLine = Chart.controllers.line.extend({\n draw(ease) {\n Chart.controllers.line.prototype.draw.call(this, ease);\n\n if (this.chart.tooltip._active && this.chart.tooltip._active.length) {\n const activePoint = this.chart.tooltip._active[0];\n const { ctx } = this.chart;\n const { x } = activePoint.tooltipPosition();\n const topY = this.chart.scales['y-axis-0'].top;\n const bottomY = this.chart.scales['y-axis-0'].bottom;\n\n // Draw the line\n ctx.save();\n ctx.beginPath();\n ctx.moveTo(x, topY);\n ctx.lineTo(x, bottomY);\n ctx.lineWidth = 0.5;\n ctx.strokeStyle = '#ddd';\n ctx.stroke();\n ctx.restore();\n }\n },\n});\n\nexport default Chart;\n","import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport classNames from \"classnames\";\nimport shortid from \"shortid\";\nimport { Card, CardBody } from \"shards-react\";\n\nimport Chart from \"../../utils/chart\";\n\nclass SmallStats extends React.Component {\n constructor(props) {\n super(props);\n\n this.canvasRef = React.createRef();\n }\n\n componentDidMount() {\n const chartOptions = {\n ...{\n maintainAspectRatio: true,\n responsive: true,\n legend: {\n display: false\n },\n tooltips: {\n enabled: false,\n custom: false\n },\n elements: {\n point: {\n radius: 0\n },\n line: {\n tension: 0.33\n }\n },\n scales: {\n xAxes: [\n {\n gridLines: false,\n ticks: {\n display: false\n }\n }\n ],\n yAxes: [\n {\n gridLines: false,\n scaleLabel: false,\n ticks: {\n display: false,\n isplay: false,\n // Avoid getting the graph line cut of at the top of the canvas.\n // Chart.js bug link: https://github.com/chartjs/Chart.js/issues/4790\n // suggestedMax: Math.max(...this.props.chartData[0].data) + 1\n }\n }\n ]\n }\n },\n ...this.props.chartOptions\n };\n\n const chartConfig = {\n ...{\n type: \"line\",\n data: {\n ...{\n labels: this.props.chartLabels\n },\n ...{\n datasets: this.props.chartData\n }\n },\n options: chartOptions\n },\n ...this.props.chartConfig\n };\n\n new Chart(this.canvasRef.current, chartConfig);\n }\n\n render() {\n const { variation, label, value, percentage, increase } = this.props;\n\n const cardClasses = classNames(\n \"stats-small\",\n variation && `stats-small--${variation}`\n );\n\n const cardBodyClasses = classNames(\n variation === \"1\" ? \"p-0 d-flex\" : \"px-0 pb-0\"\n );\n\n const innerWrapperClasses = classNames(\n \"d-flex\",\n variation === \"1\" ? \"flex-column m-auto\" : \"px-3\"\n );\n\n const dataFieldClasses = classNames(\n \"stats-small__data\",\n variation === \"1\" && \"text-center\"\n );\n\n const labelClasses = classNames(\n \"stats-small__label\",\n \"text-uppercase\",\n variation !== \"1\" && \"mb-1\"\n );\n\n const valueClasses = classNames(\n \"stats-small__value\",\n \"count\",\n variation === \"1\" ? \"my-3\" : \"m-0\"\n );\n\n const innerDataFieldClasses = classNames(\n \"stats-small__data\",\n variation !== \"1\" && \"text-right align-items-center\"\n );\n\n const percentageClasses = classNames(\n \"stats-small__percentage\",\n `stats-small__percentage--${increase ? \"increase\" : \"decrease\"}`\n );\n\n const canvasHeight = variation === \"1\" ? 120 : 60;\n\n return (\n\n
\n \n {label}\n
\n {value}
\n\n {percentage}\n
\n {title}
\n{title}
\n{title}
\n{title}
\n\n {/* Avatar */}\n
\n ))}\n \n 
\n
\n\n {/* Content */}\n \n {/* Content :: Title */}\n
\n \n \n {discussion.author.name}\n {\" \"}\n on{\" \"}\n \n {discussion.post.title}\n \n - {discussion.date}\n
\n\n {/* Content :: Body */}\n {discussion.body}
\n\n {/* Content :: Actions */}\n\n \n \n \n \n \n
\n {title}
\n \n\n
\n {userDetails.name}
\n {userDetails.jobTitle}\n \n\n \n {userDetails.performanceReportTitle}\n \n \n \n {userDetails.performanceReportValue}%\n \n \n
\n {title}
\n{title}
\n{title}
\n\n
\n \n
\n 500
\nSomething went wrong!
\nThere was a problem on our end. Please try again later.
\n \n\n Custom Sliders\n
\n \n Progress Bars\n \n
\n \n \n \n @ \n \n \n\n \n {}} />\n \n @designrevision.com \n \n \n\n \n \n $ \n \n {}} />\n \n .00 \n \n \n
\n);\n\nexport default InputGroups;\n","import React from \"react\";\nimport {\n InputGroup,\n InputGroupAddon,\n InputGroupText,\n FormInput,\n Button\n} from \"shards-react\";\n\nconst SeamlessInputGroups = () => (\n \n \n \n \n person\n \n \n {}} />\n \n\n \n {}}\n />\n \n \n lock\n \n \n \n\n \n \n \n \n \n
\n);\n\nexport default SeamlessInputGroups;\n","import React from \"react\";\n\nconst CustomFileUpload = ({ className, label, onChange, disabled }) => (\n \n \n \n
\n);\n\nexport default CustomFileUpload;\n","import React from \"react\";\nimport {\n InputGroup,\n FormInput,\n Dropdown,\n DropdownToggle,\n DropdownMenu,\n DropdownItem\n} from \"shards-react\";\n\nclass DropdownInputGroups extends React.Component {\n constructor(props) {\n super(props);\n\n this.toggle = this.toggle.bind(this);\n\n this.state = {\n dropdown1: false,\n dropdown2: false\n };\n }\n\n toggle(which) {\n const newState = { ...this.state };\n newState[which] = !this.state[which];\n this.setState(newState);\n }\n\n render() {\n return (\n \n \n this.toggle(\"dropdown1\")}\n addonType=\"append\"\n >\n Dropdown \n \n Action \n Another action \n Something else here \n \n \n \n\n \n this.toggle(\"dropdown2\")}\n addonType=\"prepend\"\n >\n Dropdown \n \n Action \n Another action \n Something else here \n \n \n \n
\n );\n }\n}\n\nexport default DropdownInputGroups;\n","import React from \"react\";\nimport {\n InputGroup,\n InputGroupAddon,\n InputGroupText,\n FormSelect\n} from \"shards-react\";\n\nconst CustomSelect = () => (\n \n \n \n Options \n \n \n \n \n \n \n\n \n \n \n \n \n \n Options \n \n \n
\n);\n\nexport default CustomSelect;\n","import React from \"react\";\nimport {\n Container,\n Row,\n Col,\n Card,\n CardHeader,\n ListGroup,\n ListGroupItem,\n Form,\n Alert\n} from \"shards-react\";\n\nimport PageTitle from \"../components/common/PageTitle\";\nimport Colors from \"../components/components-overview/Colors\";\nimport Checkboxes from \"../components/components-overview/Checkboxes\";\nimport RadioButtons from \"../components/components-overview/RadioButtons\";\nimport ToggleButtons from \"../components/components-overview/ToggleButtons\";\nimport SmallButtons from \"../components/components-overview/SmallButtons\";\nimport SmallOutlineButtons from \"../components/components-overview/SmallOutlineButtons\";\nimport NormalButtons from \"../components/components-overview/NormalButtons\";\nimport NormalOutlineButtons from \"../components/components-overview/NormalOutlineButtons\";\nimport Forms from \"../components/components-overview/Forms\";\nimport FormValidation from \"../components/components-overview/FormValidation\";\nimport CompleteFormExample from \"../components/components-overview/CompleteFormExample\";\nimport Sliders from \"../components/components-overview/Sliders\";\nimport ProgressBars from \"../components/components-overview/ProgressBars\";\nimport ButtonGroups from \"../components/components-overview/ButtonGroups\";\nimport InputGroups from \"../components/components-overview/InputGroups\";\nimport SeamlessInputGroups from \"../components/components-overview/SeamlessInputGroups\";\nimport CustomFileUpload from \"../components/components-overview/CustomFileUpload\";\nimport DropdownInputGroups from \"../components/components-overview/DropdownInputGroups\";\nimport CustomSelect from \"../components/components-overview/CustomSelect\";\n\nconst ComponentsOverview = () => (\n \n \n \n How you doin'? I'm just a friendly, good-looking notification message and I come in all the colors you can see below. Pretty cool, huh?\n \n \n \n \n
\n\n \n \n \n \n\n \n \n \n
\n \n\n \n \n Small Buttons\n \n \n\n \n {/* Normal Buttons */}\n \n Normal Buttons\n \n \n\n {/* Forms & Form Validation */}\n \n \n
\n \n \n \n\n {/* Complete Form Example */}\n \n \n \n \n \n\n \n \n \n \n \n \n\n {/* Groups */}\n \n \n \n\n \n \n \n \n \n \n\n \n {/* Files & Dropdowns */}\n \n \n\n \n \n \n Custom File Upload\n \n \n \n \n \n
\n \n
\n);\n\nexport default ComponentsOverview;\n","import React from \"react\";\nimport { Container, Row, Col, Card, CardHeader, CardBody } from \"shards-react\";\n\nimport PageTitle from \"../components/common/PageTitle\";\n\nconst Tables = () => (\n Form Inputs
\nForm Example
\nSliders & Progress Bars
\nGroups
\nFiles & Dropdowns
\nActive Users
\n| \n #\n | \n\n First Name\n | \n\n Last Name\n | \n\n Country\n | \n\n City\n | \n\n Phone\n | \n
|---|---|---|---|---|---|
| 1 | \nAli | \nKerry | \nRussian Federation | \nGdańsk | \n107-0339 | \n
| 2 | \nClark | \nAngela | \nEstonia | \nBorghetto di Vara | \n1-660-850-1647 | \n
| 3 | \nJerry | \nNathan | \nCyprus | \nBraunau am Inn | \n214-4225 | \n
| 4 | \nColt | \nAngela | \nLiberia | \nBad Hersfeld | \n1-848-473-7416 | \n
Active Users
\n| \n #\n | \n\n First Name\n | \n\n Last Name\n | \n\n Country\n | \n\n City\n | \n\n Phone\n | \n
|---|---|---|---|---|---|
| 1 | \nAli | \nKerry | \nRussian Federation | \nGdańsk | \n107-0339 | \n
| 2 | \nClark | \nAngela | \nEstonia | \nBorghetto di Vara | \n1-660-850-1647 | \n
| 3 | \nJerry | \nNathan | \nCyprus | \nBraunau am Inn | \n214-4225 | \n
| 4 | \nColt | \nAngela | \nLiberia | \nBad Hersfeld | \n1-848-473-7416 | \n
\n \n Written by {post.author}\n \n
\n \n \n \n {post.title}\n \n
\n{post.body}
\n {post.date}\n\n \n Written by Anna Ken\n \n
\n \n \n \n {post.title}\n \n
\n{post.body}
\n {post.date}\n{post.title}
\n{post.body}
\n\n \n Written by James Khan\n \n
\n \n \n {post.author}\n \n {post.date}\n
\n \n \n
\n \n \n {post.title}\n \n
\n{post.body}
\ncurrentPageNumber - {currentPageNumber}
\ntotalPages - {totalPages()}
\nroute - {route}
*/}\n\n {/*
\n \n
*/}\n \n Page\n
\n \n Showing\n \n navigate_before\n {/* \n navigate_next\n {/*
\n \n {props.title}\n
\n {props.count != null ? (\n\n {toThousandFormat(props.count)}\n
\n ) : null}\n {props.showSum ? (\n\n
\n ) : null}\n {props.details != null ? (\n \n Total Value\n
\n\n {toThousandCurrencyFormat(props.sum)}\n
\n\n {props.details.map((value, index) => {\n return (\n
\n ) : null}\n \n
\n );\n })}\n \n {value.key}:\n
\n\n {toThousandFormat(value.value)}\n
\n{headerAction}
\n \n ) : null}\n No results
\n ) : null}\nError occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n \n false}\n date={state.filter.startDate} // momentPropTypes.momentObj or null,\n id=\"filterStartDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setStartDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput1} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({ focused }) => setFocusedInput1(focused)} // PropTypes.func.isRequired,\n />\n
\n \n\n \n \n false}\n date={state.filter.endDate} // momentPropTypes.momentObj or null,\n id=\"filterEndDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setEndDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput2} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({ focused }) => setFocusedInput2(focused)} // PropTypes.func.isRequired,\n />\n
\n \n\n \n {state.summary.map((summary, index) => {\n return
\n );\n };\n\n const CustomersListView = () => {\n const customers = state.customers;\n const rowNumber = index => {\n return state.filter.pageSize * state.filter.currentPage - state.filter.pageSize + (index + 1);\n };\n\n return (\n \n
\n \n setFeedback(e.target.value)}/>\n
\n );\n } else {\n return \n \n
\n\n \n
\n \n );\n }\n\n return null\n})\n\nexport default ConfirmationDialog;\n\n\n\n// export default {\n// }\n// \n// \n\n // Entering: \"ease-out duration-300\"\n // From: \"opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95\"\n // To: \"opacity-100 translate-y-0 sm:scale-100\"\n // Leaving: \"ease-in duration-200\"\n // From: \"opacity-100 translate-y-0 sm:scale-100\"\n // To: \"opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95\"\n","import React, {useEffect, useRef} from \"react\";\nimport {useParams} from \"react-router-dom\";\n\nimport {\n getCustomerSims,\n getCustomerTransactions,\n getCustomer,\n deleteCustomer,\n blockCustomer\n} from \"../../redux/customers\";\nimport {useSelector, useDispatch} from \"react-redux\";\nimport {\n toFriendlyDate,\n toInitials,\n toThousandCurrencyFormat, toTickOrCross\n} from \"../../utils/helpers\";\nimport \"react-dates/initialize\";\nimport \"react-dates/lib/css/_datepicker.css\";\nimport \"../../assets/react_dates_overrides.css\";\nimport {Button, Card, CardHeader, Col, Container, Row} from \"shards-react\";\nimport PageTitle from \"../../components/common/PageTitle\";\nimport ResponsiveTable from \"../../components/custom/ResponsiveTable\";\nimport {getSims, setCurrentPage} from \"../../redux/sims\";\nimport ConfirmationDialog from \"../../components/custom/ConfirmationDialog\";\nimport {sendMessage} from \"../../redux/messages\";\n\nconst CustomerProfile = () => {\n const state = useSelector(state => state.customers);\n const dispatch = useDispatch();\n const param = useParams();\n const dialogRef = useRef();\n\n\n useEffect(() => {\n dispatch(getCustomer(param.id));\n dispatch(getCustomerSims(param.id));\n dispatch(getCustomerTransactions(param.id));\n }, []);\n\n// const renderView = () => {\n// if (state.viewState === viewStates.ERROR) {\n// return \n {message}\n\n {renderInput()}\n\n
\n \n {title}\n
\n\n \n {negativeText}\n \n \n {positiveText}\n \n
\n Error occurred
;\n// } else if (state.viewState === viewStates.RETRIEVED) {\n// returnKYC Level {KYCLevel(customer.kycLevel)}
\n\n
\n \n Email\n
\n\n {toTickOrCross(customer.isEmailVerified)}\n
\n\n
\n \n NIN\n
\n\n {toTickOrCross(customer.isNinVerified)}\n
\n\n
\n \n Selfie\n
\n\n {toTickOrCross(customer.isSelfieVerified)}\n
\n\n
\n \n Docs\n
\n\n {toTickOrCross(customer.isDocumentsVerified)}\n
\n\n
\n \n Identity\n
\n\n {toTickOrCross(customer.isPersonalDetailsVerified)}\n
\n\n
\n \n \n BVN\n
\n\n {toTickOrCross(customer.isBvnVerified)}\n
\n\n \n {status}\n \n {isBlocked &&
\n );\n }\n\n const ProfileCard = () => {\n const customer = state.customer;\n\n return (\n \n by {admin} on {toFriendlyDate(date)}
{reason}\n
}\n {reason}\n
{customer.firstName} {customer.lastName}
\n {customer.email}\n {customer.userName}\n {UserStatus(customer.profileStatusDescription, customer.lastStatusUpdateReason, customer.lastStatusUpdateDate, customer.lastStatusUpdateBy)}\n\n
\n \n Registered on\n
\n\n {toFriendlyDate(customer.registrationDate)}\n
\n\n
\n \n \n Active Sims\n
\n\n {customer.activeSims}\n
\nError occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n {/* {JSON.stringify(state.filter.profileStatus)} */}\n dispatch(setSimStatus(e.target.value))}>\n \n \n \n \n \n\n {\n dispatch(setCurrentPage(1));\n handleRouteChange(1);\n dispatch(getSims());\n }}\n >\n Filter\n \n
\n );\n };\n\n const SimsListView = () => {\n const sims = state.sims;\n const rowNumber = index => {\n return state.filter.pageSize * state.filter.currentPage - state.filter.pageSize + (index + 1);\n };\n\n return (\n \n \n dispatch(setSearchText(e.target.value))}\n />\n
\n \n \n false}\n date={state.filter.startDate} // momentPropTypes.momentObj or null,\n id=\"filterStartDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setStartDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput1} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({ focused }) => setFocusedInput1(focused)} // PropTypes.func.isRequired,\n />\n
\n \n \n false}\n date={state.filter.endDate} // momentPropTypes.momentObj or null,\n id=\"filterEndDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setEndDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput2} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({ focused }) => setFocusedInput2(focused)} // PropTypes.func.isRequired,\n />\n
\n NO Transaction History Available
\n \nTransaction History
\n \n\n \n
\n
\n ))}\n \n \n
\n \n
\n
\n Error occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n \n\n \n
\n\n \n dispatch(setMinValue(e.target.value))}\n />\n dispatch(setMaxValue(e.target.value))}\n />\n
\n\n \n\n \n \n \n
\n \n false}\n date={state.filter.startDate} // momentPropTypes.momentObj or null,\n id=\"filterStartDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setStartDate(date))\n }} // PropTypes.func.isRequired,\n focused={focusedInput1} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({ focused }) => setFocusedInput1(focused)} // PropTypes.func.isRequired,\n />\n\n false}\n date={state.filter.endDate} // momentPropTypes.momentObj or null,\n id=\"filterEndDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setEndDate(date))\n }} // PropTypes.func.isRequired,\n focused={focusedInput2} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({ focused }) => setFocusedInput2(focused)} // PropTypes.func.isRequired,\n />\n
\n \n\n {recipientPhoneNumber};\n } else if (transactionType === 9) {\n return (\n \n {recipientBank}
{recipientAccountNumber}\n \n );\n } else if (transactionType === 12) {\n return (\n \n {partner}
{partnerCustomerId}\n \n );\n } else return \"-\";\n };\n\n return (\n
{transaction.senderPhoneNumber}
\n confirmOverride(transaction.id)}\n >\n OVERRIDE\n \n
\n ) : null}\n \n {state.summary.map((summary, index) => {\n return (\n
\n );\n };\n\n const statusStyle = status => {\n let result;\n if ([4, 8, 9, 13, 14].includes(status)) {\n result = {\n color: \"#ca4945\",\n backgroundColor: \"rgba(202,73,69,0.14)\"\n };\n } else if ([12].includes(status)) {\n result = {\n color: \"#a4a4a4\",\n backgroundColor: \"rgba(186,186,186,0.14)\"\n };\n } else if ([1, 6].includes(status)) {\n result = {\n color: \"#f9c012\",\n backgroundColor: \"rgba(249,192,18,0.14)\"\n };\n } else if (status === 3) {\n result = {\n color: \"#1ac086\",\n backgroundColor: \"rgba(26,192,134,0.1)\"\n };\n } else {\n result = {\n color: \"#377ff7\",\n backgroundColor: \"rgba(55,127,247,0.1)\"\n };\n }\n\n return result;\n };\n\n const TransactionDetail = () => {\n const getSelection = () => {\n const type = selectedTransaction.transactionType;\n if (type === 2) {\n return (\n \n \n {selectedTransaction.recipientNetwork}\n
\n {selectedTransaction.recipientPhoneNumber}\n \n
\n \n {selectedTransaction.senderNetwork}\n
\n {selectedTransaction.senderPhoneNumber}\n {\" \"}\n to\n \n {selectedTransaction.recipientNetwork}\n
\n {selectedTransaction.recipientPhoneNumber}\n \n
\n \n {selectedTransaction.senderNetwork}\n
\n {selectedTransaction.senderPhoneNumber}\n {\" \"}\n to\n \n {selectedTransaction.recipientBank}\n
\n {selectedTransaction.recipientAccountNumber}\n \n
\n \n {selectedTransaction.partner}\n
\n {\" \"}\n to\n \n {selectedTransaction.recipientNetwork}\n
\n {selectedTransaction.recipientPhoneNumber}\n \n
\n \n {selectedTransaction.senderNetwork}\n
\n {selectedTransaction.senderPhoneNumber}\n {\" \"}\n to\n \n {selectedTransaction.partner}\n
\n {selectedTransaction.partnerCustomerId}\n \n
\n \n {selectedTransaction.billerCategory} / {selectedTransaction.billerName}\n \n
\n );\n }\n if (type === 14) {\n // Gift Card\n return (\n\n \n {selectedTransaction.giftCardQuantity} x {selectedTransaction.giftCard} {selectedTransaction.giftCardUnitPrice}\n
\n {selectedTransaction.giftCardQuantity} @{selectedTransaction.giftCardUnitPrice} = {selectedTransaction.giftCardValue}\n
\n (exchange rate: {selectedTransaction.exchangeRate})\n \n to\n \n {selectedTransaction.giftCardBeneficiaryEmail}\n \n
\n \n {selectedTransaction.transactionStatusDescription}\n \n
\n {selectedTransaction.transactionTypeDescription}
\n{getSelection()}
\n {}
\n \n \n
\n \n
\n \n
\n \n
\n
\n Debited
\n{toThousandCurrencyFormat(selectedTransaction.amount)}
\n \nTransferred
\n{toThousandCurrencyFormat(selectedTransaction.netAmount)}
\n \nFee
\n{toThousandCurrencyFormat(selectedTransaction.fee)}
\n \nCustomer
\n\n \n {selectedTransaction.customerName || \"-\"}\n \n
\n \nReference
\n{selectedTransaction.transactionReference || \"-\"}
\n \nInitiated on
\n{toFriendlyDate(selectedTransaction.initiatedOn) || \"-\"}
\n \n {selectedTransaction.completedOn !== \"0001-01-01T00:00:00\" ? (\nCompleted on
\n{toFriendlyDate(selectedTransaction.completedOn) || \"-\"}
\n \n ) : null}\nReceiving Gateway
\n{toReceivingGatewayLink(selectedTransaction)}
\n \nSending Gateway
\n{toSendingGatewayLink(selectedTransaction)}
\n \n\n
\n \n \n {TransactionDetail()}\n \n
\n Transaction Details
\n \nError occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n {/* {JSON.stringify(state.filter.profileStatus)} */}\n dispatch(setSearchText(e.target.value))}\n />\n dispatch(setIssueStatus(e.target.value))}>\n \n \n \n \n \n \n\n {\n dispatch(setCurrentPage(1));\n handleRouteChange(1);\n dispatch(getIssues());\n }}\n >\n Filter\n \n
\n );\n };\n\n const IssuesListView = () => {\n const issues = state.issues;\n const rowNumber = index => {\n return state.filter.pageSize * state.filter.currentPage - state.filter.pageSize + (index + 1);\n };\n\n const getIssue = issue => {\n if (issue.length > 50) {\n return issue.substring(0, 50) + \"...\";\n }\n return issue;\n };\n\n const statusIndicator = issueStatus => {\n let style;\n switch (issueStatus) {\n case 1:\n // open / unresolved => red\n style = {\n color: \"#ca4945\",\n backgroundColor: \"rgba(202,73,69,0.14)\"\n };\n break;\n case 3:\n // assigned / in-progress => orange\n style = {\n color: \"#e77816\",\n backgroundColor: \"rgba(202,116,69,0.14)\"\n }\n break;\n default:\n //resolved / closed... green\n style = {\n color: \"#1ac086\",\n backgroundColor: \"rgba(26,192,134,0.1)\"\n }\n\n }\n\n return (\n \n {status.find(x => x.value === issueStatus).text}\n \n );\n }\n\n return (\n \n \n false}\n date={state.filter.startDate} // momentPropTypes.momentObj or null,\n id=\"filterStartDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setStartDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput1} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput1(focused)} // PropTypes.func.isRequired,\n />\n
\n \n \n false}\n date={state.filter.endDate} // momentPropTypes.momentObj or null,\n id=\"filterEndDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setEndDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput2} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput2(focused)} // PropTypes.func.isRequired,\n />\n
\n \n {state.summary.map((summary, index) => {\n return ;\n })}\n
\n );\n };\n\n const handleStatusChange = async item => {\n setDropdownOpen(false);\n\n dispatch(changeIssueStatus({newStatus: item.value, issueId: selectedIssue.id}))\n .then(val => {\n dispatch(assignIssue({assignedTo: user.fullName, issueId: selectedIssue.id})).then(value => {\n if (value) {\n setSelectedStatus(item);\n setListKey(listKey + 1);\n setSummaryKey(summaryKey + 1);\n //close modal id ticket is closed\n if (item.value === 2) {\n setModalViews(({issues, form}) => ({issues: false, form: true}))\n }\n }\n }\n );\n });\n };\n\n const Detail = () => {\n const dropdownStyle = {\n backgroundColor: \"white\",\n boxShadow: \"rgba(9, 30, 66, 0.13) 0px 0px 0px 1px, rgba(9, 30, 66, 0.13) 0px 4px 11px\",\n maxWidth: \"440px\",\n minWidth: \"220px\",\n zIndex: \"400\",\n borderRadius: \"4px\",\n top: \"45px\"\n };\n\n const renderDropdown = () => {\n if (dropdownIsOpen) {\n return (\n - \n {status.map((item, index) => {\n return (\n
\n
\n \n \n {toInitials(selectedIssue.reportedBy)}\n
\n \n \n {selectedIssue.reportedBy}\n \n
\n\n setDropdownOpen(!dropdownIsOpen)}\n >\n {selectedStatus.text}\n \n \n \n \n
\n {renderDropdown()}\n \n {cleanMessage(selectedIssue.issue)}
\n \n Attachments
\n \n */}\n \n 
\n \n {/*
*/}\n \n Assigned To
\n \n Comments
\n \n \n setModalViews(({issues, form}) => ({issues: !issues, form: !form}))}>\n Add Comment\n \n
\n \n \n {cleanMessage(comment.message)}\n
\n \n \n \n
\n Error occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n {/* {JSON.stringify(state.filter.profileStatus)} */}\n dispatch(setSearchText(e.target.value))}\n />\n dispatch(setProcessingStatus(e.target.value))}\n >\n \n \n \n \n \n\n {\n dispatch(setCurrentPage(1));\n handleRouteChange(1);\n dispatch(getInwardMessages())\n }}\n >\n Filter\n \n
\n );\n };\n\n const MessagesListView = () => {\n const inwardMessages = state.inwardMessages;\n const rowNumber = index => {\n return (\n state.filter.pageSize * state.filter.currentPage -\n state.filter.pageSize +\n (index + 1)\n );\n };\n\n return (\n \n \n false}\n date={state.filter.startDate} // momentPropTypes.momentObj or null,\n id=\"filterStartDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setStartDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput1} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput1(focused)} // PropTypes.func.isRequired,\n />\n
\n \n \n false}\n date={state.filter.endDate} // momentPropTypes.momentObj or null,\n id=\"filterEndDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setEndDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput2} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput2(focused)} // PropTypes.func.isRequired,\n />\n
\n {message.server}\n
\n {state.summary.map((summary, index) => {\n return (\n
\n );\n };\n\n\n return (\n \n
\n Error occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n {/* {JSON.stringify(state.filter.profileStatus)} */}\n dispatch(setPhoneNumber(e.target.value))}\n />\n dispatch(setVerificationType(e.target.value))}\n >\n \n \n \n \n \n \n dispatch(setNetwork(e.target.value))}\n >\n \n \n \n \n \n \n \n {\n dispatch(setCurrentPage(1));\n handleRouteChange(1);\n dispatch(getOtps())\n }}\n >\n Filter\n \n
\n );\n };\n\n const OtpsListView = () => {\n const otps = state.otps;\n const rowNumber = index => {\n return (\n state.filter.pageSize * state.filter.currentPage -\n state.filter.pageSize +\n (index + 1)\n );\n };\n\n return (\n \n {state.summary.map((summary, index) => {\n return (\n
\n );\n };\n\n\n return (\n Error occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n {/* {JSON.stringify(state.filter.profileStatus)} */}\n dispatch(setSearchText(e.target.value))}\n />\n dispatch(setActivityType(e.target.value))}\n >\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n {\n dispatch(setCurrentPage(1));\n handleRouteChange(1);\n dispatch(getActivities())\n }}\n >\n Filter\n \n
\n );\n };\n\n\n const ActivitiesListView = () => {\n const activities = state.activities;\n const rowNumber = index => {\n return (\n state.filter.pageSize * state.filter.currentPage -\n state.filter.pageSize +\n (index + 1)\n );\n };\n\n return (\n \n \n false}\n date={state.filter.startDate} // momentPropTypes.momentObj or null,\n id=\"filterStartDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setStartDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput1} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput1(focused)} // PropTypes.func.isRequired,\n />\n
\n \n \n false}\n date={state.filter.endDate} // momentPropTypes.momentObj or null,\n id=\"filterEndDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setEndDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput2} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput2(focused)} // PropTypes.func.isRequired,\n />\n
\n Error occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n if (customers !== undefined) {\n returnTotal Summary
\n\n\n \n
\n \n
\n );\n };\n\n const TransactionsListView = () => {\n const transactionList = transactions.transactions;\n\n const getRecipient = ({\n transactionType,\n recipientPhoneNumber,\n recipientBank,\n recipientAccountNumber\n }) => {\n if ([2, 8, 10].includes(transactionType)) {\n return {recipientPhoneNumber};\n } else if (transactionType === 9) {\n return (\n \n {recipientAccountNumber}({recipientBank})\n \n );\n } else return \"-\";\n };\n\n if (transactionList.length === 0) {\n return (\n Today's Summary
\n\n \n
\n \n There are no transactions.\n
\n );\n }\n\n return (\n\n
\n );\n };\n\n return (\n \n Recent Transactions (last 10)\n
\n\n \n {transactionList.map((transaction, index) => {\n return (\n \n \n {index + 1}\n \n \n {toThousandCurrencyFormat(transaction.amount)}\n \n \n {toThousandCurrencyFormat(transaction.fee)}\n \n \n {transaction.transactionReference || \"-\"}\n \n \n {transaction.customerName}\n \n \n {transaction.senderPhoneNumber}\n \n \n {transaction.transactionTypeDescription}\n \n \n {getRecipient(transaction)}\n \n \n {transaction.transactionStatusDescription}\n \n \n {toFriendlyDate(transaction.initiatedOn)}\n \n \n );\n })}\n \n
\n \n \n
\n );\n }\n}\n\nexport default Input;\n","import React from \"react\";\nimport { Formik, Field } from \"formik\";\nimport * as Yup from \"yup\";\nimport { useDispatch } from \"react-redux\";\nimport Input from \"../../components/custom/Input\";\nimport Spacer from '../../components/custom/Spacer';\nimport { FormInput } from 'shards-react';\nimport { createUser } from '../../redux/backofficeUsers';\nconst UserForm = props => {\n const dispatch = useDispatch();\n\n const MyInput = ({ field, form, ...props }) => {\n return \n \n Create new user\n \n {\n handleSubmit(values);\n }}\n >\n {({ values, errors, handleSubmit }) => (\n \n )}\n \n
\n );\n};\n\nexport default UserForm;\n","import React from \"react\";\nimport { Formik, Field } from \"formik\";\nimport * as Yup from \"yup\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport Input from \"../../components/custom/Input\";\nimport Spacer from '../../components/custom/Spacer';\nimport { FormInput } from 'shards-react';\nimport { createUser, editUser } from '../../redux/backofficeUsers';\nconst UserForm = props => {\n const dispatch = useDispatch();\n const state = useSelector(state => state.backofficeUsers);\n const user = state.user;\n\n const MyInput = ({ field, form, ...props }) => {\n return \n {\n handleSubmit(values, resetForm);\n }}\n >\n {({ values, errors, handleSubmit }) => (\n \n )}\n \n
\n );\n};\n\nexport default UserForm;\n","import React from \"react\";\nimport { Formik, Field } from \"formik\";\nimport * as Yup from \"yup\";\nimport { useDispatch } from \"react-redux\";\nimport Input from \"../../components/custom/Input\";\nimport Spacer from '../../components/custom/Spacer';\nimport { FormInput } from 'shards-react';\nimport {changeUserPassword } from '../../redux/backofficeUsers';\nconst ChangeUserPasswordForm = props => {\n const dispatch = useDispatch();\n\n const MyInput = ({ field, form, ...props }) => {\n return \n Edit user\n
\n\n {\n handleSubmit(values, resetForm);\n }}\n >\n {({ values, errors, handleSubmit }) => (\n \n )}\n \n
\n );\n};\n\nexport default ChangeUserPasswordForm;\n","import React, {useEffect, useState, useRef} from \"react\";\nimport {useHistory, useParams} from \"react-router-dom\";\nimport {ToastContainer, toast, Slide} from \"react-toastify\";\nimport \"react-toastify/dist/ReactToastify.css\";\n\nimport Pagination from \"../../components/components-overview/custom/Pagination\";\nimport BusyOverlay from \"../../components/layout/BusyOverlay\";\nimport {\n getUsers,\n setCurrentPage,\n setStartDate,\n setEndDate,\n setSearchText,\n getUsersSummary,\n setProfileStatus,\n blockUser,\n unblockUser,\n editUser,\n deleteUser,\n changeUserPassword,\n getUserProfile\n} from \"../../redux/backofficeUsers\";\nimport {useSelector, useDispatch} from \"react-redux\";\nimport {viewStates} from \"../../utils/constants\";\nimport {toFriendlyDate} from \"../../utils/helpers\";\nimport \"react-dates/initialize\";\nimport {SingleDatePicker} from \"react-dates\";\nimport \"react-dates/lib/css/_datepicker.css\";\nimport \"../../assets/react_dates_overrides.css\";\nimport \"react-responsive-modal/styles.css\";\nimport {Modal} from \"react-responsive-modal\";\nimport SummaryCard from \"../../components/custom/SummaryCard\";\nimport UserForm from \"../../components/custom/UserForm\";\nimport EditUserForm from \"../../components/custom/EditUserForm\";\nimport {Button, Col, Container, FormInput, FormSelect, Row} from \"shards-react\";\nimport ConfirmationDialog from \"../../components/custom/ConfirmationDialog\";\nimport ChangeUserPasswordForm from \"../../components/custom/ChangePasswordForm\";\nimport PageTitle from \"../../components/common/PageTitle\";\nimport ResponsiveTable from \"../../components/custom/ResponsiveTable\";\nimport FilterCard from \"../../components/custom/FilterCard\";\n\nconst Users = () => {\n const state = useSelector(state => state.backofficeUsers);\n const dispatch = useDispatch();\n const history = useHistory();\n let page = state.filter.currentPage;\n const param = useParams();\n\n function handleRouteChange(pageNumber) {\n history.push(`/adminusers?page=${pageNumber}`);\n dispatch(setCurrentPage(pageNumber));\n }\n\n const [selectedUser, setSelectedUser] = useState({});\n const [focusedInput1, setFocusedInput1] = useState(false);\n const [focusedInput2, setFocusedInput2] = useState(false);\n const [userModalOpen, setUserModalOpen] = useState(false);\n const [editModalOpen, setEditModalOpen] = useState(false);\n const [changePasswordModalOpen, setChangePasswordModalOpen] = useState(false);\n const [listKey, setListKey] = useState(1);\n const [summaryKey, setSummaryKey] = useState(-1);\n const [activeIndex, setActiveIndex] = useState(-1);\n const childRef = useRef();\n\n useEffect(() => {\n dispatch(getUsersSummary());\n dispatch(getUsers());\n }, [page, listKey]);\n\n const updateKeys = () => {\n setListKey(listKey + 1);\n setSummaryKey(summaryKey - 1);\n };\n\n const handleCleanUp = () => {\n setListKey(listKey + 1);\n setSummaryKey(summaryKey - 1);\n setEditModalOpen(false);\n };\n\n const renderView = () => {\n if (state.viewState === viewStates.ERROR) {\n return \n Change user password\n
\nError occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return\n {/* {JSON.stringify(state.filter.profileStatus)} */}\n {\n dispatch(setCurrentPage(1));\n handleRouteChange(1);\n dispatch(getUsers())\n }}\n >\n Filter\n \n
\n );\n };\n\n const UsersListView = () => {\n const users = state.users;\n const rowNumber = index => {\n return (\n state.filter.pageSize * state.filter.currentPage -\n state.filter.pageSize +\n (index + 1)\n );\n };\n\n const renderDropdown = (index, user) => {\n const {id} = user;\n\n const openPasswordChangeModal = () => {\n setActiveIndex(-1);\n setChangePasswordModalOpen(true);\n setSelectedUser(user);\n };\n\n const openEditUserModal = async () => {\n setActiveIndex(-1);\n dispatch(getUserProfile(id)).then(response => {\n if (response) {\n setEditModalOpen(true);\n }\n });\n };\n\n const blockUserProfile = () => {\n setActiveIndex(-1);\n childRef.current\n .open(\"Block user\", \"Are you sure you want to block this user?\")\n .then(result => {\n if (result) {\n dispatch(blockUser(id)).then(value => {\n if (value) {\n setListKey(listKey + 1);\n setSummaryKey(summaryKey + 1);\n }\n });\n }\n });\n };\n\n const unblockUserProfile = () => {\n setActiveIndex(-1);\n childRef.current\n .open(\"Unblock user\", \"Are you sure you want to unblock this user?\")\n .then(result => {\n if (result) {\n dispatch(unblockUser(id)).then(value => {\n if (value) {\n setListKey(listKey + 1);\n setSummaryKey(summaryKey + 1);\n }\n });\n }\n });\n };\n\n const deleteUserProfile = () => {\n setActiveIndex(-1);\n childRef.current\n .open(\"Delete user\", \"Are you sure you want to delete this user?\")\n .then(result => {\n if (result) {\n dispatch(deleteUser(id)).then(value => {\n if (value) {\n setListKey(listKey + 1);\n setSummaryKey(summaryKey + 1);\n }\n });\n }\n });\n };\n\n if (activeIndex === index) {\n return (\n \n \n dispatch(setSearchText(e.target.value))}\n />\n
\n \n \n dispatch(setProfileStatus(e.target.value))}\n >\n \n \n \n \n \n \n
\n\n \n \n false}\n date={state.filter.startDate} // momentPropTypes.momentObj or null,\n id=\"filterStartDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setStartDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput1} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput1(focused)} // PropTypes.func.isRequired,\n />\n
\n \n \n false}\n date={state.filter.endDate} // momentPropTypes.momentObj or null,\n id=\"filterEndDate\" // PropTypes.string.isRequired,\n onDateChange={date => {\n dispatch(setEndDate(date));\n }} // PropTypes.func.isRequired,\n focused={focusedInput2} // PropTypes.oneOf([START_DATE, END_DATE]) or null,\n onFocusChange={({focused}) => setFocusedInput2(focused)} // PropTypes.func.isRequired,\n />\n
\n \n {state.summary.map((summary, index) => {\n return (\n
\n );\n };\n\n return (\n <>\n \n \n
\n \n setUserModalOpen(false)}\n center\n >\n setUserModalOpen(false)}\n />\n \n setChangePasswordModalOpen(false)}\n center\n >\n setChangePasswordModalOpen(false)}\n />\n \n setEditModalOpen(false)}\n center\n >\n \n \n \n
\n \n \n \n {\n handleSubmit(values, resetForm);\n }}\n >\n {({ values, errors, handleSubmit }) => (\n \n )}\n \n \n
\n );\n};\n\nexport default LoginPage;\n","import React from \"react\";\nimport { Formik, Field } from \"formik\";\nimport * as Yup from \"yup\";\nimport { useDispatch } from \"react-redux\";\nimport Spacer from \"../../components/custom/Spacer\";\nimport { FormInput } from \"shards-react\";\nimport { initiatePasswordReset } from \"../../redux/auth\";\nimport { Link } from \"react-router-dom\";\n\nconst Index = () => {\n const dispatch = useDispatch();\n\n const MyInput = ({ field, form, ...props }) => {\n return Tingtel
\n\n
\n \n );\n};\n\nexport default Index;\n","import React from \"react\";\nimport { Formik, Field } from \"formik\";\nimport * as Yup from \"yup\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport Spacer from \"../../components/custom/Spacer\";\nimport { FormInput } from \"shards-react\";\nimport { completePasswordReset } from \"../../redux/auth\";\nimport { Link } from \"react-router-dom\";\nimport { useHistory } from \"react-router-dom\";\nimport { toast } from 'react-toastify';\n\nconst PasswordReset = props => {\n const dispatch = useDispatch();\n const search = window.location.search;\n const params = new URLSearchParams(search);\n const userId = params.get(\"userId\");\n const token = params.get(\"token\");\n const history = useHistory();\n\n const MyInput = ({ field, form, ...props }) => {\n return \n
\n \n \n Tingtel\n \n
\n\n {\n handleSubmit(values, resetForm);\n }}\n >\n {({ values, errors, handleSubmit }) => (\n \n )}\n \n
\n \n Forgot password\n
\nTingtel
\n\n
\n \n );\n};\n\nexport default PasswordReset;\n","import React from \"react\";\nimport { Formik, Field } from \"formik\";\nimport * as Yup from \"yup\";\nimport { useDispatch, useSelector } from \"react-redux\";\nimport { FormInput } from 'shards-react';\nimport {changePassword } from '../../redux/auth';\n\nconst ChangePassword = props => {\n const dispatch = useDispatch();\n\n const MyInput = ({ field, form, ...props }) => {\n return \n
\n \n \n Tingtel\n \n
\n\n {\n handleSubmit(values, resetForm);\n }}\n >\n {({ values, errors, handleSubmit }) => (\n \n )}\n \n
\n \n Reset password\n
\n\n
\n );\n};\n\nexport default ChangePassword;\n","import React, {useEffect, useState, useRef} from \"react\";\nimport {useHistory, useParams} from \"react-router-dom\";\nimport {ToastContainer, toast, Slide} from \"react-toastify\";\nimport \"react-toastify/dist/ReactToastify.css\";\nimport {\n toThousandCurrencyFormat,\n toThousandFormat\n} from \"../../utils/helpers\";\n\nimport {\n getProducts\n} from \"../../redux/fees\";\n\nimport {useSelector, useDispatch} from \"react-redux\";\nimport {viewStates} from '../../utils/constants';\nimport {Col, Container, Row} from \"shards-react\";\nimport PageTitle from \"../../components/common/PageTitle\";\nimport ResponsiveTable from \"../../components/custom/ResponsiveTable\";\n\nconst Products = () => {\n const state = useSelector(state => state.fees);\n const dispatch = useDispatch();\n const history = useHistory();\n\n\n useEffect(() => {\n dispatch(getProducts());\n console.log(state);\n\n }, []);\n\n const renderView = () => {\n if (state.viewState === viewStates.ERROR) {\n return \n {\n handleSubmit(values, resetForm);\n }}\n >\n {({ values, errors, handleSubmit }) => (\n \n )}\n \n
\n \n Change password\n
\nError occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n\n returnPercentage
,\n 2:Flat
\n }\n\n const renderTable = (commissions, name, id) => {\n if (commissions.length === 0) {\n returnThere are no commissions setup for this transaction type
\n } else {\n return (\nActive
:Inactive
}\nError occurred
;\n } else if (state.viewState === viewStates.RETRIEVED) {\n return{detials.name}
\n\n
\n \n \n \n error {state.sendResult}\n
\n );\n } else if (state.viewState === viewStates.RETRIEVED && state.sendResult != null) {\n return (\n \n \n thumb_up {state.sendResult}\n
\n );\n }\n };\n\n const isNumber = (str) => {\n return /^[1-9]\\d*$/.test(str);\n }\n\n const handleSubmit = (e) => {\n e.preventDefault();\n\n let formData = new FormData();\n formData.append('Title', title);\n formData.append('Body', body);\n formData.append('RequestFeedback', requestFeedback);\n if (image != null) {\n formData.append('Image', image);\n }\n let customerIdCount = 0;\n if (customerIds != null) {\n customerIds.toString().split(/\\s*(?:[,;\\r\\n\\t]+|$)\\s*/).forEach(val => {\n val = val.trim();\n if (isNumber(val)) {\n customerIdCount++;\n formData.append('CustomerIds', val);\n }\n });\n }\n\n if (networks != null && networks.toString().length > 0) {\n networks.toString().split(',').forEach(val => {\n val = val.trim();\n if (val != null && val.length > 0) {\n formData.append('Networks', val);\n }\n });\n }\n\n let networkStr = networks != null ? networks.toString() : \"\";\n let confirmMessage = customerIdCount > 0 ? \"Send to \" + customerIdCount + \" user\" + (customerIdCount > 1 ? \"s\" : \"\") : \"Broadcast to ALL \" + networkStr + \" users\";\n\n fileSelectDisabled = true;\n dialogRef.current.open(\n confirmMessage,\n \"Are you sure you want to send?\",\n ).then(doIt => {\n if (doIt) {\n dispatch(sendMessage(formData))\n fileSelectDisabled = false;\n }\n });\n }\n\n const theme = createMuiTheme({\n palette: {\n secondary: {\n main: green[500],\n },\n },\n });\n\n const RenderForm = () => {\n return (\n \n );\n };\n\n return (\n \n \n \n \n \n \n \n \n \n \n \n \n
\n \n {props.children}\n
\n \n );\n};\n\nexport default Overlay;\n","import React from \"react\";\nimport { BrowserRouter as Router, Route, Switch } from \"react-router-dom\";\n\nimport routes from \"./routes\";\nimport withTracker from \"./withTracker\";\n\nimport \"bootstrap/dist/css/bootstrap.min.css\";\nimport \"./shards-dashboard/styles/shards-dashboards.1.1.0.min.css\";\nimport \"./assets/main.css\"\nimport \"./assets/style.css\"\nimport Overlay from './components/layout/Overlay';\nimport store from \"./redux/index\";\nimport { useSelector } from \"react-redux\";\nimport {useEffect} from \"react\"\n\nconst App = () => {\n\n\n return (\n <>\n