\n \n \n {initials}\n \n \n
\n );\n }\n\n return (\n - {children}
- \n {children}\n
\n
\n );\n};\n\nexport default Pagination;\n","import React from \"react\";\n\nimport classnames from \"classnames\";\n\ntype BodyProps = {\n children: any;\n className: string;\n};\n\nconst Body = ({ children, className }: BodyProps) => (\n \n {totalPages > 1 && (\n
\n {isDesktop && isPerPageVisible && (\n \n {!isFirstPage && (\n {\n handleClick(prevPage);\n }}\n >\n {\n handleClick(nextPage);\n }}\n >\n
\n )}\n \n {paginationRange?.map((page, index) => (\n \n {\n handleClick(page);\n }}\n >\n {page}\n \n \n ))}\n
\n {!isLastPage && (\n \n \n \n \n \n \n \n \n {title || \"items/page\"}\n
\n )}\n {children}
\n);\n\nexport default Body;\n","import React from \"react\";\n\nimport classnames from \"classnames\";\n\ntype FooterProps = {\n children: any;\n className: string;\n};\n\nconst Footer = ({ children, className }: FooterProps) => (\n {children}
\n);\n\nexport default Footer;\n","import React from \"react\";\n\nimport classnames from \"classnames\";\n\ntype HeaderProps = {\n children: any;\n className: string;\n};\n\nconst Header = ({ children, className }: HeaderProps) => (\n {children}
\n);\n\nexport default Header;\n","import React, { useRef } from \"react\";\n\nimport classnames from \"classnames\";\nimport { useOutsideClick } from \"helpers\";\n\nimport Body from \"./Body\";\nimport Footer from \"./Footer\";\nimport Header from \"./Header\";\n\ntype SidePanelProps = {\n WrapperClassname?: string;\n setFilterVisibilty;\n children;\n disableOutsideClick?: boolean;\n};\n\nconst SidePanel = ({\n WrapperClassname,\n setFilterVisibilty,\n children,\n disableOutsideClick = false,\n}: SidePanelProps) => {\n const wrapperRef = useRef(null);\n\n useOutsideClick(\n wrapperRef,\n () => setFilterVisibilty(false),\n !disableOutsideClick\n );\n\n return (\n \n {summary.label}\n
\n\n {summary.hideCurrencySymbol\n ? summary.value\n : currencyFormat(\n currency,\n summary.value,\n summary.value > 999 ? \"compact\" : \"standard\"\n )}\n
\n \n ))}\n \n);\n\nexport default SummaryDashboard;\n","import React from \"react\";\n\nimport { Switch as HeadlessSwitch } from \"@headlessui/react\";\nimport classNames from \"classnames\";\n\nconst Switch = ({ enabled, onChange }) => (\n{content}
\n )}\n \n );\n};\n\nexport default Tooltip;\n","import axios from \"axios\";\nimport { Toastr } from \"StyledComponents\";\n\nimport {\n clearCredentialsFromLocalStorage,\n getValueFromLocalStorage,\n} from \"utils/storage\";\n\nclass ApiHandler {\n axios: any;\n constructor() {\n this.axios = axios.create({\n baseURL: \"/internal_api/v1\",\n headers: {\n Accept: \"application/json\",\n \"Content-Type\": \"application/json\",\n \"X-CSRF-TOKEN\": document\n .querySelector('[name=\"csrf-token\"]')\n .getAttribute(\"content\"),\n },\n });\n\n this.axios.interceptors.response.use(\n (response: any) => {\n if (response) {\n const { data, status } = response;\n response.success = status === 200;\n const { reset_session, notice } = data;\n if (data && !reset_session && notice) {\n Toastr.success(notice);\n }\n }\n\n return response;\n },\n (error: any) => {\n if (error.response?.status === 401) {\n clearCredentialsFromLocalStorage();\n Toastr.error(error.response?.data?.error);\n setTimeout(() => (window.location.href = \"/\"), 500);\n }\n\n Toastr.error(\n error.response?.data?.errors ||\n error.response?.data?.error ||\n error.response?.data?.notice ||\n error.message ||\n error.notice ||\n \"Something went wrong!\"\n );\n if (error.response?.status === 423) {\n setTimeout(() => (window.location.href = \"/\"), 500);\n }\n\n return Promise.reject(error);\n }\n );\n\n this.axios.interceptors.request.use(\n async (config: any) => {\n const token = getValueFromLocalStorage(\"authToken\");\n const email = getValueFromLocalStorage(\"authEmail\");\n const headers = {\n \"X-Auth-Email\": email,\n \"X-Auth-Token\": token,\n };\n\n const newConfig = {\n ...config,\n headers: {\n ...config.headers,\n ...headers,\n },\n };\n\n return newConfig;\n },\n (error: any) => Promise.reject(error)\n );\n }\n}\n\nconst Api = new ApiHandler();\n\nexport default Api.axios;\n","import axios from \"./api\";\n\nconst authApi = axios.create({\n baseURL: \"/internal_api/v1\",\n headers: {\n Accept: \"application/json\",\n \"Content-Type\": \"application/json\",\n \"X-CSRF-TOKEN\": document\n .querySelector('[name=\"csrf-token\"]')\n .getAttribute(\"content\"),\n },\n});\n\nconst signin = payload => authApi.post(\"/users/login\", { user: payload });\n\nconst signup = payload => authApi.post(\"/users/signup\", { user: payload });\n\nconst forgotPassword = payload =>\n authApi.post(\"/users/forgot_password\", { user: payload });\n\nconst resetPassword = payload =>\n authApi.put(\"/users/reset_password\", { user: payload });\n\nconst sendEmailConfirmation = payload =>\n axios.post(`/users/resend_confirmation_email`, { user: payload });\n\nconst googleAuth = () =>\n axios\n .create({\n baseURL: \"/\",\n headers: {\n \"Access-Control-Allow-Origin\": \"*\",\n },\n })\n .get(\"users/auth/google_oauth2\");\n\nconst authenticationApi = {\n signin,\n signup,\n forgotPassword,\n resetPassword,\n googleAuth,\n sendEmailConfirmation,\n};\n\nexport default authenticationApi;\n","import axios from \"./api\";\n\nconst get = clientId => axios.get(`/clients/${clientId}/client_members`);\n\nconst update = (id, clientId, payload) =>\n axios.patch(`/clients/${clientId}/client_members/${id}`, payload);\n\nconst destroy = (id, clientId) =>\n axios.delete(`/clients/${clientId}/client_members/${id}`);\n\nconst clientMembersApi = {\n get,\n update,\n destroy,\n};\n\nexport default clientMembersApi;\n","import axios from \"./api\";\n\nconst path = \"/clients\";\n\nconst formHeaders = {\n headers: {\n \"Content-Type\": \"multipart/form-data\",\n },\n};\n\nconst get = async queryParam => axios.get(`${path}${queryParam}`);\n\nconst create = async payload => axios.post(`${path}`, payload, formHeaders);\n\nconst show = async (id, queryParam) => axios.get(`${path}/${id}${queryParam}`);\n\nconst update = async (id, payload) =>\n axios.patch(`${path}/${id}`, payload, formHeaders);\n\nconst destroy = async id => axios.delete(`${path}/${id}`);\n\nconst sendPaymentReminder = async (id, payload) =>\n axios.post(`${path}/${id}/send_payment_reminder`, payload);\n\nconst addClientContact = async (id, payload) =>\n axios.post(`${path}/${id}/add_client_contact`, payload);\n\nconst invoices = async (query = \"\") =>\n axios.get(query ? `${path}/invoices?${query}` : `${path}/invoices`);\n\nconst clientApi = {\n update,\n destroy,\n get,\n show,\n create,\n invoices,\n sendPaymentReminder,\n addClientContact,\n};\n\nexport default clientApi;\n","import axios from \"./api\";\n\nconst path = \"/companies\";\nconst authApi = axios.create({\n baseURL: \"/internal_api/v1\",\n headers: {\n Accept: \"application/json\",\n \"Content-Type\": \"application/json\",\n \"X-CSRF-TOKEN\": document\n .querySelector('[name=\"csrf-token\"]')\n .getAttribute(\"content\"),\n },\n});\n\nconst formHeaders = {\n headers: {\n \"Content-Type\": \"multipart/form-data\",\n },\n};\n\nconst index = async () => axios.get(`${path}`);\n\nconst create = payload => authApi.post(path, payload, formHeaders);\n\nconst update = (id, payload) =>\n axios.put(`${path}/${id}`, payload, formHeaders);\n\nconst destroy = id => axios.delete(`${path}/${id}`);\n\nconst removeLogo = id => axios.delete(`${path}/${id}/purge_logo`);\n\nconst companiesApi = {\n index,\n create,\n update,\n destroy,\n removeLogo,\n};\n\nexport default companiesApi;\n","import axios from \"./api\";\n\nconst path = \"/employments\";\n\nconst get = async () => axios.get(`${path}`);\n\nconst companyUsersApi = { get };\n\nexport default companyUsersApi;\n","import axios from \"./api\";\n\nconst path = \"/timezones\";\n\nconst get = async () => axios.get(`${path}`);\n\nconst companyProfileApi = { get };\n\nexport default companyProfileApi;\n","import axios from \"./api\";\n\nconst get = async userId => axios.get(`/users/${userId}/devices`);\n\nconst deviceApi = { get };\n\nexport default deviceApi;\n","import axios from \"./api\";\n\nconst path = \"/expenses\";\n\nconst index = (query = \"\") => axios.get(query ? `${path}?${query}` : path);\n\nconst create = payload =>\n axios.post(path, payload, {\n headers: {\n \"Content-Type\": \"multipart/form-data\",\n },\n });\n\nconst show = id => axios.get(`${path}/${id}`);\n\nconst update = (id, payload, config) =>\n axios.patch(`${path}/${id}`, payload, config);\n\nconst destroy = id => axios.delete(`${path}/${id}`);\n\nconst createCategory = payload => axios.post(\"/expense_categories\", payload);\n\nconst createVendors = payload => axios.post(\"/vendors\", payload);\n\nconst expensesApi = {\n index,\n create,\n show,\n update,\n destroy,\n createCategory,\n createVendors,\n};\n\nexport default expensesApi;\n","import axios from \"./api\";\n\nconst allHolidays = () => axios.get(\"/holidays\");\n\nconst updateHolidays = (year, payload) =>\n axios.patch(`/holidays/${year}`, payload);\n\nconst holidaysApi = {\n allHolidays,\n updateHolidays,\n};\n\nexport default holidaysApi;\n","import axios from \"./api\";\n\nconst path = \"/invoices\";\n\nconst get = async (query = \"\") =>\n axios.get(query ? `${path}?${query}` : `${path}`);\n\nconst post = async body => axios.post(`${path}`, body);\n\nconst patch = async (id, body) => axios.post(`${path}/${id}`, body);\n\nconst destroy = id => axios.delete(`${path}/${id}`);\n\nconst destroyBulk = invoice_ids =>\n axios.post(`${path}/bulk_deletion`, invoice_ids);\n\nconst getInvoice = async id => axios.get(`${path}/${id}`);\n\nconst editInvoice = async id => axios.get(`${path}/${id}/edit`);\n\nconst downloadInvoice = async id =>\n await axios.get(`${path}/${id}/download`, { responseType: \"blob\" });\n\nconst bulkDownloadInvoices = async queryString =>\n await axios.get(`${path}/bulk_download?${queryString}`);\n\nconst updateInvoice = async (id, body) => axios.patch(`${path}/${id}/`, body);\n\nconst sendInvoice = async (id, payload) =>\n axios.post(`${path}/${id}/send_invoice`, payload);\n\nconst viewInvoice = async id => axios.get(`${path}/${id}/view`);\n\nconst paymentSuccess = async id => axios.get(`${path}/${id}/payments/success`);\n\nconst wavieInvoice = async id => axios.patch(`${path}/waived/${id}`);\n\nconst invoiceLogs = async id => axios.get(`${path}/action_trails/${id}`);\nconst sendReminder = async (id, payload) =>\n await axios.post(`${path}/${id}/send_reminder`, payload);\n\nconst getDownloadStatus = async downloadId =>\n axios.get(`invoices/bulk_download/status`, {\n params: { download_id: downloadId },\n });\n\nconst invoicesApi = {\n get,\n post,\n patch,\n destroy,\n sendInvoice,\n getInvoice,\n destroyBulk,\n editInvoice,\n updateInvoice,\n downloadInvoice,\n bulkDownloadInvoices,\n viewInvoice,\n paymentSuccess,\n wavieInvoice,\n invoiceLogs,\n sendReminder,\n getDownloadStatus,\n};\n\nexport default invoicesApi;\n","import axios from \"./api\";\n\nconst path = \"/payments/settings\";\n\nconst get = async () => axios.get(`${path}`);\n\nconst connectStripe = async () => axios.post(`${path}/stripe/connect`);\n\nconst disconnectStripe = async () => axios.delete(`${path}/stripe/disconnect`);\n\nconst paymentSettings = { get, connectStripe, disconnectStripe };\n\nexport default paymentSettings;\n","import axios from \"../api\";\n\nconst path = \"/payments\";\n\nconst get = () => axios.get(`${path}`);\n\nconst create = async payload => axios.post(`${path}`, payload);\n\nconst show = async (id, queryParam) => axios.get(`${path}/${id}${queryParam}`);\n\nconst update = async (id, payload) => axios.patch(`${path}/${id}`, payload);\n\nconst destroy = async id => axios.delete(`${path}/${id}`);\n\nconst getInvoiceList = () => axios.get(`${path}/new`);\n\nconst payments = { update, destroy, get, show, create, getInvoiceList };\n\nexport default payments;\n","import axios from \"../api\";\n\nconst path = \"/payments/providers\";\n\nconst get = () => axios.get(path);\nconst update = (id, provider) => axios.patch(`${path}/${id}`, provider);\n\nconst PaymentsProviders = {\n get,\n update,\n};\n\nexport default PaymentsProviders;\n","import axios from \"./api\";\n\nconst path = \"/project_members\";\n\nconst update = async (id, payload) => axios.put(`${path}/${id}`, payload);\n\nconst projectMembersApi = { update };\n\nexport default projectMembersApi;\n","import axios from \"./api\";\n\nconst path = \"/projects\";\n\nconst get = async () => axios.get(`${path}`);\n\nconst create = async payload => axios.post(`${path}`, payload);\n\nconst show = async (id, timeFrame = \"week\") =>\n axios.get(`${path}/${id}?time_frame=${timeFrame}`);\n\nconst update = async (id, payload) => axios.patch(`${path}/${id}`, payload);\n\nconst destroy = async id => axios.delete(`${path}/${id}`);\n\nconst search = async term => axios.get(`${path}/search?search_term=${term}`);\n\nconst projectApi = { get, show, create, update, destroy, search };\n\nexport default projectApi;\n","import axios from \"./api\";\n\nconst path = \"/reports/time_entries/\";\n\nconst get = queryParams => axios.get(`${path}${queryParams}`);\n\nconst download = (type, queryParams) =>\n axios({\n method: \"GET\",\n url: `${path}/download.${type}${queryParams}`,\n responseType: \"blob\",\n });\n\nconst reportsApi = { get, download };\n\nexport default reportsApi;\n","import axios from \"../api\";\n\nconst path = \"/reports/accounts_aging\";\n\nconst get = () => axios.get(path);\n\nconst download = (type, queryParams) =>\n axios({\n method: \"GET\",\n url: `${path}/download.${type}${queryParams}`,\n responseType: \"blob\",\n });\n\nconst accountsAgingApi = { get, download };\n\nexport default accountsAgingApi;\n","import axios from \"../api\";\n\nconst path = \"/reports/client_revenues/\";\n\nconst get = (from, to, clientIds) =>\n axios.get(\n `${path}?duration_from=${from}&duration_to=${to}&client_ids=[${clientIds}]`\n );\n\nconst newReport = async () => axios.get(`${path}new`);\n\nconst download = (type, queryParams) =>\n axios({\n method: \"GET\",\n url: `${path}/download.${type}${queryParams}`,\n responseType: \"blob\",\n });\n\nconst clientRevenueApi = { get, newReport, download };\n\nexport default clientRevenueApi;\n","import axios from \"../api\";\n\nconst path = \"/reports/outstanding_overdue_invoices/\";\n\nconst get = () => axios.get(path);\n\nconst download = type =>\n axios({\n method: \"GET\",\n url: `${path}/download.${type}`,\n responseType: \"blob\",\n });\n\nconst reports = { get, download };\n\nexport default reports;\n","import axios from \"./api\";\n\nconst path = \"/team\";\n\nconst get = (query = \"\") => axios.get(query ? `${path}?${query}` : path);\nconst search = term => {\n const payload = { \"q[first_name_or_last_name_or_email_cont]\": term };\n const queryParams = new URLSearchParams(payload).toString();\n\n return axios.get(`${path}?${queryParams}`);\n};\n\nconst destroyTeamMember = id => axios.delete(`${path}/${id}`);\n\nconst updateTeamMember = (id, payload) => axios.put(`${path}/${id}`, payload);\n\nconst destroyTeamMemberAvatar = id => axios.delete(`${path}/${id}/avatar`);\n\nconst updateTeamMemberAvatar = (id, payload, config) =>\n axios.put(`${path}/${id}/avatar`, payload, config);\n\nconst updateTeamMembers = payload =>\n axios.put(`${path}/update_team_members`, payload);\n\n//TODO: connect Invitation flow\nconst inviteMember = payload => axios.post(\"/invitations\", payload);\nconst resendInvite = id => axios.post(`/invitations/${id}/resend`);\nconst updateInvitedMember = (id, payload) =>\n axios.put(`/invitations/${id}`, payload);\nconst deleteInvitedMember = id => axios.delete(`/invitations/${id}`);\n\nconst teamApi = {\n get,\n search,\n destroyTeamMember,\n destroyTeamMemberAvatar,\n updateTeamMember,\n updateInvitedMember,\n updateTeamMemberAvatar,\n deleteInvitedMember,\n inviteMember,\n updateTeamMembers,\n resendInvite,\n};\n\nexport default teamApi;\n","import axios from \"./api\";\n\nconst get = async id => axios.get(`team/${id}/details`);\n\nconst updateUser = (userId, payload) =>\n axios.put(`team/${userId}/details`, payload);\n\nconst getAddress = async userId => axios.get(`users/${userId}/addresses`);\nconst createAddress = (userId, payload) =>\n axios.post(`/users/${userId}/addresses`, payload);\n\nconst updateAddress = (userId, addrId, payload) =>\n axios.put(`users/${userId}/addresses/${addrId}`, payload);\n\nconst getEmploymentDetails = async id => axios.get(`employments/${id}`);\n\nconst updateEmploymentDetails = async (id, payload) =>\n axios.patch(`employments/${id}`, payload);\n\nconst getPreviousEmployments = async id =>\n axios.get(`users/${id}/previous_employments`);\n\nconst updatePreviousEmployments = async (id, payload) =>\n axios.put(`bulk_previous_employments/${id}`, payload);\n\nconst teamsApi = {\n get,\n getAddress,\n updateUser,\n updateAddress,\n createAddress,\n getEmploymentDetails,\n updateEmploymentDetails,\n getPreviousEmployments,\n updatePreviousEmployments,\n};\n\nexport default teamsApi;\n","import axios from \"./api\";\n\nconst path = \"/time-tracking\";\n\nconst get = async () => axios.get(path);\n\nconst getCurrentUserEntries = (from, to, year, uid) =>\n axios.get(`${path}?from=${from}&to=${to}&year=${year}&user_id=${uid}`);\n\nconst timeTrackingApi = { get, getCurrentUserEntries };\n\nexport default timeTrackingApi;\n","import axios from \"./api\";\n\nconst path = \"/timeoff_entries\";\n\nconst create = async (payload, userId) =>\n axios.post(`${path}?user_id=${userId}`, payload);\n\nconst update = async (id, payload) => axios.put(`${path}/${id}`, payload);\n\nconst destroy = async id => axios.delete(`${path}/${id}`);\n\nconst timeoffEntryApi = {\n create,\n update,\n destroy,\n};\n\nexport default timeoffEntryApi;\n","import axios from \"./api\";\n\nconst path = \"/timesheet_entry\";\n\nconst create = async (params, userId) =>\n axios.post(`${path}?user_id=${userId}`, params);\n\nconst list = async (from, to, uid) =>\n axios.get(`${path}?from=${from}&to=${to}&user_id=${uid}`);\n\nconst update = async (id, payload) => axios.put(`${path}/${id}`, payload);\n\nconst destroy = async id => axios.delete(`${path}/${id}`);\n\nconst destroyBulk = async payload =>\n axios.delete(`${path}/bulk_action/`, { data: { source: payload } });\n\nconst updateBulk = async payload =>\n axios.patch(`${path}/bulk_action/`, payload);\n\nconst timesheetEntryApi = {\n list,\n create,\n update,\n destroy,\n destroyBulk,\n updateBulk,\n};\n\nexport default timesheetEntryApi;\n","import axios from \"./api\";\n\nconst path = \"/workspaces\";\n\nconst get = async () => await axios.get(path);\n\nconst update = async id => await axios.put(`${path}/${id}`);\n\nconst WorkspaceApi = { get, update };\n\nexport default WorkspaceApi;\n","import React from \"react\";\n\nconst AmountBoxContainer = ({ amountBox, cssClass = \"\" }) => (\n {data.title}
\n\n {data.amount}\n
\n \n ))}\n \n);\n\nexport default AmountBoxContainer;\n","import React from \"react\";\n\nconst SearchDropdown = ({ list = [], loading, SearchedDataRow }: Iprops) => {\n if (!loading && list.length == 0) {\n return (\nNo results found
\n \n setSearchQuery(e.target.value)}\n onKeyDown={e => handleEnter(debouncedSearchQuery, e.key === \"Enter\")}\n />\n \n
\n );\n};\n\ninterface Iprops {\n searchAction: (val) => any; // eslint-disable-line\n SearchDataRow;\n wrapperClassName?: string;\n handleEnter?: (val, shouldUpdate) => any; // eslint-disable-line\n clearSearch?: () => any;\n}\n\nexport default AutoSearch;\n","import React from \"react\";\n\nimport { minToHHMM } from \"helpers\";\nimport { Tooltip } from \"react-tooltip\";\nimport \"react-tooltip/dist/react-tooltip.css\";\n\nimport { IChartBarGraph, ISingleClient } from \"./interface\";\n\nconst Client = ({ element, totalMinutes, index }: ISingleClient) => {\n const chartColor = [\n \"miru-chart-green\",\n \"miru-chart-blue\",\n \"miru-chart-pink\",\n \"miru-chart-orange\",\n ];\n const chartColorIndex = index % 4;\n const randomColor = chartColor[chartColorIndex];\n const hourPercentage = (element.minutes * 100) / totalMinutes;\n const finalHourPercentage =\n hourPercentage > 1 ? hourPercentage : Math.ceil(hourPercentage);\n\n const divStyle = {\n width: `${finalHourPercentage}%`,\n };\n\n return (\n \n \n
\n );\n};\n\nconst GetClientBar = ({ data, totalMinutes }: IChartBarGraph) => {\n //removing elements whose minutes value is less than or equal to zero.\n const dataWithMinutes = data.filter(element => element.minutes > 0);\n\n return (\n {element.name}
\n{minToHHMM(element.minutes)}
\n \n\n
\n \n TOTAL HOURS:{\" \"}\n {minToHHMM(totalMinutes)}\n
\n\n {dataWithMinutes.map((element, index) => {\n if (element.minutes > 0) {\n return (\n
\n \n 0\n {minToHHMM(totalMinutes)}\n
\n \n \n \n {!isUpdatedDesign ? (\n \n \n \n \n \n \n ) : (\n \n
\n \n {text && text.length > 0 && (\n \n \n \n {!isUpdatedDesign ? (\n \n \n \n \n \n \n ) : (\n \n
\n \n {text !== \"\" && (\n \n \n
\n )}\n onChange={newDate => handleChange(formatDate(newDate))}\n />\n );\n};\n\ntype CustomDatePickerProps = {\n visibility?: boolean;\n handleChange: any;\n date: any;\n setVisibility?: (visibility: boolean) => any;\n wrapperRef?: any;\n dateFormat?: any;\n};\n\nexport default CustomDatePicker;\n","/* eslint-disable no-unused-vars */\nimport React, { useEffect, useRef, useState } from \"react\";\n\nimport { getMonth, getYear } from \"date-fns\";\nimport dayjs from \"dayjs\";\nimport {\n CaretCircleLeftIcon,\n CaretCircleRightIcon,\n LeftArrowIcon,\n} from \"miruIcons\";\nimport DatePicker from \"react-datepicker\";\nimport \"react-datepicker/dist/react-datepicker.css\";\n\nimport { validDateFormats, months, CUSTOM_DATE_RANGE_ERRORS } from \"./utils\";\n\ninterface DateRange {\n from: string;\n to: string;\n}\n\nconst CustomDateRangePicker = ({\n hideCustomFilter,\n handleSelectDate,\n onClickInput,\n selectedInput,\n dateRange,\n setSelectedInput = (inputFieldName: string) => {}, // eslint-disable-line\n setIsDisableDoneBtn = (isDisableDoneBtn: boolean) => {}, // eslint-disable-line\n}) => {\n const fromInput = \"from-input\";\n const toInput = \"to-input\";\n const [errors, setErrors] = useState({\n fromInput: \"\",\n toInput: \"\",\n });\n const [isValidDateRange, setIsValidDateRange] = useState\n \n changeMonth(months.indexOf(value))\n }\n >\n {months.map(option => (\n \n ))}\n \n changeYear(value)}\n >\n {years.map(option => (\n \n ))}\n \n
\n \n \n
\n )}\n onChange={date => {\n const fieldName = selectedInput == fromInput ? \"fromInput\" : \"toInput\";\n handleSelectDate(date);\n validateDateInput(date, fieldName);\n if (selectedInput == fromInput && !dateRange.to) {\n toInputRef.current.focus();\n toInputRef.current.click(onClickInput);\n resetErrors(\"toInput\");\n }\n }}\n />\n );\n};\n\nexport default CustomDateRangePicker;\n","export const months = [\n \"Jan\",\n \"Feb\",\n \"Mar\",\n \"Apr\",\n \"May\",\n \"Jun\",\n \"Jul\",\n \"Aug\",\n \"Sep\",\n \"Oct\",\n \"Nov\",\n \"Dec\",\n];\nexport const validDateFormats = [\n \"DD MMM YYYY\",\n \"DD MMMM YYYY\",\n \"MM/DD/YYYY\",\n \"YYYY/MM/DD\",\n \"MM-DD-YYYY\",\n \"YYYY-MM-DD\",\n];\n\nexport const CUSTOM_DATE_RANGE_ERRORS = {\n BLANK_DATE: \"Date can not be blank\",\n FROM_DATE_IS_NOT_BEFORE_TO_DATE:\n \"'From' date must be less than or equal to 'To' date\",\n TO_DATE_IS_NOT_AFTER_FROM_DATE:\n \"'To' date must be greater than or equal to 'From' date\",\n INVALID_DATE: \"Please enter a valid date\",\n};\n","/* eslint-disable import/exports-last */\n\nimport React from \"react\";\n\nimport classNames from \"classnames\";\n\nconst defaultInputBoxClassName =\n \"form__input block w-full appearance-none bg-white p-4 text-sm lg:text-base h-12 border-miru-gray-1000\";\nconst defaultWrapperClassName = \"outline relative h-12\";\nconst defaultLabelClassname =\n \"absolute top-0.5 h-6 z-1 origin-0 bg-white p-2 text-sm 2xl:text-base font-medium text-miru-dark-purple-200 duration-300\";\n\ntype customInputTextProps = {\n id?: string;\n inputBoxClassName?: string;\n disabled?: boolean;\n name?: string;\n type?: string;\n value: any;\n onChange: any;\n labelClassName?: string;\n label?: string;\n wrapperClassName?: string;\n moveLabelToRightClassName?: string;\n moveLabelToLeftClassName?: string;\n readOnly?: boolean;\n autoFocus?: boolean;\n step?: any;\n min?: any;\n onFocus?: (e?: any) => void; // eslint-disable-line\n onBlur?: (e?: any) => void; // eslint-disable-line\n onClick?: (e?: any) => void; // eslint-disable-line\n};\n\nexport const CustomInputText = ({\n id,\n inputBoxClassName,\n disabled,\n name,\n type,\n value,\n onChange,\n onFocus,\n onBlur,\n labelClassName,\n label,\n wrapperClassName,\n moveLabelToRightClassName,\n moveLabelToLeftClassName,\n readOnly,\n step,\n min,\n onClick,\n autoFocus,\n}: customInputTextProps) => (\n \n \n
\n Custom Date Range
\n\n
\n \n handleDateInputOnBlur(e.target.value, \"fromInput\")}\n onClick={onClickInput}\n onChange={e =>\n handleDateInputChange(e.target.value, \"fromInput\")\n }\n />\n
\n \n {errors.fromInput &&
\n {errors.fromInput}
}\n \n handleDateInputOnBlur(e.target.value, \"toInput\")}\n onChange={e => handleDateInputChange(e.target.value, \"toInput\")}\n onClick={onClickInput}\n />\n
\n \n {errors.toInput &&
\n {errors.toInput}
}\n \n \n
\n \n \n changeMonth(months.indexOf(value))\n }\n >\n {months.map(option => (\n \n ))}\n \n changeYear(value)}\n >\n {years.map(option => (\n \n ))}\n \n
\n \n \n \n {label}\n \n
\n);\n\nCustomInputText.defaultProps = {\n type: \"text\",\n disabled: false,\n readOnly: false,\n autoFocus: false,\n step: 1,\n min: null,\n moveLabelToLeftClassName: \"left-1\",\n moveLabelToRightClassName: \"\",\n onChange: () => {}, // eslint-disable-line @typescript-eslint/no-empty-function\n onFocus: () => {}, // eslint-disable-line @typescript-eslint/no-empty-function\n onBlur: () => {}, // eslint-disable-line @typescript-eslint/no-empty-function\n onClick: () => {}, // eslint-disable-line\n};\n","import React from \"react\";\n\nimport classnames from \"classnames\";\n\nconst DEFAULT_STYLE_WRAPPER = \"flex items-center cursor-pointer\";\n\nconst DEFAULT_STYLE_LABEL =\n \"text-sm text-miru-dark-purple-1000 font-normal leading-5\";\nconst DEFAULT_STYLE_INPUT = \"hidden w-3 h-3 custom__radio\";\nconst DEFAULT_STYLE_RADIO_ICON =\n \"w-3 h-3 inline-block mr-2 rounded-full border border-miru-han-purple-1000\";\n\ntype RadioProps = {\n id?: string;\n label?: string | number;\n value: string;\n groupName?: string;\n defaultCheck?: boolean;\n classNameLabel?: string;\n classNameInput?: string;\n classNameWrapper?: string;\n classNameRadioIcon?: string;\n handleOnChange?: any;\n};\n\nconst CustomRadioButton = ({\n id,\n label,\n value,\n groupName,\n defaultCheck,\n classNameLabel = \"\",\n classNameInput = \"\",\n classNameWrapper = \"\",\n classNameRadioIcon = \"\",\n handleOnChange = () => {}, //eslint-disable-line\n}: RadioProps) => (\n \n \n \n \n {label}\n \n \n
\n);\n\nexport default CustomRadioButton;\n","/* eslint-disable import/exports-last */\nimport React from \"react\";\n\nimport Select from \"react-select\";\n\nimport {\n customErrStyles,\n customStyles,\n CustomValueContainer,\n} from \"common/CustomReactSelectStyle\";\nimport { useUserContext } from \"context/UserContext\";\n\ntype CustomReactSelectProps = {\n id?: string;\n styles?: any;\n components?: any;\n classNamePrefix?: string;\n label?: string;\n isErr?: any;\n isSearchable?: boolean;\n isDisabled?: boolean;\n ignoreDisabledFontColor?: boolean;\n hideDropdownIndicator?: boolean;\n handleOnClick?: (e?: any) => void; // eslint-disable-line\n handleOnChange?: (e?: any) => void; // eslint-disable-line\n handleonFocus?: (e?: any) => void; // eslint-disable-line\n onBlur?: (e?: any) => void; // eslint-disable-line\n defaultValue?: object;\n onMenuClose?: (e?: any) => void; // eslint-disable-line\n onMenuOpen?: (e?: any) => void; // eslint-disable-line\n className?: string;\n autoFocus?: boolean;\n value?: object;\n getOptionLabel?: (e?: any) => any; // eslint-disable-line\n wrapperClassName?: string;\n options?: Array\n \n
\n);\n\nexport default CustomToggle;\n","import React from \"react\";\n\nimport classNames from \"classnames\";\nimport { CaretCircleLeftIcon, CaretCircleRightIcon } from \"miruIcons\";\n\ntype customYearPickerProps = {\n wrapperClassName?: string;\n yearClassName?: string;\n currentYear: number;\n setCurrentYear: React.Dispatch\n \n {currentYear && (\n handleOnChange(e.target.value)}\n >\n {years.map((year, index) => (\n \n {year}\n \n ))}\n \n )}\n \n {isNextYearButtonDisabled ? (\n
\n );\n};\n\nexport default CustomYearPicker;\n","import React from \"react\";\n\nimport classNames from \"classnames\";\n\nexport const Divider = ({ CustomStyle = \"\" }) => (\n \n
\n );\n};\n\nexport default EmptyStates;\n","import React from \"react\";\n\nimport { Animation_404 } from \"miruIcons\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Button } from \"StyledComponents\";\n\nimport withLayout from \"common/Mobile/HOC/withLayout\";\nimport { useUserContext } from \"context/UserContext\";\nimport { dashboardUrl } from \"utils/dashboardUrl\";\n\nconst ErrorPage = () => {\n const navigate = useNavigate();\n const { isDesktop, companyRole } = useUserContext();\n\n const ErrorPageLayout = () => (\n \n {showNoSearchResultState ? (\n 
\n ) : (\n 
\n )}\n \n {Message}\n \n {children}\n
\n \n
\n );\n\n const Main = withLayout(ErrorPageLayout, !isDesktop, !isDesktop);\n\n return isDesktop ? ErrorPageLayout() : ;\n};\nexport default ErrorPage;\n","import React from \"react\";\n\nexport const ErrorSpan = ({ message, className = \"text-sm text-red-600\" }) => (\n {message}\n);\n","import React from \"react\";\n\nconst InputErrors = ({ fieldErrors, fieldTouched, addMargin = true }) =>\n fieldErrors && fieldTouched ? (\n \n 
\n \n Page not Found\n \n {\n navigate(dashboardUrl(companyRole));\n }}\n >\n Click here\n \n
\n {fieldErrors}
\n \n ) : null;\n\nexport default InputErrors;\n","/* eslint-disable import/exports-last */\n\nimport React, { useEffect, useState } from \"react\";\n\nimport classNames from \"classnames\";\nimport { Field } from \"formik\";\nimport { PasswordIconSVG, PasswordIconTextSVG } from \"miruIcons\";\n\nconst defaultInputBoxClassName =\n \"form__input block w-full appearance-none bg-white p-3.75 text-base lg:text-base h-12 border-miru-gray-1000\";\n\nconst defaultLabelClassname =\n \"absolute top-0.5 left-1 h-6 z-1 origin-0 bg-white p-2 text-sm lg:text-base font-medium text-miru-dark-purple-200 duration-300\";\nconst defaultWrapperClassName = \"outline relative h-12\";\n\nconst InputField = ({\n readOnly,\n label,\n id,\n name,\n type,\n autoFocus,\n disabled,\n inputBoxClassName,\n labelClassName,\n wrapperClassName,\n autoComplete,\n onChange,\n onClick,\n hasError,\n resetErrorOnChange,\n setFieldError,\n setFieldValue,\n marginBottom,\n}) => {\n const [showPassword, setShowPassword] = useState\n
\n );\n\n if (isDesktop) {\n return (\n \n
\n {Object.keys(yearCalendar).map((quarters, key) => (\n \n
\n \n \n Holidays\n
\n \n \n Optional Holidays\n
\n \n {yearCalendar[quarters].quarter.map((month, key) => (\n
\n ))}\n \n \n Public and optional holidays\n \n
\n \n \n
\n \n
\n );\n }\n};\n\nexport default HolidayModal;\n","import React from \"react\";\n\nconst Loader = ({ message = \"\" }) => (\n \n
\n \n
\n);\n\nexport default Loader;\n","import React from \"react\";\n\nconst Loader = ({ className }: { className?: string }) => (\n \n \n
\n {message}
\n\n 
\n
\n);\n\nexport default MiruLogoWatermark;\n","import React from \"react\";\n\nimport { XIcon } from \"miruIcons\";\n\nconst AddEditModalHeader = ({ title, handleOnClose }) => (\n \n \n {title}\n \n
\n);\n\nexport default AddEditModalHeader;\n","/* eslint-disable */\nimport React from \"react\";\n\nimport PropTypes from \"prop-types\";\n\nimport Header from \"components/Navbar/Mobile/Header\";\nimport Navigation from \"components/Navbar/Mobile/Navigation\";\nimport { useUserContext } from \"context/UserContext\";\n\nconst WithLayout =\n (WrappedComponent, includeNavbar, includeSidebar) => props => {\n const { selectedTab, setSelectedTab, companyRole } = useUserContext();\n\n return (\n \n {includeNavbar &&
\n );\n };\n\nWithLayout.propTypes = {\n WrappedComponent: PropTypes.any,\n includeNavbar: PropTypes.bool.isRequired,\n includeSidebar: PropTypes.bool.isRequired,\n};\n\nWithLayout.displayName = \"WithLayout\";\n\nexport default WithLayout;\n","import React from \"react\";\n\nimport { XIcon } from \"miruIcons\";\nimport { Link } from \"react-router-dom\";\n\nexport const MobileDetailsHeader = ({\n wrapperClassName = \"w-full flex flex-row text-center justify-center items-center h-12 text-white bg-miru-han-purple-1000 fixed z-15\",\n title = \"\",\n href,\n}) => (\n \n {title}\n
\n);\n","import React from \"react\";\n\nimport { Link } from \"react-router-dom\";\n\nimport BackButton from \"components/Invoices/Invoice/BackButton\";\n\nexport const MobileEditHeader = ({\n wrapperClassName = \"w-full flex flex-row items-center justify-between h-12 shadow-c1 fixed z-15 fixed bg-white\",\n title = \"\",\n backHref,\n href,\n showEdit = true,\n}) => (\n \n \n
\n \n
\n);\n","import React from \"react\";\n\nconst ProgressBar = ({ width = \"37%\" }) => (\n \n);\n\nexport default ProgressBar;\n","import React, { useState, useEffect } from \"react\";\n\nimport { useDebounce } from \"helpers\";\nimport { CaretDownIcon, SearchIcon, XIcon } from \"miruIcons\";\nimport Select from \"react-select\";\nimport { MobileMoreOptions } from \"StyledComponents\";\n\nimport { useUserContext } from \"context/UserContext\";\n\nconst SearchTimeEntries = ({\n selectedEmployeeId,\n setSelectedEmployeeId,\n employeeList,\n}) => {\n const [showEmployeeList, setShowEmployeeList] = useState\n
\n {showEdit && (\n \n Edit\n
\n )}\n \n {\n setSearchQuery(e.target.value);\n }}\n />\n {searchQuery ? (\n setSearchQuery(\"\")}\n />\n ) : (\n
\n \n {filteredEmployeeList.map(employee => (\n handleEmployeeChange(employee)}\n >\n {employee.label}\n \n ))}\n
\n \n )}\n \n );\n};\n\nexport default SearchTimeEntries;\n","/* eslint-disable react/display-name */\nimport React, { forwardRef, useEffect, useMemo, useRef } from \"react\";\n\nimport { PencilIcon, DeleteIcon } from \"miruIcons\";\nimport PropTypes from \"prop-types\";\nimport { useTable, useRowSelect } from \"react-table\";\n\nimport { useUserContext } from \"context/UserContext\";\n\nconst IndeterminateCheckbox = forwardRef(\n ({ indeterminate, ...rest }: any, ref) => {\n const defaultRef = useRef();\n const resolvedRef: any = ref || defaultRef;\n\n useEffect(() => {\n resolvedRef.current.indeterminate = indeterminate;\n }, [resolvedRef, indeterminate]);\n\n return (\n \n
\n );\n }\n);\n\nconst getTableCheckbox = hooks => {\n hooks.visibleColumns.push(columns => [\n {\n id: \"selection\",\n Header: ({ getToggleAllRowsSelectedProps }) => (\n \n \n \n \n \n \n \n
\n \n
\n ),\n Cell: ({ row }) => (\n \n
\n ),\n },\n ...columns,\n ]);\n};\n\nconst Table = ({\n tableHeader,\n tableRowArray,\n hasCheckbox = false,\n hasRowIcons = false,\n handleDeleteClick = id => {}, // eslint-disable-line\n handleEditClick = id => {}, // eslint-disable-line\n rowOnClick = id => {}, // eslint-disable-line\n}) => {\n const data = useMemo(() => tableRowArray, [tableRowArray]);\n const columns = useMemo(() => tableHeader, []);\n const { isDesktop } = useUserContext();\n\n const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow } =\n useTable(\n {\n columns,\n data,\n },\n useRowSelect,\n hasCheckbox ? getTableCheckbox : () => {} // eslint-disable-line @typescript-eslint/no-empty-function\n );\n\n return (\n \n {\n e.preventDefault();\n e.stopPropagation();\n handleEditClick(row.original.rowId);\n }}\n >\n {\n e.preventDefault();\n e.stopPropagation();\n handleDeleteClick(row.original.rowId);\n }}\n >\n
\n \n
\n );\n};\n\nexport default EmailVerificationSuccess;\n","import React from \"react\";\n\nimport { MiruLogoSVG } from \"miruIcons\";\n\nimport authenticationApi from \"apis/authentication\";\nimport MiruLogoWatermark from \"common/MiruLogoWatermark\";\nimport { MIRU_APP_URL } from \"constants/index\";\n\nconst EmailVerification = () => {\n const email = new URLSearchParams(window.location.search).get(\"email\");\n\n const resendEmailVerificationLink = async email => {\n await authenticationApi.sendEmailConfirmation({ email });\n };\n\n return (\n \n \n Email\n
\n
\n \n
\n \n Email\n
\n Verification\n
\n Successful\n
\n \n
\n \n Thanks for verifying your email.\n
\n\n \n Continue\n \n
\n \n
\n );\n};\n\nexport default EmailVerification;\n","import React from \"react\";\n\nimport { BlurredMiruLogo } from \"miruIcons\";\nimport { Carousel } from \"react-responsive-carousel\";\n\nimport { MIRU_APP_URL } from \"constants/index\";\n\nimport { carouselItems } from \"./utils\";\n\nconst FeaturePreviews = () => (\n \n
\n \n \n
\n \n Email Verification\n
\n\n
\n \n Verification link has been sent to your email ID:\n {email}\n
\n\n Didn’t recieve verification link?\n
\n \n
\n);\nexport default FeaturePreviews;\n","import {\n MiruTimeTrackingScreen,\n MiruReportAndAnalysisScreen,\n MiruPaymentAndInvoicesScreen,\n MiruManagingProjectsScreen,\n MiruManagingClientsScreen,\n MiruManagingEmployeesScreen,\n} from \"miruIcons\";\n\nexport const carouselItems = [\n {\n image: MiruTimeTrackingScreen,\n texts: {\n title: \"Start with effortless time tracking today\",\n description:\n \"Get a detailed report of your team's efforts & measure their time distribution across different projects. Identify team burnouts & underworked members for better decision-making.\",\n },\n },\n {\n image: MiruReportAndAnalysisScreen,\n texts: {\n title: \"Powerful Reporting & Analysis \",\n description:\n \"Get a wide range of business reports with accurate insights and data into your business profitability, sales revenue, and operational efficiency.\",\n },\n },\n {\n image: MiruPaymentAndInvoicesScreen,\n texts: {\n title: \"Payment & Invoices\",\n description:\n \"Create and send invoices instantly to clients, and accept payments in a seamless way with integrated online payment methods.\",\n },\n },\n {\n image: MiruManagingClientsScreen,\n texts: {\n title: \"Managing Clients\",\n description:\n \"Analyze and manage clients effectively, gauge your team efforts on every client, and track budgets, cost constraints, and profitability.\",\n },\n },\n {\n image: MiruManagingEmployeesScreen,\n texts: {\n title: \"Managing Employees\",\n description:\n \"Store and manage employee details, track team contribution, and settle salary payments securely.\",\n },\n },\n {\n image: MiruManagingProjectsScreen,\n texts: {\n title: \"Managing Projects\",\n description:\n \"Get comprehensive and in-depth reports on all projects handled by your teams and monitor team contributions in individual projects.\",\n },\n },\n];\n","import React from \"react\";\n\nimport FOOTER_LINKS from \"./utils\";\n\nconst FooterLinks = ({ handlePrivacyPolicy, handleTermsOfService }) => (\n \n 
\n
\n \n \n \n {carouselItems?.map((feature, i) => (\n
\n \n
\n ))}\n \n \n
\n \n {feature.texts.title}\n
\n\n {feature.texts.description}\n
\n\n
\n);\n\nexport default FooterLinks;\n","import { MIRU_APP_SUPPORT_EMAIL_ID, MIRU_APP_URL } from \"constants/index\";\n\nconst FOOTER_LINKS = [\n {\n text: \"Support\",\n link: MIRU_APP_SUPPORT_EMAIL_ID,\n },\n {\n text: \"miru.so\",\n link: MIRU_APP_URL,\n },\n];\n\nexport default FOOTER_LINKS;\n","import React from \"react\";\n\nimport { MiruLogoSVG } from \"miruIcons\";\n\nimport authenticationApi from \"apis/authentication\";\nimport MiruLogoWatermark from \"common/MiruLogoWatermark\";\nimport { MIRU_APP_URL } from \"constants/index\";\n\ninterface Props {\n email: string;\n}\nconst PasswordResetLinkSentMsg = ({ email }: Props) => {\n const resendPasswordResetLink = async (email: string) => {\n if (email?.trim()) {\n await authenticationApi.forgotPassword({ email });\n }\n };\n\n return (\n - \n
- \n
\n
\n );\n};\n\nexport default PasswordResetLinkSentMsg;\n","import React, { useEffect, useState } from \"react\";\n\nimport { Form, Formik, FormikProps } from \"formik\";\nimport { MiruLogoSVG } from \"miruIcons\";\n\nimport authenticationApi from \"apis/authentication\";\nimport { InputErrors, InputField } from \"common/FormikFields\";\nimport MiruLogoWatermark from \"common/MiruLogoWatermark\";\nimport { MIRU_APP_URL, Paths } from \"constants/index\";\n\nimport PasswordResetLinkSentMsg from \"./PasswordResetLinkSentMsg\";\nimport {\n forgotPasswordFormInitialValues,\n forgotPasswordFormValidationSchema,\n} from \"./utils\";\n\ninterface ForgotPasswordFormValues {\n email: string;\n}\n\nconst ForgotPassword = () => {\n const [emailToSendResetPasswordLink, setEmailToSendResetPasswordLink] =\n useState\n
\n \n \n
\n \n Password reset link sent\n
\n\n
\n \n A password reset link has been sent to your email ID:\n {email}\n
\n\n Didn’t recieve reset link?\n
\n
\n );\n};\n\nexport default ForgotPassword;\n","import * as Yup from \"yup\";\n\nexport const forgotPasswordFormInitialValues = {\n email: \"\",\n};\n\nexport const forgotPasswordFormValidationSchema = Yup.object().shape({\n email: Yup.string()\n .email(\"Invalid email ID\")\n .required(\"Email ID cannot be blank\"),\n});\n","import React from \"react\";\n\nimport { Formik, Form, FormikProps } from \"formik\";\nimport { MiruLogoSVG } from \"miruIcons\";\nimport { ToastContainer } from \"react-toastify\";\n\nimport authenticationApi from \"apis/authentication\";\nimport { InputErrors, InputField } from \"common/FormikFields\";\nimport MiruLogoWatermark from \"common/MiruLogoWatermark\";\nimport { MIRU_APP_URL, Paths } from \"constants/index\";\nimport { setToLocalStorage } from \"utils/storage\";\n\nimport {\n resetPasswordFormInitialValues,\n resetPasswordFormValidationSchema,\n} from \"./utils\";\n\ninterface ResetPasswordFormValues {\n password: string;\n confirm_password: string;\n}\n\nconst ResetPassword = () => {\n const searchParams = new URLSearchParams(document.location.search);\n\n const handleResetPasswordFormSubmit = async (values, { setFieldError }) => {\n const { password, confirm_password } = values;\n const payload = {\n reset_password_token: searchParams.get(\"reset_password_token\"),\n password,\n password_confirmation: confirm_password,\n };\n try {\n const res = await authenticationApi.resetPassword(payload);\n if (res.status == 200) {\n setToLocalStorage(\"authToken\", res.data.user.token);\n setToLocalStorage(\"authEmail\", res.data.user.email);\n setTimeout(() => {\n window.location.assign(`${window.location.origin}`);\n }, 500);\n }\n } catch (error) {\n setFieldError(\"confirm_password\", error.response.data.error);\n }\n };\n\n const isSubmitBtnDisable = values =>\n !(values?.password?.trim() && values?.confirm_password?.trim());\n\n return (\n <>\n \n
\n \n \n
\n \n Forgot Password\n
\n\n \n {(props: FormikProps) => {\n const { values, touched, errors, setFieldValue, setFieldError } =\n props;\n\n return (\n \n );\n }}\n \n
\n \n
\n \n );\n};\n\nexport default ResetPassword;\n","import * as Yup from \"yup\";\n\nexport const resetPasswordFormInitialValues = {\n password: \"\",\n confirm_password: \"\",\n};\n\nexport const resetPasswordFormValidationSchema = Yup.object().shape({\n password: Yup.string()\n .matches(/^\\S.*\\S$/, \"Password cannot start or end with a blank space\")\n .matches(\n /^(?=.*[a-z])(?=.*[A-Z])(?=.*\\d)(?=.*[_\\w\\s\\x00-\\x1F\\x7F])[\\S]{8,}$/, // eslint-disable-line\n \"Must Contain at least 8 Characters, One Uppercase, One Lowercase, One Number and One Special Character\"\n )\n .required(\"Password cannot be blank\"),\n confirm_password: Yup.string()\n .oneOf([Yup.ref(\"password\"), null], \"Passwords must match\")\n .required(\"Confirm Password cannot be blank\"),\n});\n","import React, { useRef, useState } from \"react\";\n\nimport { Formik, Form, FormikProps } from \"formik\";\nimport { GoogleSVG, MiruLogoSVG } from \"miruIcons\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Toastr } from \"StyledComponents\";\n\nimport authenticationApi from \"apis/authentication\";\nimport { InputErrors, InputField } from \"common/FormikFields\";\nimport { MIRU_APP_URL, Paths } from \"constants/index\";\nimport { useAuthDispatch } from \"context/auth\";\n\nimport { signInFormInitialValues, signInFormValidationSchema } from \"./utils\";\n\nimport FooterLinks from \"../FooterLinks\";\nimport PrivacyPolicyModal from \"../SignUp/PrivacyPolicyModal\";\nimport TermsOfServiceModal from \"../SignUp/TermsOfServiceModal\";\n\ninterface SignInFormValues {\n email: string;\n password: string;\n}\n\nconst SignInForm = () => {\n const [privacyModal, setPrivacyModal] = useState(false);\n const [termsOfServiceModal, setTermsOfServiceModal] = useState(false);\n const authDispatch = useAuthDispatch();\n const navigate = useNavigate();\n\n const googleOauth = useRef(null);\n const csrfToken = document\n .querySelector('[name=\"csrf-token\"]')\n .getAttribute(\"content\");\n\n const handleSignInFormSubmit = async (values: any, { setFieldError }) => {\n try {\n const res = await authenticationApi.signin(values);\n //@ts-expect-error for authDispatch initial values\n authDispatch({\n type: \"LOGIN\",\n payload: {\n token: res.data.user.token,\n email: res?.data?.user.email,\n },\n });\n\n setTimeout(\n () => (window.location.href = `${window.location.origin}`),\n 500\n );\n } catch (error) {\n if (error?.response?.data?.unconfirmed) {\n navigate(`/email_confirmation?email=${values.email}`);\n Toastr.error(error.response.data.error);\n } else if (error?.response?.data?.error) {\n setFieldError(\"password\", error.response.data.error);\n }\n }\n };\n\n const handlePrivacyPolicy = () => {\n setPrivacyModal(true);\n };\n\n const handleTermsOfService = () => {\n setTermsOfServiceModal(true);\n };\n\n const handleGoogleAuth = async () => {\n const googleForm = googleOauth?.current;\n\n if (googleForm) googleForm.submit();\n };\n\n const isBtnDisabled = (values: SignInFormValues) =>\n !(values.email?.trim() && values?.password?.trim());\n\n return (\n \n
\n \n \n
\n \n Reset Password\n
\n\n \n {(props: FormikProps) => {\n const {\n values,\n touched,\n errors,\n setFieldError,\n setFieldValue,\n } = props;\n\n return (\n \n );\n }}\n \n
\n \n
\n );\n};\n\nexport default SignInForm;\n","import React from \"react\";\n\nimport MiruLogoWatermark from \"common/MiruLogoWatermark\";\n\nimport SignInForm from \"./SignInForm\";\n\nimport FeaturePreviews from \"../FeaturePreviews\";\n\nconst SignIn = () => (\n \n \n
\n \n
\n \n Welcome back!\n
\n\n \n {(props: FormikProps) => {\n const { touched, errors, values, setFieldError, setFieldValue } =\n props;\n\n return (\n \n );\n }}\n \n
\n \n {}} //eslint-disable-line\n >\n {() => (\n \n \n 
\n Sign In with Google\n \n \n )}\n \n {privacyModal && (\n setPrivacyModal(false)}\n />\n )}\n {termsOfServiceModal && (\n setTermsOfServiceModal(false)}\n />\n )}\n
\n \n \n \n Forgot Password?\n \n \n
\n\n Don't have an account? \n \n \n Sign Up\n \n \n
\n\n
\n);\n\nexport default SignIn;\n","import * as Yup from \"yup\";\n\nexport const signInFormInitialValues = {\n email: \"\",\n password: \"\",\n};\n\nexport const signInFormValidationSchema = Yup.object().shape({\n email: Yup.string()\n .email(\"Invalid email ID\")\n .required(\"Email ID cannot be blank\"),\n password: Yup.string().required(\"Password cannot be blank\"),\n});\n","import React from \"react\";\n\nimport { XIcon } from \"miruIcons\";\nimport { Modal } from \"StyledComponents\";\n\nimport {\n MIRU_APP_SUPPORT_EMAIL_ID,\n GOOGLE_PRIVACY_URL,\n AWS_PRIVACY_URL,\n STRIPE_PRIVACY_URL,\n} from \"constants/index\";\n\nconst PrivacyPolicyModal = ({ isOpen, onClose }) => (\n \n
\n \n \n
\n Privacy Policy for Miru Inc
\nLast Updated on 26th April 2023
\n\n At Miru, accessible from www.miru.so, one of our main priorities is the\n privacy of our visitors. This Privacy Policy document contains types of\n information that is collected and recorded by Miru and how we use it.\n
\n\n If you have additional questions or require more information about our\n Privacy Policy, do not hesitate to contact us\n
\n\n This Privacy Policy applies only to our online activities and is valid\n for visitors to our website with regards to the information that they\n shared and/or collected in Miru. This policy is not applicable to any\n information collected offline or via channels other than this website.\n Our Privacy Policy was created with the help of the Free Privacy Policy\n Generator\n
\nConsent
\n\n By using our website, you hereby consent to our Privacy Policy and agree\n to its terms\n
\n\n Information we collect & How we collect it{\" \"}\n
\n\n The personal information that you are asked to provide, and the reasons\n why you are asked to provide it, will be made clear to you at the point\n we ask you to provide your personal information. We collect information\n from and about users of our Platform:\n
\n- \n
- \n Directly from you when you provide it to us, such as when you make a\n purchase, visit or use our website, place an order with us, contact us\n by email, by phone, or by online chat, register for an online account,\n participate in a contest or sweepstakes, respond to a survey, comment\n on blog posts, engage in a promotional activity, or sign up for\n emails, newsletters, or marketing.\n \n
- \n Automatically when you use the Platform, including automatically\n collected information, but which generally does not include personal\n information unless you provide it through the Platform or you choose\n to share it with us.{\" \"}\n \n
- \n Certain information from third parties, such as social media platforms\n and networks that you use in connection with our website, or that\n share or allow you to share information with us; service providers\n that we use that provide us with information about you and the devices\n you use online; and other third parties that we choose to collaborate\n with in order to make the Platform and its services available for your\n use.\n \n
\n Information You Provide to Us\n
\n\n When you download, register with, or use this Platform, we may ask you\n provide information:\n
\n- \n
- \n By which you may be personally identified, such as name, postal\n address, email address, telephone number, or any other identifier by\n which you may be contacted online or offline(“\n personal information”).\n \n
- \n That is about you but individually does not identify you, such as\n anonymized data relating to your use of the Platform.\n \n
This information includes:
\n- \n
- \n Information that you provide by filling in forms in the Platform,\n creating or bidding on Platform contracts, or otherwise interacting\n with other users on the Platform. This includes information provided\n at the time of registering to use the Platform, subscribing to or\n utilizing our services, posting materials in or related to the\n Platform, and requesting further services. We may also ask you for\n information when you enter a contest or promotion sponsored by us, and\n when you report a problem with the Platform\n \n
- \n Records and copies of your correspondence (including email addresses\n and phone numbers) if you contact us.\n \n
- \n Your responses to surveys that we might ask you to complete for\n research purposes.\n \n
- \n Details of transactions you carry out through the Platform and of the\n fulfillment of your orders. You may be required to provide financial\n information before placing an order through the Platform.\n \n
- \n Your search queries on the Platform.\n \n
- Employment information. \n
\n How we use your information\n
\n\n We use the information we collect in various ways, including to:\n
\n- \n
- \n Provide, operate, and maintain our website .\n \n
- \n Improve, personalize, and expand our website\n \n
- \n Understand and analyze how you use our website\n \n
- \n Develop new products, services, features, and functionality\n \n
- \n Communicate with you, either directly or through one of our partners,\n including for customer service, to provide you with updates and other\n information relating to the website, and for marketing and promotional\n purposes\n \n
- Send you emails \n
- Find and prevent fraud \n
- \n Provide Miru with marketing analytics and insights\n \n
\n We may also use your information to contact you about goods and services\n that may be of interest to you. If you do not want us to use your\n information in this way, contact Miru support at{\" \"}\n
\n Disclosure of Your Information\n
\n\n We may disclose aggregated information about our users, and information\n that does not identify any individual or device, without restriction. We\n do not sell, trade or otherwise transfer Personal Information to outside\n parties (except to the third parties with whom we have contracted to\n provide services to us, as detailed in the applicable section below).\n
\n\n {\" \"}\n In addition, we may disclose personal information that we collect or you\n provide:\n
\n- \n
- \n To our subsidiaries and affiliates to perform any of the actions or\n activities allowed under this policy.\n \n
- \n To contractors, service providers, and other third parties we use to\n support our business and who are bound by contractual obligations to\n keep personal information confidential and use it only for the\n purposes for which we disclose it to them.\n \n
- \n To fulfill the purpose for which you provide it.\n \n
- \n For any other purpose disclosed by us when you provide the\n information.\n \n
- With your consent. \n
- \n To third party service providers in connection with the Platform’s\n services, which utilize their own terms and conditions and privacy\n policies:\n
- \n
- \n
- \n
- \n
\n - \n
- Find and prevent fraud \n
- \n Provide Miru with marketing analytics and insights\n \n
- \n To enforce our rights arising from any contracts entered into between\n you and us, including, as applicable, the Platform EULA, terms of\n sale, Terms and Conditions of Use, and for billing and collection.\n \n
- \n If we believe disclosure is necessary or appropriate to protect the\n rights, property, or safety of Miru, our customers or others. This\n includes exchanging information with other companies and organizations\n for the purposes of fraud protection and credit risk reduction.\n \n
Log files
\n\n Miru follows a standard procedure of using log files. These files log\n visitors when they visit websites. All hosting companies do this as part\n of hosting services' analytics. The information collected by log files\n include internet protocol (IP) addresses, browser type, Internet Service\n Provider (ISP), date and time stamp, referring/exit pages, and possibly\n the number of clicks. These are not linked to any information that is\n personally identifiable. The purpose of the information is for analyzing\n trends, administering the site, tracking users' movement on the website,\n and gathering demographic information.\n
\n\n Advertising Partners Privacy Policies\n
\n\n You may consult this list to find the Privacy Policy for each of the\n advertising partners of Miru.\n
\n\n Third-party ad servers or ad networks use technologies like cookies,\n JavaScript, or Web Beacons that are used in their respective\n advertisements and links that appear on Miru, which are sent directly to\n users' browsers. They automatically receive your IP address when this\n occurs. These technologies are used to measure the effectiveness of\n their advertising campaigns and/or to personalize the advertising\n content that you see on websites that you visit.\n
\n\n Note that Miru has no access to or control over these cookies that are\n used by third-party advertisers.\n
\n\n Third Party Privacy Policies\n
\n\n Miru's Privacy Policy does not apply to other advertisers or websites.\n Thus, we are advising you to consult the respective Privacy Policies of\n these third-party ad servers for more detailed information. It may\n include their practices and instructions about how to opt-out of certain\n options.\n
\n\n You can choose to disable cookies through your individual browser\n options. To know more detailed information about cookie management with\n specific web browsers, it can be found at the browsers' respective\n websites.\n
\n\n CCPA Privacy Rights (Do Not Sell My Personal Information)\n
\n\n Under the CCPA, among other rights, California consumers have the right\n to:\n
\n- \n
- \n Request that a business that collects a consumer's personal data\n disclose the categories and specific pieces of personal data that a\n business has collected about consumers.\n \n
- \n Request that a business delete any personal data about the consumer\n that a business has collected.\n \n
- \n Request that a business that sells a consumer's personal data, not\n sell the consumer's personal data.\n \n
- \n If you make a request, we have one month to respond to you. If you\n would like to exercise any of these rights, please contact us.\n \n
\n Third Party Privacy Policies\n
\n\n We would like to make sure you are fully aware of all of your data\n protection rights. Every user is entitled to the following:\n
\n- \n
- \n The right to access – You have the right to request copies of your\n personal data. We may charge you a small fee for this service.\n \n
- \n The right to rectification – You have the right to request that we\n correct any information you believe is inaccurate. You also have the\n right to request that we complete the information you believe is\n incomplete.\n \n
- \n The right to erasure – You have the right to request that we erase\n your personal data, under certain conditions.\n \n
- \n The right to restrict processing – You have the right to request that\n we restrict the processing of your personal data, under certain\n conditions.\n \n
- \n The right to object to processing – You have the right to object to\n our processing of your personal data, under certain conditions.\n \n
- \n The right to data portability – You have the right to request that we\n transfer the data that we have collected to another organization, or\n directly to you, under certain conditions.\n \n
- \n If you make a request, we have one month to respond to you. If you\n would like to exercise any of these rights, please contact us.\n \n
Children's Information
\n\n Another part of our priority is adding protection for children while\n using the internet. We encourage parents and guardians to observe,\n participate in, and/or monitor and guide their online activity.\n
\n\n Miru does not knowingly collect any Personal Identifiable Information\n from children under the age of 13. If you think that your child provided\n this kind of information on our website, we strongly encourage you to\n contact us immediately and we will do our best efforts to promptly\n remove such information from our records.\n
\n\n Integration and Links to Other Websites\n
\n\n Our website and our product may contain links and provide integrations\n to other sites and products of other organizations. We offer these links\n and integrations as a convenience to you; we do not operate, control, or\n endorse these websites or products. It is your choice whether to utilize\n these links and integrations or not. These external websites and\n products are subject to their own privacy policies.\n
\n\n How will I know if there are any changes to this Privacy Policy?\n
\n\n This Privacy Policy is effective as of the “Last Updated” date specified\n at the top of this Privacy Policy and will remain in effect except with\n respect to any changes in its provisions in the future, which will be in\n effect immediately after being posted on this page.\n
\n\n We reserve the right to update or change our Privacy Policy at any time\n and you should check this Privacy Policy periodically. Your continued\n use of the Service after we post any modifications to the Privacy Policy\n on this page will constitute your acknowledgment of the modifications\n and your consent to abide and be bound by the modified Privacy Policy.\n
\n\n If we make any material changes to this Privacy Policy, we will notify\n you either through the email address you have provided us, and/or by\n placing a prominent notice on the Site and/or Service.\n
\nContact us
\n\n If you have any questions, you can contact us at{\" \"}\n
\n
\n );\n};\n\nexport default SignUpForm;\n","import React from \"react\";\n\nimport { XIcon } from \"miruIcons\";\nimport { Modal } from \"StyledComponents\";\n\nconst TermsOfServiceModal = ({ isOpen, onClose }) => (\n \n
\n \n \n
\n \n Signup for Miru\n
\n\n \n {(props: FormikProps) => {\n const {\n touched,\n errors,\n values,\n setFieldValue,\n setFieldError,\n setFieldTouched,\n } = props;\n\n return (\n \n );\n }}\n \n
\n \n {}} //eslint-disable-line\n >\n {() => (\n \n \n \n Sign Up with Google\n \n \n )}\n \n {privacyModal && (\n setPrivacyModal(false)}\n />\n )}\n {termsOfServiceModal && (\n setTermsOfServiceModal(false)}\n />\n )}\n
\n \n Already have an account? \n \n \n Sign In\n \n \n
\n\n
\n \n \n
\n Terms of Service
\n\n Welcome to our online open source B2B SAAS Application (\"Service\"). By\n accessing or using our Service, you agree to be bound by these Terms of\n Service (\"Terms\")\n
\n- \n
- Use of Service \n
- User Accounts \n
- Payment Terms \n
- \n Intellectual Property Rights\n \n
- \n Disclaimer of Warranties\n \n
- \n Limitation of Liability\n \n
- Governing Law \n
- \n Changes to Terms\n \n
\n Our Service is designed to help businesses track employee time, create\n and send invoices to clients, and allow clients to make payments\n against those invoices. You must be a registered user to access and\n use our Service. You may use our Service only for lawful purposes and\n in accordance with these Terms.\n
\n\n To access our Service, you must create a user account. You agree to\n provide accurate, current, and complete information during the\n registration process and to update such information as necessary to\n keep it accurate, current, and complete. You are responsible for\n safeguarding the password that you use to access the Service and for\n any activities or actions under your password.\n
\n\n Our Service offers different payment plans for businesses. By\n subscribing to our Service, you agree to pay the fees associated with\n the plan that you have selected. Fees are billed in advance on a\n monthly or annual basis and are non-refundable.\n
\n\n Our Service and its entire contents, features, and functionality are\n owned by us or our licensors and are protected by United States and\n international copyright, trademark, patent, trade secret, and other\n intellectual property or proprietary rights laws.\n
\n\n Our Service is provided \"as is\" and \"as available\" without any\n representation or warranty, express or implied. We do not warrant that\n the Service will be uninterrupted, error-free, or completely secure.\n
\n\n Under no circumstances shall we be liable for any direct, indirect,\n incidental, consequential, special, or exemplary damages arising from\n the use or inability to use our Service.\n
\n\n These Terms shall be governed by and construed in accordance with the\n laws of the United States.\n
\n\n We reserve the right to modify these Terms at any time. We will post\n the current version of these Terms on our website and notify you of\n any material changes. Your continued use of our Service after any\n changes to these Terms constitutes your acceptance of such changes.\n
\n\n If you have any questions about these Terms, please contact us at\n
\n
\n);\n\nexport default SignUp;\n","import * as Yup from \"yup\";\n\nexport const signUpFormInitialValues = {\n first_name: \"\",\n last_name: \"\",\n email: \"\",\n isAgreedTermsOfServices: false,\n password: \"\",\n confirm_password: \"\",\n};\n\nexport const signUpFormValidationSchema = Yup.object().shape({\n first_name: Yup.string()\n .matches(/^[A-Za-z ]*$/, \"Please enter valid first name\")\n .max(20, \"Maximum 20 characters are allowed\")\n .required(\"First name cannot be blank\"),\n last_name: Yup.string()\n .matches(/^[A-Za-z ]*$/, \"Please enter valid last name\")\n .max(20, \"Maximum 20 characters are allowed\")\n .required(\"Last name cannot be blank\"),\n email: Yup.string()\n .email(\"Invalid email ID\")\n .required(\"Email ID cannot be blank\"),\n password: Yup.string()\n .matches(/^\\S.*\\S$/, \"Password cannot start or end with a blank space\")\n .matches(\n /(?=.*[a-z])(?=.*[A-Z])(?=.*\\d)(?=.*[_\\W\\s\\x00-\\x1F\\x7F])[\\S\\s]{8,}$/, // eslint-disable-line\n \"Must Contain at least 8 Characters, One Uppercase, One Lowercase, One Number and One Special Character\"\n )\n .required(\"Password cannot be blank\"),\n confirm_password: Yup.string()\n .matches(/^\\S.*\\S$/, \"Password cannot start or end with a blank space\")\n .matches(\n /^(?=.*[a-z])(?=.*[A-Z])(?=.*\\d)(?=.*[_\\w\\s\\x00-\\x1F\\x7F])[\\S]{8,}$/, // eslint-disable-line\n \"Must Contain at least 8 Characters, One Uppercase, One Lowercase, One Number and One Special Character\"\n )\n .oneOf([Yup.ref(\"password\"), null], \"Passwords must match\")\n .required(\"Confirm Password cannot be blank\"),\n isAgreedTermsOfServices: Yup.boolean().oneOf(\n [true],\n \"Please agree to the terms and privacy policy to continue\"\n ),\n});\n","import React, { useRef, useState } from \"react\";\n\nimport { useOutsideClick } from \"helpers\";\nimport {\n ReportsIcon,\n DotsThreeVerticalIcon,\n DownloadSimpleIcon,\n} from \"miruIcons\";\nimport { Badge, Button, MoreOptions, Toastr, Tooltip } from \"StyledComponents\";\n\nimport { handleDownloadInvoice } from \"components/Invoices/common/utils\";\nimport getStatusCssClass from \"utils/getBadgeStatus\";\n\nconst Header = ({\n invoice,\n stripeUrl,\n stripe_connected_account,\n setShowConnectPaymentDialog,\n setShowStripeDisabledDialog,\n}) => {\n const [isMoreOptionsVisible, setIsMoreOptionsVisible] =\n useState\n
\n );\n};\n\nexport default Header;\n","import React from \"react\";\n\nimport CompanyInfo from \"components/Invoices/common/CompanyInfo\";\nimport ClientInfo from \"components/Invoices/Invoice/ClientInfo\";\nimport InvoiceLineItems from \"components/Invoices/Invoice/InvoiceLineItems\";\n\nimport InvoiceInfo from \"./InvoiceInfo\";\nimport InvoiceTotalSummary from \"./InvoiceTotalSummary\";\n\nconst InvoiceDetails = ({ invoice, company, lineItems, client, logo }) => {\n const invoiceWaived = invoice?.status === \"waived\";\n const strikeAmount = invoiceWaived && \"line-through\";\n\n const sortedLineItems = [...lineItems].sort((a, b) => {\n const dateA = new Date(a.date);\n const dateB = new Date(b.date);\n\n return dateA.getTime() - dateB.getTime();\n });\n\n return (\n <>\n \n
\n \n
\n Invoice #{invoice_number}
\n\n
\n \n
\n \n {status == \"waived\" ? (\n \n \n {\n if (status != \"paid\") {\n if (stripe_connected_account && !stripe_enabled) {\n setShowStripeDisabledDialog(true);\n } else if (stripe_connected_account) {\n window.location.href = stripeUrl;\n } else {\n setShowConnectPaymentDialog(true);\n }\n }\n }}\n >\n
\n \n
\n \n \n ) : (\n \n
\n \n PAY\n
\n\n
\n \n )}\n \n
\n \n PAY\n
\n\n setIsMoreOptionsVisible(!isMoreOptionsVisible)}\n >\n \n handleDownloadAction(invoice)}\n >\n
\n \n
\n \n
\n \n Date of Issue\n
\n\n {formattedDate(issue_date)}\n
\n\n Due Date\n
\n\n {formattedDate(due_date)}\n
\n\n
\n \n Invoice Number\n
\n\n {invoice_number}\n
\n\n Reference\n
\n\n {reference}\n
\n\n \n {currencyFormat(currency, amount)}\n \n
\n \n );\n};\n\nexport default InvoiceInfo;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\n\nconst InvoiceTotalSummary = ({ invoice, company, lineItems, strikeAmount }) => {\n const subTotal = lineItems\n .reduce((prev, curr) => prev + (curr.rate * curr.quantity) / 60, 0)\n .toFixed(2);\n\n const { amount_due, amount_paid, discount, tax } = invoice;\n const { currency } = company;\n const total = Number(subTotal) + Number(tax) - Number(discount);\n\n return (\n \n Amount\n
\n\n \n \n
\n
\n );\n};\n\nexport default InvoiceTotalSummary;\n","import React from \"react\";\n\nimport { ArrowLeftIcon } from \"miruIcons\";\nimport { useLocation, useNavigate } from \"react-router-dom\";\nimport { Badge, Button } from \"StyledComponents\";\n\nimport getStatusCssClass from \"utils/getBadgeStatus\";\n\nconst Header = ({ invoice }) => {\n const navigate = useNavigate();\n const location = useLocation();\n\n const { pathname } = location;\n\n return (\n | \n Sub total\n | \n
| \n Discount\n | \n
| \n Tax\n | \n
| \n Total\n | \n
| \n Amount Paid\n | \n
| \n Amount Due\n | \n
\n
\n );\n};\n\nexport default Header;\n","import React from \"react\";\n\nimport dayjs from \"dayjs\";\nimport { currencyFormat } from \"helpers\";\n\nconst InvoiceInfo = ({ invoice, company, strikeAmount = \"\" }) => {\n const { date_format, currency } = company;\n const { issue_date, due_date, invoice_number, reference, amount } = invoice;\n const formattedDate = date => dayjs(date).format(date_format);\n\n return (\n \n {!pathname.includes(\"view\") && (\n {\n navigate(\"/invoices\");\n }}\n >\n
\n \n
\n \n
\n );\n};\n\nexport default InvoiceInfo;\n","import React from \"react\";\n\nimport LineItemTableHeader from \"components/Invoices/common/LineItemTableHeader\";\n\nimport LineItem from \"./LineItem\";\n\nconst InvoiceLineItems = ({\n currency,\n items,\n showHeader,\n dateFormat,\n strikeAmount = \"\",\n}) => (\n \n
\n \n \n Date of Issue\n \n \n {formattedDate(issue_date)}\n \n
\n \n \n Invoice Number\n \n \n {invoice_number}\n \n
\n \n
\n \n \n Due Date\n \n \n {formattedDate(due_date)}\n \n
\n \n \n Reference\n \n \n {reference}\n \n
\n \n \n Amount\n \n \n {currencyFormat(currency, amount)}\n \n
\n \n \n {showHeader ?
\n
\n);\n\nexport default InvoiceLineItems;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\n\nconst InvoiceTotal = ({ company, invoice, lineItems, strikeAmount }) => {\n const subTotal = lineItems\n .reduce((prev, curr) => prev + (curr.rate * curr.quantity) / 60, 0)\n .toFixed(2);\n\n const { amount_due, amount_paid, discount, tax } = invoice;\n const { currency } = company;\n const total = Number(subTotal) + Number(tax) - Number(discount);\n\n const AmountComponent = ({ label, value }) => (\n \n \n {label}\n \n \n {currencyFormat(currency, value)}\n \n
\n );\n\n return (\n \n
\n );\n};\n\nexport default InvoiceTotal;\n","import React from \"react\";\n\nimport dayjs from \"dayjs\";\nimport { currencyFormat, minToHHMM, lineTotalCalc } from \"helpers\";\n\nconst LineItem = ({ currency, item, dateFormat, strikeAmount = \"\" }) => {\n const date = dayjs(item.date).format(dateFormat);\n\n return (\n <>\n \n
\n \n
\n \n
\n );\n};\n\nexport default MobileView;\n","import React from \"react\";\n\nimport { StripeLogoSVG } from \"miruIcons\";\n\nconst Discountmenu = ({ stripeUrl }) => (\n \n
\n \n 0}\n strikeAmount={strikeAmount}\n />\n
\n \n {\n invoice.status != \"paid\" && (window.location.href = url);\n }}\n >\n
\n \n
\n);\n\nexport default Discountmenu;\n","import React, { useEffect, useState } from \"react\";\n\nimport { useParams } from \"react-router-dom\";\n\nimport invoicesApi from \"apis/invoices\";\nimport Loader from \"common/Loader/index\";\nimport ConnectPaymentGateway from \"components/Invoices/popups/ConnectPaymentGateway\";\nimport StripeDisabledInvoice from \"components/Invoices/popups/StripeDisabledInvoice\";\nimport { useUserContext } from \"context/UserContext\";\n\nimport Header from \"./Header\";\nimport InvoiceDetails from \"./InvoiceDetails\";\nimport MobileView from \"./MobileView\";\n\nimport NoInvoices from \"../List/NoInvoices\";\n\nconst ClientInvoiceDetails = () => {\n const { isDesktop } = useUserContext();\n const params = useParams();\n\n const [loading, setLoading] = useState(true);\n const [data, setData] = useState(null);\n const [showConnectPaymentDialog, setShowConnectPaymentDialog] =\n useState- \n
- \n \n
\n \n Pay via Stripe\n \n \n
\n
\n
\n ) : (\n \n
\n \n
\n {showConnectPaymentDialog && (\n \n {isDesktop &&
\n )}\n \n )}\n \n \n );\n};\n\nexport default Header;\n","import React from \"react\";\n\nimport { ApiStatus } from \"constants/index\";\n\nimport SearchedDataRow from \"./SearchedDataRow\";\n\nconst SearchDropdown = ({ list = [], status, display }) => {\n if (!display) return null;\n\n if (status == ApiStatus.SUCCESS && list.length == 0) {\n return (\n Invoices
}\n {showSearch >= 1 && (\n <>\n {isDesktop ? (\n\n
\n ) : (\n \n setSearchQuery(e.target.value)}\n onKeyDown={e => onKeydownHandler(e)}\n />\n \n
\n \n \n setSearchQuery(e.target.value)}\n onFocus={() => setExpandSearchBox(true)}\n onKeyDown={e => onKeydownHandler(e)}\n />\n \n
\n No matching results found
\n \n
\n \n {client.name}\n
\n \n {invoiceNumber}\n
\n \n {currencyFormat(company.baseCurrency, amount)}\n
\n \n {issueDate}\n
\n \n \n {status}\n \n
\n \n );\n};\n\nexport default SearchDataRow;\n","import React from \"react\";\n\nimport EmptyStates from \"common/EmptyStates\";\n\nconst NoInvoices = () => (\n INVOICE NO.\n \n
DUE DATE\n \n
\n AMOUNT\n \n
\n \n \n {name}\n \n
\n \n \n {invoiceNumber}\n
\n\n {issueDate}\n
\n\n Due on {dueDate}\n
\n- \n
- {currencyFormat(baseCurrency, amount)} \n
\n
\n );\n\n const Main = withLayout(InvoicesLayout, !isDesktop, !isDesktop);\n\n return isDesktop ? InvoicesLayout() : ;\n};\n\nexport default ClientInvoices;\n","/* eslint-disable @typescript-eslint/no-var-requires */\nimport React, { useEffect, useState } from \"react\";\n\nimport { Country } from \"country-state-city\";\nimport { Form, Formik, FormikProps } from \"formik\";\nimport { XIcon } from \"miruIcons\";\nimport PhoneInput from \"react-phone-number-input\";\nimport flags from \"react-phone-number-input/flags\";\nimport { Button, SidePanel, Toastr } from \"StyledComponents\";\n\nimport clientApi from \"apis/clients\";\nimport CustomReactSelect from \"common/CustomReactSelect\";\nimport { InputErrors, InputField } from \"common/FormikFields\";\n\nimport { clientSchema, getInitialvalues } from \"./formValidationSchema\";\nimport UploadLogo from \"./UploadLogo\";\nimport { formatFormData, disableBtn } from \"./utils\";\n\nconst MobileClientForm = ({\n client,\n clientLogoUrl,\n handleDeleteLogo,\n setClientLogoUrl,\n setClientLogo,\n clientData,\n formType = \"new\",\n setClientData,\n setnewClient,\n clientLogo,\n setShowEditDialog,\n submitting,\n setSubmitting,\n handleEdit,\n setShowDialog,\n fetchDetails,\n}: IClientForm) => {\n const [fileUploadError, setFileUploadError] = useState\n
\n );\n\n const EditLogo = () => (\n \n \n
\n \n
\n \n Select File
\n\n
\n Accepted file formats: PNG and JPG.
\nFile size should be ≺ 30 KB.
\nImage resolution should be 1:1.
\n\n
\n );\n\n if (formType == \"edit\" || clientLogoUrl) {\n return \n
\n \n
\n \n \n \n \n
\n Delete
\n \n )}\n\n
\n Accepted file formats: PNG and JPG.
\nFile size should be ≺ 30 KB.
\nImage resolution should be 1:1.
\n\n
\n Add Contact
\n\n {\n setShowContactModal(false);\n }}\n >\n
\n \n
\n Delete Contact
\n\n Are you sure you want to delete contact{\" \"}\n {contact.email}? This action cannot be\n reversed.\n
\n\n {\n setShowDeleteDialog(false);\n }}\n >\n CANCEL\n \n \n DELETE\n \n
\n \n );\n};\n\nexport default DeleteContact;\n","import React from \"react\";\n\nimport { Formik, Form, FormikProps } from \"formik\";\nimport { XIcon } from \"miruIcons\";\nimport { Button, Modal } from \"StyledComponents\";\nimport * as Yup from \"yup\";\n\nimport clientMembersApi from \"apis/clientMembers\";\nimport { InputField, InputErrors } from \"common/FormikFields\";\n\nconst contactSchema = Yup.object().shape({\n firstName: Yup.string()\n .matches(/^[a-zA-Z]+$/, \"First Name must contain only letters\")\n .max(20, \"Maximum 20 characters are allowed\")\n .required(\"First Name cannot be blank\"),\n lastName: Yup.string()\n .matches(/^[a-zA-Z]+$/, \"Last Name must contain only letters\")\n .max(20, \"Maximum 20 characters are allowed\")\n .required(\"Last Name cannot be blank\"),\n email: Yup.string()\n .email(\"Invalid email ID\")\n .required(\"Email ID cannot be blank\"),\n});\n\nconst EditContact = ({\n contact,\n client,\n fetchDetails,\n setShowContactModal,\n showContactModal,\n}) => {\n interface FormValues {\n id?: string;\n firstName: string;\n lastName: string;\n email: string;\n }\n\n const handleSubmit = async values => {\n const { firstName, lastName } = values;\n\n const payload = {\n first_name: firstName,\n last_name: lastName,\n };\n\n await clientMembersApi.update(contact.contactId, client.id, payload);\n fetchDetails();\n setShowContactModal(false);\n };\n\n return (\n \n
\n Edit Contact
\n\n {\n setShowContactModal(false);\n }}\n >\n
\n \n
\n Add Contacts
\n\n setAddContactModal(true)}\n >\n setIsContactOpen(false)}\n >\n
\n \n {contacts.map((contact, index) => (\n
\n \n);\n\nexport default ContactsList;\n","import React, { useEffect, useState } from \"react\";\n\nimport clientMembersApi from \"apis/clientMembers\";\nimport teamApi from \"apis/team\";\nimport Loader from \"common/Loader\";\n\nimport AddContacts from \"./AddContacts\";\nimport DeleteContact from \"./DeleteContact\";\nimport EditContact from \"./EditContact\";\nimport ContactsList from \"./List\";\n\nconst Contacts = ({ isContactOpen, setIsContactOpen, clientDetails }) => {\n const [isLoading, setIsLoading] = useState(true);\n const [addContactModal, setAddContactModal] = useState(false);\n const [editContactModal, setEditContactModal] = useState(false);\n const [deleteContactModal, setDeleteContactModal] = useState(false);\n const [contacts, setContacts] = useState([]);\n const [contact, setContact] = useState({});\n const [invitedEmails, setInvitedEmails] = useState([]);\n const [\n virtualVerifiedInvitationsAllowed,\n setVirtualVerifiedInvitationsAllowed,\n ] = useState(false);\n\n useEffect(() => {\n fetchContacts();\n }, []);\n\n const fetchContacts = async () => {\n setIsLoading(true);\n const res = await clientMembersApi.get(clientDetails.id);\n const pendingInvitationEmails = res?.data?.invitations.filter(\n contact => contact.accepted_at === null\n );\n\n setContacts(res?.data?.clientMembers);\n setInvitedEmails(pendingInvitationEmails);\n setVirtualVerifiedInvitationsAllowed(\n res?.data?.virtualVerifiedInvitationsAllowed\n );\n setIsLoading(false);\n };\n\n const displayEditContact = contact => {\n setContact(contact);\n setEditContactModal(true);\n };\n\n const displayDeleteContact = contact => {\n setContact(contact);\n setDeleteContactModal(true);\n };\n\n const handleVerifyContact = async contact => {\n const payload = { virtual_verified: !contact.virtual_verified };\n await teamApi.updateInvitedMember(contact.id, payload);\n fetchContacts();\n };\n\n if (isLoading) {\n return \n \n {contact.email}\n \n
\n ))}\n \n \n displayDeleteContact(contact)}\n >\n
\n \n {invitedEmails.map((contact, index) => (\n
\n \n \n {contact.recipient_email}\n \n
\n ))}\n \n handleVerifyContact(contact)}\n />\n )}\n
\n \n setIsClientOpen(false)}>\n \n )}\n {showDeleteDialog && (\n \n {\n handleAddProject();\n setShowMobileModal(false);\n }}\n >\n {\n setSendPaymentReminder(true);\n setShowMobileModal(false);\n }}\n >\n {\n setShowContactModal(true);\n setShowMobileModal(false);\n }}\n >\n \n \n {\n handleEdit();\n setShowMobileModal(false);\n }}\n >\n {\n handleDelete();\n setShowMobileModal(false);\n }}\n >\n
\n );\n};\n\nexport default Header;\n","import React from \"react\";\n\nimport { minToHHMM } from \"helpers\";\n\nconst TableData = (projects, isDesktop) => {\n if (projects && isDesktop) {\n return projects.map(project => ({\n col1: (\n \n
\n {isClientOpen && (\n \n \n
\n \n {clientDetails.name}\n
\n \n\n \n
\n - \n
- \n \n \n
- \n \n \n
- setSendPaymentReminder(true)}>\n \n \n
- \n \n \n
\n
\n Client Details
\n\n
\n Address
\n\n
\n {clientDetails.address.address_line_1}
\n{clientDetails.address?.address_line_2}
\n{clientDetails.address?.city}
\n{clientDetails.address?.country}
\n\n
\n Phone number
\n\n {clientDetails.phone}\n
\n\n {project.name}\n
\n ),\n col2: (\n \n {project.team.map((member, index) => (\n {member}, \n ))}\n
\n ),\n col3: (\n \n {minToHHMM(project.minutes)}\n
\n ),\n rowId: project.id,\n }));\n } else if (projects && !isDesktop) {\n return projects.map(project => ({\n col1: (\n \n {project.name}\n
\n
\n ),\n col2: (\n \n
\n {project.team.map((member, index) => (\n \n {member}, \n \n ))}\n
\n \n {minToHHMM(project.minutes)}\n
\n ),\n rowId: project.id,\n }));\n }\n\n return [{}];\n};\n\nexport default TableData;\n","import React from \"react\";\n\nimport { cashFormatter, currencySymbol } from \"helpers\";\n\nimport AmountBoxContainer from \"common/AmountBox\";\nimport ChartBar from \"common/ChartBar\";\n\nconst TotalHoursChart = ({\n projectDetails,\n totalMinutes,\n overdueOutstandingAmount,\n handleSelectChange,\n}) => {\n const currencySymb = currencySymbol(overdueOutstandingAmount?.currency);\n\n const amountBox = [\n {\n title: \"OVERDUE\",\n amount:\n currencySymb + cashFormatter(overdueOutstandingAmount?.overdue_amount),\n },\n {\n title: \"OUTSTANDING\",\n amount:\n currencySymb +\n cashFormatter(overdueOutstandingAmount?.outstanding_amount),\n },\n ];\n\n return (\n \n
\n );\n};\n\nexport default TotalHoursChart;\n","export const tableHeader = [\n {\n Header: \"PROJECT\",\n accessor: \"col1\", // accessor is the \"key\" in the data\n cssClass: \"md:w-1/3\",\n },\n {\n Header: \"TEAM\",\n accessor: \"col2\",\n cssClass: \"md:w-1/3\",\n },\n {\n Header: \"HOURS LOGGED\",\n accessor: \"col3\",\n cssClass: \"text-right md:w-1/5\", // accessor is the \"key\" in the data\n },\n];\n\nexport const mobileTableHeader = [\n {\n Header: \"PROJECT\",\n accessor: \"col1\", // accessor is the \"key\" in the data\n cssClass: \"md:w-1/3\",\n },\n {\n Header: \"HOURS\",\n accessor: \"col2\",\n cssClass: \"text-right md:w-1/5\", // accessor is the \"key\" in the data\n },\n];\n","import React, { useEffect, useState } from \"react\";\n\nimport Logger from \"js-logger\";\nimport { PlusIcon } from \"miruIcons\";\nimport { useParams, useNavigate } from \"react-router-dom\";\n\nimport clientApi from \"apis/clients\";\nimport EmptyStates from \"common/EmptyStates\";\nimport Loader from \"common/Loader/index\";\nimport Table from \"common/Table\";\nimport ProjectForm from \"components/Projects/List/Mobile/ProjectForm\";\nimport AddEditProject from \"components/Projects/Modals/AddEditProject\";\nimport DeleteProject from \"components/Projects/Modals/DeleteProject\";\nimport { useUserContext } from \"context/UserContext\";\nimport { unmapClientInvoices } from \"mapper/client.mapper\";\nimport { unmapClientDetails } from \"mapper/mappedIndex\";\nimport { sendGAPageView } from \"utils/googleAnalytics\";\n\nimport { tableHeader, mobileTableHeader } from \"./constants\";\nimport Header from \"./Header\";\nimport TableData from \"./TableData\";\nimport TotalHoursChart from \"./TotalHoursChart\";\n\nimport AddProject from \"../Modals/AddProject\";\nimport PaymentReminder from \"../Modals/PaymentReminder\";\nimport MobilePaymentReminder from \"../Modals/PaymentReminder/MobileView\";\n\nconst ClientDetails = ({ isAdminUser }) => {\n const [showEditDialog, setShowEditDialog] = useState\n \n \n \n \n \n
\n {projectDetails && (\n \n {isAdminUser && isDesktop && (\n
\n {showEditDialog && (\n \n
\n \n
\n \n
\n \n {projectDetails && projectDetails.length > 0 ? (\n {} // eslint-disable-line @typescript-eslint/no-empty-function\n }\n />\n ) : (\n \n \n
\n \n {item.label}\n
\n \n );\n};\n\nexport default SearchDataRow;\n","import React, { Fragment } from \"react\";\n\nimport Logger from \"js-logger\";\nimport { PlusIcon } from \"miruIcons\";\nimport { Button } from \"StyledComponents\";\n\nimport clientApi from \"apis/clients\";\nimport AutoSearch from \"common/AutoSearch\";\nimport { unmapClientListForDropdown } from \"mapper/mappedIndex\";\n\nimport SearchDataRow from \"./SearchDataRow\";\n\nconst Header = ({ setnewClient, isAdminUser, setShowDialog }) => {\n const fetchClients = async searchString => {\n try {\n const res = await clientApi.get(`?query=${searchString}`);\n const dropdownList = unmapClientListForDropdown(res);\n\n return dropdownList;\n } catch (error) {\n Logger.error(error);\n }\n };\n\n return (\nClients
\n {isAdminUser && (\n\n \n {client.name}\n \n
\n \n \n {client.name}\n \n
\n ),\n col3: (\n \n {isAdminUser && (\n {\n e.preventDefault();\n e.stopPropagation();\n setShowMoreOptions(true);\n setClientId(client.id);\n }}\n />\n )}\n
\n ),\n rowId: client.id,\n }));\n }\n\n return [{}];\n};\n\nexport default TableData;\n","import React from \"react\";\n\nimport { PlusIcon } from \"miruIcons\";\n\nimport EmptyStates from \"common/EmptyStates\";\nimport Table from \"common/Table\";\nimport { useUserContext } from \"context/UserContext\";\n\nimport TableData from \"./TableData\";\n\nimport {\n employeeTableHeader,\n mobileEmployeeTableHeader,\n mobileTableHeader,\n tableHeader,\n} from \"../constants\";\n\nconst ClientList = ({\n clientData,\n handleTooltip,\n showToolTip,\n toolTipRef,\n setShowMoreOptions,\n setClientId,\n handleDeleteClick,\n handleEditClick,\n handleRowClick,\n setShowDialog,\n setIsClient,\n}) => {\n const { isAdminUser, isDesktop } = useUserContext();\n\n const getTableData = TableData(\n clientData,\n handleTooltip,\n showToolTip,\n toolTipRef,\n isDesktop,\n isAdminUser,\n setShowMoreOptions,\n setClientId\n );\n\n return (\n \n
\n );\n};\n\nexport default ClientList;\n","import React, { useState } from \"react\";\n\nimport { XIcon } from \"miruIcons\";\nimport { Modal } from \"StyledComponents\";\n\nimport projectApi from \"apis/projects\";\n\nconst AddProject = ({\n showProjectModal,\n setShowProjectModal,\n clientDetails,\n fetchProjectList,\n}) => {\n const [client, setClient] = useState\n
\n \n
\n \n {clientData && clientData.length > 0 ? (\n {} // eslint-disable-line @typescript-eslint/no-empty-function\n }\n tableHeader={\n isAdminUser && isDesktop\n ? tableHeader\n : isAdminUser && !isDesktop\n ? mobileTableHeader\n : !isAdminUser && isDesktop\n ? employeeTableHeader\n : mobileEmployeeTableHeader\n }\n />\n ) : (\n \n {\n setShowDialog(true);\n setIsClient(true);\n }}\n >\n
\n \n
\n Add New Project
\n\n {\n setShowProjectModal(false);\n }}\n >\n
\n \n
\n \n );\n};\n\nexport default AddProject;\n","import React from \"react\";\n\nimport { useNavigate } from \"react-router-dom\";\nimport { Modal, Button } from \"StyledComponents\";\n\nimport clientApi from \"apis/clients\";\n\ninterface IProps {\n client: any;\n setShowDeleteDialog: any;\n showDeleteDialog: boolean;\n}\n\nconst DeleteClient = ({\n client,\n showDeleteDialog,\n setShowDeleteDialog,\n}: IProps) => {\n const navigate = useNavigate();\n\n const deleteClient = async client => {\n await clientApi.destroy(client.id);\n setShowDeleteDialog(false);\n window.location.pathname == \"/clients\" ? navigate(0) : navigate(\"/clients\");\n };\n\n return (\n \n
\n \n
\n \n \n
\n \n setClient(e.target.value)}\n >\n \n \n \n
\n \n
\n \n
\n \n \n
\n \n setProjectName(e.target.value)}\n />\n
\n \n
\n \n \n
\n \n
\n \n
\n \n setProjectType(\"Billable\")}\n />\n \n Billable\n \n
\n \n setProjectType(\"Non-Billable\")}\n />\n \n Non-billable\n \n
\n \n {client && projectName && projectType ? (\n handleSubmit()}\n >\n {\" \"}\n ADD PROJECT{\" \"}\n \n ) : (\n \n {\" \"}\n ADD PROJECT{\" \"}\n \n )}\n
\n \n
\n Delete Client
\n\n Are you sure you want to delete client{\" \"}\n {client.name}? This action cannot be\n reversed.\n
\n\n {\n setShowDeleteDialog(false);\n }}\n >\n CANCEL\n \n {\n deleteClient(client);\n }}\n >\n DELETE\n \n
\n \n );\n};\n\nexport default DeleteClient;\n","import React, { useState } from \"react\";\n\nimport { XIcon } from \"miruIcons\";\nimport { Modal } from \"StyledComponents\";\n\nimport { useUserContext } from \"context/UserContext\";\n\nimport ClientForm from \"../ClientForm\";\nimport MobileClientForm from \"../ClientForm/MobileClientForm\";\n\nconst EditClient = ({\n client,\n fetchDetails,\n setShowEditDialog,\n showEditDialog,\n}: IEditClient) => {\n const [clientLogoUrl, setClientLogoUrl] = useState\n {\n setShowEditDialog(false);\n }}\n >\n
\n Edit Client Details
\n\n {\n setnewClient(false);\n setShowDialog(false);\n }}\n >\n
\n Add New Client
\n\n
\n }\n />\n \n \n \n {emailParams.recipients.map(recipient => (\n \n
\n ))}\n {recipient}
\n\n \n setEmailParams({\n ...emailParams,\n subject: e.target.value,\n })\n }\n />\n
\n \n \n
\n }\n />\n \n \n );\n};\n\nexport default EmailPreview;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\nimport { Badge, Button } from \"StyledComponents\";\n\nimport getStatusCssClass from \"utils/getBadgeStatus\";\n\nconst MobileInvoiceRow = ({ invoice, isLast }) => {\n const {\n amount,\n company,\n dueDate,\n invoiceNumber,\n issueDate,\n status,\n externalViewKey,\n } = invoice;\n\n const { baseCurrency } = company;\n\n return (\n {emailParams.message}
\n {selected.map((invoice, idx) =>\n isDesktop ? (\n\n INVOICE NO.\n
\n {invoiceNumber}
\n \n ISSUED DATE\n
\n {issueDate}
\n \n DUE DATE\n
\n {dueDate}
\n \n AMOUNT\n
\n {currencyFormat(baseCurrency, amount)}
\n \n STATUS\n
\n \n
\n \n \n
\n \n );\n};\n\nexport default MobileInvoiceRow;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\nimport { Badge } from \"StyledComponents\";\n\nimport CustomCheckbox from \"common/CustomCheckbox\";\nimport getStatusCssClass from \"utils/getBadgeStatus\";\n\nconst MobileInvoicesList = ({\n deselectInvoices,\n invoice,\n isSelected,\n selectInvoices,\n}) => {\n const { amount, company, id, invoiceNumber, status, issueDate, dueDate } =\n invoice;\n\n const { baseCurrency } = company;\n\n const handleCheckboxChange = () => {\n if (isSelected) {\n deselectInvoices([id]);\n } else {\n selectInvoices([id]);\n }\n };\n\n return (\n \n \n
\n \n {dueDate}\n
\n
\n );\n};\n\nexport default MobileTable;\n","import React from \"react\";\n\nimport CustomCheckbox from \"common/CustomCheckbox\";\n\nconst MobileTableHeader = ({ handleCheck, isChecked }) => (\n \n \n
\n \n \n
\n
\n \n
\n );\n};\n\ninterface SendPaymentReminderEmail {\n subject: string;\n message: string;\n recipients: string[];\n}\n\nexport default MobilePaymentReminder;\n","import React, { useEffect, useState } from \"react\";\n\nimport { CheckCircleIcon } from \"miruIcons\";\n\nconst Step = (props: any) => {\n const [stepNumber, setStepNumber] = useState\n {\n setSendPaymentReminder(false);\n }}\n >\n
\n \n Send Payment Reminder\n
\n \n
\n {renderSelectedForm()}\n {currentStep === 1 ? (\n \n (\n
\n \n \n {selectedInvoices.length > 1\n ? `${selectedInvoices.length} invoices selected`\n : `${selectedInvoices.length} invoice selected`}\n \n {\n onNextBtnClick();\n setCurrentStep(2);\n }}\n >\n Continue\n \n
\n ) : (\n \n {\n setCurrentStep(1);\n }}\n >\n Back\n \n {\n handleSendReminder();\n }}\n >\n Send Reminder\n \n
\n )}\n \n \n {stepIsFinished(status) ? (\n
\n \n
\n ) : (\n \n {stepNumber}\n
\n )}\n \n \n {title}\n
\n \n \n );\n};\n\nexport default Step;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\nimport { Badge } from \"StyledComponents\";\n\nimport CustomCheckbox from \"common/CustomCheckbox\";\nimport getStatusCssClass from \"utils/getBadgeStatus\";\n\nconst InvoicesList = ({\n isSelected,\n deselectInvoices,\n selectInvoices,\n invoice,\n}) => {\n const { amount, company, id, invoiceNumber, status, issueDate, dueDate } =\n invoice;\n\n const { baseCurrency } = company;\n\n const handleCheckboxChange = () => {\n if (isSelected) {\n deselectInvoices([id]);\n } else {\n selectInvoices([id]);\n }\n };\n\n return (\n \n \n
\n
\n );\n};\n\nexport default Table;\n","import React, { useState } from \"react\";\n\nimport { XIcon } from \"miruIcons\";\nimport Steps from \"rc-steps\";\nimport \"rc-steps/assets/index.css\";\nimport { Button, Modal, Toastr } from \"StyledComponents\";\n\nimport clientApi from \"apis/clients\";\n\nimport EmailPreview from \"./EmailPreview\";\nimport Step from \"./Step\";\nimport Table from \"./Table\";\nimport { organizationSetupSteps, TOTAL_NUMBER_OF_STEPS } from \"./utils\";\n\nconst PaymentReminder = ({\n sendPaymentReminder,\n setSendPaymentReminder,\n client,\n clientInvoices,\n isDesktop,\n}) => {\n const invoiceStatus = [\"overdue\", \"viewed\", \"sent\"];\n const invoices = clientInvoices.filter(invoice =>\n invoiceStatus.includes(invoice.status)\n );\n\n const sortByStatus = (a, b) => {\n const statusAIndex = invoiceStatus.indexOf(a.status);\n const statusBIndex = invoiceStatus.indexOf(b.status);\n\n return statusAIndex - statusBIndex;\n };\n\n const [selectedInvoices, setSelectedInvoices] = useState e.stopPropagation()}>\n
\n \n );\n};\n\ninterface SendPaymentReminderEmail {\n subject: string;\n message: string;\n recipients: string[];\n}\n\nexport default PaymentReminder;\n","export const organizationSetupSteps = [\n { title: \"Select invoices\" },\n { title: \"Email preview\" },\n];\n\nexport const TOTAL_NUMBER_OF_STEPS = organizationSetupSteps.length;\n","import React from \"react\";\n\nimport { minToHHMM } from \"helpers\";\n\nconst MobileAmountBox = ({\n overdueAmount,\n outstandingAmount,\n totalMinutes,\n}) => (\n \n setSendPaymentReminder(false)}\n >\n
\n {renderSelectedForm()}\n Send Payment Reminder
\n\n (\n
\n \n {currentStep === 1 ? (\n
\n \n \n {selectedInvoices.length > 1\n ? `${selectedInvoices.length} invoices selected`\n : `${selectedInvoices.length} invoice selected`}\n \n {\n onNextBtnClick();\n setCurrentStep(2);\n }}\n >\n Continue\n \n
\n ) : (\n \n {\n setCurrentStep(1);\n }}\n >\n Back\n \n {\n handleSendReminder();\n }}\n >\n Send Reminder\n \n
\n )}\n \n
\n);\n\nexport default MobileAmountBox;\n","import React from \"react\";\n\nimport { cashFormatter, currencySymbol } from \"helpers\";\n\nimport AmountBoxContainer from \"common/AmountBox\";\nimport MobileAmountBox from \"common/AmountBox/MobileAmountBox\";\nimport ChartBar from \"common/ChartBar\";\nimport { useUserContext } from \"context/UserContext\";\n\nconst TotalHoursChart = ({\n clientData,\n fetchClientDetails,\n totalMinutes,\n overdueOutstandingAmount,\n}) => {\n const { isAdminUser, isDesktop } = useUserContext();\n\n const {\n currency = \"\",\n overdue_amount = 0,\n outstanding_amount = 0,\n } = overdueOutstandingAmount ?? {};\n\n const currencySymb = currencySymbol(currency);\n const formattedOverdueAmount = currencySymb + cashFormatter(overdue_amount);\n const formattedOutstandingAmount =\n currencySymb + cashFormatter(outstanding_amount);\n\n const amountBox = [\n {\n title: \"OVERDUE\",\n amount: formattedOverdueAmount,\n },\n {\n title: \"OUTSTANDING\",\n amount: formattedOutstandingAmount,\n },\n ];\n\n return (\n \n \n \n
\n
\n | \n TOTAL HOURS\n | \n\n OVERDUE\n | \nOUTSTANDING | \n
|---|---|---|
| {minToHHMM(totalMinutes)} | \n{overdueAmount} | \n{outstandingAmount} | \n
\n {isAdminUser && isDesktop && (\n
\n );\n};\n\nexport default TotalHoursChart;\n","export const tableHeader = [\n {\n Header: \"CLIENT\",\n accessor: \"col1\", // accessor is the \"key\" in the data\n cssClass: \"md:w-1/3 capitalize\",\n },\n {\n Header: \"HOURS LOGGED\",\n accessor: \"col2\",\n cssClass: \"text-right md:w-1/5\", // accessor is the \"key\" in the data\n },\n];\n\nexport const employeeTableHeader = [\n {\n Header: \"CLIENT\",\n accessor: \"col1\", // accessor is the \"key\" in the data\n cssClass: \"\",\n },\n {\n Header: \"HOURS LOGGED\",\n accessor: \"col2\",\n cssClass: \"text-right\", // accessor is the \"key\" in the data\n },\n];\nexport const mobileEmployeeTableHeader = [\n {\n Header: \"CLIENT\",\n accessor: \"col1\", // accessor is the \"key\" in the data\n cssClass: \"\",\n },\n {\n Header: \"HOURS LOGGED\",\n accessor: \"col3\",\n cssClass: \"text-right\", // accessor is the \"key\" in the data\n },\n];\nexport const mobileTableHeader = [\n {\n Header: \"CLIENT\",\n accessor: \"col1\", // accessor is the \"key\" in the data\n cssClass: \"table__header font-medium\",\n },\n {\n Header: \"HOURS\",\n accessor: \"col3\",\n cssClass: \"table__header font-medium text-right\", // accessor is the \"key\" in the data\n },\n {\n Header: \"\",\n accessor: \"col4\",\n cssClass: \"font-medium text-right\", // accessor is the \"key\" in the data\n },\n];\n","import React, { useEffect, useState, useRef } from \"react\";\n\nimport { useNavigate } from \"react-router-dom\";\n\nimport clientApi from \"apis/clients\";\nimport Loader from \"common/Loader/index\";\nimport withLayout from \"common/Mobile/HOC/withLayout\";\nimport { useUserContext } from \"context/UserContext\";\nimport { unmapClientList } from \"mapper/mappedIndex\";\nimport { sendGAPageView } from \"utils/googleAnalytics\";\n\nimport ClientMobileMoreOptions from \"./ClientMobileMoreOptions\";\nimport Header from \"./Header\";\nimport ClientList from \"./List\";\nimport DeleteClient from \"./Modals/DeleteClient\";\nimport EditClient from \"./Modals/EditClient\";\nimport NewClient from \"./Modals/NewClient\";\nimport TotalHoursChart from \"./TotalHoursChart\";\n\nconst Clients = ({ isAdminUser }) => {\n const [clientId, setClientId] = useState(\"\");\n const [showEditDialog, setShowEditDialog] = useState\n
\n )}\n {isAdminUser && !isDesktop && (\n \n fetchClientDetails(e.target.value)}\n >\n \n \n \n \n
\n {clientData && (\n \n
\n {showEditDialog && (\n \n \n \n
\n );\n};\n\ninterface Iprops {\n user: object;\n companyRole: Roles;\n company: object;\n isDesktop: boolean;\n isAdminUser: boolean;\n}\n\nexport default Home;\n","import React from \"react\";\n\nimport Home from \"./Home\";\n\nimport Navbar from \"../Navbar\";\n\nconst Dashboard = props => {\n const { isAdminUser, user, isDesktop, setIsDesktop, companyRole } = props;\n\n window.addEventListener(\"resize\", () =>\n setIsDesktop(window.innerWidth > 1023)\n );\n\n window.removeEventListener(\"resize\", () =>\n setIsDesktop(window.innerWidth > 1023)\n );\n\n if (isDesktop) {\n return (\n \n
\n );\n }\n\n return (\n \n
\n );\n};\n\nexport default Dashboard;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\n\nimport { FileDownloader } from \"../utils\";\n\nconst Expense = ({ expense, currency }) => (\n \n
\n);\n\nexport default Expense;\n","import React from \"react\";\n\nimport { ArrowLeftIcon, EditIcon, DeleteIcon } from \"miruIcons\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Button } from \"StyledComponents\";\n\nconst Header = ({ expense, handleEdit, handleDelete }) => {\n const navigate = useNavigate();\n\n return (\n \n \n Amount\n \n \n {currencyFormat(currency, expense?.amount)}\n \n
\n \n
\n \n \n Date\n \n \n {expense?.date || \"-\"}\n \n
\n \n \n Vendor\n \n \n {expense?.vendorName || \"-\"}\n \n
\n \n \n Type\n \n \n {expense?.type || \"-\"}\n \n
\n \n \n Receipt\n \n
\n \n {expense?.receipts.length > 0\n ? expense?.receipts.map((receipt, index) => (\n \n
\n \n \n Description\n \n \n {expense?.description || \"-\"}\n \n
\n \n
\n );\n};\n\nexport default Header;\n","import React, { Fragment, useEffect, useState } from \"react\";\n\nimport Logger from \"js-logger\";\nimport { useNavigate, useParams } from \"react-router-dom\";\n\nimport expensesApi from \"apis/expenses\";\nimport Loader from \"common/Loader/index\";\nimport { useUserContext } from \"context/UserContext\";\n\nimport Expense from \"./Expense\";\nimport Header from \"./Header\";\n\nimport DeleteExpenseModal from \"../Modals/DeleteExpenseModal\";\nimport EditExpenseModal from \"../Modals/EditExpenseModal\";\nimport EditExpense from \"../Modals/Mobile/EditExpense\";\nimport { setCategoryData, setVendorData } from \"../utils\";\n\nconst ExpenseDetails = () => {\n const [showDeleteExpenseModal, setShowDeleteExpenseModal] =\n useState\n navigate(\"/expenses\")}\n >\n
\n \n \n \n
\n \n \n \n
\n \n
\n );\n }\n\n return (\n \n {!isDesktop && showEditExpenseModal ? null : (\n \n \n )}\n {showEditExpenseModal &&\n (isDesktop ? (\n
\n );\n};\n\nexport default ExpenseDetails;\n","import React from \"react\";\n\nimport { Categories } from \"components/Expenses/utils\";\n\nconst ExpensesSummary = () => (\n \n
\n ))}\n \n \n);\n\nexport default ExpensesSummary;\n","import React from \"react\";\n\nimport { DeleteIcon, EditIcon, DownloadSimpleIcon } from \"miruIcons\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Tooltip, Modal, Button } from \"StyledComponents\";\n\nimport { DownloadAll } from \"components/Expenses/utils\";\n\nconst MoreOptions = ({\n expense,\n isDesktop,\n showMoreOptions,\n setShowMoreOptions,\n handleDelete,\n}) => {\n const navigate = useNavigate();\n\n return isDesktop ? (\n \n {Categories?.map(category => (\n \n \n {category.icon}\n
\n \n \n {category.label}\n \n \n {category.color}\n \n
\n - \n
- \n
Download Expense\n \n
\n Vendor\n \n
\n DATE\n \n
\n {icon}\n
\n );\n };\n\n const handleExpenseClick = id => {\n navigate(`${id}`);\n };\n\n const handleDelete = () => {\n setShowDeleteExpenseModal(true);\n };\n\n return (\n \n {getCategoryIcon()}\n
\n \n {categoryName}\n
\n \n {!isDesktop && getCategoryIcon()}\n
\n \n \n {vendorName}\n \n
\n \n {description}\n
\n\n {expenseType}\n
\n - \n
- {date} \n
\n {receipts?.length > 0 && isDesktop && (\n
\n \n {/* TODO: Uncomment and integrate when API is ready\n
\n ) : (\n
\n);\n\nexport default Container;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\nimport { PlusIcon } from \"miruIcons\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Button } from \"StyledComponents\";\n\nimport AutoSearch from \"common/AutoSearch\";\nimport { useUserContext } from \"context/UserContext\";\n\nconst SearchDataRow = ({ item }) => {\n const { company } = useUserContext();\n const navigate = useNavigate();\n\n const handleClick = item => {\n navigate(`/expenses/${item.value}`);\n };\n\n return (\n \n setShowAddExpenseModal(true)}\n >\n
\n);\n\nexport default Header;\n","import React, { useEffect, useState } from \"react\";\n\nimport { Toastr } from \"StyledComponents\";\n\nimport expensesApi from \"apis/expenses\";\nimport Loader from \"common/Loader/index\";\nimport withLayout from \"common/Mobile/HOC/withLayout\";\nimport { useUserContext } from \"context/UserContext\";\n\nimport Container from \"./Container\";\nimport Header from \"./Header\";\n\nimport AddExpenseModal from \"../Modals/AddExpenseModal\";\nimport AddExpense from \"../Modals/Mobile/AddExpense\";\nimport {\n setCategoryData,\n setVendorData,\n unmapExpenseListForDropdown,\n} from \"../utils\";\n\nconst Expenses = () => {\n const { isDesktop } = useUserContext();\n const [showAddExpenseModal, setShowAddExpenseModal] =\n useState\n Expenses\n
\n\n
\n );\n }\n\n const ExpensesLayout = () => (\n \n
\n );\n\n const Main = withLayout(ExpensesLayout, !isDesktop, !isDesktop);\n\n if (!isDesktop) {\n if (showAddExpenseModal) {\n return (\n \n Add New Expense\n \n
\n \n
\n \n);\n\nexport default AddExpenseModal;\n","import React from \"react\";\n\nimport { useNavigate } from \"react-router-dom\";\nimport { Modal, Button } from \"StyledComponents\";\n\nimport expensesApi from \"apis/expenses\";\n\nconst DeleteExpenseModal = ({\n setShowDeleteExpenseModal,\n showDeleteExpenseModal,\n expense,\n fetchExpenses,\n}) => {\n const navigate = useNavigate();\n\n const handleDeleteExpense = async () => {\n const res = await expensesApi.destroy(expense.id);\n if (res.status === 200) {\n navigate(\"/expenses/\", { replace: true });\n fetchExpenses();\n }\n setShowDeleteExpenseModal(false);\n };\n\n return (\n \n
\n Delete Expense
\n\n Are you sure you want to delete this expense?\n
This action cannot be reversed.\n
\n {\n setShowDeleteExpenseModal(false);\n }}\n >\n CANCEL\n \n \n DELETE\n \n
\n \n );\n};\n\nexport default DeleteExpenseModal;\n","import React from \"react\";\n\nimport { XIcon } from \"miruIcons\";\nimport { Button, Modal } from \"StyledComponents\";\n\nimport ExpenseForm from \"./ExpenseForm\";\n\nconst EditExpenseModal = ({\n showEditExpenseModal,\n setShowEditExpenseModal,\n expenseData,\n handleEditExpense,\n expense,\n}) => (\n \n Edit Expense\n \n
\n \n
\n \n);\n\nexport default EditExpenseModal;\n","/* eslint-disable import/exports-last */\nimport React from \"react\";\n\nimport CreatableSelect from \"react-select/creatable\";\n\nimport {\n customErrStyles,\n customStyles,\n CustomValueContainer,\n} from \"common/CustomReactSelectStyle\";\nimport { useUserContext } from \"context/UserContext\";\n\ntype CustomCreatableSelectProps = {\n id?: string;\n styles?: any;\n components?: any;\n classNamePrefix?: string;\n label?: string;\n isErr?: any;\n isSearchable?: boolean;\n isDisabled?: boolean;\n ignoreDisabledFontColor?: boolean;\n hideDropdownIndicator?: boolean;\n handleOnClick?: (e?: any) => void; // eslint-disable-line\n handleOnChange?: (e?: any) => void; // eslint-disable-line\n handleonFocus?: (e?: any) => void; // eslint-disable-line\n onBlur?: (e?: any) => void; // eslint-disable-line\n defaultValue?: object;\n onMenuClose?: (e?: any) => void; // eslint-disable-line\n onMenuOpen?: (e?: any) => void; // eslint-disable-line\n className?: string;\n autoFocus?: boolean;\n value?: object;\n getOptionLabel?: (e?: any) => any; // eslint-disable-line\n wrapperClassName?: string;\n options?: Array\n {props?.data?.icon}\n {props?.data?.label}\n
\n \n {receipts.map(receipt => (\n \n
\n ))}\n \n );\n\n const UploadCard = () => (\n \n
\n \n {receipt.name}\n
\n \n \n PDF\n \n {Math.ceil(receipt.size / 1024)}kb\n
\n \n
\n \n
\n \n setShowDatePicker(!showDatePicker)}\n >\n {}} //eslint-disable-line\n />\n
\n {showDatePicker && (\n \n
\n \n setAmount(e.target.value)}\n />\n
\n \n
\n \n setDescription(e.target.value)}\n />\n
\n \n \n Expense Type\n \n
\n \n {\n setExpenseType(\"business\");\n }}\n />\n {\n setExpenseType(\"personal\");\n }}\n />\n
\n \n \n Receipt (optional)\n \n {receipts.length > 0 ?
\n \n {expense ? (\n \n Save Changes\n \n ) : (\n \n Add Expense\n \n )}\n
\n \n );\n};\n\nexport default ExpenseForm;\n","import React from \"react\";\n\nimport AddEditModalHeader from \"common/Mobile/AddEditModalHeader\";\n\nimport ExpenseForm from \"../ExpenseForm\";\n\nconst AddExpense = ({\n expenseData,\n handleAddExpense,\n setShowAddExpenseModal,\n}) => (\n \n {\n setShowAddExpenseModal(false);\n }}\n />\n
\n);\n\nexport default AddExpense;\n","import React from \"react\";\n\nimport AddEditModalHeader from \"common/Mobile/AddEditModalHeader\";\n\nimport ExpenseForm from \"../ExpenseForm\";\n\nconst EditExpense = ({\n expenseData,\n handleEditExpense,\n setShowEditExpenseModal,\n expense,\n}) => (\n \n {\n setShowEditExpenseModal(false);\n }}\n />\n
\n);\n\nexport default EditExpense;\n","import React from \"react\";\n\nimport JSZip from \"jszip\";\nimport {\n ExpenseIconSVG,\n PaymentsIcon,\n FoodIcon,\n PercentIcon,\n ShieldIcon,\n WrenchIcon,\n FurnitureIcon,\n CarIcon,\n HouseIcon,\n} from \"miruIcons\";\nimport { Toastr } from \"StyledComponents\";\n\nexport const Categories = [\n {\n value: \"Food\",\n label: \"Food\",\n icon: \n
\n);\n\ninterface Invoice {\n invoice_number: number;\n status: string;\n amount: number;\n stripe_enabled: boolean;\n}\n\ninterface InvoiceEmailProps {\n invoice: Invoice;\n stripeUrl: string;\n isStripeConnected: boolean;\n setIsInvoiceEmail: (_value) => void;\n setShowConnectPaymentDialog: (_value) => void;\n setShowStripeDisabledDialog: (_value) => void;\n}\n\nexport default Header;\n","import React from \"react\";\n\nimport InvoiceInfo from \"./InvoiceInfo\";\nimport InvoiceTotalSummary from \"./InvoiceTotalSummary\";\n\nimport CompanyInfo from \"../Invoices/common/CompanyInfo\";\nimport ClientInfo from \"../Invoices/Invoice/ClientInfo\";\nimport InvoiceLineItems from \"../Invoices/Invoice/InvoiceLineItems\";\n\nconst InvoiceDetails = ({ invoice, company, lineItems, client, logo }) => {\n const invoiceWaived = invoice?.status === \"waived\";\n const strikeAmount = invoiceWaived && \"line-through\";\n\n const sortedLineItems = [...lineItems].sort((a, b) => {\n const dateA = new Date(a.date);\n const dateB = new Date(b.date);\n\n return dateA.getTime() - dateB.getTime();\n });\n\n return (\n <>\n \n
\n \n
\n Invoice #{invoice.invoice_number}
\n\n
\n \n
\n \n {invoice.status == \"waived\" || invoice.amount <= 0 ? (\n \n \n {\n if (invoice.status != \"paid\") {\n if (isStripeConnected && !invoice.stripe_enabled) {\n setShowStripeDisabledDialog(true);\n } else if (isStripeConnected) {\n window.location.href = stripeUrl;\n } else {\n setIsInvoiceEmail(true);\n setShowConnectPaymentDialog(true);\n }\n }\n }}\n >\n
\n \n
\n \n \n ) : (\n \n
\n \n PAY\n
\n\n
\n \n )}\n \n
\n \n PAY\n
\n\n
\n \n
\n \n Date of Issue\n
\n\n {formattedDate(issue_date)}\n
\n\n Due Date\n
\n\n {formattedDate(due_date)}\n
\n\n
\n \n Invoice Number\n
\n\n {invoice_number}\n
\n\n Reference\n
\n\n {reference}\n
\n\n \n {currencyFormat(currency, amount)}\n \n
\n \n );\n};\n\nexport default InvoiceInfo;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\n\nconst InvoiceTotalSummary = ({ invoice, company, lineItems, strikeAmount }) => {\n const subTotal = lineItems\n .reduce((prev, curr) => prev + (curr.rate * curr.quantity) / 60, 0)\n .toFixed(2);\n\n const { amount_due, amount_paid, discount, tax } = invoice;\n const { currency } = company;\n const total = Number(subTotal) + Number(tax) - Number(discount);\n\n return (\n \n Amount\n
\n\n \n \n
\n
\n );\n};\n\nexport default InvoiceTotalSummary;\n","import React from \"react\";\n\nimport { StripeLogoSVG } from \"miruIcons\";\n\nconst Discountmenu = ({ stripeUrl }) => (\n | \n Sub total\n | \n
| \n Discount\n | \n
| \n Tax\n | \n
| \n Total\n | \n
| \n Amount Paid\n | \n
| \n Amount Due\n | \n
\n
\n);\n\nexport default Discountmenu;\n","import React, { useEffect, useState } from \"react\";\n\nimport { InstagramSVG, TwitterSVG, MiruLogoWithTextSVG } from \"miruIcons\";\nimport { useParams } from \"react-router-dom\";\n\nimport invoicesApi from \"apis/invoices\";\nimport Loader from \"common/Loader\";\nimport MobileView from \"components/ClientInvoices/Details/MobileView\";\nimport ConnectPaymentGateway from \"components/Invoices/popups/ConnectPaymentGateway\";\nimport StripeDisabledInvoice from \"components/Invoices/popups/StripeDisabledInvoice\";\nimport { useUserContext } from \"context/UserContext\";\n\nimport Header from \"./Header\";\nimport InvoiceDetails from \"./InvoiceDetails\";\n\nconst InvoiceEmail = () => {\n const params = useParams();\n const { isDesktop } = useUserContext();\n\n const [loading, setLoading] = useState(true);\n const [data, setData] = useState(null);\n const [isStripeConnected, setIsStripeConnected] = useState- \n
- \n \n \n
\n
\n );\n }\n\n const { url, invoice, logo, lineItems, company, client } = data;\n\n return isDesktop ? (\n \n
\n ) : (\n \n 
\n
\n \n
\n \n
\n {isInvoiceEmail && showConnectPaymentDialog && (\n \n \n © Miru. All rights reserved.\n \n \n \n miru.so/\n \n \n 
\n \n \n 
\n \n \n
\n \n \n \n \n
\n);\n\nexport default Header;\n","import React from \"react\";\n\nimport MobileView from \"components/Invoices/Generate/MobileView\";\n\nconst EditInvoiceForm = ({\n invoiceDetails,\n handleSaveInvoice,\n lineItems,\n setAmount,\n setAmountDue,\n setDiscount,\n setDueDate,\n setInvoiceNumber,\n setIssueDate,\n setLineItems,\n setReference,\n setTax,\n setSelectedClient,\n selectedClient,\n setSelectedLineItems,\n setManualEntryArr,\n manualEntryArr,\n amount,\n amountDue,\n amountPaid,\n discount,\n dueDate,\n invoiceNumber,\n issueDate,\n reference,\n tax,\n selectedLineItems,\n isStripeEnabled,\n showConnectPaymentDialog,\n setShowConnectPaymentDialog,\n}) => {\n const { company } = invoiceDetails;\n\n return (\n Edit Invoice #{invoiceNumber}
\n\n \n \n \n
\n \n
\n {(showSendInvoiceModal || isSendReminder) &&\n !showConnectPaymentDialog && (\n \n
\n \n
\n);\n\nexport default Container;\n","import React, { useState, useRef, useEffect } from \"react\";\n\nimport dayjs from \"dayjs\";\nimport { Formik, Form, FormikProps } from \"formik\";\nimport {\n lineTotalCalc,\n minFromHHMM,\n minToHHMM,\n useDebounce,\n useOutsideClick,\n} from \"helpers\";\nimport { CalendarIcon, DeleteIcon, FloppyDiskIcon } from \"miruIcons\";\nimport { Button, TimeInput } from \"StyledComponents\";\n\nimport CustomDatePicker from \"common/CustomDatePicker\";\nimport { CustomInputText } from \"common/CustomInputText\";\nimport { CustomTextareaAutosize } from \"common/CustomTextareaAutosize\";\nimport { InputErrors, InputField } from \"common/FormikFields\";\nimport NewLineItemTable from \"components/Invoices/common/NewLineItemTable\";\nimport { fetchNewLineItems } from \"components/Invoices/common/utils\";\n\nimport { addEditFormInitialValues, addEditFormSchema } from \"./utils\";\n\nimport { sections } from \"../../utils\";\n\nconst AddLineItemContainer = ({\n dateFormat,\n setManualEntryArr,\n manualEntryArr,\n lineItems,\n setLineItems,\n selectedLineItems,\n setSelectedLineItems,\n selectedClient,\n setActiveSection,\n multiLineItemModal,\n setMultiLineItemModal,\n editItem,\n setEditItem,\n}) => {\n const [name, setName] = useState\n
\n \n {}} //eslint-disable-line\n >\n {(props: FormikProps) => {\n const { touched, errors, values, setFieldValue, setFieldError } =\n props;\n\n return (\n
\n \n )}\n \n \n
\n \n handleDelete(editItem)}\n >\n handleSubmitForm(values)}\n >\n
\n ) : (\n \n {\n setActiveSection(sections.generateInvoice);\n }}\n >\n
\n )}\n \n );\n};\n\nexport default InvoiceInfo;\n","import React from \"react\";\n\nimport { currencyFormat } from \"helpers\";\nimport { EditIcon } from \"miruIcons\";\n\nimport { sections } from \"../../utils\";\n\nconst InvoiceTotal = ({\n currency,\n subTotal,\n discount,\n tax,\n total,\n amountPaid,\n amountDue,\n setActiveSection,\n showEditButton = true,\n strikeAmount = \"\",\n}) => {\n const AmountComponent = ({ label, value }) => (\n \n \n Billed to\n \n
\n \n {name || label}\n
\n\n {selectedClient?.address\n ? `${address_line_1}${\n address_line_2 ? `, ${address_line_2}` : \"\"\n }\\n${\n address_line_2 ? \",\" : \"\"\n }\\n${city}, ${state}, ${country},\\n${pin}`\n : \"No address found\"}\n
\n {phone}\n
\n
\n \n \n Date of Issue\n \n \n {dayjs(issueDate, dateFormat).format(dateFormat)}\n \n
\n \n \n Invoice Number\n \n \n {invoiceNumber}\n \n
\n \n
\n \n \n Due Date\n \n \n {dayjs(dueDate, dateFormat).format(dateFormat)}\n \n
\n \n \n Reference\n \n \n {reference}\n \n
\n \n \n Amount\n \n \n {currencyFormat(currency, amount)}\n \n
\n {showEditButton && (\n \n \n {label}\n \n \n {currencyFormat(currency, value)}\n \n
\n );\n\n return (\n \n {\n setActiveSection(sections.generateInvoice);\n }}\n >\n
\n )}\n \n );\n};\n\nexport default InvoiceTotal;\n","import React from \"react\";\n\nimport { EditIcon, FloppyDiskIcon, PaperPlaneTiltIcon } from \"miruIcons\";\nimport { Button } from \"StyledComponents\";\n\nimport CompanyInfo from \"components/Invoices/common/CompanyInfo\";\n\nimport InvoiceInfo from \"./InvoiceInfo\";\nimport InvoiceTotal from \"./InvoiceTotal\";\n\nimport { sections } from \"../../utils\";\nimport LineItems from \"../MenuContainer/LineItems\";\n\nconst InvoicePreviewContainer = ({\n invoiceDetails,\n selectedClient,\n setActiveSection,\n selectedLineItems,\n setEditItem,\n manualEntryArr,\n dueDate,\n issueDate,\n invoiceNumber,\n reference,\n amount,\n isInvoicePreviewCall,\n amountDue,\n amountPaid,\n currency,\n discount,\n tax,\n total,\n subTotal,\n handleSaveInvoice,\n handleSendButtonClick,\n}) => {\n const { companyDetails } = invoiceDetails;\n\n return (\n \n
\n \n
\n {showEditButton && (\n \n {companyDetails &&
\n \n {\n setActiveSection(sections.generateInvoice);\n }}\n >\n
\n \n \n {\n handleSendButtonClick();\n }}\n >\n
\n \n );\n};\n\nexport default InvoicePreviewContainer;\n","import React from \"react\";\n\nconst InputComponent = ({ label, value, onChange, readOnly = false }) => (\n \n \n {label}\n \n
\n);\n\nconst Billing = ({\n amountDue,\n amountPaid,\n discount,\n setAmount,\n setAmountDue,\n setDiscount,\n setTax,\n tax,\n total,\n setTotal,\n subTotal,\n setSubTotal,\n}) => (\n \n
\n);\n\nexport default Billing;\n","import React, { useState, useRef, useEffect } from \"react\";\n\nimport dayjs from \"dayjs\";\nimport { Formik, Form, FormikProps } from \"formik\";\nimport { useOutsideClick } from \"helpers\";\nimport { SearchIcon, CalendarIcon, CaretDownIcon } from \"miruIcons\";\nimport Select, { components, DropdownIndicatorProps } from \"react-select\";\n\nimport { CustomAdvanceInput } from \"common/CustomAdvanceInput\";\nimport CustomDatePicker from \"common/CustomDatePicker\";\nimport { CustomInputText } from \"common/CustomInputText\";\nimport { InputErrors, InputField } from \"common/FormikFields\";\nimport { reactSelectStyles } from \"components/Invoices/common/InvoiceDetails/Styles\";\n\nimport { invoiceDetailsFormInitialValues, invoiceDetailsSchema } from \"./utils\";\n\nconst InvoiceDetails = ({\n dueDate,\n issueDate,\n invoiceDetails,\n invoiceNumber,\n reference,\n selectedClient,\n setReference,\n setSelectedClient,\n dateFormat,\n setDueDate,\n setIssueDate,\n setInvoiceNumber,\n handleSaveInvoice,\n}) => {\n const [isClientVisible, setIsClientVisible] = useState\n setSubTotal(e.target.value)}\n />\n setDiscount(e.target.value)}\n />\n
\n \n setTax(e.target.value)}\n />\n setTotal(e.target.value)}\n />\n setAmount(e.target.value)}\n />\n setAmountDue(e.target.value)}\n />\n
\n \n
\n);\n\nexport default InvoicePreview;\n","import React from \"react\";\n\nimport dayjs from \"dayjs\";\nimport { currencyFormat, lineTotalCalc, minToHHMM } from \"helpers\";\n\nimport { sections } from \"../../utils\";\n\nconst LineItemRow = ({\n currency,\n item,\n dateFormat,\n setEditItem,\n setActiveSection,\n isInvoicePreviewCall,\n strikeAmount = \"\",\n}) => {\n const { first_name, last_name, name, date, rate, quantity, description } =\n item;\n\n return (\n <>\n \n {\n if (selectedClient) {\n setActiveSection(sections.invoicePreview);\n setIsInvoicePreviewCall(true);\n }\n }}\n >\n Invoice Preview\n \n
\n \n \n Total\n \n \n {currencyFormat(currency, total)}\n \n
\n \n \n {\n handleSendButtonClick();\n }}\n >\n
\n \n {openDropdown ? (\n
\n \n );\n\n return (\n \n
\n \n \n
\n \n
\n \n
\n \n {multiLineItemModal && (\n
\n );\n};\n\nexport default MultiLineContainer;\n","import React, { useState, useEffect } from \"react\";\n\nimport cn from \"classnames\";\nimport { Formik, Form, FormikProps } from \"formik\";\nimport { XIcon } from \"miruIcons\";\nimport { useNavigate } from \"react-router-dom\";\nimport { Toastr } from \"StyledComponents\";\n\nimport invoicesApi from \"apis/invoices\";\nimport { CustomAdvanceInput } from \"common/CustomAdvanceInput\";\nimport { CustomTextareaAutosize } from \"common/CustomTextareaAutosize\";\nimport { InputErrors } from \"common/FormikFields\";\nimport {\n emailBody,\n emailSubject,\n buttonText,\n isDisabled,\n} from \"components/Invoices/common/InvoiceForm/SendInvoice/utils\";\nimport { ApiStatus as InvoiceStatus } from \"constants/index\";\n\nconst SendInvoiceContainer = ({\n invoice,\n handleSaveSendInvoice,\n setIsSending,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n setIsSendReminder = _value => {},\n isSendReminder = false,\n}) => {\n const Recipient: React.FC<{\n email: string;\n handleClick: any;\n recipientsCount: any;\n }> = ({ email, handleClick, recipientsCount }) => (\n \n \n
\n );\n interface InvoiceEmail {\n recipients: string[];\n subject: string;\n message: string;\n }\n\n const [invoiceEmail, setInvoiceEmail] = useState{email}
\n {recipientsCount > 1 && (\n\n \n {(props: FormikProps) => {\n const { touched, errors } = props;\n\n return (\n
\n \n {showBackButton && (\n \n )}\n \n {getLabel()}\n \n {showSettingsButton && (\n \n )}\n
\n );\n};\n\nexport default Header;\n","import React, { useState } from \"react\";\n\nimport Container from \"./Container\";\nimport Header from \"./Header\";\nimport { sections } from \"./utils\";\n\nconst MobileView = ({\n dueDate,\n issueDate,\n invoiceDetails,\n invoiceNumber,\n reference,\n selectedClient,\n setReference,\n setSelectedClient,\n dateFormat,\n setDueDate,\n setIssueDate,\n setInvoiceNumber,\n manualEntryArr,\n setManualEntryArr,\n lineItems,\n setLineItems,\n selectedLineItems,\n setSelectedLineItems,\n amount,\n amountDue,\n amountPaid,\n discount,\n setAmount,\n setAmountDue,\n setDiscount,\n setTax,\n tax,\n handleSaveInvoice,\n isEdit,\n isStripeEnabled,\n setShowConnectPaymentDialog,\n showConnectPaymentDialog,\n}) => {\n const [activeSection, setActiveSection] = useState\n
\n );\n};\n\nexport default MobileView;\n","export const sections = {\n generateInvoice: { value: \"generateInvoice\", label: \"Generate Invoice\" },\n addLineItem: { value: \"addLineItem\", label: \"Add Line Item\" },\n editLineItem: { value: \"editLineItem\", label: \"Edit Line Item\" },\n multipleEntries: {\n value: \"multipleEntries\",\n label: \"Select multiple entries\",\n },\n invoicePreview: { value: \"invoicePreview\", label: \"Invoice Preview\" },\n invoiceSettings: { value: \"invoiceSettings\", label: \"Invoice Settings\" },\n sendInvoice: { value: \"sendInvoice\", label: \"Send Invoice\" },\n};\n","import React, { Fragment, useEffect, useState } from \"react\";\n\nimport dayjs from \"dayjs\";\nimport { useNavigate, useSearchParams } from \"react-router-dom\";\nimport { Toastr } from \"StyledComponents\";\n\nimport companiesApi from \"apis/companies\";\nimport invoicesApi from \"apis/invoices\";\nimport PaymentsProviders from \"apis/payments/providers\";\nimport Loader from \"common/Loader/index\";\nimport { ApiStatus as InvoiceStatus } from \"constants/index\";\nimport { useUserContext } from \"context/UserContext\";\nimport { mapGenerateInvoice, unmapGenerateInvoice } from \"mapper/mappedIndex\";\nimport { sendGAPageView } from \"utils/googleAnalytics\";\n\nimport Container from \"./Container\";\nimport MobileView from \"./MobileView\";\n\nimport Header from \"../common/InvoiceForm/Header\";\nimport SendInvoice from \"../common/InvoiceForm/SendInvoice\";\nimport { generateInvoiceLineItems } from \"../common/utils\";\nimport InvoiceSettings from \"../InvoiceSettings\";\nimport ConnectPaymentGateway from \"../popups/ConnectPaymentGateway\";\n\nconst GenerateInvoices = () => {\n const navigate = useNavigate();\n const [status, setStatus] = useState