![\"logo\"](\"/image/logo.svg\"){kind=logo}
\n \n \n
\n \n {message}
\n \n ) : null\n}\n\n// PropTypes\nCampaignStatusLabel.propTypes = {\n message: PropTypes.string.isRequired,\n type: PropTypes.oneOf(['pending', 'running', 'cancel', 'done']).isRequired,\n size: PropTypes.oneOf(['small', 'medium', 'large']),\n}\n\nCampaignStatusLabel.defaultProps = {\n size: 'medium',\n}\n\n// Export trạng thái\nexport const campaignStatusDir = {\n pending: 'Initial',\n running: 'Running',\n cancel: 'Paused',\n done: 'Completed',\n}\n\nexport default CampaignStatusLabel\n","import { Button, IconButton, TextField, Tooltip } from \"@material-ui/core\";\nimport InputAdornment from \"@material-ui/core/InputAdornment\";\nimport Paper from \"@material-ui/core/Paper\";\nimport { makeStyles, styled } from \"@material-ui/core/styles\";\nimport Table from \"@material-ui/core/Table\";\nimport TableBody from \"@material-ui/core/TableBody\";\nimport TableCell from \"@material-ui/core/TableCell\";\nimport TableContainer from \"@material-ui/core/TableContainer\";\nimport TableHead from \"@material-ui/core/TableHead\";\nimport TablePagination from \"@material-ui/core/TablePagination\";\nimport TableRow from \"@material-ui/core/TableRow\";\nimport TableSortLabel from \"@material-ui/core/TableSortLabel\";\nimport { CheckOutlined, SortRounded } from \"@material-ui/icons\";\nimport ClearIcon from \"@material-ui/icons/Clear\";\nimport SearchIcon from \"@material-ui/icons/Search\";\nimport Pagination from \"@material-ui/lab/Pagination\";\nimport cn from \"classnames\";\nimport Flex from \"components/Flex\";\nimport { ChevronDown, FilterIcon } from \"lucide-react\";\nimport moment from \"moment\";\nimport PropTypes from \"prop-types\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { useHistory } from \"react-router-dom/cjs/react-router-dom.min\";\nimport CampaignStatusLabel from \"views/Scenario/components/CampaignStatusLabel\";\nimport types from \"../constants/types\";\nimport ButtonComponent from \"./Button\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {\n width: \"100%\"\n },\n paper: {\n width: \"100%\",\n // marginBottom: theme.spacing(2),\n boxShadow: \"0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)\",\n borderRadius: \"0px\",\n overflow: \"hidden\",\n border: \"1px solid rgb(222, 225, 230)\"\n },\n table: {\n minWidth: \"100%\"\n },\n tableHead: {\n backgroundColor: \"#F4F4F4FF\"\n },\n tableHeadCell: {\n fontWeight: \"bold\"\n },\n tableCell: {\n whiteSpace: \"nowrap\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n padding: \"12px 16px\",\n minWidth: \"150px\"\n },\n ordNumberCell: {\n width: \"80px\",\n minWidth: \"80px\"\n },\n idCell: {\n width: \"180px\",\n minWidth: \"180px\"\n },\n nameCell: {\n width: \"250px\",\n minWidth: \"250px\"\n },\n pageNameCell: {\n width: \"200px\",\n minWidth: \"200px\"\n },\n creatorCell: {\n width: \"180px\",\n minWidth: \"180px\"\n },\n dateTimeCell: {\n width: \"160px\",\n minWidth: \"160px\"\n },\n statusCell: {\n width: \"140px\",\n minWidth: \"140px\",\n \"& span\": {\n padding: \"6px 12px\",\n borderRadius: \"4px\",\n fontWeight: \"500\",\n display: \"inline-block\",\n width: \"100%\",\n textAlign: \"center\"\n }\n },\n numberCell: {\n width: \"120px\",\n minWidth: \"120px\"\n },\n copyButton: {\n padding: 4,\n \"&:hover\": {\n backgroundColor: \"rgba(0, 0, 0, 0.04)\"\n }\n },\n wrapperSearch: {\n width: 500,\n marginBottom: theme.spacing(2)\n },\n noData: {\n color: \"rgba(0,0,0,.5)\",\n fontWeight: \"bold\",\n textAlign: \"center\",\n padding: theme.spacing(3)\n },\n clickableRow: {\n cursor: \"pointer\",\n \"&:hover\": {\n backgroundColor: \"rgba(0, 0, 0, 0.04)\"\n }\n },\n actionCell: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n borderLeft: \"0.2px solid rgb(246, 239, 239)\",\n backgroundColor: \"#fafafa\",\n position: \"sticky\",\n right: 0,\n top: 0,\n zIndex: 1\n },\n actionButton: {\n background: \"none\",\n padding: 0,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n color: \"rgb(0, 123, 255)\",\n fontWeight: 600,\n transition: \"all 0.3s ease\",\n \"&:hover\": {\n backgroundColor: \"rgba(33, 150, 243, 0.2)\"\n }\n },\n actionBtnDetail: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n padding: \"6px 10px\",\n borderRadius: \"8px\"\n },\n actionTitle: {\n margin: 0,\n fontSize: \"10px !important\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\"\n },\n buttonSearch: {\n backgroundColor: \"#05AE34\",\n color: \"white\",\n padding: \"6px 16px\",\n \"&:hover\": {\n backgroundColor: \"#048A2D\"\n }\n },\n textField: {\n backgroundColor: \"#ffffff\",\n \"& .MuiOutlinedInput-root\": {}\n },\n p0: {\n padding: \"0\",\n margin: \"0\"\n },\n witdhOrd: {\n minWidth: \"140px\",\n padding: \"0 8px !important\"\n },\n f600: {\n fontWeight: 600\n },\n heightHeader: {\n height: \"52px\"\n },\n rowItem: {\n cursor: \"pointer\"\n }\n}));\n\nconst headCells = [\n {\n id: \"ord_number\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.ord_number\"\n },\n {\n id: \"id\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.campaign_id\"\n },\n {\n id: \"name\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.campaign_name\"\n },\n {\n id: \"fanpage\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.page_name\"\n },\n {\n id: \"author\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.creator\"\n },\n {\n id: \"createdAt\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.create_time\"\n },\n {\n id: \"status\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.status\"\n },\n {\n id: \"timeStart\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.start_time\"\n },\n\n {\n id: \"totalScenario\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.scenario\"\n },\n\n {\n id: \"numberCus\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.customer\"\n },\n\n {\n id: \"numberCusSuccess\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.successful_customer\"\n },\n\n {\n id: \"numberCusFailed\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.failed_customer\"\n },\n\n {\n id: \"numberCusNotSend\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.pending_customer\"\n },\n\n {\n id: \"totalMess\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.message\"\n },\n\n {\n id: \"messSuccss\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.successful_message\"\n },\n {\n id: \"messFail\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.failed_message\"\n },\n {\n id: \"messNotSend\",\n numeric: true,\n disablePadding: true,\n label: \"overall.lastest_campaign.pending_message\"\n }\n];\n\nfunction EnhancedTableHead(props) {\n const { classes, t } = props;\n\n return (\n{t(\"common.btn.sort\")}
\n \n }\n backgroundColor=\"#05AE34\"\n color=\"white\"\n handleClickButton={handleToggleSortModal}\n style={{\n minWidth: \"fit-content\",\n padding: \"6px 16px\",\n background: \"#05AE34\"\n }}\n />\n\n {openSortModal && (\n{t(\"campaign_management.name\")}
\n\n {/* name: a-z */}\n{t(\"campaign_management.time\")}
\n\n {/* newest-oldest */}\n{t(\"campaign_management.date_range\")}
\n{t(\"campaign_management.status.title\")}
\n\n {t(\"campaign_management.scenario.name\")}\n
\n\n {t(\"phone_verification.description\")}{\" \"}\n {phone}\n
\n\n {t(\"phone_verification.sample_sms\")}\n
\n{t(\"noti.otp\")}
\n )}\n\n {t(\"phone_verification.not_received_otp\")}\n
\n\n
| {t(\"overall.account_info.account_id\")}: | \n\n | \n
|---|---|
| {t(\"overall.account_info.type\")}: | \n\n {t(\"overall.account_info.\" + data?.info?.type)}\n | \n
| {t(\"overall.account_info.giftPoint\")}: | \n{data?.info?.giftPoint} | \n
| {t(\"overall.account_info.expire_date\")}: | \n\n {data?.info?.expiredAt\n ? data?.info?.expiredAt > \"2100-12-24T05:46:34.304+00:00\"\n ? t(\"overall.account_info.lifetime\")\n : moment(data.info.expiredAt).format(\"DD/MM/YYYY HH:mm\")\n : \"-\"}\n | \n
| {t(\"overall.account_info.linked_account\")}: | \n{data?.info?.numRef} | \n
| {t(\"overall.account_info.amount_customer\")}: | \n{data?.customer?.totalCus} | \n
| {t(\"overall.account_info.amount_fanpage\")}: | \n{data?.fanpage?.totalPage} | \n
\n {t(\"dashboard.no_data\")}\n
\n \n ) : (\n\n {t(\"dashboard.no_data\")}\n
\n \n ) : (\n\n {customerStatistic.totalCus}\n
\n{t(\"dashboard.male\")}
\n\n {customerStatistic.totalMale}\n
\n{t(\"dashboard.female\")}
\n\n {customerStatistic.totalFemale}\n
\n{t(\"dashboard.other\")}
\n\n {customerStatistic.totalOther}\n
\n\n {t(\"dashboard.have_phone_number\")}\n
\n\n {customerStatistic.totalHavePhone}\n
\n\n {t(\"dashboard.not_have_phone_number\")}\n
\n\n {customerStatistic.totalNotHavePhone}\n
\n{t(\"dashboard.no_data\")}
\n\n {t(\"dashboard.no_data\")}\n
\n \n ) : (\n\n {t(\"dashboard.no_data\")}\n
\n \n ) : (\n{message}
\n \n ) : null\n}\n\n// PropTypes\nCampaignStatusLabel.propTypes = {\n message: PropTypes.string.isRequired,\n type: PropTypes.oneOf(['pending', 'running', 'cancel', 'done']).isRequired,\n size: PropTypes.oneOf(['small', 'medium', 'large']),\n}\n\nCampaignStatusLabel.defaultProps = {\n size: 'medium',\n}\n\n// Export trạng thái\nexport const campaignStatusDir = {\n pending: 'Initial',\n running: 'Running',\n cancel: 'Paused',\n done: 'Completed',\n}\n\nexport default CampaignStatusLabel\n","import { CircularProgress } from '@material-ui/core'\nimport React from 'react'\n\nconst LoadingWrapper = ({ children, isOpen, style, ...res }) => {\n return (\n\n {title}\n
\n\n {t('form_collect_info.title')}{' '}\n {user.name}!\n
{' '}\n{t('form_collect_info.description')}.
\n{t('form_collect_info.helper')}
\n{t('form_collect_info.helper_2')}
\n{nameError}
\n )}\n{phoneError}
\n )}\n{emailError}
\n )}\n{countryError}
\n )}\n{proviceError}
\n )} */}\n![\"icon\"](\"/image/vn.png\")
\n )}\n {lng.label === \"English\" && (\n ![\"icon\"](\"/image/usa.png\")
\n )}\n {lng.label === \"ភាសាខ្មែរ\" && (\n ![\"icon\"](\"/image/cam.png\")
\n )}\n {lng.label}\n \n ))}\n \n \n );\n}\n\nexport default ChangeLanguage\n","import React, { useMemo } from \"react\";\nimport { makeStyles } from \"@material-ui/core/styles\";\nimport SidebarContainer from \"../Sidebar\";\nimport HeaderContainer from \"../Header\";\nimport cn from \"classnames\";\nimport { useTranslation } from \"react-i18next\";\nimport ChangeLanguage from \"components/ChangeLanguage\";\n\nconst useStyles = makeStyles((theme) => ({\n root: {},\n sidebar: {\n width: 250,\n float: \"left\",\n height: \"100vh\",\n overflowY: \"auto\",\n background: \"white\",\n position: \"fixed\",\n top: 0,\n left: 0,\n transition: \"width 0.3s ease, left 0.3s ease\",\n borderRight: \"1px solid #efefef\"\n },\n sidebarDehaze: {\n width: 60,\n float: \"left\",\n height: \"100vh\",\n overflowY: \"auto\",\n background: \"white\",\n position: \"fixed\",\n top: 0,\n left: 0,\n zIndex: 10,\n transition: \"width 0.3s ease, left 0.3s ease\",\n borderRight: \"1px solid #efefef\"\n },\n contentRight: {\n width: \"calc(100% - 250px)\",\n height: \"calc(100vh - 70px - 73px)\",\n overflow: \"auto\",\n float: \"right\",\n backgroundColor: 'white',\n // backgroundImage: \"url('image/bg-dashboard.png')\", \n backgroundSize: \"cover\",\n // paddingLeft: 15,\n // paddingRight: 15,\n marginTop: 76,\n transition: \"width 0.3s ease\"\n },\n contentRightDehaze: {\n width: \"calc(100% - 60px)\",\n height: \"calc(100vh - 70px - 73px)\",\n overflow: \"auto\",\n float: \"right\",\n // paddingLeft: 15,\n // paddingRight: 15,\n marginTop: 76,\n transition: \"width 0.3s ease\"\n },\n content: {\n paddingLeft: 15,\n paddingRight: 15,\n },\n footer: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n paddingRight: 15,\n paddingLeft: 15,\n color: \"#05ae34\",\n bottom: 0,\n width: \"calc(100% - 250px)\",\n height: \"70px\",\n background: \"#F6F9FC\",\n position: \"fixed\",\n zIndex: 99,\n transition: \"width 0.3s ease\"\n },\n footerDehaze: {\n height: 70,\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n paddingRight: 15,\n paddingLeft: 15,\n color: \"#05ae34\",\n bottom: 0,\n width: \"calc(100% - 60px)\", // Width when sidebar is collapsed\n background: \"#F6F9FC\",\n position: \"fixed\",\n zIndex: 99,\n transition: \"width 0.3s ease\"\n },\n right: {\n display: \"flex\",\n alignItems: \"center\",\n \"& a\": {\n marginLeft: 15,\n color: \"#05ae34\",\n textDecoration: \"none\"\n }\n }\n}));\n\nconst MainLayoutView = (props) => {\n const { children, dehaze } = props;\n const classes = useStyles();\n const { t, i18n } = useTranslation();\n const configPage = useMemo(() => {\n if (i18n.language?.substring(0, 2) === \"kh\") {\n return {\n page_id: \"102636822160260\",\n app_id: \"4087907114572119\"\n };\n } else {\n return {\n page_id: \"103634791744953\",\n app_id: \"4087907114572119\"\n };\n }\n }, [i18n.language]);\n\n return (\n {errors[name]?.message}
\n )}\n \n );\n};\n\nexport default BaseSelect;\n","export const FIELD_OPTIONS = [\n {\n label: \"customer_management.list.uid\",\n value: \"uid\"\n },\n {\n label: \"customer_management.list.facebook_name\",\n value: \"name\"\n },\n {\n label: \"customer_management.list.gender\",\n value: \"gender\"\n },\n {\n label: \"customer_management.list.phone\",\n value: \"phone\"\n },\n {\n label: \"customer_management.list.facebook_tag\",\n value: \"fbTags\"\n },\n {\n label: \"customer_management.list.bombot_tag\",\n value: \"bombotTags\"\n },\n // {\n // label: \"customer_management.list.pancake_tag\",\n // value: \"pancakeTags\"\n // },\n {\n label: \"customer_management.list.last_update_time\",\n value: \"lastSyncTime\"\n },\n {\n label: \"customer_management.list.last_inbox_time\",\n value: \"lastInboxTime\"\n },\n {\n label: \"customer_management.list.last_customer_inbox_time\",\n value: \"lastCustomerInboxTime\"\n }\n];\nexport const OPERATION_OPTION_NAME = [\n {\n label: \"customer_management.customer_filter.contain\",\n value: \"contain\"\n },\n {\n label: \"customer_management.customer_filter.not_contain\",\n value: \"ncontain\"\n }\n];\n\nexport const OPERATION_TAGS_OPTION = [\n {\n label: \"update.customer_filter.in\",\n value: \"in\"\n },\n {\n label: \"update.customer_filter.notin\",\n value: \"notin\"\n }\n];\n\nexport const GENDER_OPTION = [\n {\n label: \"customer_management.customer_filter.is\",\n value: \"==\"\n },\n {\n label: \"customer_management.customer_filter.is_not\",\n value: \"!=\"\n }\n];\nexport const OPERATION_OPTION = [...GENDER_OPTION, ...OPERATION_TAGS_OPTION];\n\nexport const OPERATION_TIME_OPTION = [\n {\n label: \"customer_management.customer_filter.range\",\n value: \"bw\"\n }\n];\n\nexport const OPERATION_PHONE_OPTION = [\n {\n label: \"customer_management.customer_filter.is\",\n value: \"exists\"\n }\n];\n\nexport const GENDER_OPTIONS = [\n {\n label: \"update.gender.male\",\n value: \"MALE\"\n },\n {\n label: \"update.gender.female\",\n value: \"FEMALE\"\n },\n {\n label: \"update.gender.other\",\n value: \"NEUTER\"\n }\n];\n\nexport const PHONE_OPTIONS = [\n {\n label: \"update.customer_filter.in\",\n value: \"true\"\n },\n {\n label: \"update.customer_filter.notin\",\n value: \"false\"\n }\n];\n","import React from \"react\";\nimport { TextField } from \"@material-ui/core\";\nimport { Controller } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nconst BaseInput = ({ errors, name, ...props }) => {\n const { t } = useTranslation();\n return (\n <>\n{errors[name]?.message}
\n )}\n \n );\n};\n\nexport default BaseInput;\n","import { TextField } from \"@material-ui/core\";\nimport Autocomplete from \"@material-ui/lab/Autocomplete\";\nimport React from \"react\";\nimport { Controller } from \"react-hook-form\";\nimport { useTranslation } from \"react-i18next\";\n\nconst BaseAutocomplete = ({\n errors,\n name,\n options,\n defaultValue,\n control,\n inputStyle = {},\n ...props\n}) => {\n const { t } = useTranslation();\n return (\n{value.label}
;\n }}\n value={field.value || []}\n renderInput={(params) => (\n{t(\"update.no_data\")}
\n )}\n \n\n {bombotTagData?.content?.length > 0 && (\n{t(\"common.btn.delete\")}
\n\n {selectedCount > 0\n ? `${t(\"common.btn.delete\")} (${selectedCount})`\n : t(\"common.btn.delete\")}\n
\n{t(\"update.no_data\")}
\n )}\n \n\n {!_.isNull(selectedTag) && (\n{t('common.btn.delete')}
\n{error}
\n{t('common.btn.manage_tag')}
\n{t(\"common.btn.filter_customer\")}
\n{t(\"common.btn.update_info\")}
\n \n }\n backgroundColor=\"#05AE34\"\n color=\"white\"\n disabled={_.isEmpty(fanpageSelected) ? true : false}\n handleClickButton={handleClick}\n />\n \n \n{t(\"update.no_data\")}
\n )}\n {isPagination && rows.length > 0 && (\n\n {fileNameSelected}\n
\nĐã import khách hàng!
\nThành công: {data?.updateSuccessful || 0}
\nThất bại: {data?.updateFailed || 0}
\n{messageAddTag}
\n )}\n\n {t('update.delete_tag.desc')}?\n
\n{t('common.btn.download_template')}
\n\n {t('customer_management.import_customer.description')}\n
\n\n {t('customer_management.import_customer.choose_option')}\n
\n{t('update.import_customer.loading')}
\n{t(\"update.no_data\")}
\n )}\n {isPagination && rows.length > 0 && (\n <>\n{t(\"update.error_invite\")}
\n )}\n{t(\"login.welcom_to\")}
\n\n {t(\"login.bulk_messaging_application\")}\n
\n{t(\"noti.login_error\")}
\n )}\n{t(\"login.welcom_to\")}
\n\n {t(\"login.bulk_messaging_application\")}\n
\n{t(\"noti.login_error\")}
\n )}\n\n {t(\"login.forgot_password.description\")}\n
\n {forgotPassword != null && !forgotPassword && (\n{t(\"noti.email_not_exist\")}
\n )}\n {forgotPassword != null && forgotPassword && (\n{t(\"noti.reset_password\")}
\n )}\n{t(\"common.btn.sort\")}
\n \n }\n backgroundColor=\"#05AE34\"\n color=\"white\"\n handleClickButton={handleToggleSortModal}\n style={{\n minWidth: \"fit-content\",\n padding: \"6px 16px\",\n background: \"#05AE34\"\n }}\n />\n\n {openSortModal && (\n{t(\"campaign_management.name\")}
\n\n {/* name: a-z */}\n{t(\"campaign_management.time\")}
\n\n {/* newest-oldest */}\n{t(\"campaign_management.date_range\")}
\n{t(\"campaign_management.status.title\")}
\n{t(\"update.no_data\")}
\n )} */}\n {/* {isPagination && rows.length > 0 && ( */}\n{t(\"update.no_data\")}
\n )}\n {/*{t(\"update.no_data\")}
\n )}\n \n \n\n\n {t(\"account_management.linked_account.unlink\")}\n
\n| {t(\"account_management.tab_policy_point.task\")} | \n{t(\"account_management.tab_policy_point.rewardPoints\")} | \n
|---|---|
| \n {t(\"account_management.tab_policy_point.dailyLogin\")}\n \n {t(\"account_management.tab_policy_point.logInbombot\")} | \n {t(\"account_management.tab_policy_point.pointDay\")} | \n
| \n {t(\"account_management.tab_policy_point.reviewBombot\")}\n \n {t(\"account_management.tab_policy_point.postARenew\")}\n \n {t(\"account_management.tab_policy_point.afterPosting\")}\n \n {t(\"account_management.tab_policy_point.afterPosting1\")} \n {t(\"account_management.tab_policy_point.afterPosting2\")}\n | \n {t(\"account_management.tab_policy_point.pointPost\")} | \n
| \n {t(\"account_management.tab_policy_point.spread\")}\n \n {t(\"account_management.tab_policy_point.inviteFriend\")}: https://bombot.vn/?ref={whatYouNeed?.user?.myAffId}\n \n {t(\"account_management.tab_policy_point.scroreIs\")} | \n {t(\"account_management.tab_policy_point.pointSuccessful\")} | \n
| \n {t(\"account_management.tab_policy_point.receiveRewards\")}\n \n {t(\"account_management.tab_policy_point.friendWho\")}:\n https://bombot.vn/?ref={whatYouNeed?.user?.myAffId} | \n \n {t(\"account_management.tab_policy_point.pointPayment\")}\n \n {t(\"account_management.tab_policy_point.comission\")} | \n
{t(\"account_management.service_information.giftPoint\")}: {(redeemPoints && redeemPoints.giftPoint) ? redeemPoints.giftPoint : whatYouNeed?.package?.giftPoint}
\n{t(\"account_management.tab_policy_point.choiseGift\")}
\n{nameError}
\n )}\n{phoneError}
\n )}\n{emailError}
\n )}\nvalue
}\n renderOption={(option, { selected }) => (\n <>\n{countryError}
\n )}\n {country && country !== \"Other\" && (\n{updateInfoSuccess}
\n )}\n {updateInfoError && (\n{updateInfoError}
\n )}\n\n {t(\"account_management.service_information.giftPoint\")}:{\" \"}\n {whatYouNeed?.package?.giftPoint}\n
\n\n {t(\"account_management.service_information.expire_date\")}:{\" \"}\n \n {moment(\n whatYouNeed &&\n whatYouNeed.package &&\n whatYouNeed.package.expiredAt\n ).format(\"DD/MM/YYYY HH:mm\")}\n \n
\n\n {t(\"account_management.service_information.total_mess\")}\n
\n \n {whatYouNeed &&\n whatYouNeed.package &&\n whatYouNeed.package.totalMes > 1000000000\n ? t(\"account_management.service_information.unlimited\")\n : whatYouNeed &&\n whatYouNeed.package &&\n whatYouNeed.package.totalMes}\n \n\n {t(\"account_management.service_information.sent_mess\")}\n
\n \n {whatYouNeed &&\n whatYouNeed.package &&\n whatYouNeed.package.totalSent}\n \n\n {t(\"account_management.service_information.remain_mess\")}\n
\n \n {whatYouNeed &&\n whatYouNeed.package &&\n whatYouNeed.package.type &&\n whatYouNeed.package.totalMes > 1000000000\n ? t(\"account_management.service_information.unlimited\")\n : whatYouNeed &&\n whatYouNeed.package &&\n whatYouNeed.package.totalMes -\n whatYouNeed.package.totalSent}\n \n\n {isChangePasswordSucss && (\n \n {t(\"noti.change_password\")}\n \n )}\n {!isChangePasswordSucss && (\n \n {t(\"noti.password_invalid\")}\n \n )}\n
\n )\n ) : (\n\n \n {errorPassword}\n \n
\n )}\n{copySuccess}
\n {inviteCode && inviteCode.code ? (\n\n {t(\n \"account_management.linked_account.invite_account.description\"\n )}\n
\n ) : (\n\n {messageInviteError != \"\" && messageInviteError != null\n ? messageInviteError\n : t(\"noti.limit_account\")}\n
\n![](\"/icon/Circle_Check.svg\"){kind=icon}
;\n break;\n case \"error\":\n toastStyle = {\n backgroundColor: \"#f8d7da\",\n color: \"#721c24\",\n border: \"1px solid #f5c6cb\"\n };\n icon = ![](\"/icon/Error.svg\"){kind=icon}
;\n break;\n case \"warn\":\n toastStyle = {\n backgroundColor: \"#fff3cd\",\n color: \"#CD8521\",\n border: \"1px solid #ffeeba\"\n };\n icon = ![](\"/icon/Warning.svg\"){kind=icon}
;\n break;\n default:\n toastStyle = {\n backgroundColor: \"white\",\n color: \"#757575\"\n };\n }\n\n return (\n {message}
\n![](\"/icon/Close_SM.svg\"){kind=icon}
\n \n \n );\n};\n\nexport default Toast;\n","import React, { useEffect } from \"react\";\nimport Toast from \"components/Toast\";\nimport { useDispatch } from \"react-redux\";\nimport { closeToast } from \"stores/toast/slice.toast\";\n\nconst ToastContainer = ({ toasts }) => {\n\n const dispatch = useDispatch()\n\n useEffect(() => {\n const timers = toasts.map((toast) => {\n return setTimeout(() => {\n dispatch(closeToast(toast.id));\n }, 3000); \n });\n\n return () => {\n timers.forEach((timer) => clearTimeout(timer));\n };\n }, [toasts, dispatch]);\n\n return (\n