= ({ to, children, className, type = 'primary', testId }) => {\n const classes = useStyles();\n return (\n \n {children}\n \n );\n};\n\nconst useStyles = makeStyles(theme => ({\n white: {\n color: theme.palette.background.paper,\n textDecoration: 'none'\n },\n primary: {\n color: theme.palette.primary.main,\n textDecoration: 'none',\n '&:hover': {\n color: theme.palette.primary.dark\n }\n }\n}));\n","const config = require('../buildSettings.json');\n\nconst createSeqLog = async (level: string, details: any, message: string) => {\n if (!config.REACT_APP_SEQ_SERVER_URL || !config.REACT_APP_SEQ_API_KEY || !config.REACT_APP_SEQ_ENVIRONMENT) {\n return;\n }\n\n const options = {\n Application: 'Enrollment Alliance - Dashboard',\n Environment: config.REACT_APP_SEQ_ENVIRONMENT,\n ...(details ? details.toJSON() : details) //TODO: Determine if this is going to break something in the future. We are double logging errors in certain places\n };\n try {\n const event = { '@t': new Date(), '@m': message, '@l': level, ...options };\n await fetch(`${config.REACT_APP_SEQ_SERVER_URL}/api/events/raw?clef&apiKey=${config.REACT_APP_SEQ_API_KEY}`, {\n body: JSON.stringify(event),\n method: 'POST',\n // sending the envents as no-cors otherwise we get CORS errors, still works fine https://logs.mwks.io/#/events?filter=Application%20%3D%20'CCBSS%20-%20Self%20Service'\n mode: 'no-cors',\n headers: {\n 'Content-Type': 'application/json'\n }\n });\n } catch (error) {\n //console.log(error);\n }\n};\n\nexport const logInfo = (details: any, message: string) => {\n createSeqLog('Information', details, message);\n};\n\nexport const logWarn = (details: any, message: string) => {\n createSeqLog('Warning', details, message);\n};\n\nexport const logError = (details: any, message: string) => {\n createSeqLog('Error', details, message);\n};\n","import React, { useEffect } from 'react';\nimport ReactGA from 'react-ga4';\nimport { RouteComponentProps } from 'react-router-dom';\n\nexport const withTracker = (WrappedComponent: React.ComponentType
, options = {}) => {\n const trackPage = (page: string) => {\n ReactGA.set({ page, ...options });\n ReactGA.pageview(page);\n };\n\n return (props: P) => {\n useEffect(() => {\n trackPage(props.location.pathname);\n }, [props.location.pathname]);\n\n return ;\n };\n};\n","import Axios, { Method } from 'axios';\n\nimport { logError, logInfo } from '../services';\n//let buildConfig = require('../buildSettings');\n// uncomment for hitting staging\nlet buildConfig = require('../buildSettings.json');\n\nconst axiosInstance = Axios.create({\n baseURL: `${buildConfig.REACT_APP_API_URL}/api/`\n});\n\nconst axiosRequest = async (method: Method, url: string, data: object | null, options: object, params?: any) => {\n logInfo(null, `axios.js request started: ${url}`);\n try {\n return await axiosInstance({\n method,\n url,\n ...(data ? { data } : {}),\n ...options,\n params\n });\n } catch (err) {\n logError(err, 'axios.js request failed');\n return Promise.reject(err);\n }\n};\n\n// eslint-disable-next-line import/no-anonymous-default-export\nexport default {\n get: async (url: string, options = {}, params?: any) => {\n return await axiosRequest('get', url, null, options, params);\n },\n post: async (url: string, data = {}, options = {}) => {\n return await axiosRequest('post', url, data, { ...options });\n },\n put: async (url: string, data = {}, options = {}) => {\n return await axiosRequest('put', url, data, { ...options });\n },\n patch: async (url: string, data = {}, options = {}) => {\n return await axiosRequest('patch', url, data, { ...options });\n },\n delete: async (url: string, options = {}) => {\n return await axiosRequest('delete', url, null, { ...options });\n }\n};\n","import { format, parseISO } from 'date-fns';\nimport { IBuildStep } from '../models';\n\nexport const formatInputPhoneNumber = (val: string | undefined) => {\n let number = val?.replace(/\\D/g, '').match(/(\\d{0,3})(\\d{0,3})(\\d{0,4})/);\n // taken from here, https://stackoverflow.com/questions/17651207/mask-us-phone-number-string-with-javascript\n return number && (!number[2] ? number[1] : `(${number[1]}) ${number[2]}${number[3] ? `-${number[3]}` : ''}`);\n};\n\nexport const phoneRegExp = /1?\\W*([2-9][0-8][0-9])\\W*([2-9][0-9]{2})\\W*([0-9]{4})(\\se?x?t?(\\d*))?/;\nexport const passwordRegex = new RegExp(/^(?=.*[A-Z])(?=.*[A-z])(?=.*[0-9])(?=.*[!@#$%^&*()_+\\-=[\\]{};':\"\\\\|,.<>/?])\\S{6,20}$/);\n// eslint-disable-next-line\nexport const urlRegex = /[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_\\+.~#?&//=]*)?/gi;\n\n// append https:// if the url doesn't have it\nexport const formatUrl = (text?: string, protocol: 'http' | 'https' = 'https'): string => {\n if (text && !text.startsWith('https://') && !text.startsWith('http://')) {\n return `${protocol}://${text}`;\n }\n return text;\n};\n\n/**\n * Format date into a short friendly date with time\n * @example 1/6/2020 2:00pm\n * @example 12/12/2020 12:00am\n * @param date Date | number | string\n * @returns string\n */\nexport const formatShortFriendlyDateWithTime = (date: Date | number | string, timeZone = 'EST'): string => {\n // need to append \"Z\" to the end of the date string so true UTC is reflected and we show the correct zone\n const parsedDate: Date | number | string = typeof date === 'string' ? parseISO(`${date}Z`) : date;\n // Make sure the value is a date\n var timeZoneDate = new Date(parsedDate);\n // Convert from string back to a date\n const newTimeZoneDate = new Date(timeZoneDate.toLocaleString('en-US', { timeZone: timeZone }));\n return format(newTimeZoneDate, 'L/d/yyyy h:mma');\n};\n\n/**\n * Format date string to Date\n * @example \"2020-06-09T00:00:00+00:00\" => Tue Jun 09 2020 00:00:00 GMT-0400\n * @param date string\n * @returns Date\n */\nexport const stringToDate = (date: string): Date => {\n const d = date.split('T')[0].split('-');\n // Months are 0 index so subtract 1\n return new Date(+d[0], +d[1] - 1, +d[2]);\n};\n\n/**\n * Format date\n * @example 1/6/2020\n * @example 12/12/2020\n * @param date Date | number | string\n * @returns string\n */\nexport const formatDate = (date: Date | number | string | null): string | null => {\n if (date) {\n const stringDate: Date | number = typeof date === 'string' ? stringToDate(date) : date;\n return format(stringDate, 'L/d/yyyy');\n }\n return null;\n};\n\n/**\n * Formats a string or number into USD\n * @example formatMoney(1) => $1.00\n * @example formatMoney(0) => $0.00\n * @example formatMoney('1.99') => $1.99\n * @example formatMoney('9999.99') => $9,999.99\n * @example formatMoney(undefined) => $0.00\n * @example formatMoney(null) => $0.00\n * @param value number | string | undefined | null\n * @param digits number | undefined\n * @returns string\n */\nexport const formatMoney = (value: number | string | undefined | null, digits = 2): string => {\n let amount = 0;\n\n if (value) {\n if (typeof value === 'string') {\n // strip out any commas or dollar signs so that $9,999.99 passes !isNaN test\n value = value.includes(',') || value.includes('$') ? value.replace(',', '').replace('$', '') : value;\n // make sure the string is a number\n if (!isNaN(value as unknown as number)) {\n amount = Number(value);\n }\n } else if (typeof value === 'number' && value > 0) {\n amount = value;\n }\n }\n\n // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat\n return new Intl.NumberFormat('en-US', { maximumFractionDigits: digits, minimumFractionDigits: digits, style: 'currency', currency: 'USD' }).format(amount);\n};\n\nexport const formatDueDateKey = (step: IBuildStep) => {\n // this turns this, i.e. `ProductOverview` into `productOverviewDate` to match the correct key for the\n // target date endpoint\n let key = `${step.buildStep.charAt(0).toLowerCase() + step.buildStep.slice(1)}Date`;\n\n if (step.buildStep === 'HROverview') {\n key = 'hrOverviewDate';\n }\n if (step.buildStep === 'CensusProfile') {\n key = 'censusDate';\n }\n return key;\n};\n\nexport const getBuildStepOptions = (projectType: string, steps: IBuildStep[]) => {\n // filter out product overview and hr overview for this selection\n if (projectType === 'CommunicationOnly') {\n return steps.filter(p => p.buildStep !== 'ProductOverview' && p.buildStep !== 'HROverview');\n }\n // filter out enrollment overview and hr overview and communication overview for this selection\n if (projectType === 'TechOnly') {\n return steps.filter(p => p.buildStep !== 'EnrollmentOverview' && p.buildStep !== 'HROverview' && p.buildStep !== 'Communication Overview');\n }\n // filter out communication overview and hr overview for this selection\n if (projectType === 'EnrollmentOnly') {\n return steps.filter(p => p.buildStep !== 'CommunicationOverview');\n }\n // filter out he overview for this selection\n if (projectType === 'TechAndCommunication') {\n return steps.filter(p => p.buildStep !== 'HROverview');\n }\n // filter out communication overview for this selection\n if (projectType === 'TechAndEnrollment') {\n return steps.filter(p => p.buildStep !== 'CommunicationOverview');\n }\n return steps;\n};\n\nexport const reorder = (list: any[], startIndex: number, endIndex: number) => {\n const result = Array.from(list);\n const [removed] = result.splice(startIndex, 1);\n result.splice(endIndex, 0, removed);\n\n return result;\n};\n","import { createTheme, Theme, lighten, darken } from '@mui/material/styles';\n\nconst baseFontSize = 14; // .875rem\n\nexport const theme: Theme = createTheme({\n spacing: 16, // 1rem\n palette: {\n common: {\n black: '#000',\n white: '#fff'\n },\n // type: 'light',\n primary: {\n light: lighten('#11a5c5', 0.1),\n main: '#11a5c5',\n dark: darken('#11a5c5', 0.4),\n contrastText: '#fff'\n },\n secondary: {\n light: lighten('#000', 0.1),\n main: '#000',\n dark: darken('#000', 0.4),\n contrastText: '#fff'\n },\n error: {\n main: '#A94442'\n },\n warning: {\n main: '#8A6D3B'\n },\n info: {\n main: '#31708F'\n },\n success: {\n main: '#3C763D'\n },\n background: {\n default: '#fff'\n }\n },\n typography: {\n fontFamily: 'droid-sans, sans-serif',\n fontSize: baseFontSize,\n h1: {\n fontSize: baseFontSize * 2.25,\n fontFamily: 'DinPro-Light, sans-serif'\n },\n h2: {\n fontSize: baseFontSize * 2,\n fontFamily: 'DinPro-Light, sans-serif'\n },\n h3: {\n fontSize: baseFontSize * 1.75,\n fontFamily: 'DinPro-Light, sans-serif'\n },\n h4: {\n fontSize: baseFontSize * 1.5,\n fontFamily: 'DinPro-Light, sans-serif'\n },\n h5: {\n fontSize: baseFontSize * 1.25,\n fontFamily: 'DinPro-Light, sans-serif'\n }\n }\n});\n\n// Break this out so that we can reference palette and other options\ntheme.components = {\n MuiButton: {\n defaultProps: {\n disableElevation: true\n },\n styleOverrides: {\n root: {\n borderRadius: 0\n }\n }\n },\n MuiPaper: {\n defaultProps: {\n square: true,\n elevation: 1\n }\n },\n MuiAccordion: {\n defaultProps: {\n square: true\n }\n },\n MuiRadio: {\n defaultProps: {\n color: 'primary'\n }\n },\n MuiDialog: {\n styleOverrides: {\n root: {\n borderRadius: 0\n }\n }\n },\n MuiTableCell: {\n styleOverrides: {\n head: {\n lineHeight: 1.25\n }\n }\n }\n};\n","// @ts-ignore\nimport { ThemeProvider, Theme, StyledEngineProvider } from '@mui/material/styles';\nimport React, { ReactElement } from 'react';\nimport { Router } from 'react-router-dom';\nimport { createMemoryHistory } from 'history';\nimport { render } from '@testing-library/react';\nimport { theme } from '../styles/theme';\n\n\ndeclare module '@mui/styles/defaultTheme' {\n // eslint-disable-next-line @typescript-eslint/no-empty-interface\n interface DefaultTheme extends Theme {}\n}\n\n\ninterface Props {\n children: React.ReactNode;\n}\n\nexport const renderWithProviders = (ui: ReactElement) => {\n setWindowToDesktop();\n const Providers = ({ children }: Props) => {\n return (\n \n \n {children}\n \n \n );\n };\n // @ts-ignore\n return render(ui, { wrapper: Providers });\n};\n\nexport const setWindowToDesktop = () => {\n if (process.env.NODE_ENV === 'test') {\n window.matchMedia = jest.fn().mockImplementation(query => {\n return {\n matches: true,\n media: query,\n onchange: null,\n addListener: jest.fn(), // deprecated\n removeListener: jest.fn(), // deprecated\n addEventListener: jest.fn(),\n removeEventListener: jest.fn(),\n dispatchEvent: jest.fn()\n };\n });\n }\n};\n","import { Environments } from '../models';\n\n/**\n * Get site environment (one of 'localhost' | 'dev' | 'stg' | 'prod')\n * @param {string} origin string\n * @returns {Environments} Environments\n */\nexport const getEnvironment = (): Environments => {\n const environment = window.location.href.includes('localhost') // http://localhost:5001\n ? 'localhost'\n : window.location.href.includes('dev-enrollmentalliance') // https://dev-enrollmentalliance-web01.azurewebsites.net/\n ? 'dev'\n : window.location.href.includes('stg-enrollmentalliance') // https://stg-enrollmentalliance-web01.azurewebsites.net/\n ? 'stg'\n : 'prod';\n return environment;\n};\n","import * as localForage from 'localforage';\n\n/**\n * Sets an item in local storage. NOTE: Only for use within the browser.\n * @param key string\n * @param value any\n * @returns boolean\n */\nexport const setLocalStorage = async (key: string, value: any): Promise => {\n try {\n const item = JSON.stringify(value);\n await localForage.setItem(key, item);\n return true;\n } catch (error) {\n console.error('setLocalStorage', error);\n return false;\n }\n};\n\n/**\n * Gets an item from local storage. NOTE: Only for use within the browser.\n * @param key string\n * @returns any\n */\nexport const getLocalStorage = async (key: string): Promise => {\n try {\n const item: any = await localForage.getItem(key);\n if (item) {\n const parsed = JSON.parse(item);\n return parsed;\n } else {\n return undefined;\n }\n } catch (error) {\n console.error('getLocalStorage', error);\n return undefined;\n }\n};\n\n/**\n * Removes an item from local storage. NOTE: Only for use within the browser.\n * @param key string\n * @returns boolean\n */\nexport const removeLocalStorage = async (key: string): Promise => {\n try {\n await localForage.removeItem(key);\n return true;\n } catch (error) {\n console.error('removeLocalStorage', error);\n return false;\n }\n};\n","import { isAfter } from 'date-fns';\n// helpers\nimport { getEnvironment } from './environment';\nimport { setCookie, getCookie, removeCookie } from './cookies';\nimport { setLocalStorage, removeLocalStorage, getLocalStorage } from './local-storage';\n// models\nimport { ILoginUser } from '../models';\n\n/**\n * Set user to local storage\n * @param user ILoginUser\n */\nexport const setUserLocalStorage = (user: ILoginUser | undefined): void => {\n if (user) {\n setLocalStorage(`enrollmentalliance-${getEnvironment()}-user`, user);\n }\n};\n\n/**\n * Remove user from local storage\n */\nexport const removeUserLocalStorage = async (): Promise => {\n await removeLocalStorage(`enrollmentalliance-${getEnvironment()}-user`);\n};\n\n/**\n * Get user from local storage\n */\nexport const getUserLocalStorage = async (): Promise => {\n return await getLocalStorage(`enrollmentalliance-${getEnvironment()}-user`);\n};\n\n/**\n * Set access token and refresh token cookies for a user\n * @param accessToken string\n * @param tokenExpiresAt string\n */\nexport const setUserTokenCookies = (accessToken: string, tokenExpiresAt: string): void => {\n setCookie(`enrollmentalliance-${getEnvironment()}-token`, accessToken, { expires: new Date(tokenExpiresAt) });\n};\n\n/**\n * Remove access token and refresh token cookies. Used when logging out.\n */\nexport const removeUserTokenCookies = (): void => {\n removeCookie(`enrollmentalliance-${getEnvironment()}-token`);\n};\n\n/**\n * Get user access token\n * @returns string | undefined\n */\nexport const getUserAccessTokenCookie = (): string | undefined => {\n return getCookie(`enrollmentalliance-${getEnvironment()}-token`);\n};\n\n/**\n * Check to see if a user's JWT token has expired\n * @returns boolean\n */\nexport const getIsUserExpired = (tokenExpiresAt?: string): boolean => {\n let isExpired = true;\n\n if (tokenExpiresAt) {\n const now = new Date();\n const expires = new Date(tokenExpiresAt);\n if (!isAfter(now, expires)) {\n isExpired = false;\n }\n }\n\n return isExpired;\n};\n\n/**\n * When logging a user out, remove their tokens and local storage\n */\nexport const userLogout = async () => {\n await removeUserLocalStorage();\n removeUserTokenCookies();\n};\n","import Cookies, { CookieSetOptions } from 'universal-cookie';\n\n/**\n * Set a cookie client-side.\n * @param key string\n * @param value any\n * @returns boolean\n */\nexport const setCookie = (key: string, value: any, options?: CookieSetOptions): boolean => {\n const cookies = new Cookies();\n cookies.set(key, value, { path: '/', ...options });\n return true;\n};\n\n/**\n * Get a cookie client-side.\n * @param key string\n * @returns any\n */\nexport const getCookie = (key: string): any => {\n const cookies = new Cookies();\n const cookie = cookies.get(key);\n return cookie;\n};\n\n/**\n * Remove a cookie client-side.\n * @param key string\n * @returns boolean\n */\nexport const removeCookie = (key: string, options?: CookieSetOptions): boolean => {\n const cookies = new Cookies();\n cookies.remove(key, { path: '/', ...options });\n return true;\n};\n","import React from 'react';\nimport makeStyles from '@mui/styles/makeStyles';\n\n// eslint-disable-next-line no-useless-escape\nconst passwordRegex = /^(?=.*[A-z])(?=.*[0-9])(?=.*[!@#$%^&*()_+\\-=\\[\\]{};':\"\\\\|,.<>\\/?])\\S{8,20}$/;\nexport const isValidPassword = (value: string = ''): boolean | string => passwordRegex.test(value);\nexport const PasswordRequirements = (): JSX.Element => {\n const classes = useStyles();\n return (\n <>\n Please enter a valid password\n \n - Must be between 8 and 20 characters long
\n - Must have at least one numeric character
\n - Must have at least one \"special\" character, ex: !$#@%
\n
\n \n );\n};\nconst useStyles = makeStyles(() => {\n return {\n list: {\n marginTop: 0\n }\n };\n});\n","import {\n SCHEDULING_STATUS_ENUM,\n SCHEDULING_STATUS,\n ENROLLMENT_MEETING_OUTCOME,\n ENHANCED_STATUS_FILTERS_ENUM,\n ENROLLMENT_MEETING_OUTCOME_ENUM,\n POST_ENROLLMENT_FOLLOWUP_ITEM_ENUM,\n POST_ENROLLMENT_FOLLOWUP_ITEM,\n POST_ENROLLMENT_FOLLOWUP_ITEM_PARENT,\n POST_ENROLLMENT_FOLLOWUP_ITEM_PARENT_ENUM\n} from '../models';\n\nexport const formatCountData = (enhancedFilterType, status): string => {\n if (enhancedFilterType === 'SchedulingStatus') {\n return getEmployeeStatus(status as SCHEDULING_STATUS_ENUM);\n }\n if (enhancedFilterType === 'EnrollmentMeetingOutcome') {\n return getEmployeeEnrollmentMtgStatus(status as ENROLLMENT_MEETING_OUTCOME_ENUM);\n }\n if (enhancedFilterType === 'PostEnrollmentFollowUpItem') {\n return getEmployeePostEnrollmentStatusParent(status as POST_ENROLLMENT_FOLLOWUP_ITEM_PARENT_ENUM);\n }\n};\n\nexport const getEmployeeStatus = (statusEnum: SCHEDULING_STATUS_ENUM): string => {\n if (statusEnum === 'FailedToReschedule') {\n return 'Failed to Reschedule';\n }\n\n if (statusEnum === 'NeedsToReschedule') {\n return 'Needs to Reschedule';\n }\n\n if (statusEnum === 'NotScheduled') {\n return 'Not Scheduled';\n }\n\n if (statusEnum === 'NonResponsive') {\n return 'Non-Responsive';\n }\n\n if (statusEnum === 'CancelledMeeting') {\n return 'Cancelled Meeting';\n }\n\n if (statusEnum === 'HRAssistanceNeeded') {\n return 'HR Assistance Needed';\n }\n\n return statusEnum;\n};\n\nexport const getEmployeeStatusEnum = (status: SCHEDULING_STATUS): string => {\n if (status === 'Failed to Reschedule') {\n return 'FailedToReschedule';\n }\n\n if (status === 'Needs to Reschedule') {\n return 'NeedsToReschedule';\n }\n\n if (status === 'Not Scheduled') {\n return 'NotScheduled';\n }\n\n if (status === 'Non-Responsive') {\n return 'NonResponsive';\n }\n\n if (status === 'Cancelled Meeting') {\n return 'CancelledMeeting';\n }\n if (status === 'HR Assistance Needed') {\n return 'HRAssistanceNeeded';\n }\n\n return status;\n};\n\nexport const getEmployeeEnrollmentMtgStatus = (statusEnum: ENROLLMENT_MEETING_OUTCOME_ENUM): string => {\n if (statusEnum === 'NotStarted') {\n return 'Not Started';\n }\n\n return statusEnum;\n};\n\nexport const getEmployeeEnrollmentMtgStatusEnum = (status: ENROLLMENT_MEETING_OUTCOME): string => {\n if (status === 'Cancelled Meeting') {\n return 'CancelledMeeting';\n }\n\n if (status === 'Missed Meeting') {\n return 'MissedMeeting';\n }\n\n if (status === 'Not Started') {\n return 'NotStarted';\n }\n\n if (status === 'Upcoming Meeting') {\n return 'UpcomingMeeting';\n }\n\n return status;\n};\n\nexport const getEmployeePostEnrollmentStatus = (statusEnum: POST_ENROLLMENT_FOLLOWUP_ITEM_ENUM): string => {\n if (statusEnum === 'ContactInfoInvalid') {\n return 'Limitation: Employee Contact Info Invalid';\n }\n if (statusEnum === 'EmployeeNotEligible') {\n return 'Limitation: Employee Termed or Not Eligible';\n }\n if (statusEnum === 'EmployeeNotInSystem') {\n return 'Limitation: Employee Not In System';\n }\n if (statusEnum === 'EnrolledPrior') {\n return 'Complete: Enrolled on System Prior to Benefit Meeting';\n }\n if (statusEnum === 'FurtherInfoToCollect') {\n return 'Complete: Further Info to Collect (Dep., SS, EOI)';\n }\n if (statusEnum === 'IncorrectInfo') {\n return 'Limitation: System Displaying Incorrect Rates / Products/ Info';\n }\n if (statusEnum === 'Indecisive') {\n return 'Incomplete: Indecisive / Not Prepared to Finalize Elections';\n }\n if (statusEnum === 'NoFollowUpRequired') {\n return 'Complete: No Follow Up Required';\n }\n if (statusEnum === 'NoMeetingOccurred') {\n return 'Missed Meeting: Meeting Did Not Occur';\n }\n if (statusEnum === 'RequestToReschedule') {\n return 'Incomplete: Employee Request to Reschedule';\n }\n};\n\nexport const getEmployeePostEnrollmentStatusEnum = (status: POST_ENROLLMENT_FOLLOWUP_ITEM): string => {\n if (status === 'Limitation: Employee Contact Info Invalid') {\n return 'ContactInfoInvalid';\n }\n\n if (status === 'Limitation: Employee Termed or Not Eligible') {\n return 'EmployeeNotEligible';\n }\n\n if (status === 'Limitation: Employee Not In System') {\n return 'EmployeeNotInSystem';\n }\n\n if (status === 'Complete: Enrolled on System Prior to Benefit Meeting') {\n return 'EnrolledPrior';\n }\n if (status === 'Complete: Further Info to Collect (Dep., SS, EOI)') {\n return 'FurtherInfoToCollect';\n }\n if (status === 'Limitation: System Displaying Incorrect Rates / Products/ Info') {\n return 'IncorrectInfo';\n }\n if (status === 'Incomplete: Indecisive / Not Prepared to Finalize Elections') {\n return 'Indecisive';\n }\n if (status === 'Complete: No Follow Up Required') {\n return 'NoFollowUpRequired';\n }\n if (status === 'Missed Meeting: Meeting Did Not Occur') {\n return 'NoMeetingOccurred';\n }\n if (status === 'Incomplete: Employee Request to Reschedule') {\n return 'RequestToReschedule';\n }\n};\n\nexport const getEmployeePostEnrollmentStatusParent = (status: POST_ENROLLMENT_FOLLOWUP_ITEM_PARENT_ENUM): string => {\n if (status === 'NoFollowUpRequired') {\n return 'No Follow-Up Required';\n }\n if (status === 'HrAssistanceRecommended') {\n return 'HR Assistance Recommended';\n }\n if (status === 'ReviewInBenefitsAdminSystem') {\n return 'Review in Benefits Admin. System';\n }\n};\n\nexport const getEmployeePostEnrollmentStatusParentEnum = (status: POST_ENROLLMENT_FOLLOWUP_ITEM_PARENT): string => {\n if (status === 'No Follow-Up Required') {\n return 'NoFollowUpRequired';\n }\n if (status === 'HR Assistance Recommended') {\n return 'HrAssistanceRecommended';\n }\n if (status === 'Review in Benefits Admin. System') {\n return 'ReviewInBenefitsAdminSystem';\n }\n};\n\nexport const enhancedFilterTypeArray = [\n { value: 'SchedulingStatus', description: 'Scheduling Status' },\n { value: 'EnrollmentMeetingOutcome', description: 'Meeting Outcome' },\n { value: 'PostEnrollmentFollowUpItem', description: 'Post Enrollment Follow-Up' }\n];\n\nexport const getEnhancedFilterType = (type: ENHANCED_STATUS_FILTERS_ENUM): string => {\n if (type === 'SchedulingStatus') {\n return 'Mtg. Schedule Status';\n }\n\n if (type === 'EnrollmentMeetingOutcome') {\n return 'Enrollment Mtg. Outcome';\n }\n\n if (type === 'PostEnrollmentFollowUpItem') {\n return 'Post Enrollment Follow-Up';\n }\n};\n","export const months = (isFuture?: boolean) => {\n const year = isFuture ? new Date().getFullYear() + 1 : new Date().getFullYear();\n return [\n {\n label: 'January',\n value: new Date(year, 0, 1).toISOString(),\n lastDay: new Date(year, 1, 0).toISOString()\n },\n {\n label: 'February',\n value: new Date(year, 1, 1).toISOString(),\n lastDay: new Date(year, 2, 0).toISOString()\n },\n {\n label: 'March',\n value: new Date(year, 2, 1).toISOString(),\n lastDay: new Date(year, 3, 0).toISOString()\n },\n {\n label: 'April',\n value: new Date(year, 3, 1).toISOString(),\n lastDay: new Date(year, 4, 0).toISOString()\n },\n {\n label: 'May',\n value: new Date(year, 4, 1).toISOString(),\n lastDay: new Date(year, 5, 0).toISOString()\n },\n {\n label: 'June',\n value: new Date(year, 5, 1).toISOString(),\n lastDay: new Date(year, 6, 0).toISOString()\n },\n {\n label: 'July',\n value: new Date(year, 6, 1).toISOString(),\n lastDay: new Date(year, 7, 0).toISOString()\n },\n {\n label: 'August',\n value: new Date(year, 7, 1).toISOString(),\n lastDay: new Date(year, 8, 0).toISOString()\n },\n {\n label: 'September',\n value: new Date(year, 8, 1).toISOString(),\n lastDay: new Date(year, 9, 0).toISOString()\n },\n {\n label: 'October',\n value: new Date(year, 9, 1).toISOString(),\n lastDay: new Date(year, 10, 0).toISOString()\n },\n {\n label: 'November',\n value: new Date(year, 10, 1).toISOString(),\n lastDay: new Date(year, 11, 0).toISOString()\n },\n {\n label: 'December',\n value: new Date(year, 11, 1).toISOString(),\n lastDay: new Date(year, 12, 0).toISOString()\n }\n ];\n};\n\nexport const nextSixMonthsFromCurrent = (currentMonth?: number) => {\n const selectedMonths = [];\n for (var cal = 0; cal < 6; cal++) {\n const currentMonthNumber = typeof currentMonth === 'number' ? currentMonth : new Date().getMonth();\n let numberDate = currentMonthNumber + cal + 1;\n\n // conditional checks here to loop the array to grab the next months correctly\n // since we are adding up the values and loop through six times\n if (numberDate === 12) {\n numberDate = 0;\n }\n if (numberDate === 13) {\n numberDate = 1;\n }\n if (numberDate === 14) {\n numberDate = 2;\n }\n if (numberDate === 15) {\n numberDate = 3;\n }\n if (numberDate === 16) {\n numberDate = 4;\n }\n if (numberDate === 17) {\n numberDate = 5;\n }\n selectedMonths.push(months()[numberDate]);\n }\n return selectedMonths;\n};\n\nconst getDaysInMonth = (year, month) => new Date(year, month, 0).getDate();\n\nexport const addMonths = (input: Date, months: number): Date => {\n const date = new Date(input);\n date.setDate(1);\n date.setMonth(date.getMonth() + months);\n date.setDate(Math.min(input.getDate(), getDaysInMonth(date.getFullYear(), date.getMonth() + 1)));\n return date;\n};\n","export const getUserErrorHandling = (res: any): { hasError: boolean; message?: string } => {\n // the api sends a boolean on success\n // or a valid uuid string, if there is an error, the service worker sends back html\n if (res && !res.Errors && (typeof res === 'boolean' || (res && !res.startsWith('<')))) {\n return {\n hasError: false\n };\n } else if (res && res.Errors) {\n let message = '';\n\n if (res.Errors.UserId) {\n // grabbing the first instance of the string in the array\n message = res.Errors.UserId[0];\n }\n\n if (res.Errors[`Body.Password`]) {\n // grabbing the first instance of the string in the array\n message = res.Errors[`Body.Password`][0];\n }\n\n if (res.Errors[`Body.BusinessClientId`]) {\n // grabbing the first instance of the string in the array\n message = res.Errors[`Body.Password`][0];\n }\n\n if (res.Errors.command) {\n // grabbing the first instance of the string in the array\n message = res.Errors.command[0];\n }\n // validation errors\n return {\n hasError: true,\n message\n };\n } else {\n // server errors\n return {\n hasError: true,\n message: 'Error, please try again'\n };\n }\n};\n","import React, { createContext, FC, useEffect, useState } from 'react';\nimport { useLocation, useHistory } from 'react-router-dom';\n// helpers\nimport { setUserLocalStorage, removeUserLocalStorage, getUserLocalStorage, getIsUserExpired, userLogout } from '../helpers';\n// models\nimport { ILoginUser } from '../models';\n\ninterface IUserContext {\n setUser: (user: ILoginUser | undefined) => void;\n user: ILoginUser | undefined;\n isFetching: boolean;\n}\n\nexport const UserContext = createContext({ setUser: () => {}, user: undefined, isFetching: false });\n\ninterface IUserContextHandlerProps {}\n\nexport const UserContextHandler: FC = ({ children }): JSX.Element => {\n const history = useHistory();\n const location = useLocation();\n\n const [user, setUser] = useState(undefined);\n const [isFetching, setFetching] = useState(true);\n\n const handleSetUser = (user: ILoginUser | undefined) => {\n if (user) {\n setUserLocalStorage(user);\n } else {\n removeUserLocalStorage();\n }\n setUser(user);\n };\n\n const fetchUserFromLocalStorage = async () => {\n try {\n const user = await getUserLocalStorage();\n if (user) {\n // token expired\n if (getIsUserExpired(user.accessTokenExpiresAt)) {\n userLogout();\n history.push('/login');\n } else {\n setUser(user);\n }\n }\n } catch (e) {\n console.log(e, 'fetchUserFromLocalStorage');\n } finally {\n setFetching(false);\n }\n };\n useEffect(() => {\n fetchUserFromLocalStorage();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [location.pathname]);\n\n return {children};\n};\n","export const DESC_SORT = 'Desc';\nexport const ASC_SORT = 'Asc';\nexport type SortOptions = 'Desc' | 'Asc';\n","export interface IUser {\n userId: string;\n firstName: string;\n lastName: string;\n email: string;\n phoneNumber: string;\n role: string;\n clientName: string;\n isActive: boolean;\n}\n\nexport interface IUserDetail {\n userId: string;\n firstName: string;\n lastName: string;\n email: string;\n phoneNumber: string;\n role: string;\n businessClient: {\n businessClientId: number;\n name: string;\n broker: {\n brokerId: number;\n name: string;\n };\n }[];\n broker: {\n brokerId: number;\n name: string;\n };\n isActive: boolean;\n}\n\nexport type UserRoles =\n | 'Administrator'\n | 'Carrier Partner'\n | 'General Agent'\n | 'Account Manager'\n | 'Broker Client'\n | 'Broker Manager'\n | 'Broker'\n | 'Business Client'\n | 'Enrolling Agent'\n | 'Manager'\n | 'Broker Client Manager';\nexport enum EUserRoles {\n ADMIN = 'Administrator',\n BROKER_CLIENT = 'BrokerClient',\n BROKER_MANAGER = 'BrokerManager',\n BROKER = 'Broker',\n BUSINESS_CLIENT = 'BusinessClient',\n ENROLLING_AGENT = 'EnrollingAgent',\n MANAGER = 'Manager',\n BROKER_CLIENT_MANAGER = 'BrokerClientManager'\n}\n\nexport interface IUserRes {\n records: IUser[];\n totalRecordCount: number;\n}\n\nexport interface IUserRole {\n value: string;\n description: string;\n shorthand: string;\n}\n\nexport interface IUserPost {\n email: string;\n password: string;\n firstName: string;\n lastName: string;\n role: UserRoles;\n brokerId: number;\n businessClientIds: number[];\n}\n\nexport interface IUserPut {\n isActive: boolean;\n email: string;\n password: string;\n firstName: string;\n lastName: string;\n role: UserRoles;\n brokerId: number;\n businessClientIds: number[];\n}\n\nexport interface ILoginPost {\n email: string;\n password: string;\n}\n\nexport interface IResetPasswordPost {\n email: string;\n resetPasswordToken: string;\n newPassword: string;\n}\n\nexport interface ILoginUser {\n username: string;\n name: string | null;\n email: string;\n accessTokenExpired: string;\n accessTokenExpiresAt: string;\n userId: string;\n firstName: string;\n lastName: string;\n roles: UserRoles[];\n accessToken: string;\n brokerId: number;\n brokerLogo: string;\n businessClientIds: number[];\n businessClientLogo: string;\n}\nexport interface IForgotPasswordPost {\n email: string;\n}\nexport interface IResetPasswordPost {\n email: string;\n resetPasswordToken: string;\n newPassword: string;\n}\n","import { IBroker } from './broker';\n\nexport interface ISectionDocumentsFile {\n id: number;\n fileVersionId: number;\n fileUrl: string;\n fileName: string;\n otherInformations: string;\n docContentType: string;\n externalFileUrl: string;\n fileExtension: string;\n uploadedBy: string;\n uploadedDateTime: string;\n}\n\nexport interface ISectionDocuments {\n id: number | null;\n status: string;\n category: string;\n categoryDescription: string;\n files: ISectionDocumentsFile[];\n orderIndex: number;\n}\n\nexport type OfferedNotOfferedBenefit = {\n benefitName: string;\n offered: boolean;\n}\n\nexport interface ISystemOfRecordRes {\n records: ISystemOfRecord[];\n totalRecordCount: number;\n}\n\nexport interface ISystemOfRecord {\n systemOfRecordId: number;\n name: string;\n}\n\nexport interface IDropdownResponse {\n value: string;\n description: string;\n shorthand: string;\n}\n\nexport interface IDefaultDropdownsOptions {\n defaultPreExRulesOptions: IDropdownResponse[];\n defaultPlanOfferOptions: IDropdownResponse[];\n defaultPeriodOptions: IDropdownResponse[];\n\n defaultPortabilityOptions: IDropdownResponse[];\n defaultGIEligibilityOptions: IDropdownResponse[];\n defaultPaymentTypeOptions: IDropdownResponse[];\n defaultEliminationAccumulationPeriodsOptions: IDropdownResponse[];\n}\n\nexport interface IEnrollmentEngagementNumbers {\n id?: number;\n priorYearEnrollmentStyle: string;\n priorYearEngagement: string;\n employeeEngagement: string;\n numberOfEnrollerDays: string;\n engagementPercentage: string;\n}\n\nexport interface IProductParticipation {\n id?: number | null;\n hsaParticipationPriorYear: string;\n hsaParticipation: string;\n fieldTitle: string;\n}\n\nexport interface IChallengesAndSolutions {\n id?: number | null;\n topChallengesToSolveForEnrollment: string;\n solutionsImplemented: string;\n keyTakeawaysFromStrategy: string;\n}\n\nexport interface IGeneralDropdownsOptions {\n projectTypesOptions: IDropdownResponse[];\n stdBuyUpOptions: IDropdownResponse[];\n accidentSicknessEliminationPeriods: IDropdownResponse[];\n stdCoverageTerminatesOn: IDropdownResponse[];\n stdCoverageClassPolicyTypes: IDropdownResponse[];\n\n basicADeDOptions: IDropdownResponse[];\n employeeRateBasisOptions: IDropdownResponse[];\n faceAmountOptions: IDropdownResponse[];\n incrementsOptions: IDropdownResponse[];\n maxFactorOptions: IDropdownResponse[];\n spouseRateBasisOptions: IDropdownResponse[];\n tobaccoRateBasisOptions: IDropdownResponse[];\n volADeDOptions: IDropdownResponse[];\n volLifeEmployeeRateBasisOptions: IDropdownResponse[];\n volLifeSpouseRateBasisOptions: IDropdownResponse[];\n volLifeTobaccoRateBasisOptions: IDropdownResponse[];\n accidentPlanTypeOptions: IDropdownResponse[];\n\n hospitalPlanTypeOptions: IDropdownResponse[];\n creditForTimeServedOptions: IDropdownResponse[];\n cancerPlanTypeOptions: IDropdownResponse[];\n criticalIllnessPlanTypeOptions: IDropdownResponse[];\n\n criticalIllnessMaxAmountOptions: IDropdownResponse[];\n criticalIllnessMaxFactorOptions: IDropdownResponse[];\n criticalIllnessIncrementsOptions: IDropdownResponse[];\n\n portableLifePlanTypeOptions: IDropdownResponse[];\n\n priorYearEnrollmentStyleOptions: IDropdownResponse[];\n defaultPeriodOptions: IDropdownResponse[];\n stateOptions: IDropdownResponse[];\n\n anticipatedSupportOptions: IDropdownResponse[];\n industryOptions: IDropdownResponse[];\n\n dataFileRecipientsOptions: IDropdownResponse[];\n\n typeOfEnrollmentOptions: IDropdownResponse[];\n enrollmentConditionsOptions: IDropdownResponse[];\n primaryEnrollmentMethodOptions: IDropdownResponse[];\n secondaryEnrollmentMethodOptions: IDropdownResponse[];\n engagementPercentageOptions: IDropdownResponse[];\n}\n\nexport interface IFinancialOptions {\n standardPeriodOptions: IDropdownResponse[];\n}\n\nexport interface IInsuranceCoverageOptions {\n defaultPlanOfferOptions: IDropdownResponse[];\n}\n\nexport interface IMedicalInsuranceOptions {\n telemedicineOptions: IDropdownResponse[];\n medicalDeductibleTypeOptions: IDropdownResponse[];\n medicalPlanOfferingOptions: IDropdownResponse[];\n medicalCoverageTerminatesOnOptions: IDropdownResponse[];\n}\n\nexport interface IBusinessClassOptions {\n waitingPeriods: IDropdownResponse[];\n classPayCycles: IDropdownResponse[];\n classEligibilityPeriods: IDropdownResponse[];\n classEligibilityRules: IDropdownResponse[];\n}\n\nexport interface IDentalInsurance {\n dentalInsuranceId?: number;\n offerDentalCoverage: boolean;\n dentalCarrier: string;\n previousDentalCarrier: string;\n dentalPlanOffering: string;\n coverageTerminatesOn?: string;\n dentalNotes: string;\n dentalInsurancePlans: IDentalInsurancePlan[];\n}\n\nexport interface IDentalInsurancePlan {\n dentalInsurancePlanId?: number;\n planName: string;\n pcpRequired: boolean;\n mostSimilarPreviousPlan: string;\n}\n\nexport interface IVisionInsurance {\n visionInsuranceId?: number;\n offerVisionCoverage: boolean;\n visionCarrier: string;\n previousVisionCarrier: string;\n visionPlanOffering: string;\n coverageTerminatesOn: string;\n visionNotes: string;\n visionInsurancePlans: IVisionInsurancePlan[];\n}\n\nexport interface IVisionInsurancePlan {\n visionInsurancePlanId?: number;\n planName: string;\n mostSimilarPreviousPlan: string;\n}\n\nexport interface IMedicalInsurance {\n id?: number;\n offerMedicalInsurance: boolean;\n medicalCarrier: string;\n previousMedicalCarrier: string;\n medicalPlanOffering?: string;\n medicalDeductibleType?: string;\n telemedicine?: string;\n medicalCoverageTerminatesOn?: string;\n medicalNotes: string;\n medicalPlans: IMedicalInsurancePlan[];\n}\n\nexport interface IMedicalInsurancePlan {\n id: number;\n planName: string;\n pcpRequired: boolean;\n mostSimilarPreviousPlan: string;\n}\n\nexport interface IVoluntaryLifeCoverage {\n id?: number;\n offerVoluntaryLifeCoverage: boolean;\n voluntaryLifeCarrier: string;\n previousVoluntaryLifeCarrier: string;\n volADeD?: string;\n volLifeGiEligibility?: string;\n volLifeOffering?: string;\n volLifePortability?: string;\n volLifeEmployeeRateBasis?: string;\n volLifeSpouseRateBasis?: string;\n volLifeTobaccoRateBasis?: string;\n voluntaryLifeCoverageGuaranteedIssues: IVoluntaryLifeCoverageGuaranteedIssue[];\n}\n\nexport interface IVoluntaryLifeCoverageGuaranteedIssue {\n id?: number;\n giAmount: string;\n maxAmount?: string;\n maxFactor?: string;\n increments?: string;\n}\n\n\nexport interface IGroupLifeInsurance {\n id?: number;\n offerBasicLifeCoverage: boolean;\n basicLifeCarrier: string;\n previousBasicLifeCarrier: string;\n basicLifeOffering?: string;\n lifeNotes: string;\n groupLifeInsuranceClasses: IGroupLifeInsuranceClass[];\n groupLifeInsuranceGuaranteedIssues: IGroupLifeInsuranceGuaranteedIssue[];\n\n basicADeD?: string;\n}\n\nexport interface IGroupLifeInsuranceClass {\n id?: number;\n className: string;\n notes: string;\n\n faceAmount: string;\n maxFactor: string;\n}\n\nexport interface IGroupLifeInsuranceGuaranteedIssue {\n id?: number;\n giAmount?: string;\n\n maxAmount?: string;\n maxFactor?: string;\n increments?: string;\n}\n\nexport interface ICriticalIllnessCoverageGuaranteedIssue {\n id?: number;\n giAmount?: string;\n\n maxAmount?: string;\n maxFactor?: string;\n increments?: string;\n}\n\nexport interface IAccidentInsurance {\n id?: number;\n offerAccidentCoverage: boolean;\n accidentCarrier: string;\n previousAccidentCarrier: string;\n highlights: string;\n accidentTaxStatus: boolean;\n accidentNotes: string;\n\n accidentOffering: string;\n accidentPlanType: string;\n accidentPortability: string;\n}\n\nexport interface IHospitalCoverage {\n id?: number;\n offerHospitalCoverage: boolean;\n hospitalCarrier: string;\n previousHospitalCarrier: string;\n hospitalTaxStatus: boolean;\n hospitalNotes: string;\n\n hospitalOffering: string;\n hospitalGIEligibility: string;\n hospitalPlanType: string;\n hospitalPreExRules: string;\n hospitalPortability: string;\n hospitalCreditForTimeServed: string;\n\n}\n\nexport interface ICancerInsurance {\n id?: number;\n offerCancerCoverage: boolean;\n cancerCarrier: string;\n previousCancerCarrier: string;\n cancerTaxStatus: boolean;\n cancerNotes: string;\n\n cancerOffering: string;\n cancerPlanType: string;\n cancerPreExRules: string;\n cancerPortability: string;\n cancerCreditForTimeServed: string;\n}\n\nexport interface ICriticalIllnessInsurance {\n id?: number;\n offerCriticalIllnessCoverage: boolean;\n criticalIllnessCarrier: string;\n previousCriticalIllnessCarrier: string;\n ciTaxStatus: boolean;\n criticalIllnessNotes: string;\n\n criticalIllnessOffering: string;\n criticalIllnessGIEligibility: string;\n criticalIllnessPlan: string;\n ciPreExRules: string;\n ciPortability: string;\n ciCreditForTimeServed: string;\n\n ciEmployeeRateBasis: string;\n ciSpouseRateBasis: string;\n ciTobaccoRateBasis: string;\n\n criticalIllnessInsuranceGuaranteedIssues: ICriticalIllnessCoverageGuaranteedIssue[]\n}\n\nexport interface IPortableLifeInsurance {\n id?: number;\n offerPortableLifeInsuranceCoverage: boolean;\n portableLifeCarrier: string;\n previousPortableLifeCarrier: string;\n portableLifeTaxStatus: boolean;\n portableLifeNotes: string;\n\n portableLifeGIEligibility: string;\n portableLifePortability: string;\n\n portableLifeOffering: string;\n portableLifePlanType: string;\n portableLifePreExRules: string;\n portableLifeCreditForTimeServed: string;\n portableLifeEmployeeRateBasedOn: string;\n portableLifeTobaccoRate: string;\n portableLifeSpouseRateBasis: string;\n\n portableLifeInsuranceGuaranteedIssues: IPortableLifeInsuranceGuaranteedIssue[]\n}\n\nexport interface IPortableLifeInsuranceGuaranteedIssue {\n id?: number;\n giAmount?: string;\n\n maxAmount?: string;\n maxFactor?: string;\n}\n\nexport interface IShortTermDisabilityCoverage {\n shortTermDisabilityCoverageId?: number;\n offerShortTermDisabilityCoverage: boolean;\n stdCarrier: string;\n previousSTDCarrier: string;\n areMultiplePlansAvailable: boolean;\n stdOffering: string;\n\n stdBuyUpOptions: string;\n stdPortability: string;\n stdPolicyType: string;\n accidentSicknessEliminationPeriods: string;\n coverageTerminatesOn: string;\n\n\n eligibleClasses: string;\n stdPreExRules: string;\n stdMaxWeeklyBenefit: string;\n stdTaxStatus: string;\n preExExceptionForPregnancy: boolean;\n stdNotes: string;\n\n stdCreditForTimeServed: string;\n stdgiEligibility: string;\n stdPaymentType: string;\n\n shortTermDisabilityCoverageClasses: IShortTermDisabilityCoverageClass[];\n}\n\nexport interface IShortTermDisabilityCoverageClass {\n id?: number;\n shortTermDisabilityCoverageId?: number;\n className: string;\n maxWeeklyBenefit: string;\n\n policyType: string;\n preExRules: string;\n giEligibility: string;\n paymentType: string;\n eliminationPeriods: string;\n\n}\n\nexport interface ILongTermDisabilityCoverage {\n longTermDisabilityCoverageId?: number;\n offerLongTermDisabilityCoverage: boolean;\n ltdCarrier: string;\n previousLTDCarrier: string;\n areMultiplePlansAvailable: boolean;\n ltdOffering: string;\n eligibleClasses: string;\n ltdMaxMonthlyBenefit: string;\n ltdNotes: string;\n maxMonthlyBenefit: string;\n\n ltdPreExRules: string;\n eliminationAccumulationPeriods: string;\n\n ltdPolicyType: string;\n ltdPortability: string;\n ltdgiEligibility: string;\n ltdBuyUpOptions: string;\n ltdCreditForTimeServed: string;\n ltdPaymentType: string;\n\n ltdTaxStatus: string;\n coverageTerminatesOn: string;\n\n longTermDisabilityCoverageClasses: ILongTermDisabilityCoverageClass[];\n}\n\nexport interface ILongTermDisabilityCoverageClass {\n id?: number;\n className: string;\n\n policyType: string;\n giEligibility: string;\n paymentType: string;\n\n eliminationAccumulationPeriods: string;\n}\n\n//start\nexport interface IHealthReimbursementAccount {\n offerHealthReimbursementAccount: boolean;\n erContribution?: string;\n contingentPlans?: string;\n coverageTerminatesOn?: string;\n highlights?: string;\n}\n\nexport interface IFlexibleSpendingAccount {\n offerFlexibleSpendingAccount: boolean;\n erContribution: string;\n employeeMaxAnnualAccount?: string;\n coverageTerminatesOn: string;\n}\n\nexport interface IDependentCareFlexSpendingAccount {\n offerDependentCareFlexSpendingAccount: boolean;\n erContribution: string;\n employeeMaxAnnualContribution?: string;\n familyMaxAnnualContribution?: string;\n coverageTerminatesOn: string;\n}\n\nexport interface ILimitedPurposeFlexSpendingAccount {\n offerLimitedPurposeFlexSpendingAccount: boolean;\n erContribution: string;\n employeeMaxAnnualContribution?: string;\n coverageTerminatesOn: string;\n\n}\n//end \n\nexport interface IBusinessClient {\n businessClientId: number;\n name: string;\n broker: IBroker;\n}\n\nexport interface IBuildStep {\n businessClientBuildStepId: number;\n buildStep: string;\n url: string;\n buildStepStatus: string;\n icon?: any;\n}\n\nexport interface ISpecialAttentionBusinessClientEmployee {\n businessClientSpecialAttentionEmployeeId?: number;\n name: string | null;\n title: string | null;\n}\n\nexport interface IDataFileRecipient {\n businessClientDataFileRecipientId?: number;\n recipient: string;\n otherRecipientDescription: string | null;\n}\n\nexport interface IHealthSavingsAccount {\n offerHealthSavingsAccount: boolean;\n erContributionsDistribution: string;\n employeeMaxAnnualContribution?: string;\n familyMaxAnnualContribution?: string;\n bankName: string;\n contingentPlans: string;\n coverageTermination: string;\n setupRequirements: string;\n erContribution: string;\n}\n\nexport interface ISupplementalProduct {\n id?: number;\n offerSupplementalProducts: boolean;\n carrierName: string;\n notes: string;\n}\n\nexport interface IEligibilityRules {\n id?: number;\n arePartTimeEmployeesEligibleToEnroll: boolean;\n partTimeEmployeesEligibility: boolean;\n areDomesticPartnersEligibleToEnroll: boolean;\n domesticPartnerPlanEligibility: boolean;\n eligibilityRulesDeductions: IEligibilityRulesDeduction[];\n}\n\nexport interface IEligibilityRulesDeduction {\n id?: number;\n deductionFrequency: string;\n hoursRequiredForEligibility: string;\n}\n\nexport interface IBusinessClientDetailFormValues {\n name: string;\n brokerName: string;\n\n shouldCompanyNameUsedInCommunication: boolean;\n companyNameUsedInCommunication: string;\n\n eligibilityRules?: IEligibilityRules;\n\n caseOverviewUrl: string;\n benefitProgramSupportDocumentationUrl: string;\n importantCaseNotes: string;\n logoUrl: string;\n appLogoUrl: string;\n systemOfRecord: string;\n systemOfRecordUrl: string;\n systemOfRecordUsername: string;\n systemOfRecordPassword: string;\n openEnrollmentEffectiveDate: string;\n openEnrollmentStartDate: string | null;\n dashboardOpenEnrollmentView: number;\n selfServiceStartDate: string;\n selfServiceEndDate: string;\n enrollmentDeadline: string;\n newHireScheduleUrl: string;\n classes: IBusinessClientClass[];\n location: IBusinessClientLocation[];\n contacts?: IBusinessClientContact[];\n supplementalProducts?: ISupplementalProduct[];\n\n mobileAppEnabled: boolean;\n appLogoType: string;\n homeLogoType: string;\n hexColor: string;\n secondaryHexColor: string;\n textHexColor: string;\n header: string;\n links: any[];\n hrManagerFirstName: string;\n hrManagerLastName: string;\n hrManagerEmail: string | null;\n hrManagerPhoneNumber: string | null;\n automatedEmployeeCommunication: boolean;\n qrCodes: QRCode[];\n // enrollment builder\n projectType: string | null;\n enrollmentStart: string | null;\n enrollmentEnd: string | null;\n targetDate: string | null;\n buildSteps: IBuildStep[];\n // enrollment overview\n // -- client details\n situsState: string;\n industry: string;\n industryTier?: string;\n benAdminBuildType?: string;\n engagementPercentage?: string;\n anticipatedSupport?: string;\n\n\n healthSavingsAccount: IHealthSavingsAccount;\n healthReimbursementAccount: IHealthReimbursementAccount;\n flexibleSpendingAccount: IFlexibleSpendingAccount;\n dependentCareFlexSpendingAccount: IDependentCareFlexSpendingAccount;\n limitedPurposeFlexSpendingAccount: ILimitedPurposeFlexSpendingAccount;\n financialProductNotes: string;\n\n enrollmentEngagementNumbers: IEnrollmentEngagementNumbers;\n\n productParticipation: IProductParticipation;\n challengesAndSolutions: IChallengesAndSolutions;\n\n medicalInsurance: IMedicalInsurance;\n\n dentalInsurance: IDentalInsurance;\n visionInsurance: IVisionInsurance;\n shortTermDisabilityCoverage: IShortTermDisabilityCoverage;\n longTermDisabilityCoverage: ILongTermDisabilityCoverage;\n groupLifeInsurance: IGroupLifeInsurance;\n voluntaryLifeCoverage: IVoluntaryLifeCoverage;\n\n accidentInsurance: IAccidentInsurance;\n hospitalCoverage: IHospitalCoverage;\n cancerInsurance: ICancerInsurance;\n criticalIllnessInsurance: ICriticalIllnessInsurance;\n portableLifeInsurance: IPortableLifeInsurance;\n\n sicCode: string;\n street: string;\n streetLine2: string;\n city: string;\n state: string;\n postalCode: string | null;\n taxId: string | number | null;\n totalEligibleEmployees: string | number;\n totalEmployees: string | number;\n engagementPackageType: string;\n carrierRepGoals: string;\n // -- client preferences\n highlightsChallenges: string | null;\n specialAttentionBusinessClientEmployees: ISpecialAttentionBusinessClientEmployee[];\n hrDeadline: string | null;\n provideDataFile: boolean;\n dataDeliveryDate: string | null;\n dataFileRecipients: IDataFileRecipient[];\n accountManagerUserId: string | number | null;\n\n //pretty new\n previousYearEnrollmentDetails: string | null;\n isEnrollmentAllianceProvidingBenAdminSystem: boolean;\n\n projectedNumberOfBenefitMeetingsRequired: string | null;\n\n estimatedEngagementRate: string | null;\n\n proposedDatesAndTimes: string | null;\n timeZone: string | null;\n enrollmentMethodAndSchedulingNotes: string | null;\n\n businessClientLocationAndLogistic: IBusinessClientLocationAndLogistic;\n faceToFaceEnrollment: IFaceToFaceEnrollmentDetails;\n\n businessClientFollowUpMessages: IBusinessClientFollowUpMessages;\n\n typeOfEnrollment?: string;\n enrollmentConditions?: string;\n primaryEnrollmentMethod?: string;\n secondaryEnrollmentMethod?: string;\n\n enrollmentSchedulingTools: IEnrollmentSchedulingTool[];\n\n sectionsDocuments: ISectionDocuments[];\n}\n\nexport interface IEnrollmentSchedulingTool {\n schedulingTool?: string;\n schedulingToolDescription?: string;\n otherToolDescription?: string;\n isSelected?: boolean;\n}\n\nexport interface IMinimalAddBusinessClient {\n name: string;\n projectType: string | null;\n openEnrollmentEffectiveDate: string | null;\n}\n\nexport interface IBusinessClientDetail {\n businessClientId: number;\n name: string;\n brokerId: number;\n\n shouldCompanyNameUsedInCommunication: boolean;\n companyNameUsedInCommunication: string;\n\n eligibilityRules?: IEligibilityRules;\n\n importantCaseNotes: string;\n caseOverviewUrl: string;\n dashboardOpenEnrollmentView: number;\n newHireScheduleUrl: string;\n benefitProgramSupportDocumentationUrl: string;\n systemOfRecordId: 0;\n systemOfRecordUrl: string;\n systemOfRecordUsername: string;\n systemOfRecordPassword: string;\n logoUrl: string;\n appLogoUrl: string;\n openEnrollmentEffectiveDate: string;\n openEnrollmentStartDate: string;\n selfServiceEndDate: string;\n selfServiceStartDate: string;\n enrollmentDeadline: string;\n broker: IBroker;\n systemOfRecord: ISystemOfRecord;\n classes: IBusinessClientClass[];\n location: IBusinessClientLocation[];\n contacts: IBusinessClientContact[];\n supplementalProducts?: ISupplementalProduct[];\n mobileAppEnabled: boolean;\n appLogoType: string;\n homeLogoType: string;\n hexColor: string;\n secondaryHexColor: string;\n textHexColor: string;\n header: string;\n links: IMobileAppLink[];\n qrCodes: QRCode[];\n hrManagerFirstName: string;\n hrManagerLastName: string;\n hrManagerEmail: string;\n hrManagerPhoneNumber: string;\n automatedEmployeeCommunication: boolean;\n projectType: string | null;\n enrollmentStart: string;\n enrollmentEnd: string;\n targetDate: string;\n buildSteps: IBuildStep[];\n situsState: string;\n industry: string;\n industryTier?: string;\n benAdminBuildType?: string;\n engagementPercentage?: string;\n anticipatedSupport?: string;\n\n healthSavingsAccount: IHealthSavingsAccount;\n healthReimbursementAccount: IHealthReimbursementAccount;\n flexibleSpendingAccount: IFlexibleSpendingAccount;\n dependentCareFlexSpendingAccount: IDependentCareFlexSpendingAccount;\n limitedPurposeFlexSpendingAccount: ILimitedPurposeFlexSpendingAccount;\n financialProductNotes: string;\n\n enrollmentEngagementNumbers: IEnrollmentEngagementNumbers;\n\n productParticipation: IProductParticipation;\n challengesAndSolutions: IChallengesAndSolutions;\n\n medicalInsurance: IMedicalInsurance;\n\n dentalInsurance: IDentalInsurance;\n visionInsurance: IVisionInsurance;\n shortTermDisabilityCoverage: IShortTermDisabilityCoverage;\n longTermDisabilityCoverage: ILongTermDisabilityCoverage;\n groupLifeInsurance: IGroupLifeInsurance;\n voluntaryLifeCoverage: IVoluntaryLifeCoverage;\n\n accidentInsurance: IAccidentInsurance;\n hospitalCoverage: IHospitalCoverage;\n cancerInsurance: ICancerInsurance;\n criticalIllnessInsurance: ICriticalIllnessInsurance;\n portableLifeInsurance: IPortableLifeInsurance;\n\n sicCode: string;\n street: string;\n streetLine2: string;\n city: string;\n state: string;\n postalCode: string | null;\n taxId: string;\n totalEligibleEmployees: number;\n totalEmployees: string | number;\n engagementPackageType: string;\n carrierRepGoals: string;\n highlightsChallenges: string | null;\n specialAttentionBusinessClientEmployees: ISpecialAttentionBusinessClientEmployee[];\n hrDeadline: string | null;\n provideDataFile: boolean;\n dataDeliveryDate: string | null;\n dataFileRecipients: IDataFileRecipient[];\n accountManagerUserId: string | number;\n\n previousYearEnrollmentDetails: string | null;\n isEnrollmentAllianceProvidingBenAdminSystem: boolean;\n\n projectedNumberOfBenefitMeetingsRequired: string | null;\n\n estimatedEngagementRate: string | null;\n\n proposedDatesAndTimes: string | null;\n timeZone: string | null;\n enrollmentMethodAndSchedulingNotes: string | null;\n\n businessClientLocationAndLogistic: IBusinessClientLocationAndLogistic;\n faceToFaceEnrollment: IFaceToFaceEnrollmentDetails;\n\n businessClientFollowUpMessages: IBusinessClientFollowUpMessages;\n\n typeOfEnrollment?: string;\n enrollmentConditions?: string;\n primaryEnrollmentMethod?: string;\n secondaryEnrollmentMethod?: string;\n\n enrollmentSchedulingTools: IEnrollmentSchedulingTool[];\n\n sectionsDocuments: ISectionDocuments[];\n}\n\nexport interface QRCode {\n name: string;\n link: string;\n url: string;\n businessClientClassId: number;\n businessClientLocationId: number;\n}\n\nexport interface IBusinessClientLocationAndLogistic {\n id?: number | null;\n isThereNeedForOtherLanguages: boolean;\n isThereNeedForSpanish: boolean;\n areAnyOtherLanguagesNeeded: boolean;\n additionalLanguages: string;\n}\n\nexport interface IFaceToFaceEnrollmentLocation {\n id?: number | null;\n locationName: string;\n streetAddress: string;\n city: string;\n state: string;\n zip: string;\n}\n\nexport interface IFaceToFaceEnrollmentDetails {\n id?: number | null;\n multipleLocationsRequired: boolean;\n notesAboutEnrollmentLogistics: string;\n locations: IFaceToFaceEnrollmentLocation[];\n}\n\nexport interface IBusinessClientFollowUpMessages {\n id?: number | null;\n targetAudience: string | null;\n messages: IBusinessClientFollowUpMessageItem[];\n}\n\nexport interface IBusinessClientFollowUpMessageItem {\n id?: number | null;\n messageDeliveryDate: string | null;\n textMessage: string | null;\n emailSubjectLine: string | null;\n emailMessage: string | null;\n}\n\n\nexport interface IBusinessClientLocation {\n businessClientLocationId?: number;\n name: string;\n calendarLinkUrl: string | null;\n supervisorName?: string | null;\n}\n\nexport interface IBusinessClientRes {\n records: IBusinessClient[];\n totalRecordCount: number;\n}\n\nexport interface IBusinessClientClass {\n businessClientClassId?: number;\n name: string;\n benefitGuideUrl: string | null;\n benefitGuideMultilingualUrl: string | null;\n videoUrl: string | null;\n videoMultilingualUrl: string | null;\n waitingPeriod: string;\n\n classPayCycle: string;\n classEligibilityPeriod: string;\n classEligibilityRule: string;\n}\n\nexport interface IBusinessClientContact {\n businessClientContactId?: number;\n businessClientId?: number;\n name: string;\n email: string;\n hasBenAdminAccess: boolean;\n hasDashboardAccess: boolean;\n role?: string | null;\n}\n\nexport interface IBusinessClientPost {\n name: string;\n brokerId: number;\n caseOverviewUrl?: string;\n newHireScheduleUrl?: string;\n benefitProgramSupportDocumentationUrl?: string;\n systemOfRecordId?: number;\n systemOfRecordUrl?: string;\n systemOfRecordUsername?: string;\n systemOfRecordPassword?: string;\n logoUrl?: string;\n openEnrollmentEffectiveDate?: string;\n openEnrollmentStartDate?: string;\n enrollmentDeadline?: string;\n classes?: IBusinessClientClass[];\n locations?: IBusinessClientLocation[];\n contacts?: IBusinessClientContact[];\n supplementalProducts?: ISupplementalProduct[];\n mobileAppEnabled: boolean;\n appLogoType: string;\n homeLogoType: string;\n hexColor: string;\n links: IMobileAppLink[];\n hrManagerFirstName?: string;\n hrManagerLastName?: string;\n hrManagerEmail?: string;\n hrManagerPhoneNumber?: string;\n automatedEmployeeCommunication?: boolean;\n classLocations: {\n businessClientClassId: number;\n businessClientLocationId: number;\n url: string;\n }[];\n situsState: string;\n industry: string;\n industryTier?: string;\n benAdminBuildType?: string;\n engagementPercentage?: string;\n anticipatedSupport?: string;\n\n\n healthSavingsAccount: IHealthSavingsAccount;\n healthReimbursementAccount: IHealthReimbursementAccount;\n flexibleSpendingAccount: IFlexibleSpendingAccount;\n dependentCareFlexSpendingAccount: IDependentCareFlexSpendingAccount;\n limitedPurposeFlexSpendingAccount: ILimitedPurposeFlexSpendingAccount;\n financialProductNotes: string;\n\n medicalInsurance: IMedicalInsurance;\n\n dentalInsurance: IDentalInsurance;\n visionInsurance: IVisionInsurance;\n shortTermDisabilityCoverage: IShortTermDisabilityCoverage;\n longTermDisabilityCoverage: ILongTermDisabilityCoverage;\n groupLifeInsurance: IGroupLifeInsurance;\n voluntaryLifeCoverage: IVoluntaryLifeCoverage;\n\n accidentInsurance: IAccidentInsurance;\n hospitalCoverage: IHospitalCoverage;\n cancerInsurance: ICancerInsurance;\n criticalIllnessInsurance: ICriticalIllnessInsurance;\n portableLifeInsurance: IPortableLifeInsurance;\n\n medicalDeductibleType?: string;\n telemedicine?: string;\n medicalNotes?: string;\n\n sicCode: string;\n street: string;\n streetLine2: string;\n city: string;\n state: string;\n postalCode: string;\n taxId: string;\n totalEligibleEmployees: number;\n totalEmployees: string | number;\n engagementPackageType: string;\n carrierRepGoals: string;\n highlightsChallenges: string | null;\n specialAttentionBusinessClientEmployees?: ISpecialAttentionBusinessClientEmployee[];\n hrDeadline: string | null;\n provideDataFile: boolean;\n dataDeliveryDate: string | null;\n dataFileRecipients: IDataFileRecipient[];\n accountManagerUserId: string | number;\n\n previousYearEnrollmentDetails: string | null;\n isEnrollmentAllianceProvidingBenAdminSystem: boolean;\n\n projectedNumberOfBenefitMeetingsRequired: string | null;\n\n estimatedEngagementRate: string | null;\n\n proposedDatesAndTimes: string | null;\n timeZone: string | null;\n enrollmentMethodAndSchedulingNotes: string | null;\n\n businessClientLocationAndLogistic: IBusinessClientLocationAndLogistic;\n faceToFaceEnrollment: IFaceToFaceEnrollmentDetails;\n\n businessClientFollowUpMessages: IBusinessClientFollowUpMessages;\n\n typeOfEnrollment?: string;\n enrollmentConditions?: string;\n primaryEnrollmentMethod?: string;\n secondaryEnrollmentMethod?: string;\n\n enrollmentSchedulingTools: IEnrollmentSchedulingTool[];\n\n sectionsDocuments: ISectionDocuments[];\n}\n\nexport interface IBusinessClientPut {\n name: string;\n}\n\nexport interface IBusinessClientDashboardEmployeeCount {\n status: string;\n count: number;\n}\n\nexport interface IBusinessClientDashboard {\n businessClientId: number;\n name: string;\n logoUrl: string;\n isOpenEnrollment: boolean;\n employeeStatusCounts: IBusinessClientDashboardEmployeeCount[];\n}\n\nexport interface IImageUploadRes {\n url: string;\n}\n\nexport type mobileAppLogoTypes = 'Broker' | 'BusinessClient' | 'Custom' | 'Default';\n\nexport type mobileAppLogoTypeTitles = 'Broker Logo' | 'Business Client Logo' | 'Enrollment Alliance' | 'Custom App Icon Logo';\n\nexport enum EMobileAppLogoTypeEnums {\n BROKER = 'Broker',\n BUSINESS_CLIENT = 'BusinessClient',\n DEFAULT = 'Default'\n}\n\nexport interface IMobileAppLogoType {\n type: mobileAppLogoTypes;\n title: mobileAppLogoTypeTitles;\n}\n\nexport const mobileAppLogoTypeOptions: IMobileAppLogoType[] = [\n { type: 'Broker', title: 'Broker Logo' },\n { type: 'BusinessClient', title: 'Business Client Logo' },\n { type: 'Custom', title: 'Custom App Icon Logo' },\n { type: 'Default', title: 'Enrollment Alliance' }\n];\n\nexport type mobileAppLinkTypes =\n | 'Instructions'\n | 'Calendar'\n | 'TalkToAdvisor'\n | 'BenefitsInfo'\n | 'BenefitsInfoMultilingual'\n | 'Media'\n | 'MediaMultilingual'\n | 'Chat'\n | 'FindADoctor'\n | 'EnrollInBenefits'\n | 'EnrollInBenefitsMultilingual'\n | 'VirtualDoctorVisit'\n | 'PrescriptionDiscounts'\n | 'WellnessIncentives'\n | 'MentalHealth'\n | 'SpeakToConcierge'\n | 'Retirement'\n | 'Payroll'\n | 'ScreenShare'\n | 'Webinar'\n | 'WebinarMultilingual'\n | 'Legal'\n | 'IdentityProtection'\n | 'PetInsurance'\n | 'AutoInsurance'\n | 'BoatInsurance'\n | 'Forms'\n | 'HomeInsurance'\n | 'LifeInsurance';\n\nexport enum EMobileAppLinkTypeEnums {\n INSTRUCTIONS = 'Instructions',\n CALENDAR = 'Calendar',\n TALK_TO_ADVISOR = 'TalkToAdvisor',\n BENEFITS_INFO = 'BenefitsInfo',\n BENEFITS_INFO_MULTILINGUAL = 'BenefitsInfoMultilingual',\n MEDIA = 'Media',\n MEDIA_MULTILINGUAL = 'MediaMultilingual',\n CHAT = 'Chat',\n FIND_A_DOCTOR = 'FindADoctor',\n ENROLL_In_BENEFITS = 'EnrollInBenefits',\n ENROLL_In_BENEFITS_MULTILINGUAL = 'EnrollInBenefitsMultilingual',\n VIRTUAL_DOCTOR_VISIT = 'VirtualDoctorVisit',\n PRESCRIPTION_DISCOUNTS = 'PrescriptionDiscounts',\n WELLNESS_INCENTIVES = 'WellnessIncentives',\n MENTAL_HEALTH = 'MentalHealth',\n SPEAK_TO_CONCIERGE = 'SpeakToConcierge',\n RETIREMENT = 'Retirement',\n PAYROLL = 'Payroll',\n SCREEN_SHARE = 'ScreenShare',\n WEBINAR = 'Webinar',\n WEBINAR_MULTILINGUAL = 'WebinarMultilingual',\n LEGAL = 'Legal',\n IDENTITY_PROTECTION = 'IdentityProtection',\n PET_INSURANCE = 'PetInsurance',\n AUTO_INSURANCE = 'AutoInsurance',\n BOAT_INSURANCE = 'BoatInsurance',\n FORMS = 'Forms',\n HOME_INSURANCE = 'HomeInsurance',\n LIFE_INSURANCE = 'LifeInsurance'\n}\n\nexport interface IMobileAppLink {\n businessClientMobileAppLinkId?: number;\n enabled: boolean;\n link: string;\n type: mobileAppLinkTypes;\n name: string | null;\n}\n\nexport const instructionsForDownloadAppLinkOptions: IMobileAppLink[] = [\n { enabled: false, link: 'https://enrollmentalliance.com/', type: EMobileAppLinkTypeEnums.INSTRUCTIONS, name: 'Add app to Home Screen' }\n];\n\nexport const sharedAppLinkOptions: IMobileAppLink[] = [\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.AUTO_INSURANCE, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.BOAT_INSURANCE, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.FORMS, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.HOME_INSURANCE, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.LIFE_INSURANCE, name: '' },\n];\n\n// this was created to possible handle some clients that saved their link options, but were missing FIND_A_DOCTOR\nexport const multilingualAppLinkOptions: IMobileAppLink[] = [\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.BENEFITS_INFO_MULTILINGUAL, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.MEDIA_MULTILINGUAL, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.WEBINAR_MULTILINGUAL, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.ENROLL_In_BENEFITS_MULTILINGUAL, name: '' }\n];\nexport const missingMobileAppLinkOptions: IMobileAppLink[] = [\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.RETIREMENT, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.PAYROLL, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.SCREEN_SHARE, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.WEBINAR, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.LEGAL, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.IDENTITY_PROTECTION, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.PET_INSURANCE, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.FIND_A_DOCTOR, name: '' },\n ...multilingualAppLinkOptions,\n ...instructionsForDownloadAppLinkOptions\n];\n\nexport const extraMobileAppLinkOptions: IMobileAppLink[] = [\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.RETIREMENT, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.PAYROLL, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.SCREEN_SHARE, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.WEBINAR, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.LEGAL, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.IDENTITY_PROTECTION, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.PET_INSURANCE, name: '' },\n ...multilingualAppLinkOptions,\n ...instructionsForDownloadAppLinkOptions\n];\n\nexport const newMobileAppLinkOptions: IMobileAppLink[] = [\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.ENROLL_In_BENEFITS, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.VIRTUAL_DOCTOR_VISIT, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.PRESCRIPTION_DISCOUNTS, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.WELLNESS_INCENTIVES, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.MENTAL_HEALTH, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.SPEAK_TO_CONCIERGE, name: '' },\n ...extraMobileAppLinkOptions,\n ...instructionsForDownloadAppLinkOptions\n];\n\nexport const mobileAppLinkOptions: IMobileAppLink[] = [\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.CALENDAR, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.BENEFITS_INFO, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.TALK_TO_ADVISOR, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.MEDIA, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.CHAT, name: '' },\n { enabled: false, link: '', type: EMobileAppLinkTypeEnums.FIND_A_DOCTOR, name: '' },\n ...newMobileAppLinkOptions,\n ...instructionsForDownloadAppLinkOptions\n];\n\n\n// Had to add incase doubled links got through\nconst makeLinksDistinct = (array, property = 'type') => array.filter((value, index, self) => index === self.findIndex(t => t[property] === value[property]));\n\nexport const getDefaultLinks = (currentLinks: IMobileAppLink[]) => {\n // // Add instructions no matter what\n // currentLinks = makeLinksDistinct([...currentLinks, ...instructionsForDownloadAppLinkOptions]);\n // this check is for possible some clients missing one of the options (11) and saved their selections with one less option\n if (currentLinks.length === 11) {\n return makeLinksDistinct([...currentLinks, ...missingMobileAppLinkOptions, ...sharedAppLinkOptions]);\n }\n // this check is for when a client has all of the latest options (12) except the most recent icons\n if (currentLinks.length === 12) {\n return makeLinksDistinct([...currentLinks, ...extraMobileAppLinkOptions, ...sharedAppLinkOptions]);\n }\n // this check is for when a client has all of the latest options (6) except the most recent icons\n if (currentLinks.length === 6) {\n return makeLinksDistinct([...currentLinks, ...newMobileAppLinkOptions, ...sharedAppLinkOptions]);\n }\n // use the client options if they have already saved all of the latest options to the API\n if (currentLinks.length > 12) {\n return makeLinksDistinct([...currentLinks, ...instructionsForDownloadAppLinkOptions, ...sharedAppLinkOptions]);\n }\n\n // return all of the static default options for brand new clients\n // Adding Multilingual options and making them distinct\n return makeLinksDistinct([...mobileAppLinkOptions, ...sharedAppLinkOptions]);\n};\n\nexport interface ITargetDate {\n targetDate: string;\n projectType: string;\n censusDate: string;\n essentialDocsDate: string;\n productOverviewDate: string;\n enrollmentOverviewDate: string;\n hrOverviewDate: string;\n communicationOverviewDate: string;\n}\n\nexport interface IEnrollmentBuilderDashboard {\n businessClientId: number;\n name: string | null;\n enrollmentStart: string | null;\n enrollmentEnd: string | null;\n targetDates: ITargetDate;\n buildSteps: IBuildStep[];\n}\n","export interface IBroker {\n brokerId: number;\n name: string;\n logoUrl?: string;\n}\n\nexport interface IBrokerRes {\n records: IBroker[];\n totalRecordCount: number;\n}\n\nexport interface IBrokerPost {\n name: string;\n logoUrl?: string;\n}\n\nexport interface IBrokerPut {\n name: string;\n logoUrl?: string;\n}\n\nexport type BrokerDashboardStatus = 'OpenEnrollment' | 'NewHire' | 'All';\nexport enum EBrokerDashboardStatus {\n OPEN_ENROLLMENT = 'OpenEnrollment',\n NEW_HIRE = 'NewHire',\n ALL = 'All'\n}\n\nexport interface IBrokerDashboardEmployeeCount {\n status: string;\n count: number;\n}\n\nexport interface IBrokerDashboard {\n businessClientId: number;\n name: string;\n logoUrl: string;\n isOpenEnrollment: boolean;\n openEnrollmentStartDate: string;\n openEnrollmentEffectiveDate: string;\n enrollmentDeadline: string;\n employeeStatusCounts: IBrokerDashboardEmployeeCount[];\n}\n\nexport interface IBrokerDashboardRes {\n totalRecordCount: number;\n records: IBrokerDashboard[];\n}\n","import React, { createContext, FC, useState } from 'react';\nimport { SortOptions, ASC_SORT } from '../models';\n\ninterface IManageBusinessClientCtx {\n selectedSort: string;\n setSelectedSort: (val: string) => void;\n searchValue: string;\n setSearchValue: (val: string) => void;\n sortDirection: {\n Name?: SortOptions;\n Broker?: SortOptions;\n };\n setSortDirection: (val: { Name?: SortOptions; Broker?: SortOptions }) => void;\n}\n\nexport const ManageBusinessClientCtx = createContext({\n selectedSort: 'Name',\n setSelectedSort: () => {},\n searchValue: '',\n setSearchValue: () => {},\n sortDirection: {},\n setSortDirection: () => {}\n});\n\ninterface IManageBusinessClientCtxHandlerProps {}\n\nexport const ManageBusinessClientCtxHandler: FC = ({ children }): JSX.Element => {\n const [sortDirection, setSortDirection] = useState<{\n Name?: SortOptions;\n Broker?: SortOptions;\n }>({\n Name: ASC_SORT\n });\n const [selectedSort, setSelectedSort] = useState('Name');\n const [searchValue, setSearchValue] = useState('');\n\n return (\n \n {children}\n \n );\n};\n","import React, { createContext, FC, useEffect, useState } from 'react';\nimport { getLocalStorage, setLocalStorage } from '../helpers';\n// helpers\n\ninterface ITimeZoneContext {\n setTimeZone: (timezone: string) => void;\n timeZone: string;\n}\n\nexport const TimeZoneContext = createContext({ setTimeZone: () => {}, timeZone: undefined });\n\ninterface ITimeZoneContextHandlerProps {}\n\nexport const TimeZoneContextHandler: FC = ({ children }): JSX.Element => {\n const [timeZone, setTimeZone] = useState('America/New_York');\n useEffect(() => {\n getLocalStorage('timezone')\n .then(data => {\n if (data) {\n setTimeZone(data);\n } else {\n setTimeZone('America/New_York');\n }\n })\n .catch(err => {\n console.log('Error', err);\n setTimeZone('America/New_York');\n });\n }, []);\n\n useEffect(() => {\n setLocalStorage('timezone', timeZone);\n }, [timeZone]);\n\n return {children};\n};\n","import React, { FC, useState, useEffect, useContext } from 'react';\nimport { Theme, darken } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport useMediaQuery from '@mui/material/useMediaQuery';\nimport { Link as MLink, useHistory } from 'react-router-dom';\nimport clsx from 'clsx';\n// Components\nimport { Button, Drawer, Divider, List, ListItem, ListItemText, ListItemIcon, TextField, MenuItem } from '@mui/material';\n// icons\nimport { Close, Menu, HomeOutlined, ExitToAppOutlined } from '@mui/icons-material';\n// helpers\nimport { userLogout } from '../../helpers';\n// context\nimport { UserContext } from '../../context';\n// models\nimport { ILoginUser } from '../../models';\nimport { TimeZoneContext } from '../../context/timezone';\n\ninterface IMobileDrawer {\n user: ILoginUser;\n}\n\nexport const MobileDrawer: FC = ({ user }) => {\n const classes = useStyles();\n\n const [isDrawerOpen, setDrawerOpen] = useState(false);\n\n const toggleDrawer = isOpen => event => {\n if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) {\n return;\n }\n\n setDrawerOpen(isOpen);\n };\n\n const isDesktop = useMediaQuery('(min-width: 768px)');\n\n // close the drawer if the menu gets resized into desktop view\n useEffect(() => {\n if (isDesktop && isDrawerOpen) {\n setDrawerOpen(false);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isDesktop]);\n\n const history = useHistory();\n const { setUser } = useContext(UserContext);\n\n const { timeZone, setTimeZone } = useContext(TimeZoneContext);\n\n const timeZones = [\n { name: 'EST', tzName: 'America/New_York' },\n { name: 'CST', tzName: 'America/Chicago' },\n { name: 'MST', tzName: 'America/Phoenix' },\n { name: 'PST', tzName: 'America/Los_Angeles' }\n ];\n return (\n \n
\n
\n \n
\n {\n setTimeZone(e.target.value);\n }}\n name={`timeZoneMobile`}\n id={`timeZoneMobile`}\n label='Time Zone'\n size='small'\n value={timeZone}\n >\n {timeZones.map((timezone, index) => {\n return (\n \n );\n })}\n \n
\n
} color='primary' onClick={toggleDrawer(false)}>\n Close\n \n
\n
\n \n \n \n \n \n \n \n \n \n \n \n {\n await userLogout();\n setUser(null);\n history.push('/login');\n }}\n >\n \n \n \n \n \n
\n
\n
\n
\n \n \n {user && user.brokerLogo && (\n <>\n
\n
\n \n \n \n )}\n \n
\n
:
}\n className={clsx(classes.menuButton)}\n id='timeZone-button'\n aria-controls={open ? 'time-zone-menu' : undefined}\n aria-haspopup='true'\n aria-expanded={open ? 'true' : undefined}\n onClick={handleClick}\n >\n {/* The Default is EST */}\n {timeZone ? `Time Zone: ${timeZones.filter(tz => tz.tzName === timeZone)[0].name}` : `Time Zone: EST`}\n \n
\n
\n
} className={clsx(classes.menuButton, pathname === '/' && 'active')}>\n Home\n \n \n
{\n await userLogout();\n setUser(null);\n history.push('/login');\n }}\n startIcon={}\n className={clsx(classes.menuButton, pathname === '/logout' && 'active')}\n >\n Logout\n \n \n
\n \n \n } className={clsx(classes.adminMenuButton, pathname === '/' && 'active')}>\n Home\n \n \n \n } className={clsx(classes.adminMenuButton, pathname === '/manage-users' && 'active')}>\n Manage Users\n \n \n \n } className={clsx(classes.adminMenuButton, pathname === '/manage-brokers' && 'active')}>\n Manage Brokers\n \n \n \n } className={clsx(classes.adminMenuButton, pathname.includes('/manage-business-clients') && 'active')}>\n Manage Business Clients\n \n \n
\n \n
\n {isAdmin && (\n <>\n
\n
\n
setIsMobileAdminMenuOpen(!isMobileAdminMenuOpen)} size='small' className={classes.mobileAdminMenuButton} color='primary' aria-label='admin-menu'>\n \n \n
setIsMobileAdminMenuOpen(false)} onOpen={() => setIsMobileAdminMenuOpen(true)}>\n \n \n
\n \n )}\n
{children}
\n
\n {isDesktop && (\n \n {theme.direction === 'rtl' ? : }\n \n )}\n \n {theme.direction === 'rtl' ? : }\n \n = Math.ceil(count / rowsPerPage) - 1} aria-label='next page' size='large'>\n {theme.direction === 'rtl' ? : }\n \n {isDesktop && (\n = Math.ceil(count / rowsPerPage) - 1} aria-label='last page' size='large'>\n {theme.direction === 'rtl' ? : }\n \n )}\n
\n );\n};\n\nconst useStyles = makeStyles(theme => ({\n root: {\n flexShrink: 0,\n [theme.breakpoints.up('md')]: {\n marginLeft: theme.spacing(2.5)\n }\n },\n button: {\n [theme.breakpoints.down('lg')]: {\n padding: 0\n }\n }\n}));\n","import React, { FC } from 'react';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport TablePagination from '@mui/material/TablePagination';\nimport { TablePaginationActions } from './TablePaginationActions';\n\ninterface IPaginationProps {\n labelRowsPerPage?: string;\n rowsPerPageOptions?: number[] | { label: string; value: number }[] | any;\n count: number;\n rowsPerPage: number;\n page: number;\n setPage: (newPage: number) => void;\n setRowsPerPage: (val: number) => void;\n}\n\nexport const Pagination: FC = ({ labelRowsPerPage, rowsPerPageOptions, count, rowsPerPage, page, setPage, setRowsPerPage }) => {\n const classes = paginationStyles();\n return (\n setPage(newPage)}\n onRowsPerPageChange={(e: React.ChangeEvent) => {\n setPage(0);\n setRowsPerPage(parseInt(e.target.value, 10));\n }}\n ActionsComponent={TablePaginationActions}\n />\n );\n};\n\nconst paginationStyles = makeStyles((theme: Theme) => ({\n paginationRoot: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n '&& .MuiTablePagination-selectRoot': {\n marginLeft: 0,\n marginRight: '5px'\n },\n '&& .MuiToolbar-gutters': {\n paddingLeft: 0\n },\n '&& .MuiTablePagination-actions': {\n marginLeft: 0\n },\n [theme.breakpoints.up('md')]: {\n '&& .MuiTablePagination-selectRoot': {\n marginLeft: '8px',\n marginRight: '32px'\n },\n '&& .MuiToolbar-gutters': {\n paddingLeft: 0\n },\n '&& .MuiTablePagination-actions': {\n marginLeft: '20px'\n }\n }\n }\n}));\n","import React, { FC, useEffect } from 'react';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport isFunction from 'lodash/isFunction';\nimport useMediaQuery from '@mui/material/useMediaQuery';\nimport clsx from 'clsx';\n// Components`\nimport { TableBody, TableCell, TableContainer, TableHead, TableRow, TableSortLabel, Typography, Grid, Table as MaUTable } from '@mui/material';\nimport { useGlobalFilter, usePagination, useRowSelect, useSortBy, useTable, Column, Row } from 'react-table';\nimport Skeleton from '@mui/material/Skeleton';\nimport { Pagination } from './Pagination';\n\nexport interface ITableColumn extends Column {\n id?: string;\n Header: string;\n accessor?: (() => string | number) | ((item: unknown) => string | number) | string;\n canFilter?: boolean;\n className?: string;\n sort?: boolean;\n isServerSorted?: boolean;\n isServerSortedDesc?: boolean;\n handleClickColumn?: (columnId: any) => void;\n hideLoad?: boolean;\n overrideWidth?: number;\n filterType?: 'input' | 'autocomplete';\n isDate?: boolean;\n isNumber?: boolean;\n isRate?: boolean;\n title?: string;\n}\n\ninterface ITableProps {\n data: any[];\n columns: ITableColumn[];\n noResultsText?: string;\n isLoading?: boolean;\n rowOnClick?: (e, val?: any) => void;\n hideDeleted?: boolean;\n cellClasses?: any;\n rowClasses?: any;\n useTableProps?: { [key: string]: any };\n hidePagination?: boolean;\n stickyHeader?: boolean;\n ResponsiveComponent?: FC;\n ResponsiveComponentLoader?: FC;\n containerClasses?: string;\n tableSize?: 'medium' | 'small' | undefined;\n onRowsPerPageChange?: (rows: number) => void;\n LoadMoreComponent?: FC;\n mobileProps?: any;\n hover?: boolean;\n}\n\nexport const Table: FC = ({\n columns,\n data,\n isLoading,\n noResultsText = 'No Results',\n hideDeleted,\n cellClasses = '',\n rowClasses,\n useTableProps = {},\n hidePagination,\n stickyHeader = false,\n rowOnClick,\n ResponsiveComponent,\n containerClasses = '',\n ResponsiveComponentLoader,\n tableSize = 'medium',\n onRowsPerPageChange,\n LoadMoreComponent,\n mobileProps,\n hover = false\n}) => {\n const {\n getTableProps,\n headerGroups,\n prepareRow,\n page,\n gotoPage,\n setPageSize,\n state: { pageIndex, pageSize }\n } = useTable(\n {\n columns,\n data,\n userPageCount: 1, // ignored if manualPagination is false\n manualPagination: hidePagination,\n autoResetPage: isLoading, // reset page when loading\n autoResetSortBy: isLoading, // reset sort when loading\n ...useTableProps\n },\n useGlobalFilter,\n useSortBy,\n usePagination,\n useRowSelect\n );\n\n const handleChangePage = (page: number) => {\n gotoPage(page);\n };\n\n const handleChangeRowsPerPage = (value: number) => {\n setPageSize(value);\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n };\n\n // update page size if we hide pagination\n useEffect(() => {\n if (hidePagination && Array.isArray(data)) {\n setPageSize(Number(data.length));\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [data]);\n // always start on first page if data length changes, ie; filter was applied\n useEffect(() => {\n handleChangePage(0);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [data.length]);\n\n const classes = useStyles();\n const isDesktop = useMediaQuery('(min-width: 960px)');\n\n const getCellStyle = (column: ITableColumn, type: 'header' | 'cell') => {\n let style: any = { cursor: 'inherit' };\n\n if (column.isDate) {\n style = {\n ...style,\n textAlign: 'center'\n };\n } else if (column.isNumber) {\n style = {\n ...style,\n textAlign: 'right',\n paddingRight: '3rem'\n };\n } else if (column.isRate) {\n style = {\n ...style,\n textAlign: 'right'\n };\n }\n\n if (column.overrideWidth) {\n style = {\n ...style,\n width: column.overrideWidth,\n maxWidth: column.overrideWidth,\n wordWrap: 'break-word', // IE11\n overflowWrap: 'break-word'\n };\n }\n\n if (type === 'header') {\n style = {\n ...style,\n fontWeight: 'bold',\n cursor: column.handleClickColumn ? 'pointer' : 'inherit',\n color: '#11a5c5'\n };\n }\n\n return style;\n };\n\n return <>\n \n \n {isDesktop || !ResponsiveComponent ? (\n <>\n \n {headerGroups.map(headerGroup => (\n \n {headerGroup.headers.map(column => (\n {\n const { handleClickColumn, sort } = column as ITableColumn;\n const sortProps: any = column.getHeaderProps(column.getSortByToggleProps());\n\n // If the column is sortable and there's an onClick handler, then call it\n const { onClick } = sortProps || {};\n sort !== false && onClick && onClick(e);\n\n // Also run column click handler if passed\n handleClickColumn && handleClickColumn(column.id);\n }}\n >\n {(column as ITableColumn).sort !== false || (column as ITableColumn).isServerSorted ? (\n \n {column.render('Header')}\n \n ) : (\n column.render('Header')\n )}\n \n ))}\n \n ))}\n \n \n {isLoading\n ? new Array(pageSize || 3).fill('').map((x, j) => (\n \n {columns.map((column, i) => (\n \n {column.hideLoad ? null : }\n \n ))}\n \n ))\n : page.map((row: Row, i) => {\n prepareRow(row);\n return !hideDeleted || (hideDeleted && !(row.original as any).isDeleted) ? (\n \n rowOnClick(e, row.original) } : {})}\n >\n {row.cells.map((cell, j) => {\n return (\n \n {cell.render('Cell')}\n \n );\n })}\n \n \n ) : null;\n })}\n \n \n ) : (\n \n {isLoading ? (\n \n \n {ResponsiveComponentLoader ? : }\n \n \n ) : (\n page.map((row, i) => {\n prepareRow(row);\n return !hideDeleted || (hideDeleted && !(row.original as any).isDeleted) ? (\n \n rowOnClick(e, row.original) } : {})}\n style={ResponsiveComponent ? { display: 'block' } : undefined}\n >\n \n \n \n \n \n ) : null;\n })\n )}\n \n )}\n \n {!isLoading && Array.isArray(data) && data.length > 0 && !hidePagination && (\n \n )}\n {!isLoading && Array.isArray(data) && data.length === 0 && (\n \n \n {noResultsText}\n \n \n )}\n\n {LoadMoreComponent && }\n \n ;\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n noResults: {\n marginTop: '1rem'\n },\n stickyHeader: {\n flexGrow: 1,\n maxHeight: '100%'\n },\n borderNone: {\n border: 'none'\n },\n mobileTable: {\n display: 'block'\n },\n mobileCell: {\n padding: 0,\n border: 0\n },\n\n}));\n","import React, { FC } from 'react';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport Alert from '@mui/material/Alert';\nimport Snackbar from '@mui/material/Snackbar';\nimport { SnackbarProps } from '@mui/material/Snackbar';\n\ninterface IToastProps extends SnackbarProps {\n autoHideDuration?: number | null;\n id: string;\n message: React.ReactNode | string;\n open: boolean;\n onClose: (e: React.SyntheticEvent, reason?: string) => void;\n variant: 'error' | 'info' | 'success' | 'warning';\n action?: React.ReactNode;\n}\n\nexport const Toast: FC = ({ autoHideDuration = 3000, id, message, onClose, open, variant, action, ...props }) => {\n const classes = useStyles();\n return (\n \n \n {message}\n \n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n toast: {\n // needed so its above the footer\n bottom: theme.spacing(5)\n }\n}));\n","import React, { FC } from 'react';\nimport { SnackbarProps } from '@mui/material/Snackbar';\nimport { Toast } from './Toast';\nimport { Button } from '../../components';\n\ninterface IEmployeeWarningToastProps extends SnackbarProps {\n autoHideDuration?: number | null; // Null makes the alert sticky. Requires confirmation before it can be closed.\n message?: React.ReactNode | string;\n open: boolean;\n variant?: 'error' | 'info' | 'success' | 'warning';\n onConfirm: () => void;\n}\n\nconst defaultWarningMessage = (\n <>\n Friendly Reminder: You are attempting to add new hires with an effective date that is less than 15 days away. This creates a challenge to connect with and\n enroll employees prior to their deadline. Please double check date of hire/effective dates to ensure all employees have the correct information uploaded. THANK YOU!\n \n);\n\nexport const EmployeeWarningToast: FC = ({\n autoHideDuration = null,\n message = defaultWarningMessage,\n open = false,\n variant = 'error',\n onConfirm,\n ...props\n}) => {\n return (\n {\n //Do Nothing\n }}\n variant={variant}\n autoHideDuration={autoHideDuration}\n action={\n \n }\n />\n );\n};\n","import React, { FC } from 'react';\nimport clsx from 'clsx';\nimport { Theme, alpha } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport createStyles from '@mui/styles/createStyles';\n// components\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Typography from '@mui/material/Typography';\n// types\nimport { CircularProgressProps } from '@mui/material/CircularProgress';\n\ntype LoaderPosition = 'centered' | 'left' | 'top-center';\ntype LoaderSize = 'small' | 'medium' | 'large';\ntype LoaderType = 'fullscreen' | 'inline' | 'overlay';\ntype LoaderTopOffset = number;\n\ninterface ILoaderExtendedProps extends CircularProgressProps {\n loaderWrapperClassName?: string;\n /** 'centered' | 'left' */\n position?: LoaderPosition;\n /** number */\n topOffset?: LoaderTopOffset;\n /** 'small' | 'medium' | 'large' */\n size?: LoaderSize;\n subtitle?: string;\n title?: string;\n /** 'inline' | 'overlay' */\n type?: LoaderType;\n}\n\nexport type ILoaderProps = Omit;\n\nexport const Loader: FC = ({ children, loaderWrapperClassName, subtitle, title = 'Loading...', ...props }) => {\n const classes = useStyles(props);\n return (\n \n
\n
\n
\n {children}\n {!children && (\n <>\n \n {title}\n \n {subtitle && (\n \n {subtitle}\n \n )}\n \n )}\n
\n
\n
\n {icon && icon === 'User' ?
:
}\n
\n {title && (\n \n {title}\n \n )}\n \n {message}\n \n {action && (\n {\n action(e);\n }}\n variant='contained'\n >\n {actionText || (stateType === 'empty' ? 'Undo' : 'Refresh')}\n \n )}\n {actionLink && actionLink}\n
\n
\n
\n {title}\n \n {items && (\n
\n {items\n .flatMap(item => item)\n .map((item, index) => {\n return (\n - \n {item}\n
\n );\n })}\n
\n )}\n
\n \n \n
\n
\n
{\n setShowGradient(true);\n }}\n style={{ backgroundColor: color, cursor: disable ? 'default' : 'pointer' }}\n type='button'\n disabled={disable}\n />\n\n {!disable ? (\n \n ) : (\n \n Hex\n {color}\n
\n )}\n \n {showGradient && (\n
{\n setShowGradient(false);\n }}\n >\n \n \n
\n \n )}\n \n - Must be at least 6 characters long
\n - Must have at least one capital letter
\n - Must have at least one numeric character
\n - Must have at least one "special" character, ex: !$#@%
\n
\n );\n};\nconst useStyles = makeStyles(() => {\n return {\n list: {\n fontSize: 14,\n paddingLeft: 24\n }\n };\n});\n","import { InputLabel } from '@mui/material';\nimport clsx from 'clsx';\nimport { FC } from 'react';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\n\ninterface IFormLabelProps {\n label: string;\n id: string;\n}\n\nexport const FormLabel: FC = ({ label, id }) => {\n const classes = useStyles();\n return (\n \n {label}\n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n outlinedLabel: {\n backgroundColor: theme.palette.common.white,\n paddingLeft: 2,\n paddingRight: 2\n },\n smallerLeading: {\n letterSpacing: '-.25px'\n }\n}));\n","import React, { FC, useEffect, useState } from 'react';\nimport makeStyles from '@mui/styles/makeStyles';\nimport { scaleLinear } from 'd3-scale';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n// Componnents\nimport { Button } from '@mui/material';\nimport clsx from 'clsx';\nimport { CheckCircleOutline, EventAvailable, HourglassEmpty } from '@mui/icons-material';\nimport { IProgressBarColors, IProgressBarItem } from '../../models';\n\ninterface IProgressBarProps {\n data?: {\n [key: string]: any;\n }[];\n totalCount: number;\n handleClick?: (val: string) => void;\n onLoad?: () => void;\n colors?: IProgressBarColors[];\n icons?: JSX.Element[];\n order?: number[];\n}\n\nexport const ProgressBar: FC = ({\n data,\n totalCount,\n handleClick,\n onLoad,\n colors = [\n { background: '#4C4B4C', text: '#fff' },\n { background: '#7CDEF3', text: '#fff' },\n { background: '#11A5C5', text: '#fff' }\n ],\n icons = [, , ],\n order\n}) => {\n const classes = useStyles();\n const isDesktop = useMediaQuery('(min-width: 600px)');\n\n const ticks = scaleLinear().domain([0, totalCount]).ticks(10);\n\n const assembleStatuses = () => {\n let statusArray = [];\n\n for (const [key, value] of Object.entries(data[0])) {\n const status = { name: key, count: value };\n statusArray.push(status);\n }\n // When received status order does not match what is desired to be displayed, things should be rearranged by given order\n if (order) {\n statusArray = statusArray.map((status, index) => {\n return {\n ...status,\n order: order[index]\n };\n });\n statusArray.sort((a, b) => (a.order > b.order ? 1 : -1));\n }\n // Combine colors and icons into status array\n const newStatuses = statusArray.map((status, index) => {\n return {\n ...status,\n background: colors[index].background,\n text: colors[index].text,\n icon: icons[index]\n };\n });\n setProgressBarData(newStatuses);\n };\n\n const calculateBarPercentage = (count: number) => {\n const value = (count / totalCount) * 100;\n const percent = value + '%';\n return percent;\n };\n\n const [progressBarData, setProgressBarData] = useState();\n\n useEffect(() => {\n assembleStatuses();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [data, totalCount]);\n\n if (progressBarData) {\n return (\n \n
\n {progressBarData.map((status, index) => {\n return (\n
\n {\n handleClick(status.name);\n }\n : undefined\n }\n color='inherit'\n fullWidth={true}\n id={`status-filter-${status.name}`}\n variant='text'\n title={`${status.count} ${status.name}`}\n >\n \n {status.count}\n {!isDesktop && {status.name}}\n {status.icon}
\n \n \n \n );\n })}\n
\n {ticks.map(tick => {\n return (\n
\n {tick}\n
\n );\n })}\n
\n {progressBarData.map((status, index) => {\n return (\n
\n );\n })}\n
\n
\n
\n
{isActive ? 'Active' : 'Inactive'}\n
\n
{role}\n
\n
{\n e.stopPropagation();\n handleEdit(original);\n }}\n size=\"large\">\n \n \n \n
\n \n {firstName} {lastName}\n \n {clientName || '--'}\n
\n
\n \n Email:\n \n {email || '--'}\n
\n \n \n Phone:\n \n {phoneNumber ? formatInputPhoneNumber(phoneNumber) : '--'}\n
\n \n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n root: {\n maxWidth: '100%',\n border: `1px solid ${theme.palette.grey[300]}`,\n overflowX: 'hidden'\n },\n accordion: {\n padding: '0 16px',\n '&& .MuiAccordionSummary-content': {\n marginBottom: 0\n }\n },\n panelSummaryWrapper: {\n marginTop: theme.spacing(0.5),\n '&:first-child': { marginTop: 0 }\n },\n details: {\n display: 'flex',\n flexDirection: 'column',\n padding: '12px 16px',\n backgroundColor: theme.palette.grey[100]\n },\n roleWrapper: {\n display: 'flex',\n alignItems: 'center'\n },\n editButton: {\n position: 'absolute',\n right: 0,\n top: 0\n },\n boldName: {\n color: theme.palette.primary.main,\n fontWeight: 600\n },\n activeName: {\n color: theme.palette.grey[500]\n },\n divider: {\n margin: '0 5px'\n },\n subLabelEmail: {\n marginRight: 10\n },\n subLabelPhone: {\n marginRight: 5\n }\n}));\n","import React, { FC, useState } from 'react';\nimport clsx from 'clsx';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport { FormControl, InputLabel, Select, MenuItem, Grid, Button, TextField, InputAdornment, Divider } from '@mui/material';\nimport { FilterList, Close, ArrowDropDown, ArrowDropUp, Search } from '@mui/icons-material';\n\ninterface IManageUsersFilters {\n isLoading: boolean;\n applyFilters: (clearFilters?: boolean) => void;\n selectedStatus: string;\n setSelectedStatus: (val: string) => void;\n setSelectedRole: (val: string) => void;\n selectedRole: string;\n setSearchValue: (val: string) => void;\n searchValue: string;\n handleSearch: (clearSearch?: boolean) => void;\n}\n\nexport const ManageUsersFilters: FC = ({\n isLoading,\n applyFilters,\n selectedStatus,\n setSelectedStatus,\n selectedRole,\n setSelectedRole,\n setSearchValue,\n handleSearch,\n searchValue\n}) => {\n const [hasAppliedFilters, setHasAppliedFilters] = useState(false);\n const [isMobileFilterButtonOpen, toggleMobileFilter] = useState(false);\n\n const classes = useStyles({ isMobileFilterButtonOpen });\n return (\n <>\n }\n endIcon={isMobileFilterButtonOpen ? : }\n onClick={() => {\n toggleMobileFilter(!isMobileFilterButtonOpen);\n }}\n >\n Filters\n \n {!isMobileFilterButtonOpen && }\n \n \n {\n if (searchValue.length > 0) {\n setHasAppliedFilters(true);\n handleSearch();\n }\n }}\n >\n \n \n ),\n endAdornment: searchValue ? (\n {\n setSearchValue('');\n handleSearch(true);\n }}\n >\n \n \n ) : null\n }}\n onKeyDown={e => {\n if (e.key === 'Enter' && searchValue.length > 0) {\n handleSearch();\n }\n }}\n onChange={e => {\n setSearchValue(e.target.value);\n }}\n />\n \n \n \n Status\n \n \n \n \n \n Role\n \n \n \n \n }\n onClick={() => {\n setHasAppliedFilters(true);\n applyFilters();\n }}\n >\n Apply Filters\n \n {hasAppliedFilters && (\n }\n onClick={() => {\n setSelectedStatus('Active');\n setHasAppliedFilters(false);\n setSearchValue('');\n setSelectedRole('');\n applyFilters(true);\n }}\n >\n Reset\n \n )}\n \n \n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n mobileButton: {\n width: '100%',\n [theme.breakpoints.up('sm')]: {\n display: 'none'\n }\n },\n button: {\n height: 40,\n textTransform: 'capitalize',\n width: '100%',\n '@media (min-width: 400px)': {\n width: '48%'\n },\n [theme.breakpoints.up('sm')]: {\n width: 'auto'\n }\n },\n resetButton: {\n '@media (min-width: 400px)': {\n marginLeft: 11\n },\n [theme.breakpoints.up('sm')]: {\n marginLeft: theme.spacing(1)\n }\n },\n wrapper: ({ isMobileFilterButtonOpen }) =>\n isMobileFilterButtonOpen\n ? {\n marginTop: 10,\n marginBottom: 10,\n display: 'flex'\n }\n : {\n display: 'none',\n marginBottom: theme.spacing(1),\n [theme.breakpoints.up('sm')]: {\n display: 'flex',\n marginBottom: theme.spacing(1)\n }\n },\n divider: {\n display: 'block',\n marginBottom: theme.spacing(1),\n [theme.breakpoints.up('sm')]: {\n display: 'none'\n }\n },\n searchIcon: {\n cursor: 'pointer',\n color: theme.palette.grey[500]\n }\n}));\n","import React, { FC, useState, useEffect } from 'react';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport { Formik, Form } from 'formik';\nimport * as Yup from 'yup';\nimport { deepEqual } from 'fast-equals';\nimport { Add, Save, Close, RecentActors } from '@mui/icons-material';\nimport Autocomplete from '@mui/material/Autocomplete';\n// Components\nimport { Toast, Modal, Loader, PasswordRequirements } from '../../../components';\nimport {\n Card,\n Fade,\n CardActions,\n Button,\n CardContent,\n CardHeader,\n TextField,\n Grid,\n FormControl,\n Paper,\n Select,\n InputLabel,\n MenuItem,\n Typography,\n FormHelperText,\n Switch,\n FormControlLabel\n} from '@mui/material';\n// models\nimport { IUserDetail, IUserRole, EUserRoles, UserRoles, IBroker, IBusinessClient } from '../../../models';\n// fetch\nimport { getUserRoles, updateUser, createUser, getBrokers, getBusinessClients } from '../../../fetch';\n// helpers\nimport { formatInputPhoneNumber, passwordRegex, getUserErrorHandling } from '../../../helpers';\n\ninterface IUserModal {\n open: boolean;\n onClose: () => void;\n onSave: () => void;\n currentUser: IUserDetail | null;\n}\n\nconst UserSchema = Yup.object().shape({\n firstName: Yup.string().max(255, 'Max 255 characters').required('Required'),\n lastName: Yup.string().max(255, 'Max 255 characters').required('Required'),\n brokerName: Yup.mixed().when('role', {\n is: (val: string) => val === EUserRoles.BROKER,\n then: Yup.string().required('Required'),\n otherwise: Yup.string().notRequired()\n }),\n businessClientNames: Yup.mixed().when('role', {\n is: (val: string) => {\n return val && val !== 'Administrator' && val !== 'Broker';\n },\n then: Yup.array().of(Yup.string()).required('Required'),\n otherwise: Yup.array().notRequired()\n }),\n newEmail: Yup.string().required('Required').max(255, 'Max 255 characters').email('Email address invalid'),\n role: Yup.string().required('Required'),\n newPassword: Yup.mixed().when('role', {\n is: (val: string) => {\n return val !== EUserRoles.ADMIN;\n },\n then: Yup.string().notRequired(),\n otherwise: Yup.string().required('Required').min(6, 'Password must be at least 6 characters').matches(passwordRegex, {\n message: 'Invalid Password'\n })\n })\n});\n\nconst EditUserSchema = Yup.object().shape({\n firstName: Yup.string().max(255, 'Max 255 characters').required('Required'),\n lastName: Yup.string().max(255, 'Max 255 characters').required('Required'),\n newEmail: Yup.string().required('Required').max(255, 'Max 255 characters').email('Email address invalid'),\n status: Yup.boolean(),\n brokerName: Yup.mixed().when('role', {\n is: (val: string) => val === EUserRoles.BROKER,\n then: Yup.string().required('Required'),\n otherwise: Yup.string().notRequired()\n }),\n businessClientNames: Yup.mixed().when('role', {\n is: (val: string) => val && val !== 'Administrator' && val !== 'Broker',\n then: Yup.array().of(Yup.string()).required('Required'),\n otherwise: Yup.array().notRequired()\n }),\n hasInitialDummyPassoword: Yup.boolean(),\n role: Yup.string().required('Required'),\n newPassword: Yup.mixed().when('hasInitialDummyPassoword', {\n is: (val: boolean) => val,\n then: Yup.string().notRequired(),\n otherwise: Yup.string().required('Required').min(6, 'Password must be at least 6 characters').matches(passwordRegex, {\n message: 'Invalid Password'\n })\n })\n});\n\nexport const UserModal: FC = ({ open, onClose, onSave, currentUser }) => {\n const classes = useStyles();\n const [isError, showError] = useState(false);\n const [isSuccess, showSuccess] = useState(false);\n const [errorMessage, setErrorMessage] = useState('');\n const [successMessage, setSuccessMessage] = useState('');\n const [roles, setRoles] = useState([]);\n const [brokers, setBrokers] = useState([]);\n const [brokersLoading, setBrokersLoading] = useState(true);\n const [businessClients, setBusinessClients] = useState([]);\n const [businessClientsLoading, setBusinessClientsLoading] = useState(true);\n\n const fetchRoles = async () => {\n try {\n const res = await getUserRoles();\n setRoles(res);\n } catch (err) {\n console.error(err);\n }\n };\n\n const fetchBrokers = async () => {\n try {\n const res = await getBrokers({\n perPage: '2147483647' // get all records\n });\n if (res.records) {\n setBrokers(res.records);\n } else {\n console.error(`No 'records' on brokers response.`);\n setErrorMessage('Error loading brokers, please try again.');\n }\n } catch (error) {\n console.error(error);\n setErrorMessage('Error loading brokers, please try again.');\n }\n setBrokersLoading(false);\n };\n\n const fetchBusinessClients = async () => {\n try {\n const res = await getBusinessClients({\n perPage: '2147483647' // get all records\n });\n if (res.records) {\n setBusinessClients(res.records);\n } else {\n console.error(`No 'records' on business clients response.`);\n setErrorMessage('Error loading business clients, please try again.');\n }\n } catch (error) {\n console.error(error);\n setErrorMessage('Error loading business clients, please try again.');\n }\n setBusinessClientsLoading(false);\n };\n\n useEffect(() => {\n fetchBrokers();\n fetchRoles();\n fetchBusinessClients();\n }, []);\n\n return (\n <>\n 0 ? currentUser.businessClient.map(client => client.name) : []\n }}\n validationSchema={currentUser ? EditUserSchema : UserSchema}\n onSubmit={async (values, actions) => {\n try {\n if (currentUser) {\n const { brokerName, businessClientNames, ...rest } = values;\n let businessClientIds: number[] = [];\n\n if (businessClientNames && businessClientNames.length > 0) {\n // eslint-disable-next-line\n businessClientNames.map(name => {\n // eslint-disable-next-line\n businessClients.map(client => {\n if (name === client.name) {\n businessClientIds.push(client.businessClientId);\n }\n });\n });\n }\n const selectedBroker = brokers.find(broker => broker.name === brokerName);\n const selectedRole = roles.find(role => role.description === rest.role);\n const res = await updateUser(currentUser.userId, {\n firstName: rest.firstName,\n lastName: rest.lastName,\n email: rest.newEmail,\n isActive: rest.status,\n role: selectedRole && (selectedRole.value as UserRoles as any),\n password: rest.hasInitialDummyPassoword ? null : rest.newPassword,\n brokerId: selectedBroker ? selectedBroker.brokerId : undefined,\n businessClientIds: businessClientIds.length === 0 ? undefined : businessClientIds\n });\n const { hasError, message } = getUserErrorHandling(res);\n if (message && hasError) {\n setErrorMessage(message);\n showError(true);\n }\n if (!hasError) {\n showSuccess(true);\n setSuccessMessage('User Updated!');\n onClose();\n onSave();\n actions.resetForm();\n }\n } else {\n const { brokerName, businessClientNames, ...rest } = values;\n let businessClientIds: number[] = [];\n\n if (businessClientNames && businessClientNames.length > 0) {\n // eslint-disable-next-line\n businessClientNames.map(name => {\n // eslint-disable-next-line\n businessClients.map(client => {\n if (name === client.name) {\n businessClientIds.push(client.businessClientId);\n }\n });\n });\n }\n const selectedBroker = brokers.find(broker => broker.name === brokerName);\n const selectedRole = roles.find(role => role.description === rest.role);\n const res = await createUser({\n firstName: rest.firstName,\n lastName: rest.lastName,\n email: rest.newEmail,\n role: selectedRole && (selectedRole.value as UserRoles as any),\n password: rest.hasInitialDummyPassoword ? null : rest.newPassword,\n brokerId: selectedBroker ? selectedBroker.brokerId : undefined,\n businessClientIds: businessClientIds.length === 0 ? undefined : businessClientIds\n });\n const { hasError, message } = getUserErrorHandling(res);\n if (message && hasError) {\n setErrorMessage(message);\n showError(true);\n }\n\n if (!hasError) {\n showSuccess(true);\n onClose();\n onSave();\n actions.resetForm();\n }\n }\n } catch (error) {\n console.log(error);\n if (error && error.Errors && Object.values(error.Errors)[0] && Object.values(Object.values(error.Errors)[0])[0]) {\n setErrorMessage(Object.values(Object.values(error.Errors)[0])[0] as string);\n }\n showError(true);\n }\n }}\n >\n {({ resetForm, isSubmitting, values, initialValues, setFieldValue, errors, touched, handleSubmit, dirty, isValid, handleBlur }) => {\n return (\n {\n if (!deepEqual(initialValues, values)) {\n const result = window.confirm('You have unsaved changes, are you sure you want to exit?');\n if (result) {\n resetForm();\n onClose();\n } else {\n return;\n }\n } else {\n onClose();\n resetForm();\n }\n }}\n maxWidth='md'\n >\n {isSubmitting && }\n \n \n \n \n );\n }}\n \n {\n setSuccessMessage('');\n showSuccess(false);\n }}\n variant='success'\n />\n {\n setErrorMessage('');\n showError(false);\n }}\n variant='error'\n />\n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n primaryHeader: {\n backgroundColor: theme.palette.primary.main,\n color: theme.palette.common.white,\n marginBottom: theme.spacing(1)\n },\n marginBottom: {\n marginBottom: theme.spacing(1)\n },\n column: {\n display: 'flex',\n flexDirection: 'column',\n '& > div:not(:first-of-type)': {\n marginTop: theme.spacing(1)\n }\n },\n outlinedLabel: {\n backgroundColor: theme.palette.common.white,\n paddingLeft: 2,\n paddingRight: 2\n },\n content: {\n marginTop: theme.spacing(1)\n },\n cardContent: {\n paddingTop: 0\n },\n paperBorder: {\n border: `1px solid ${theme.palette.grey[300]}`\n }\n}));\n","import React, { useMemo, useState, useEffect } from 'react';\nimport { Grid, IconButton, Typography } from '@mui/material';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport useMediaQuery from '@mui/material/useMediaQuery';\n// Components\nimport { Page } from '../../../components/skeleton';\nimport { Table, Pagination, Toast, PageTitle, Button, Loader } from '../../../components';\nimport { MobileManageUser } from './MobileManageUser';\nimport { ManageUsersFilters } from './ManageUsersFilters';\nimport { UserModal } from './UserModal';\n// icons\nimport { Edit, Add, Close } from '@mui/icons-material';\n// Types\nimport { SortOptions, DESC_SORT, ASC_SORT, IUser, IUserDetail } from '../../../models';\n// Fetch\nimport { getUser, getUsers } from '../../../fetch';\n\ninterface IFilters {\n search?: string;\n role?: string;\n isActive?: boolean;\n}\n\nexport const ManageUsers = () => {\n const classes = useStyles();\n\n // state\n const [page, setPage] = useState(0);\n const [perPage, setRowsPerPage] = useState(10);\n const [recordCount, setRecordCount] = useState(0);\n const [users, setUsers] = useState([]);\n const [isLoading, setIsLoading] = useState(true);\n const [errorMessage, setErrorMessage] = useState('');\n const [successMessage, setSuccessMessage] = useState('');\n const [sortDirection, setSortDirection] = useState<{\n ClientName?: SortOptions;\n FirstName?: SortOptions;\n LastName?: SortOptions;\n Email?: SortOptions;\n PhoneNumber?: SortOptions;\n Role?: SortOptions;\n IsActive?: SortOptions;\n }>({\n FirstName: ASC_SORT\n });\n const [selectedSort, setSelectedSort] = useState('FirstName');\n const [filters, setFilters] = useState(null);\n const [isUserModalOpen, showUserModal] = useState(false);\n const [currentUser, setCurrentUser] = useState(null);\n const [isLoadingOverlay, setLoadingOverlay] = useState(false);\n const [selectedStatus, setSelectedStatus] = useState('Active');\n const [selectedRole, setSelectedRole] = useState('');\n const [searchValue, setSearch] = useState('');\n const [searchedValue, setSearchedValue] = useState('');\n\n const fetchUsers = async () => {\n setIsLoading(true);\n try {\n const searchParams = {\n page: page + 1,\n perPage,\n sortBy: selectedSort,\n sortDirection: sortDirection[selectedSort] as string,\n role: filters && filters.role ? filters.role : null,\n isActive: filters && filters.isActive !== null ? filters.isActive : true,\n search: searchValue ? searchValue : null\n };\n const usersResponse = await getUsers(searchParams);\n if (searchValue) {\n setSearchedValue(searchValue);\n } else {\n setSearchedValue('');\n }\n if (usersResponse.records) {\n setUsers(usersResponse.records);\n setRecordCount(usersResponse.totalRecordCount);\n } else {\n console.error(`No 'records' on users response.`);\n setErrorMessage('Error loading users, please try again.');\n }\n } catch (error) {\n console.error(error);\n setErrorMessage('Error loading users, please try again.');\n }\n setIsLoading(false);\n };\n\n useEffect(() => {\n fetchUsers();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [sortDirection, selectedSort, page, perPage, filters]);\n\n const handleClickColumn = (column: string) => {\n setSelectedSort(column);\n setSortDirection({\n ...sortDirection,\n [column]: sortDirection[column] === ASC_SORT ? DESC_SORT : ASC_SORT\n });\n };\n\n const handleEdit = async id => {\n try {\n setLoadingOverlay(true);\n const res = await getUser(id);\n setCurrentUser(res);\n showUserModal(true);\n } catch (error) {\n console.log(error);\n } finally {\n setLoadingOverlay(false);\n }\n };\n\n const columns = useMemo(() => {\n return [\n {\n Header: 'Broker/Client Name',\n accessor: 'clientName',\n isServerSorted: selectedSort === 'ClientName',\n isServerSortedDesc: sortDirection.ClientName === DESC_SORT,\n handleClickColumn: () => handleClickColumn('ClientName')\n },\n {\n Header: 'First Name',\n accessor: 'firstName',\n isServerSorted: selectedSort === 'FirstName',\n isServerSortedDesc: sortDirection.FirstName === DESC_SORT,\n handleClickColumn: () => handleClickColumn('FirstName')\n },\n {\n Header: 'Last Name',\n accessor: 'lastName',\n isServerSorted: selectedSort === 'LastName',\n isServerSortedDesc: sortDirection.LastName === DESC_SORT,\n handleClickColumn: () => handleClickColumn('LastName')\n },\n {\n Header: 'Email',\n accessor: 'email',\n isServerSorted: selectedSort === 'Email',\n isServerSortedDesc: sortDirection.Email === DESC_SORT,\n handleClickColumn: () => handleClickColumn('Email')\n },\n {\n Header: 'Phone',\n accessor: 'phoneNumber',\n isServerSorted: selectedSort === 'PhoneNumber',\n isServerSortedDesc: sortDirection.PhoneNumber === DESC_SORT,\n handleClickColumn: () => handleClickColumn('PhoneNumber')\n },\n {\n Header: 'Role',\n accessor: 'role',\n isServerSorted: selectedSort === 'Role',\n isServerSortedDesc: sortDirection.Role === DESC_SORT,\n handleClickColumn: () => handleClickColumn('Role')\n },\n {\n Header: 'Active',\n accessor: (d: IUser) => (d.isActive ? 'Yes' : 'No'),\n isServerSorted: selectedSort === 'IsActive',\n isServerSortedDesc: sortDirection.IsActive === DESC_SORT,\n handleClickColumn: () => handleClickColumn('IsActive'),\n overrideWidth: 60\n },\n {\n id: 'actions',\n overrideWidth: 60,\n Header: '',\n className: classes.editButton,\n Cell: ({\n cell: {\n row: { original }\n }\n }: {\n cell: { row: { original: IUser } };\n }) => {\n return <>\n {\n handleEdit(original.userId);\n }}\n size=\"large\">\n \n \n ;\n }\n }\n ];\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [users, sortDirection, selectedSort, page, perPage, filters]);\n\n const hasData = users && users.length > 0;\n const isMobile = useMediaQuery('(max-width: 960px)');\n const isSmMobile = useMediaQuery('(max-width: 600px)');\n\n return <>\n {isLoadingOverlay && (\n \n Loading...\n \n )}\n \n \n \n } onClick={() => showUserModal(true)} color='primary' variant='contained' className={classes.addUserButton}>\n Add User\n \n \n setSearch(val)}\n setSelectedRole={(val: string) => setSelectedRole(val)}\n setSelectedStatus={(val: string) => setSelectedStatus(val)}\n handleSearch={(clearSearch?: boolean) => {\n setFilters({\n isActive: selectedStatus === 'Active' ? true : false,\n role: selectedRole,\n search: clearSearch ? null : searchValue\n });\n if (clearSearch) {\n setSearchedValue('');\n }\n }}\n applyFilters={(clearFilters?: boolean, clearSearch?: boolean) => {\n if (clearFilters) {\n setFilters({\n isActive: true,\n role: '',\n search: ''\n });\n } else {\n setFilters({\n ...filters,\n isActive: selectedStatus === 'Active' ? true : false,\n role: selectedRole\n });\n }\n }}\n />\n {searchedValue && (\n \n \n Showing results for \"{searchedValue}\"\n \n }\n className={classes.clearSearchButton}\n onClick={() => {\n setSearch('');\n setSearchedValue('');\n setFilters({\n isActive: selectedStatus === 'Active' ? true : false,\n role: selectedRole,\n search: null\n });\n }}>\n Clear Search\n \n \n )}\n \n
{\n handleEdit(val.userId);\n }\n }}\n />\n {!isLoading && hasData && (\n \n )}\n \n
\n {name}\n \n
\n {\n e.stopPropagation();\n handleEdit(original);\n }}\n size=\"large\">\n \n \n {\n e.stopPropagation();\n handleDelete(original);\n }}\n size=\"large\">\n \n \n
\n
\n \n Business Client:\n \n {name || '--'}\n
\n \n \n Broker:\n \n {broker && broker.name ? broker.name : '--'}\n
\n \n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n root: {\n maxWidth: '100%',\n border: `1px solid ${theme.palette.grey[300]}`,\n overflowX: 'hidden'\n },\n accordion: {\n padding: '0 16px',\n '&& .MuiAccordionSummary-expandIcon': {\n padding: 3\n }\n },\n topPanelSummaryWrapper: {\n marginTop: theme.spacing(0.5),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n width: '100%',\n '&:first-child': { marginTop: 0 }\n },\n panelSummaryWrapper: {\n '&:first-child': { marginTop: 0 }\n },\n details: {\n display: 'flex',\n flexDirection: 'column',\n padding: '12px 16px',\n backgroundColor: theme.palette.grey[100]\n },\n roleWrapper: {\n display: 'flex',\n alignItems: 'center'\n },\n editButton: {\n padding: `2px 5px`\n },\n deleteButton: {\n padding: `2px 5px`,\n color: theme.palette.error.main\n },\n boldName: {\n color: theme.palette.primary.main,\n fontWeight: 600\n },\n subLabelEmail: {\n marginRight: 10\n },\n buttonsWrapper: {\n display: 'flex'\n }\n}));\n","import { DependencyList, useEffect } from 'react';\nimport { useTimeoutFn } from './useTimeoutFn';\n\nexport type UseDebounceReturn = [() => boolean | null, () => void];\n\nexport const useDebounce = (fn: Function, ms: number = 0, deps: DependencyList = []): UseDebounceReturn => {\n const [isReady, cancel, reset] = useTimeoutFn(fn, ms);\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useEffect(reset, deps);\n\n return [isReady, cancel];\n};\n","import { useCallback, useEffect, useRef } from 'react';\n\nexport type UseTimeoutFnReturn = [() => boolean | null, () => void, () => void];\n\nexport const useTimeoutFn = (fn: Function, ms: number = 0): UseTimeoutFnReturn => {\n const ready = useRef(false);\n const timeout = useRef>();\n const callback = useRef(fn);\n\n const isReady = useCallback(() => ready.current, []);\n\n const set = useCallback(() => {\n ready.current = false;\n timeout.current && clearTimeout(timeout.current);\n\n timeout.current = setTimeout(() => {\n ready.current = true;\n callback.current();\n }, ms);\n }, [ms]);\n\n const clear = useCallback(() => {\n ready.current = null;\n timeout.current && clearTimeout(timeout.current);\n }, []);\n\n // update ref when function changes\n useEffect(() => {\n callback.current = fn;\n }, [fn]);\n\n // set on mount, clear on unmount\n useEffect(() => {\n set();\n\n return clear;\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [ms]);\n\n return [isReady, clear, set];\n};\n","import { useState } from 'react';\n\ntype RequestState = {\n isLoading: boolean;\n error: Error | null;\n data: T | null;\n};\n\nconst useRequestState = () => {\n const [requestState, setRequestState] = useState>({\n isLoading: false,\n error: null,\n data: null,\n });\n\n const request = async (requestFunction: () => Promise) => {\n setRequestState({\n isLoading: true,\n error: null,\n data: null,\n });\n\n try {\n const response = await requestFunction();\n setRequestState({\n isLoading: false,\n error: null,\n data: response,\n });\n } catch (err) {\n setRequestState({\n isLoading: false,\n error: err as Error,\n data: null,\n });\n }\n };\n\n return { ...requestState, request };\n};\n\nexport default useRequestState;","import React from 'react';\nimport { FormHelperText, Theme } from '@mui/material'; // Assuming you are using Material-UI\nimport makeStyles from '@mui/styles/makeStyles';\n\ninterface Props {\n message?: string;\n error?: boolean;\n testClass?: string;\n}\n\nconst FieldErrorMessage: React.FC = ({ message, error = true, testClass }) => {\n const classes = useStyles();\n return message ? (\n {message}\n ) : null;\n};\nconst useStyles = makeStyles((theme: Theme) => ({\n errorText: {\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n whiteSpace: 'nowrap'\n }\n}));\n\nexport default FieldErrorMessage;","import React from 'react';\nimport {\n FormControl,\n Select,\n MenuItem,\n FormHelperText,\n} from '@mui/material';\nimport { FormLabel } from '..';\nimport { IDropdownResponse } from '../../models';\nimport FieldErrorMessage from '../field-error-message/FieldErrorMessage ';\n\ninterface Props {\n options: IDropdownResponse[];\n isLoading: boolean;\n error?: string;\n value: any;\n setFieldValue: (field: string, value: any) => void;\n handleBlur: any;\n label: string;\n id: string;\n}\n\nconst GenericDropdown: React.FC = ({\n options,\n isLoading,\n error,\n value,\n setFieldValue,\n handleBlur,\n label,\n id\n}) => {\n return (\n \n \n setFieldValue(id, e.target.value as string)}\n labelId={id}\n id={id}\n size=\"small\"\n value={value}\n onBlur={handleBlur}\n disabled={isLoading}\n >\n {!isLoading &&\n options.map((option, index) => (\n \n {option.description}\n \n ))}\n \n\n \n \n );\n};\n\nexport default GenericDropdown;","import { Form, Formik } from 'formik';\nimport React, { FC, useState, useEffect } from 'react';\nimport { Button, Loader, Modal, Toast } from '../../../../../components';\nimport makeStyles from '@mui/styles/makeStyles';\nimport { Theme } from '@mui/material/styles';\nimport {\n Fade,\n Grid,\n TextField,\n FormControl,\n Typography,\n CardActions,\n} from '@mui/material';\nimport { createBusinessClientWithMinimalData, getBusinessClientProjectTypes } from '../../../../../fetch';\nimport useRequestState from '../../../../../hooks/useRequestState';\nimport { IDropdownResponse, IMinimalAddBusinessClient } from '../../../../../models';\nimport { DatePicker } from '../../../../../components';\nimport { Save } from '@mui/icons-material';\nimport * as Yup from 'yup';\nimport { SubmitStatus } from '../../../../../models/util';\nimport GenericDropdown from '../../../../../components/generic-dropdown/GenericDropdown';\n\ninterface IAddNewBusinessClientModal {\n open: boolean;\n onClose: () => void;\n onSave: (result?: string) => void;\n}\n\nconst schema = Yup.object().shape({\n name: Yup.string().max(255, 'Max 255 characters').required('Required'),\n projectType: Yup.string().optional().nullable(),\n openEnrollmentEffectiveDate: Yup.string().optional().nullable(),\n});\n\n\nconst hasErrorsOnResponse = (res: any) => {\n if (res && (typeof res === 'boolean' || typeof res === 'number')) {\n return false;\n }\n\n return true;\n}\n\nconst getErrorMessageOnResponse = (res: any) => {\n\n if (res?.Errors && Object?.values(Object?.values(res?.Errors)?.[0])?.[0]) {\n // validation errors\n return Object.values(Object.values(res.Errors)[0])[0] as string;\n }\n if (res?.Detail) {\n return res?.Detail;\n }\n};\n\nconst AddNewBusinessClientModal: FC = ({ open, onClose, onSave }) => {\n const initialValues: IMinimalAddBusinessClient = { name: '', projectType: null, openEnrollmentEffectiveDate: null };\n const classes = useStyles();\n const { isLoading: isLoadingProjectTypes, data: projectTypes, request } = useRequestState();\n\n\n const [submitStatus, setSubmitStatus] = useState({ status: 'idle' });\n\n useEffect(() => {\n const fetchProjectTypes = async () => {\n try {\n const res = await getBusinessClientProjectTypes();\n return res;\n } catch (error) {\n console.error(error);\n }\n };\n\n request(fetchProjectTypes);\n }, []);\n\n return <>\n { }} />\n { }}\n variant='error'\n />\n {\n\n setSubmitStatus({ status: 'submitting' });\n\n const res = await createBusinessClientWithMinimalData(values);\n const hasErrors = hasErrorsOnResponse(res);\n\n if (hasErrors) {\n const errorMessage = getErrorMessageOnResponse(res);\n setSubmitStatus({ status: 'error', errorMessage: errorMessage });\n return;\n }\n\n setSubmitStatus({ status: 'success' });\n actions.resetForm();\n\n onClose();\n onSave(values.name);\n\n }}\n validationSchema={schema}\n\n >\n {({ resetForm, isSubmitting, values, initialValues, setFieldValue, errors, touched, handleSubmit, dirty, isValid, handleBlur }) => {\n return ( {\n setSubmitStatus({ status: 'idle' });\n resetForm();\n onClose()\n }}\n maxWidth='md'\n >\n \n \n \n\n )\n }}\n \n}\n\nconst useStyles = makeStyles((theme: Theme) => ({\n buttonsContainer: {\n marginTop: theme.spacing(1)\n },\n saveButton: {\n '@media (max-width: 450px)': {\n width: '100%'\n }\n },\n primaryHeader: {\n backgroundColor: theme.palette.primary.main,\n color: theme.palette.common.white,\n marginBottom: theme.spacing(1)\n },\n marginBottom: {\n marginBottom: theme.spacing(1)\n },\n column: {\n display: 'flex',\n flexDirection: 'column',\n '& > div:not(:first-of-type)': {\n marginTop: theme.spacing(1)\n }\n },\n outlinedLabel: {\n backgroundColor: theme.palette.common.white,\n paddingLeft: 2,\n paddingRight: 2\n },\n content: {\n marginTop: theme.spacing(1)\n },\n cardContent: {\n paddingTop: 0\n },\n paperBorder: {\n border: `1px solid ${theme.palette.grey[300]}`\n }\n}));\n\nexport default AddNewBusinessClientModal;","import React, { useMemo, useState, useEffect, useContext } from 'react';\nimport { TextField, InputAdornment, Box } from '@mui/material';\nimport { Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport useMediaQuery from '@mui/material/useMediaQuery';\nimport { useHistory } from 'react-router-dom';\nimport { withTracker } from '../../../services';\n// Components\nimport { Page } from '../../../components/skeleton';\nimport { Table, Pagination, Toast, PageTitle, Button, Loader } from '../../../components';\nimport { MobileBusinessClient } from './MobileBusinessClients';\n// icons\nimport { Edit, Add, Delete, Close, Search } from '@mui/icons-material';\n// Types\nimport { DESC_SORT, ASC_SORT, IBusinessClient } from '../../../models';\n// Fetch\nimport { getBusinessClients, deleteBusinessClient } from '../../../fetch';\n// hooks\nimport { useDebounce } from '../../../hooks';\n// context\nimport { ManageBusinessClientCtx } from '../../../context';\nimport AddNewBusinessClientModal from './AddNewBusinessClient/AddNewBusinessClientModal';\n\nexport const ManageBusinessClients = withTracker(() => {\n const classes = useStyles();\n const history = useHistory();\n const { selectedSort, setSelectedSort, searchValue, setSearchValue, sortDirection, setSortDirection } = useContext(ManageBusinessClientCtx);\n // state\n const [page, setPage] = useState(0);\n const [perPage, setRowsPerPage] = useState(10);\n const [recordCount, setRecordCount] = useState(0);\n const [businessClients, setBusinessClients] = useState([]);\n const [isLoading, setIsLoading] = useState(true);\n const [errorMessage, setErrorMessage] = useState('');\n const [successMessage, setSuccessMessage] = useState('');\n const [isDeleting, setDeleting] = React.useState(false);\n\n const [isAddNewBusinessClientModal, showAddNewBusinessClientModal] = useState(false);\n\n const fetchBusinessClients = async (search?: string, startPage?: number) => {\n setIsLoading(true);\n try {\n const res = await getBusinessClients({\n page: startPage ?? page + 1,\n perPage,\n sortBy: selectedSort,\n sortDirection: sortDirection[selectedSort] as string,\n search: search === null ? undefined : search || searchValue\n });\n if (startPage) {\n setPage(0);\n }\n if (res.records) {\n setBusinessClients(res.records);\n setRecordCount(res.totalRecordCount);\n } else {\n console.error(`No 'records' on business clients response.`);\n setErrorMessage('Error loading business clients, please try again.');\n }\n } catch (error) {\n console.error(error);\n setErrorMessage('Error loading business clients, please try again.');\n } finally {\n setIsLoading(false);\n }\n };\n\n const handleDelete = async id => {\n const result = window.confirm('Are you sure you want to delete this business client?');\n if (result) {\n setDeleting(true);\n try {\n await deleteBusinessClient(id);\n fetchBusinessClients();\n setSuccessMessage('Business Client Deleted!');\n } catch (error) {\n setErrorMessage(error);\n } finally {\n setDeleting(false);\n }\n }\n };\n\n const handleEdit = async id => {\n history.push(`/manage-business-clients/${id}`);\n };\n\n useEffect(() => {\n fetchBusinessClients();\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [sortDirection, selectedSort, page, perPage]);\n\n const handleClickColumn = (column: string) => {\n setSelectedSort(column);\n setSortDirection({\n ...sortDirection,\n [column]: sortDirection[column] === ASC_SORT ? DESC_SORT : ASC_SORT\n });\n };\n const columns = useMemo(() => {\n return [\n {\n Header: 'Business Client',\n accessor: 'name',\n isServerSorted: selectedSort === 'Name',\n isServerSortedDesc: sortDirection.Name === DESC_SORT,\n handleClickColumn: () => handleClickColumn('Name')\n },\n {\n Header: 'Broker',\n accessor: 'broker.name',\n isServerSorted: selectedSort === 'Broker',\n isServerSortedDesc: sortDirection.Broker === DESC_SORT,\n handleClickColumn: () => handleClickColumn('Broker')\n },\n {\n id: 'actions',\n Header: '',\n className: classes.editButton,\n Cell: ({\n cell: {\n row: { original }\n }\n }: {\n cell: { row: { original: IBusinessClient } };\n }) => {\n return (\n <>\n }\n onClick={async () => {\n handleEdit(original.businessClientId);\n }}\n >\n Edit\n \n }\n onClick={() => {\n handleDelete(original.businessClientId);\n }}\n >\n Delete\n \n \n );\n }\n }\n ];\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [businessClients, sortDirection, selectedSort, page, perPage]);\n\n const hasData = businessClients && businessClients.length > 0;\n const isMobile = useMediaQuery('(max-width: 960px)');\n\n useDebounce(\n () => {\n if (searchValue) {\n fetchBusinessClients(searchValue, 1);\n }\n },\n 500,\n [searchValue]\n );\n\n return (\n <>\n {isDeleting && (\n \n Deleting...\n \n )}\n \n \n \n
\n \n \n \n \n ),\n endAdornment: searchValue ? (\n {\n setSearchValue('');\n fetchBusinessClients(null);\n }}\n >\n \n \n ) : null\n }}\n onChange={e => {\n setSearchValue(e.target.value);\n }}\n />\n \n }\n onClick={() => showAddNewBusinessClientModal(true)}\n color='primary'\n variant='contained'\n className={classes.addButton}\n >\n Add Business Client\n \n \n
handleEdit(bussinessClient.businessClientId),\n handleDelete: (bussinessClient: IBusinessClient) => handleDelete(bussinessClient.businessClientId)\n }}\n />\n\n showAddNewBusinessClientModal(false)}\n onSave={(result) => { setSearchValue(result) }} />\n {!isLoading && hasData && (\n \n )}\n \n
\n {name}\n \n
\n {\n e.stopPropagation();\n handleEdit(original);\n }}\n size=\"large\">\n \n \n {\n e.stopPropagation();\n handleDelete(original);\n }}\n size=\"large\">\n \n \n
\n
\n \n Broker Name:\n \n {name || '--'}\n
\n \n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n root: {\n maxWidth: '100%',\n border: `1px solid ${theme.palette.grey[300]}`,\n overflowX: 'hidden'\n },\n accordion: {\n padding: '0 16px',\n '&& .MuiAccordionSummary-expandIcon': {\n padding: 3\n }\n },\n topPanelSummaryWrapper: {\n marginTop: theme.spacing(0.5),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n width: '100%',\n '&:first-child': { marginTop: 0 }\n },\n panelSummaryWrapper: {\n '&:first-child': { marginTop: 0 }\n },\n details: {\n display: 'flex',\n flexDirection: 'column',\n padding: '12px 16px',\n backgroundColor: theme.palette.grey[100]\n },\n roleWrapper: {\n display: 'flex',\n alignItems: 'center'\n },\n editButton: {\n padding: `2px 5px`\n },\n deleteButton: {\n padding: `2px 5px`,\n color: theme.palette.error.main\n },\n boldName: {\n color: theme.palette.primary.main,\n fontWeight: 600\n },\n subLabelEmail: {\n marginRight: 10\n },\n buttonsWrapper: {\n display: 'flex'\n }\n}));\n","import clsx from 'clsx';\nimport { FormHelperText, Typography } from '@mui/material';\nimport { alpha, Theme } from '@mui/material/styles';\nimport makeStyles from '@mui/styles/makeStyles';\nimport React, { FC } from 'react';\nimport { DropzoneState } from 'react-dropzone';\n\ninterface IFileDropProps extends DropzoneState {\n error?: Error | null;\n id: string;\n title: string;\n className?: string;\n}\n\nexport const FileDrop: FC = ({ children, error, id, title, className, ...props }) => {\n const classes = useStyles();\n\n return (\n \n
0) || error\n ? classes.draggedFiles\n : props.isDragActive\n ? classes.isDragActive\n : props.isFocused\n ? classes.isFocused\n : ''\n )}\n {...props.getRootProps()}\n >\n \n \n {title}\n \n {children}
\n {props.isDragActive && (\n \n Drop your image\n
\n )}\n \n
\n {title && (\n
\n {title}\n \n )}\n
\n
\n
\n
\n {name && (\n \n {name}\n \n )}\n \n \n \n }\n >\n Remove & Replace\n \n
\n
\n
\n \n \n \n \n ),\n endAdornment: searchValue ? (\n {\n setSearchValue('');\n setSearchValueDebounced('');\n }}\n >\n \n \n ) : null\n }}\n onChange={e => {\n setSearchValue(e.target.value);\n }}\n />\n \n
\n
{\n await fetchBroker(broker.brokerId);\n // setCurrentBroker(broker);\n showBrokerModal(true);\n },\n handleDelete: (broker: IBroker) => handleDelete(broker.brokerId)\n }}\n />\n {!isLoading && hasData && (\n \n )}\n \n
\n \n {selectedIcon.icon}\n \n
\n {icon.name && (\n
\n {icon.name}\n \n )}\n
\n
\n \n \n 
\n \n \n \n {formValues.header}\n \n \n \n {icons.map((icon, index) => {\n return icon.enabled ? (\n \n {getMobileAppPreviewIcon(icon, appButtonColor, textColor, classes.link, classes.icon, classes.name)}\n \n ) : null;\n })}\n \n \n \n
\n
\n {({ field }) => {\n return (\n \n );\n }}\n \n
\n {({ field }) => {\n return (\n \n );\n }}\n \n
\n Minimum height of 140 pixels.\n
\n For best results, use a square image between 180x180 pixels and 192x192 pixels.\n \n {previewError && {previewError}}\n \n \n )}\n \n )}\n \n \n \n \n \n \n \n {({ field, form }: FieldProps) => {\n return (\n {\n form.setFieldValue('hexColor', c.hex);\n }}\n />\n );\n }}\n \n \n \n \n {({ field, form }: FieldProps) => {\n return (\n {\n form.setFieldValue('secondaryHexColor', c.hex);\n }}\n />\n );\n }}\n \n \n \n \n {({ field, form }: FieldProps) => {\n return (\n {\n form.setFieldValue('textHexColor', c.hex);\n }}\n />\n );\n }}\n \n \n \n \n \n \n \n \n \n \n \n Custom Mobile App Header\n \n \n setFieldValue('header', e.target.value)}\n error={Boolean(touched.header && errors.header)}\n helperText={touched.header && errors.header}\n />\n \n \n theme.spacing(1) }}>\n \n Custom Mobile App Icons\n \n \n \n \n \n {({ form }) => {\n return ;\n }}\n \n
\n \n \n \n \n \n {formValues.qrCodes.length > 0 && (\n <>\n \n \n Mobile App URLs\n \n \n {formValues.qrCodes.map((qrCode, index) => {\n return setFieldValue(`qrCodes.${index}.url`, val)} />;\n })}\n \n \n )}\n \n );\n};\n\nconst useStyles = makeStyles((theme: Theme) => ({\n formLabel: formLabel,\n radioGroupLabel: { marginBottom: theme.spacing(0.5) },\n linkSwitchLabel: {\n marginRight: 0\n },\n linkIcon: {\n fontSize: theme.spacing(2)\n },\n linkColumnGrow: {\n minWidth: '1px',\n width: '100%',\n [theme.breakpoints.up('md')]: {\n width: 'auto',\n flex: 1\n }\n },\n linkIconColumn: {\n '&&.MuiGrid-item': {\n paddingTop: theme.spacing(1.25)\n },\n [theme.breakpoints.down('lg')]: {\n '&&.MuiGrid-item': {\n paddingBottom: 0,\n marginBottom: -theme.spacing(0.25)\n }\n }\n },\n linkSwitchColumn: {\n '&&.MuiGrid-item': {\n paddingTop: theme.spacing(1)\n },\n [theme.breakpoints.down('lg')]: {\n '&&.MuiGrid-item': {\n paddingBottom: 0,\n marginBottom: -theme.spacing(0.25)\n }\n }\n },\n linkRow: {\n alignItems: 'center',\n '&&.MuiGrid-container': {\n paddingBottom: theme.spacing(2)\n }\n },\n scrollable: {\n paddingTop: theme.spacing(0.5),\n maxHeight: 650,\n paddingRight: 50,\n overflowY: 'scroll'\n },\n disableOpacity: {\n opacity: '.3'\n },\n activeIcon: {\n color: theme.palette.primary.dark\n },\n preview: {\n marginTop: theme.spacing(2),\n display: 'flex',\n justifyContent: 'center'\n },\n divider: {\n marginTop: theme.spacing(2),\n marginBottom: theme.spacing(2)\n },\n subHeader: {\n marginTop: '-10px',\n fontWeight: 'bold',\n marginBottom: theme.spacing(0.5)\n },\n nameTextField: {\n marginTop: theme.spacing(1)\n },\n colorPicker: {\n [theme.breakpoints.up('md')]: {\n marginTop: theme.spacing(-2.5)\n }\n },\n logoDrop: {\n marginTop: theme.spacing(1),\n marginBottom: 0\n },\n logoUploaded: {\n margin: theme.spacing(1, 0, 0)\n },\n appIconLogoPicker: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n },\n dragIcon: {\n position: 'absolute',\n top: 25,\n right: 25,\n background: 'white',\n fill: theme.palette.grey[600],\n fontSize: '2rem',\n cursor: 'grab'\n }\n}));\n","import React, { useContext } from 'react';\nimport { createContext, useState } from 'react';\n\nconst ErrorMessageCtx = createContext<[string, React.Dispatch>]>([null, () => { }]);\n\nconst ErrorMessageProvider: React.FC = ({ children }) => {\n const [errorMessage, setErrorMessage] = useState(null);\n\n return (\n \n {children}\n \n );\n};\n\nexport { ErrorMessageCtx, ErrorMessageProvider };\n\nconst useErrorMessage = (): [string, React.Dispatch>] => {\n const [errorMessage, setErrorMessage] = useContext(ErrorMessageCtx);\n return [errorMessage, setErrorMessage];\n};\n\nexport default useErrorMessage;\n","import { RequestState } from \"../models/request-state\";\n\nexport type RequestAction =\n | { type: 'REQUEST_LOADING' }\n | { type: 'REQUEST_SUCCESS'; payload: T }\n | { type: 'REQUEST_ERROR'; payload: string };\n\nconst requestReducer = () => (state: RequestState, action: RequestAction): RequestState => {\n switch (action.type) {\n case 'REQUEST_LOADING':\n return { ...state, status: 'loading', data: null, error: null };\n case 'REQUEST_SUCCESS':\n return { ...state, status: 'success', data: action.payload, error: null };\n case 'REQUEST_ERROR':\n return { ...state, status: 'error', data: null, error: action.payload };\n default:\n return state;\n }\n};\nexport default requestReducer;","import React, { useReducer } from \"react\";\nimport { IBusinessClassOptions, IDefaultDropdownsOptions, IDropdownResponse, IFinancialOptions, IGeneralDropdownsOptions, IInsuranceCoverageOptions, IMedicalInsuranceOptions, ISystemOfRecord, IUser } from \"../models\";\nimport requestReducer, { RequestAction } from \"../reducers/request-reducer\";\nimport { RequestState } from \"../models/request-state\";\n\n// Define the context data type\ninterface DropDownCollectionsCtxType {\n industriesRequest: RequestState;\n dispatchIndustries?: React.Dispatch>;\n anticipatedSupportsRequest: RequestState;\n dispatchAnticipatedSupports?: React.Dispatch>;\n contactRolesRequest: RequestState;\n dispatchContactRoles?: React.Dispatch>;\n\n medicalInsuranceOptionsRequest: RequestState;\n dispatchMedicalInsuranceOptions?: React.Dispatch>;\n\n financialOptionsRequest: RequestState;\n dispatchFinancialOptions?: React.Dispatch>;\n\n insuranceCoverageOptionsRequest: RequestState;\n dispatchInsuranceCoverageOptionsRequest?: React.Dispatch>;\n\n defaultDropdownsOptionsRequest: RequestState;\n dispatchDefaultDropdownsOptionsRequest?: React.Dispatch>;\n\n businessClassOptionsRequest: RequestState;\n dispatchBusinessClassOptionsRequest?: React.Dispatch>;\n\n states: RequestState;\n systemOfRecords: RequestState;\n users: RequestState;\n dataFileRecipients: RequestState