@gusto/embedded-react-sdk 0.37.0-rc.5 → 0.38.0

package/dist/components/Employee/EmployeeDocuments/EmployeeDocumentsPresentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmployeeDocumentsPresentation.js","sources":["../../../../src/components/Employee/EmployeeDocuments/EmployeeDocumentsPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { Flex, CheckboxField, FlexItem } from '@/components/Common'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nconst EMPLOYEE_DOCUMENTS_FORM_ID = 'gusto-sdk-employee-documents-form'\n\nconst EmployeeDocumentsSchema = z.object({\n  includeI9: z.boolean(),\n})\n\nexport type EmployeeDocumentsFormValues = z.infer<typeof EmployeeDocumentsSchema>\n\nexport interface EmployeeDocumentsPresentationProps {\n  isEmployeeSelfOnboarding: boolean\n  currentI9Status: boolean\n  onSubmit: (formData: EmployeeDocumentsFormValues) => Promise<void>\n  onDone: () => void\n  isPending: boolean\n}\n\nexport const EmployeeDocumentsPresentation = ({\n  isEmployeeSelfOnboarding,\n  currentI9Status,\n  onSubmit,\n  onDone,\n  isPending,\n}: EmployeeDocumentsPresentationProps) => {\n  useI18n('Employee.EmployeeDocuments')\n  const { t } = useTranslation('Employee.EmployeeDocuments')\n  const { Alert, Heading, Text, Button, Link, UnorderedList } = useComponentContext()\n\n  const formMethods = useForm<EmployeeDocumentsFormValues>({\n    resolver: zodResolver(EmployeeDocumentsSchema),\n    defaultValues: {\n      includeI9: currentI9Status,\n    },\n  })\n\n  const includeI9 = formMethods.watch('includeI9')\n\n  const renderSelfOnboarding = () => (\n    <FormProvider {...formMethods}>\n      <Form id={EMPLOYEE_DOCUMENTS_FORM_ID} onSubmit={formMethods.handleSubmit(onSubmit)}>\n        <Flex flexDirection=\"column\" gap={16}>\n          <FlexItem>\n            <Heading as=\"h2\">{t('selfOnboarding.title')}</Heading>\n            <Text variant=\"supporting\">{t('selfOnboarding.description')}</Text>\n          </FlexItem>\n\n          <Heading as=\"h3\">{t('selfOnboarding.documentsIncludedLabel')}</Heading>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.taxWithholdingLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.taxWithholdingDescription')}</Text>\n          </FlexItem>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.directDepositLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.directDepositDescription')}</Text>\n          </FlexItem>\n\n          <Heading as=\"h3\">{t('selfOnboarding.includeI9Heading')}</Heading>\n          <CheckboxField\n            name=\"includeI9\"\n            label={t('selfOnboarding.includeI9Label')}\n            description={t('selfOnboarding.includeI9Description')}\n          />\n\n          {includeI9 ? (\n            <Alert status=\"warning\" label={t('selfOnboarding.alerts.includedTitle')}>\n              <UnorderedList\n                items={[\n                  <Trans\n                    key=\"included-description-1\"\n                    i18nKey={'selfOnboarding.alerts.includedDescription'}\n                    t={t}\n                    components={{\n                      Link: <Link />,\n                    }}\n                  />,\n                  <span key=\"included-description-2\">\n                    {t('selfOnboarding.alerts.includedDescription2')}\n                  </span>,\n                ]}\n              />\n            </Alert>\n          ) : (\n            <Alert status=\"info\" label={t('selfOnboarding.alerts.notIncludedTitle')}>\n              <Trans\n                i18nKey={'selfOnboarding.alerts.notIncludedDescription'}\n                t={t}\n                components={{\n                  Link: <Link />,\n                }}\n              />\n            </Alert>\n          )}\n        </Flex>\n      </Form>\n    </FormProvider>\n  )\n\n  const renderNotSelfOnboarding = () => (\n    <Flex flexDirection=\"column\" gap={16}>\n      <FlexItem>\n        <Heading as=\"h2\">{t('notSelfOnboarding.title')}</Heading>\n        <Text>{t('notSelfOnboarding.description')}</Text>\n      </FlexItem>\n\n      <FlexItem>\n        <Text weight=\"medium\">{t('notSelfOnboarding.employmentEligibilityLabel')}</Text>\n        <Text>{t('notSelfOnboarding.employmentEligibilityDescription')}</Text>\n      </FlexItem>\n\n      <FlexItem>\n        <Text weight=\"medium\">{t('notSelfOnboarding.taxWithholdingLabel')}</Text>\n        <Text>{t('notSelfOnboarding.taxWithholdingDescription')}</Text>\n      </FlexItem>\n\n      <FlexItem>\n        <Text weight=\"medium\">{t('notSelfOnboarding.directDepositLabel')}</Text>\n        <Text>{t('notSelfOnboarding.directDepositDescription')}</Text>\n      </FlexItem>\n\n      <Alert status=\"info\" label={t('notSelfOnboarding.alertTitle')} disableScrollIntoView></Alert>\n    </Flex>\n  )\n\n  return (\n    <>\n      <Flex flexDirection=\"column\" gap={16}>\n        {isEmployeeSelfOnboarding ? renderSelfOnboarding() : renderNotSelfOnboarding()}\n\n        <Flex justifyContent=\"flex-end\" gap={12}>\n          {isEmployeeSelfOnboarding ? (\n            <Button\n              variant=\"primary\"\n              type=\"submit\"\n              form={EMPLOYEE_DOCUMENTS_FORM_ID}\n              isLoading={isPending}\n            >\n              {t('continueCta')}\n            </Button>\n          ) : (\n            <Button variant=\"primary\" onClick={onDone}>\n              {t('continueCta')}\n            </Button>\n          )}\n        </Flex>\n      </Flex>\n    </>\n  )\n}\n"],"names":["EMPLOYEE_DOCUMENTS_FORM_ID","EmployeeDocumentsSchema","z","EmployeeDocumentsPresentation","isEmployeeSelfOnboarding","currentI9Status","onSubmit","onDone","isPending","useI18n","t","useTranslation","Alert","Heading","Text","Button","Link","UnorderedList","useComponentContext","formMethods","useForm","zodResolver","includeI9","jsxs","Flex","jsx","FormProvider","Form","FlexItem","CheckboxField","Trans"],"mappings":"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"}
+{"version":3,"file":"EmployeeDocumentsPresentation.js","sources":["../../../../src/components/Employee/EmployeeDocuments/EmployeeDocumentsPresentation.tsx"],"sourcesContent":["import { Trans, useTranslation } from 'react-i18next'\nimport { FormProvider, useForm } from 'react-hook-form'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { z } from 'zod'\nimport { Flex, CheckboxField, FlexItem } from '@/components/Common'\nimport { Form } from '@/components/Common/Form'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { useI18n } from '@/i18n'\n\nconst EMPLOYEE_DOCUMENTS_FORM_ID = 'gusto-sdk-employee-documents-form'\n\nconst EmployeeDocumentsSchema = z.object({\n  includeI9: z.boolean(),\n})\n\nexport type EmployeeDocumentsFormValues = z.infer<typeof EmployeeDocumentsSchema>\n\nexport interface EmployeeDocumentsPresentationProps {\n  isEmployeeSelfOnboarding: boolean\n  currentI9Status: boolean\n  onSubmit: (formData: EmployeeDocumentsFormValues) => Promise<void>\n  onDone: () => void\n  isPending: boolean\n}\n\nexport const EmployeeDocumentsPresentation = ({\n  isEmployeeSelfOnboarding,\n  currentI9Status,\n  onSubmit,\n  onDone,\n  isPending,\n}: EmployeeDocumentsPresentationProps) => {\n  useI18n('Employee.EmployeeDocuments')\n  const { t } = useTranslation('Employee.EmployeeDocuments')\n  const { Alert, Heading, Text, Button, Link, UnorderedList } = useComponentContext()\n\n  const formMethods = useForm<EmployeeDocumentsFormValues>({\n    resolver: zodResolver(EmployeeDocumentsSchema),\n    defaultValues: {\n      includeI9: currentI9Status,\n    },\n  })\n\n  const includeI9 = formMethods.watch('includeI9')\n\n  const renderSelfOnboarding = () => (\n    <FormProvider {...formMethods}>\n      <Form id={EMPLOYEE_DOCUMENTS_FORM_ID} onSubmit={formMethods.handleSubmit(onSubmit)}>\n        <Flex flexDirection=\"column\" gap={16}>\n          <FlexItem>\n            <Heading as=\"h2\">{t('selfOnboarding.title')}</Heading>\n            <Text variant=\"supporting\">{t('selfOnboarding.description')}</Text>\n          </FlexItem>\n\n          <Heading as=\"h3\">{t('selfOnboarding.documentsIncludedLabel')}</Heading>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.taxWithholdingLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.taxWithholdingDescription')}</Text>\n          </FlexItem>\n          <FlexItem>\n            <Text weight=\"medium\">{t('selfOnboarding.directDepositLabel')}</Text>\n            <Text variant=\"supporting\">{t('selfOnboarding.directDepositDescription')}</Text>\n          </FlexItem>\n\n          <Heading as=\"h3\">{t('selfOnboarding.includeI9Heading')}</Heading>\n          <CheckboxField\n            name=\"includeI9\"\n            label={t('selfOnboarding.includeI9Label')}\n            description={t('selfOnboarding.includeI9Description')}\n          />\n\n          {includeI9 ? (\n            <Alert status=\"warning\" label={t('selfOnboarding.alerts.includedTitle')}>\n              <UnorderedList\n                items={[\n                  <Trans\n                    key=\"included-description-1\"\n                    i18nKey={'selfOnboarding.alerts.includedDescription'}\n                    t={t}\n                    components={{\n                      Link: <Link />,\n                    }}\n                  />,\n                  <span key=\"included-description-2\">\n                    {t('selfOnboarding.alerts.includedDescription2')}\n                  </span>,\n                ]}\n              />\n            </Alert>\n          ) : (\n            <Alert status=\"info\" label={t('selfOnboarding.alerts.notIncludedTitle')}>\n              <Trans\n                i18nKey={'selfOnboarding.alerts.notIncludedDescription'}\n                t={t}\n                components={{\n                  Link: <Link />,\n                }}\n              />\n            </Alert>\n          )}\n        </Flex>\n      </Form>\n    </FormProvider>\n  )\n\n  const renderNotSelfOnboarding = () => (\n    <Flex flexDirection=\"column\" gap={16}>\n      <FlexItem>\n        <Heading as=\"h2\">{t('notSelfOnboarding.title')}</Heading>\n        <Text>{t('notSelfOnboarding.description')}</Text>\n      </FlexItem>\n\n      <FlexItem>\n        <Text weight=\"medium\">{t('notSelfOnboarding.employmentEligibilityLabel')}</Text>\n        <Text>{t('notSelfOnboarding.employmentEligibilityDescription')}</Text>\n      </FlexItem>\n\n      <FlexItem>\n        <Text weight=\"medium\">{t('notSelfOnboarding.taxWithholdingLabel')}</Text>\n        <Text>{t('notSelfOnboarding.taxWithholdingDescription')}</Text>\n      </FlexItem>\n\n      <FlexItem>\n        <Text weight=\"medium\">{t('notSelfOnboarding.directDepositLabel')}</Text>\n        <Text>{t('notSelfOnboarding.directDepositDescription')}</Text>\n      </FlexItem>\n\n      <Alert status=\"info\" label={t('notSelfOnboarding.alertTitle')} disableScrollIntoView></Alert>\n    </Flex>\n  )\n\n  return (\n    <>\n      <Flex flexDirection=\"column\" gap={16}>\n        {isEmployeeSelfOnboarding ? renderSelfOnboarding() : renderNotSelfOnboarding()}\n\n        <Flex justifyContent=\"flex-end\" gap={12}>\n          {isEmployeeSelfOnboarding ? (\n            <Button\n              variant=\"primary\"\n              type=\"submit\"\n              form={EMPLOYEE_DOCUMENTS_FORM_ID}\n              isLoading={isPending}\n            >\n              {t('continueCta')}\n            </Button>\n          ) : (\n            <Button variant=\"primary\" onClick={onDone}>\n              {t('continueCta')}\n            </Button>\n          )}\n        </Flex>\n      </Flex>\n    </>\n  )\n}\n"],"names":["EMPLOYEE_DOCUMENTS_FORM_ID","EmployeeDocumentsSchema","z","EmployeeDocumentsPresentation","isEmployeeSelfOnboarding","currentI9Status","onSubmit","onDone","isPending","useI18n","t","useTranslation","Alert","Heading","Text","Button","Link","UnorderedList","useComponentContext","formMethods","useForm","zodResolver","includeI9","jsxs","Flex","jsx","FormProvider","Form","FlexItem","CheckboxField","Trans"],"mappings":"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"}

package/dist/components/Employee/EmployeeList/EmployeeList.d.ts

@@ -1,10 +1,7 @@
 import { BaseComponentInterface, CommonComponentInterface } from '../../Base/Base';
 interface EmployeeListProps extends CommonComponentInterface<'Employee.EmployeeList'> {
     companyId: string;
+    onEvent: BaseComponentInterface['onEvent'];
 }
-export declare function EmployeeList(props: EmployeeListProps & BaseComponentInterface): import("react/jsx-runtime").JSX.Element;
-/**
- * Wrapper used inside Flows -> exposes flow context for required parameters
- */
-export declare const EmployeeListContextual: () => import("react/jsx-runtime").JSX.Element;
+export declare function EmployeeList({ FallbackComponent, ...props }: EmployeeListProps & BaseComponentInterface): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Employee/EmployeeList/EmployeeList.js

@@ -1,100 +1,54 @@
-import { jsx as o, jsxs as R } from "react/jsx-runtime";
-import { useEmployeesList as T } from "@gusto/embedded-api/react-query/employeesList";
-import { useEmployeesDeleteMutation as B } from "@gusto/embedded-api/react-query/employeesDelete";
-import { useEmployeesUpdateOnboardingStatusMutation as v } from "@gusto/embedded-api/react-query/employeesUpdateOnboardingStatus";
-import { keepPreviousData as G } from "@tanstack/react-query";
-import { EmployeeListProvider as x } from "./useEmployeeList.js";
-import { Actions as C } from "./Actions.js";
-import { BaseComponent as Y } from "../../Base/Base.js";
-import { useBase as F } from "../../Base/useBase.js";
-import { Flex as U } from "../../Common/Flex/Flex.js";
-import { Loading as W } from "../../Common/Loading/Loading.js";
-import { useI18n as q, useComponentDictionary as j } from "../../../i18n/I18n.js";
-import { componentEvents as s, EmployeeOnboardingStatus as m } from "../../../shared/constants.js";
-import { Head as k } from "./Head.js";
-import { List as H } from "./List.js";
-import { useFlow as V } from "../../Flow/useFlow.js";
-import { usePagination as z } from "../../../hooks/usePagination/usePagination.js";
-function J(n) {
-  return /* @__PURE__ */ o(Y, { ...n, children: /* @__PURE__ */ o(K, { ...n, children: n.children }) });
-}
-function K({ companyId: n, className: r, children: E, dictionary: u }) {
-  q("Employee.EmployeeList"), j("Employee.EmployeeList", u);
-  const { onEvent: a, baseSubmitHandler: i } = F(), { currentPage: d, itemsPerPage: y, getPaginationProps: f } = z(), { data: p, fetchStatus: O, isFetching: c } = T(
-    {
-      companyId: n,
-      page: d,
-      per: y
-    },
-    { placeholderData: G }
-  ), { mutateAsync: D } = B(), { mutateAsync: A } = v();
-  if (O === "fetching" && !p)
-    return /* @__PURE__ */ o(W, {});
-  const { httpMeta: I, showEmployees: L } = p, _ = L, h = async (t) => {
-    await i(t, async (e) => {
-      await D({
-        request: { employeeId: e }
-      }), a(s.EMPLOYEE_DELETED, { employeeId: e });
-    });
-  }, N = async (t) => {
-    await i(t, async (e) => {
-      await l({
-        employeeId: e,
-        status: m.SELF_ONBOARDING_AWAITING_ADMIN_REVIEW
-      }), a(s.EMPLOYEE_UPDATE, {
-        employeeId: e,
-        onboardingStatus: m.SELF_ONBOARDING_AWAITING_ADMIN_REVIEW
-      });
-    });
-  }, P = async (t) => {
-    await i(t, async (e) => {
-      await l({
-        employeeId: e,
-        status: m.ADMIN_ONBOARDING_INCOMPLETE
-      });
-    });
-  }, l = async (t) => {
-    await i(t, async ({ employeeId: e, status: w }) => {
-      const { employeeOnboardingStatus: b } = await A({
-        request: { employeeId: e, requestBody: { onboardingStatus: w } }
-      });
-      a(s.EMPLOYEE_ONBOARDING_STATUS_UPDATED, b);
-    });
-  }, g = () => {
-    a(s.EMPLOYEE_CREATE);
-  }, M = () => {
-    a(s.EMPLOYEE_ONBOARDING_DONE);
-  }, S = (t, e) => {
-    a(s.EMPLOYEE_UPDATE, { employeeId: t, onboardingStatus: e });
+import { jsx as r } from "react/jsx-runtime";
+import { EmployeeListView as c } from "./EmployeeListView.js";
+import { useEmployeeList as y } from "./useEmployeeList.js";
+import { BaseBoundaries as d, BaseLayout as a } from "../../Base/Base.js";
+import { useI18n as L, useComponentDictionary as u } from "../../../i18n/I18n.js";
+import { componentEvents as i } from "../../../shared/constants.js";
+function O({ companyId: s, onEvent: o, dictionary: E }) {
+  L("Employee.EmployeeList"), u("Employee.EmployeeList", E);
+  const e = y({
+    companyId: s
+  });
+  if (e.isLoading)
+    return /* @__PURE__ */ r(a, { isLoading: !0, error: e.errorHandling.errors });
+  const m = (t, n) => {
+    o(i.EMPLOYEE_UPDATE, { employeeId: t, onboardingStatus: n });
+  }, l = () => {
+    o(i.EMPLOYEE_CREATE);
+  }, p = () => {
+    o(i.EMPLOYEE_ONBOARDING_DONE);
   };
-  return /* @__PURE__ */ o("section", { className: r, children: /* @__PURE__ */ o(
-    x,
+  return /* @__PURE__ */ r(a, { error: e.errorHandling.errors, children: /* @__PURE__ */ r(
+    c,
     {
-      value: {
-        ...f(I.response.headers, c),
-        isFetching: c,
-        handleEdit: S,
-        handleNew: g,
-        handleReview: N,
-        handleDelete: h,
-        employees: _,
-        handleCancelSelfOnboarding: P,
-        handleSkip: M
+      employees: e.data.employees,
+      isFetching: e.status.isFetching,
+      pagination: e.pagination,
+      status: e.status,
+      onEdit: m,
+      onDelete: async (t) => {
+        await e.actions.onDelete(t), o(i.EMPLOYEE_DELETED, { employeeId: t });
+      },
+      onCancelSelfOnboarding: async (t) => {
+        const n = await e.actions.onCancelSelfOnboarding(t);
+        o(i.EMPLOYEE_ONBOARDING_STATUS_UPDATED, n);
       },
-      children: E || /* @__PURE__ */ R(U, { flexDirection: "column", children: [
-        /* @__PURE__ */ o(k, {}),
-        /* @__PURE__ */ o(H, {}),
-        /* @__PURE__ */ o(C, {})
-      ] })
+      onReview: async (t) => {
+        const n = await e.actions.onReview(t);
+        o(i.EMPLOYEE_UPDATE, n);
+      },
+      onAddEmployee: l,
+      onSkip: p
     }
   ) });
 }
-const ue = () => {
-  const { companyId: n, onEvent: r } = V();
-  return /* @__PURE__ */ o(J, { companyId: n, onEvent: r });
-};
+function h({
+  FallbackComponent: s,
+  ...o
+}) {
+  return /* @__PURE__ */ r(d, { componentName: "Employee.EmployeeList", FallbackComponent: s, children: /* @__PURE__ */ r(O, { ...o }) });
+}
 export {
-  J as EmployeeList,
-  ue as EmployeeListContextual
+  h as EmployeeList
 };
 //# sourceMappingURL=EmployeeList.js.map

package/dist/components/Employee/EmployeeList/EmployeeList.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmployeeList.js","sources":["../../../../src/components/Employee/EmployeeList/EmployeeList.tsx"],"sourcesContent":["import { useEmployeesList } from '@gusto/embedded-api/react-query/employeesList'\nimport type { OnboardingStatus } from '@gusto/embedded-api/models/operations/putv1employeesemployeeidonboardingstatus'\nimport { useEmployeesDeleteMutation } from '@gusto/embedded-api/react-query/employeesDelete'\nimport { useEmployeesUpdateOnboardingStatusMutation } from '@gusto/embedded-api/react-query/employeesUpdateOnboardingStatus'\nimport { keepPreviousData } from '@tanstack/react-query'\nimport type { OnboardingContextInterface } from '../OnboardingFlow/OnboardingFlowComponents'\nimport { EmployeeListProvider } from './useEmployeeList'\nimport { Actions } from './Actions'\nimport {\n  BaseComponent,\n  type BaseComponentInterface,\n  type CommonComponentInterface,\n} from '@/components/Base/Base'\nimport { useBase } from '@/components/Base/useBase'\nimport { Flex, Loading } from '@/components/Common'\nimport { useI18n, useComponentDictionary } from '@/i18n'\nimport { componentEvents, EmployeeOnboardingStatus } from '@/shared/constants'\nimport { Head } from '@/components/Employee/EmployeeList/Head'\nimport { List } from '@/components/Employee/EmployeeList/List'\nimport { useFlow } from '@/components/Flow/useFlow'\nimport { usePagination } from '@/hooks/usePagination/usePagination'\n\n//Interface for component specific props\ninterface EmployeeListProps extends CommonComponentInterface<'Employee.EmployeeList'> {\n  companyId: string\n}\n\nexport function EmployeeList(props: EmployeeListProps & BaseComponentInterface) {\n  return (\n    <BaseComponent {...props}>\n      <Root {...props}>{props.children}</Root>\n    </BaseComponent>\n  )\n}\nfunction Root({ companyId, className, children, dictionary }: EmployeeListProps) {\n  //Using i18n hook to directly load necessary namespace\n  useI18n('Employee.EmployeeList')\n  useComponentDictionary('Employee.EmployeeList', dictionary)\n  //Getting props from base context\n  const { onEvent, baseSubmitHandler } = useBase()\n  const { currentPage, itemsPerPage, getPaginationProps } = usePagination()\n\n  const { data, fetchStatus, isFetching } = useEmployeesList(\n    {\n      companyId,\n      page: currentPage,\n      per: itemsPerPage,\n    },\n    { placeholderData: keepPreviousData },\n  )\n\n  const { mutateAsync: deleteEmployeeMutation } = useEmployeesDeleteMutation()\n  const { mutateAsync: updateEmployeeOnboardingStatusMutation } =\n    useEmployeesUpdateOnboardingStatusMutation()\n\n  if (fetchStatus === 'fetching' && !data) {\n    return <Loading />\n  }\n  const { httpMeta, showEmployees: employeeList } = data!\n  const employees = employeeList!\n\n  const handleDelete = async (uuid: string) => {\n    await baseSubmitHandler(uuid, async payload => {\n      await deleteEmployeeMutation({\n        request: { employeeId: payload },\n      })\n\n      onEvent(componentEvents.EMPLOYEE_DELETED, { employeeId: payload })\n    })\n  }\n  /**Set onboarding status to self_onboarding_awaiting_admin_review and proceed to edit */\n  const handleReview = async (data: string) => {\n    await baseSubmitHandler(data, async employeeId => {\n      await updateOnboardingStatus({\n        employeeId,\n        status: EmployeeOnboardingStatus.SELF_ONBOARDING_AWAITING_ADMIN_REVIEW,\n      })\n      onEvent(componentEvents.EMPLOYEE_UPDATE, {\n        employeeId,\n        onboardingStatus: EmployeeOnboardingStatus.SELF_ONBOARDING_AWAITING_ADMIN_REVIEW,\n      })\n    })\n  }\n  /**Update employee onboarding status reverting it back to admin_onboarding_incomplete */\n  const handleCancelSelfOnboarding = async (data: string) => {\n    await baseSubmitHandler(data, async employeeId => {\n      await updateOnboardingStatus({\n        employeeId,\n        status: EmployeeOnboardingStatus.ADMIN_ONBOARDING_INCOMPLETE,\n      })\n    })\n  }\n  const updateOnboardingStatus = async (data: { employeeId: string; status: OnboardingStatus }) => {\n    await baseSubmitHandler(data, async ({ employeeId, status }) => {\n      const { employeeOnboardingStatus: responseData } =\n        await updateEmployeeOnboardingStatusMutation({\n          request: { employeeId, requestBody: { onboardingStatus: status } },\n        })\n      onEvent(componentEvents.EMPLOYEE_ONBOARDING_STATUS_UPDATED, responseData)\n    })\n  }\n  const handleNew = () => {\n    onEvent(componentEvents.EMPLOYEE_CREATE)\n  }\n  const handleSkip = () => {\n    onEvent(componentEvents.EMPLOYEE_ONBOARDING_DONE)\n  }\n\n  const handleEdit = (uuid: string, onboardingStatus?: OnboardingStatus) => {\n    onEvent(componentEvents.EMPLOYEE_UPDATE, { employeeId: uuid, onboardingStatus })\n  }\n  return (\n    <section className={className}>\n      <EmployeeListProvider\n        value={{\n          ...getPaginationProps(httpMeta.response.headers, isFetching),\n          isFetching,\n          handleEdit,\n          handleNew,\n          handleReview,\n          handleDelete,\n          employees,\n          handleCancelSelfOnboarding,\n          handleSkip,\n        }}\n      >\n        {children ? (\n          children\n        ) : (\n          <Flex flexDirection=\"column\">\n            <Head />\n            <List />\n            <Actions />\n          </Flex>\n        )}\n      </EmployeeListProvider>\n    </section>\n  )\n}\n\n/**\n * Wrapper used inside Flows -> exposes flow context for required parameters\n */\nexport const EmployeeListContextual = () => {\n  const { companyId, onEvent } = useFlow<OnboardingContextInterface>()\n  return <EmployeeList companyId={companyId} onEvent={onEvent} />\n}\n"],"names":["EmployeeList","props","jsx","BaseComponent","Root","companyId","className","children","dictionary","useI18n","useComponentDictionary","onEvent","baseSubmitHandler","useBase","currentPage","itemsPerPage","getPaginationProps","usePagination","data","fetchStatus","isFetching","useEmployeesList","keepPreviousData","deleteEmployeeMutation","useEmployeesDeleteMutation","updateEmployeeOnboardingStatusMutation","useEmployeesUpdateOnboardingStatusMutation","Loading","httpMeta","employeeList","employees","handleDelete","uuid","payload","componentEvents","handleReview","employeeId","updateOnboardingStatus","EmployeeOnboardingStatus","handleCancelSelfOnboarding","status","responseData","handleNew","handleSkip","handleEdit","onboardingStatus","EmployeeListProvider","jsxs","Flex","Head","List","Actions","EmployeeListContextual","useFlow"],"mappings":"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"}
+{"version":3,"file":"EmployeeList.js","sources":["../../../../src/components/Employee/EmployeeList/EmployeeList.tsx"],"sourcesContent":["import type { OnboardingStatus } from '@gusto/embedded-api/models/operations/putv1employeesemployeeidonboardingstatus'\nimport { EmployeeListView } from './EmployeeListView'\nimport { useEmployeeList } from './useEmployeeList'\nimport {\n  BaseBoundaries,\n  BaseLayout,\n  type BaseComponentInterface,\n  type CommonComponentInterface,\n} from '@/components/Base/Base'\nimport { useI18n, useComponentDictionary } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\n\ninterface EmployeeListProps extends CommonComponentInterface<'Employee.EmployeeList'> {\n  companyId: string\n  onEvent: BaseComponentInterface['onEvent']\n}\n\nfunction EmployeeListRoot({ companyId, onEvent, dictionary }: EmployeeListProps) {\n  useI18n('Employee.EmployeeList')\n  useComponentDictionary('Employee.EmployeeList', dictionary)\n\n  const employeeList = useEmployeeList({\n    companyId,\n  })\n\n  if (employeeList.isLoading) {\n    return <BaseLayout isLoading error={employeeList.errorHandling.errors} />\n  }\n\n  const handleEdit = (employeeId: string, onboardingStatus?: OnboardingStatus) => {\n    onEvent(componentEvents.EMPLOYEE_UPDATE, { employeeId, onboardingStatus })\n  }\n\n  const handleAddEmployee = () => {\n    onEvent(componentEvents.EMPLOYEE_CREATE)\n  }\n\n  const handleSkip = () => {\n    onEvent(componentEvents.EMPLOYEE_ONBOARDING_DONE)\n  }\n\n  return (\n    <BaseLayout error={employeeList.errorHandling.errors}>\n      <EmployeeListView\n        employees={employeeList.data.employees}\n        isFetching={employeeList.status.isFetching}\n        pagination={employeeList.pagination}\n        status={employeeList.status}\n        onEdit={handleEdit}\n        onDelete={async (employeeId: string) => {\n          await employeeList.actions.onDelete(employeeId)\n          onEvent(componentEvents.EMPLOYEE_DELETED, { employeeId })\n        }}\n        onCancelSelfOnboarding={async (employeeId: string) => {\n          const result = await employeeList.actions.onCancelSelfOnboarding(employeeId)\n          onEvent(componentEvents.EMPLOYEE_ONBOARDING_STATUS_UPDATED, result)\n        }}\n        onReview={async (employeeId: string) => {\n          const result = await employeeList.actions.onReview(employeeId)\n          onEvent(componentEvents.EMPLOYEE_UPDATE, result)\n        }}\n        onAddEmployee={handleAddEmployee}\n        onSkip={handleSkip}\n      />\n    </BaseLayout>\n  )\n}\n\nexport function EmployeeList({\n  FallbackComponent,\n  ...props\n}: EmployeeListProps & BaseComponentInterface) {\n  return (\n    <BaseBoundaries componentName=\"Employee.EmployeeList\" FallbackComponent={FallbackComponent}>\n      <EmployeeListRoot {...props} />\n    </BaseBoundaries>\n  )\n}\n"],"names":["EmployeeListRoot","companyId","onEvent","dictionary","useI18n","useComponentDictionary","employeeList","useEmployeeList","BaseLayout","handleEdit","employeeId","onboardingStatus","componentEvents","handleAddEmployee","handleSkip","jsx","EmployeeListView","result","EmployeeList","FallbackComponent","props","BaseBoundaries"],"mappings":";;;;;;AAiBA,SAASA,EAAiB,EAAE,WAAAC,GAAW,SAAAC,GAAS,YAAAC,KAAiC;AAC/E,EAAAC,EAAQ,uBAAuB,GAC/BC,EAAuB,yBAAyBF,CAAU;AAE1D,QAAMG,IAAeC,EAAgB;AAAA,IACnC,WAAAN;AAAA,EAAA,CACD;AAED,MAAIK,EAAa;AACf,6BAAQE,GAAA,EAAW,WAAS,IAAC,OAAOF,EAAa,cAAc,QAAQ;AAGzE,QAAMG,IAAa,CAACC,GAAoBC,MAAwC;AAC9E,IAAAT,EAAQU,EAAgB,iBAAiB,EAAE,YAAAF,GAAY,kBAAAC,GAAkB;AAAA,EAC3E,GAEME,IAAoB,MAAM;AAC9B,IAAAX,EAAQU,EAAgB,eAAe;AAAA,EACzC,GAEME,IAAa,MAAM;AACvB,IAAAZ,EAAQU,EAAgB,wBAAwB;AAAA,EAClD;AAEA,SACE,gBAAAG,EAACP,GAAA,EAAW,OAAOF,EAAa,cAAc,QAC5C,UAAA,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWV,EAAa,KAAK;AAAA,MAC7B,YAAYA,EAAa,OAAO;AAAA,MAChC,YAAYA,EAAa;AAAA,MACzB,QAAQA,EAAa;AAAA,MACrB,QAAQG;AAAA,MACR,UAAU,OAAOC,MAAuB;AACtC,cAAMJ,EAAa,QAAQ,SAASI,CAAU,GAC9CR,EAAQU,EAAgB,kBAAkB,EAAE,YAAAF,EAAA,CAAY;AAAA,MAC1D;AAAA,MACA,wBAAwB,OAAOA,MAAuB;AACpD,cAAMO,IAAS,MAAMX,EAAa,QAAQ,uBAAuBI,CAAU;AAC3E,QAAAR,EAAQU,EAAgB,oCAAoCK,CAAM;AAAA,MACpE;AAAA,MACA,UAAU,OAAOP,MAAuB;AACtC,cAAMO,IAAS,MAAMX,EAAa,QAAQ,SAASI,CAAU;AAC7D,QAAAR,EAAQU,EAAgB,iBAAiBK,CAAM;AAAA,MACjD;AAAA,MACA,eAAeJ;AAAA,MACf,QAAQC;AAAA,IAAA;AAAA,EAAA,GAEZ;AAEJ;AAEO,SAASI,EAAa;AAAA,EAC3B,mBAAAC;AAAA,EACA,GAAGC;AACL,GAA+C;AAC7C,SACE,gBAAAL,EAACM,KAAe,eAAc,yBAAwB,mBAAAF,GACpD,UAAA,gBAAAJ,EAACf,GAAA,EAAkB,GAAGoB,EAAA,CAAO,EAAA,CAC/B;AAEJ;"}

package/dist/components/Employee/EmployeeList/EmployeeListView.d.ts

@@ -0,0 +1,15 @@
+import { OnboardingStatus } from '@gusto/embedded-api/models/operations/putv1employeesemployeeidonboardingstatus';
+import { UseEmployeeListResult, EmployeeWithActions } from './useEmployeeList';
+export interface EmployeeListViewProps extends Pick<Extract<UseEmployeeListResult, {
+    isLoading: false;
+}>, 'pagination' | 'status'> {
+    employees: EmployeeWithActions[];
+    isFetching: boolean;
+    onEdit: (employeeId: string, onboardingStatus?: OnboardingStatus) => void;
+    onDelete: (employeeId: string) => Promise<void>;
+    onCancelSelfOnboarding: (employeeId: string) => Promise<void>;
+    onReview: (employeeId: string) => Promise<void>;
+    onAddEmployee: () => void;
+    onSkip: () => void;
+}
+export declare function EmployeeListView({ employees, isFetching, pagination, status, onEdit, onDelete, onCancelSelfOnboarding, onReview, onAddEmployee, onSkip, }: EmployeeListViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Employee/EmployeeList/EmployeeListView.js

@@ -0,0 +1,132 @@
+import { jsx as i, jsxs as a, Fragment as L } from "react/jsx-runtime";
+import { useState as k } from "react";
+import { useTranslation as A } from "react-i18next";
+import { Flex as u } from "../../Common/Flex/Flex.js";
+import "classnames";
+import "../../../shared/constants.js";
+import { EmptyData as S } from "../../Common/EmptyData/EmptyData.js";
+import { ActionsLayout as p } from "../../Common/ActionsLayout/ActionsLayout.js";
+import { useComponentContext as T } from "../../../contexts/ComponentAdapter/useComponentContext.js";
+import { EmployeeOnboardingStatusBadge as x } from "../../Common/OnboardingStatusBadge/index.js";
+import s from "../../../assets/icons/pencil.svg.js";
+import E from "../../../assets/icons/trashcan.svg.js";
+import { firstLastName as P } from "../../../helpers/formattedStrings.js";
+import f from "../../../assets/icons/plus-circle.svg.js";
+import { HamburgerMenu as B } from "../../Common/HamburgerMenu/HamburgerMenu.js";
+import { useDataView as j } from "../../Common/DataView/useDataView.js";
+import { DataView as V } from "../../Common/DataView/DataView.js";
+function Y({
+  employees: r,
+  isFetching: g,
+  pagination: h,
+  status: C,
+  onEdit: b,
+  onDelete: D,
+  onCancelSelfOnboarding: v,
+  onReview: w,
+  onAddEmployee: d,
+  onSkip: m
+}) {
+  const { t } = A("Employee.EmployeeList"), n = T(), [l, c] = k(null), { ...y } = j({
+    data: r,
+    columns: [
+      {
+        key: "name",
+        title: t("nameLabel"),
+        render: (e) => P({
+          first_name: e.firstName,
+          last_name: e.lastName
+        })
+      },
+      {
+        key: "status",
+        title: t("statusLabel"),
+        render: (e) => /* @__PURE__ */ i(
+          x,
+          {
+            onboarded: e.onboarded,
+            onboardingStatus: e.onboardingStatus
+          }
+        )
+      }
+    ],
+    itemMenu: (e) => {
+      const o = [];
+      return e.allowedActions.includes("edit") && o.push({
+        label: t("editCta"),
+        onClick: () => {
+          b(e.uuid, e.onboardingStatus ?? void 0);
+        },
+        icon: /* @__PURE__ */ i(s, { "aria-hidden": !0 })
+      }), e.allowedActions.includes("cancel_self_onboarding") && o.push({
+        label: t("cancelSelfOnboardingCta"),
+        onClick: () => {
+          v(e.uuid);
+        },
+        icon: /* @__PURE__ */ i(s, { "aria-hidden": !0 })
+      }), e.allowedActions.includes("review") && o.push({
+        label: t("reviewCta"),
+        onClick: () => {
+          w(e.uuid);
+        },
+        icon: /* @__PURE__ */ i(s, { "aria-hidden": !0 })
+      }), e.allowedActions.includes("delete") && o.push({
+        label: t("deleteCta"),
+        onClick: () => {
+          c(e.uuid);
+        },
+        icon: /* @__PURE__ */ i(E, { "aria-hidden": !0 })
+      }), /* @__PURE__ */ i(B, { items: o, triggerLabel: t("hamburgerTitle") });
+    },
+    isFetching: g,
+    pagination: h,
+    emptyState: () => /* @__PURE__ */ i(S, { title: t("emptyTableTitle"), description: t("emptyTableDescription"), children: /* @__PURE__ */ a(p, { justifyContent: "center", children: [
+      /* @__PURE__ */ i(n.Button, { variant: "secondary", onClick: m, children: t("skipCta") }),
+      /* @__PURE__ */ i(n.Button, { variant: "primary", onClick: d, icon: /* @__PURE__ */ i(f, {}), children: t("addEmployeeCta") })
+    ] }) })
+  });
+  return /* @__PURE__ */ a(L, { children: [
+    /* @__PURE__ */ a(u, { flexDirection: "column", gap: 24, children: [
+      /* @__PURE__ */ a(u, { justifyContent: "space-between", alignItems: "center", children: [
+        /* @__PURE__ */ i(n.Heading, { as: "h2", children: t("title") }),
+        r.length > 0 && /* @__PURE__ */ i(
+          n.Button,
+          {
+            variant: "secondary",
+            onClick: d,
+            icon: /* @__PURE__ */ i(f, {}),
+            children: t("addAnotherCta")
+          }
+        )
+      ] }),
+      /* @__PURE__ */ i(V, { label: t("employeeListLabel"), ...y }),
+      r.length > 0 && /* @__PURE__ */ i(p, { children: /* @__PURE__ */ i(n.Button, { onClick: m, children: t("continueCta") }) })
+    ] }),
+    /* @__PURE__ */ i(
+      n.Dialog,
+      {
+        isOpen: !!l,
+        onClose: () => {
+          c(null);
+        },
+        onPrimaryActionClick: async () => {
+          if (l)
+            try {
+              await D(l), c(null);
+            } catch {
+            }
+        },
+        isPrimaryActionLoading: C.isPending,
+        isDestructive: !0,
+        title: t("deleteDialog.title"),
+        primaryActionLabel: t("deleteDialog.confirmCta"),
+        closeActionLabel: t("deleteDialog.cancelCta"),
+        children: t("deleteDialog.description")
+      }
+    )
+  ] });
+}
+export {
+  Y as EmployeeListView
+};
+//# sourceMappingURL=EmployeeListView.js.map

package/dist/components/Employee/EmployeeList/EmployeeListView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmployeeListView.js","sources":["../../../../src/components/Employee/EmployeeList/EmployeeListView.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { OnboardingStatus } from '@gusto/embedded-api/models/operations/putv1employeesemployeeidonboardingstatus'\nimport type { UseEmployeeListResult, EmployeeWithActions } from './useEmployeeList'\nimport { DataView, EmptyData, ActionsLayout, useDataView, Flex } from '@/components/Common'\nimport { useComponentContext } from '@/contexts/ComponentAdapter/useComponentContext'\nimport { HamburgerMenu } from '@/components/Common/HamburgerMenu'\nimport { EmployeeOnboardingStatusBadge } from '@/components/Common/OnboardingStatusBadge'\nimport PencilSvg from '@/assets/icons/pencil.svg?react'\nimport TrashCanSvg from '@/assets/icons/trashcan.svg?react'\nimport { firstLastName } from '@/helpers/formattedStrings'\nimport PlusCircleIcon from '@/assets/icons/plus-circle.svg?react'\n\nexport interface EmployeeListViewProps extends Pick<\n  Extract<UseEmployeeListResult, { isLoading: false }>,\n  'pagination' | 'status'\n> {\n  employees: EmployeeWithActions[]\n  isFetching: boolean\n  onEdit: (employeeId: string, onboardingStatus?: OnboardingStatus) => void\n  onDelete: (employeeId: string) => Promise<void>\n  onCancelSelfOnboarding: (employeeId: string) => Promise<void>\n  onReview: (employeeId: string) => Promise<void>\n  onAddEmployee: () => void\n  onSkip: () => void\n}\n\nexport function EmployeeListView({\n  employees,\n  isFetching,\n  pagination,\n  status,\n  onEdit,\n  onDelete,\n  onCancelSelfOnboarding,\n  onReview,\n  onAddEmployee,\n  onSkip,\n}: EmployeeListViewProps) {\n  const { t } = useTranslation('Employee.EmployeeList')\n  const Components = useComponentContext()\n  const [employeeToDelete, setEmployeeToDelete] = useState<string | null>(null)\n\n  const { ...dataViewProps } = useDataView({\n    data: employees,\n    columns: [\n      {\n        key: 'name',\n        title: t('nameLabel'),\n        render: (employee: EmployeeWithActions) => {\n          return firstLastName({\n            first_name: employee.firstName,\n            last_name: employee.lastName,\n          })\n        },\n      },\n      {\n        key: 'status',\n        title: t('statusLabel'),\n        render: (employee: EmployeeWithActions) => (\n          <EmployeeOnboardingStatusBadge\n            onboarded={employee.onboarded}\n            onboardingStatus={employee.onboardingStatus}\n          />\n        ),\n      },\n    ],\n    itemMenu: employee => {\n      const menuItems = []\n\n      if (employee.allowedActions.includes('edit')) {\n        menuItems.push({\n          label: t('editCta'),\n          onClick: () => {\n            onEdit(employee.uuid, employee.onboardingStatus ?? undefined)\n          },\n          icon: <PencilSvg aria-hidden />,\n        })\n      }\n\n      if (employee.allowedActions.includes('cancel_self_onboarding')) {\n        menuItems.push({\n          label: t('cancelSelfOnboardingCta'),\n          onClick: () => {\n            void onCancelSelfOnboarding(employee.uuid)\n          },\n          icon: <PencilSvg aria-hidden />,\n        })\n      }\n\n      if (employee.allowedActions.includes('review')) {\n        menuItems.push({\n          label: t('reviewCta'),\n          onClick: () => {\n            void onReview(employee.uuid)\n          },\n          icon: <PencilSvg aria-hidden />,\n        })\n      }\n\n      if (employee.allowedActions.includes('delete')) {\n        menuItems.push({\n          label: t('deleteCta'),\n          onClick: () => {\n            setEmployeeToDelete(employee.uuid)\n          },\n          icon: <TrashCanSvg aria-hidden />,\n        })\n      }\n\n      return <HamburgerMenu items={menuItems} triggerLabel={t('hamburgerTitle')} />\n    },\n    isFetching,\n    pagination,\n    emptyState: () => (\n      <EmptyData title={t('emptyTableTitle')} description={t('emptyTableDescription')}>\n        <ActionsLayout justifyContent=\"center\">\n          <Components.Button variant=\"secondary\" onClick={onSkip}>\n            {t('skipCta')}\n          </Components.Button>\n          <Components.Button variant=\"primary\" onClick={onAddEmployee} icon={<PlusCircleIcon />}>\n            {t('addEmployeeCta')}\n          </Components.Button>\n        </ActionsLayout>\n      </EmptyData>\n    ),\n  })\n\n  return (\n    <>\n      <Flex flexDirection=\"column\" gap={24}>\n        <Flex justifyContent=\"space-between\" alignItems=\"center\">\n          <Components.Heading as=\"h2\">{t('title')}</Components.Heading>\n\n          {employees.length > 0 && (\n            <Components.Button\n              variant=\"secondary\"\n              onClick={onAddEmployee}\n              icon={<PlusCircleIcon />}\n            >\n              {t('addAnotherCta')}\n            </Components.Button>\n          )}\n        </Flex>\n\n        <DataView label={t('employeeListLabel')} {...dataViewProps} />\n\n        {employees.length > 0 && (\n          <ActionsLayout>\n            <Components.Button onClick={onSkip}>{t('continueCta')}</Components.Button>\n          </ActionsLayout>\n        )}\n      </Flex>\n\n      <Components.Dialog\n        isOpen={!!employeeToDelete}\n        onClose={() => {\n          setEmployeeToDelete(null)\n        }}\n        onPrimaryActionClick={async () => {\n          if (employeeToDelete) {\n            try {\n              await onDelete(employeeToDelete)\n              setEmployeeToDelete(null)\n            } catch {\n              // Keep dialog open on error\n            }\n          }\n        }}\n        isPrimaryActionLoading={status.isPending}\n        isDestructive\n        title={t('deleteDialog.title')}\n        primaryActionLabel={t('deleteDialog.confirmCta')}\n        closeActionLabel={t('deleteDialog.cancelCta')}\n      >\n        {t('deleteDialog.description')}\n      </Components.Dialog>\n    </>\n  )\n}\n"],"names":["EmployeeListView","employees","isFetching","pagination","status","onEdit","onDelete","onCancelSelfOnboarding","onReview","onAddEmployee","onSkip","useTranslation","Components","useComponentContext","employeeToDelete","setEmployeeToDelete","useState","dataViewProps","useDataView","employee","firstLastName","jsx","EmployeeOnboardingStatusBadge","menuItems","PencilSvg","TrashCanSvg","HamburgerMenu","EmptyData","jsxs","ActionsLayout","PlusCircleIcon","Fragment","Flex","DataView"],"mappings":"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"}

package/dist/components/Employee/EmployeeList/ManagementEmployeeList.d.ts

@@ -0,0 +1,9 @@
+import { BaseComponentInterface, CommonComponentInterface } from '../../Base/Base';
+type EmployeeTab = 'active' | 'onboarding' | 'dismissed';
+interface ManagementEmployeeListProps extends CommonComponentInterface<'Employee.ManagementEmployeeList'> {
+    companyId: string;
+    initialTab?: EmployeeTab;
+    onEvent: BaseComponentInterface['onEvent'];
+}
+export declare function ManagementEmployeeList({ FallbackComponent, ...props }: ManagementEmployeeListProps & BaseComponentInterface): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Employee/EmployeeList/ManagementEmployeeList.js

@@ -0,0 +1,81 @@
+import { jsx as s } from "react/jsx-runtime";
+import { useState as h, useMemo as M } from "react";
+import { ManagementEmployeeListView as T } from "./ManagementEmployeeListView.js";
+import { useEmployeeList as f } from "./useEmployeeList.js";
+import { BaseBoundaries as D, BaseLayout as m } from "../../Base/Base.js";
+import { useI18n as b, useComponentDictionary as P } from "../../../i18n/I18n.js";
+import { componentEvents as a } from "../../../shared/constants.js";
+const R = (t) => {
+  switch (t) {
+    case "active":
+      return "active";
+    case "onboarding":
+      return "onboarding";
+    case "dismissed":
+      return "terminated";
+  }
+};
+function I({
+  companyId: t,
+  initialTab: i = "active",
+  onEvent: n,
+  dictionary: E
+}) {
+  b("Employee.ManagementEmployeeList"), P("Employee.ManagementEmployeeList", E);
+  const [r, p] = h(i), l = M(() => R(r), [r]), o = f({
+    companyId: t,
+    employeeType: l
+  });
+  if (o.isLoading)
+    return /* @__PURE__ */ s(m, { isLoading: !0, error: o.errorHandling.errors });
+  const c = (e) => {
+    n(a.EMPLOYEE_UPDATE, { employeeId: e });
+  }, d = () => {
+    n(a.EMPLOYEE_CREATE);
+  }, y = (e) => {
+    n(a.EMPLOYEE_DISMISS, { employeeId: e });
+  }, u = (e) => {
+    n(a.EMPLOYEE_REHIRE, { employeeId: e });
+  }, g = (e) => {
+    p(e);
+  };
+  return /* @__PURE__ */ s(m, { error: o.errorHandling.errors, children: /* @__PURE__ */ s(
+    T,
+    {
+      selectedTab: r,
+      onTabChange: g,
+      employees: o.data.employees,
+      isFetching: o.status.isFetching,
+      pagination: o.pagination,
+      status: o.status,
+      onEdit: c,
+      onDismiss: y,
+      onDelete: async (e) => {
+        await o.actions.onDelete(e, {
+          onDelete: (L) => {
+            n(a.EMPLOYEE_DELETED, { employeeId: L });
+          }
+        });
+      },
+      onRehire: u,
+      onAddEmployee: d
+    }
+  ) });
+}
+function B({
+  FallbackComponent: t,
+  ...i
+}) {
+  return /* @__PURE__ */ s(
+    D,
+    {
+      componentName: "Employee.ManagementEmployeeList",
+      FallbackComponent: t,
+      children: /* @__PURE__ */ s(I, { ...i })
+    }
+  );
+}
+export {
+  B as ManagementEmployeeList
+};
+//# sourceMappingURL=ManagementEmployeeList.js.map

package/dist/components/Employee/EmployeeList/ManagementEmployeeList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ManagementEmployeeList.js","sources":["../../../../src/components/Employee/EmployeeList/ManagementEmployeeList.tsx"],"sourcesContent":["import { useState, useMemo } from 'react'\nimport { ManagementEmployeeListView } from './ManagementEmployeeListView'\nimport { useEmployeeList, type EmployeeType } from './useEmployeeList'\nimport {\n  BaseBoundaries,\n  BaseLayout,\n  type BaseComponentInterface,\n  type CommonComponentInterface,\n} from '@/components/Base/Base'\nimport { useI18n, useComponentDictionary } from '@/i18n'\nimport { componentEvents } from '@/shared/constants'\n\ntype EmployeeTab = 'active' | 'onboarding' | 'dismissed'\n\ninterface ManagementEmployeeListProps extends CommonComponentInterface<'Employee.ManagementEmployeeList'> {\n  companyId: string\n  initialTab?: EmployeeTab\n  onEvent: BaseComponentInterface['onEvent']\n}\n\nconst mapTabToEmployeeType = (tab: EmployeeTab): EmployeeType => {\n  switch (tab) {\n    case 'active':\n      return 'active'\n    case 'onboarding':\n      return 'onboarding'\n    case 'dismissed':\n      return 'terminated'\n  }\n}\n\nfunction ManagementEmployeeListRoot({\n  companyId,\n  initialTab = 'active',\n  onEvent,\n  dictionary,\n}: ManagementEmployeeListProps) {\n  useI18n('Employee.ManagementEmployeeList')\n  useComponentDictionary('Employee.ManagementEmployeeList', dictionary)\n\n  const [selectedTab, setSelectedTab] = useState<EmployeeTab>(initialTab)\n\n  const employeeType = useMemo(() => mapTabToEmployeeType(selectedTab), [selectedTab])\n\n  const employeeList = useEmployeeList({\n    companyId,\n    employeeType,\n  })\n\n  if (employeeList.isLoading) {\n    return <BaseLayout isLoading error={employeeList.errorHandling.errors} />\n  }\n\n  const handleEdit = (employeeId: string) => {\n    onEvent(componentEvents.EMPLOYEE_UPDATE, { employeeId })\n  }\n\n  const handleAddEmployee = () => {\n    onEvent(componentEvents.EMPLOYEE_CREATE)\n  }\n\n  const handleDismiss = (employeeId: string) => {\n    onEvent(componentEvents.EMPLOYEE_DISMISS, { employeeId })\n  }\n\n  const handleRehire = (employeeId: string) => {\n    onEvent(componentEvents.EMPLOYEE_REHIRE, { employeeId })\n  }\n\n  const handleTabChange = (tab: EmployeeTab) => {\n    setSelectedTab(tab)\n  }\n\n  return (\n    <BaseLayout error={employeeList.errorHandling.errors}>\n      <ManagementEmployeeListView\n        selectedTab={selectedTab}\n        onTabChange={handleTabChange}\n        employees={employeeList.data.employees}\n        isFetching={employeeList.status.isFetching}\n        pagination={employeeList.pagination}\n        status={employeeList.status}\n        onEdit={handleEdit}\n        onDismiss={handleDismiss}\n        onDelete={async (employeeId: string) => {\n          await employeeList.actions.onDelete(employeeId, {\n            onDelete: (id: string) => {\n              onEvent(componentEvents.EMPLOYEE_DELETED, { employeeId: id })\n            },\n          })\n        }}\n        onRehire={handleRehire}\n        onAddEmployee={handleAddEmployee}\n      />\n    </BaseLayout>\n  )\n}\n\nexport function ManagementEmployeeList({\n  FallbackComponent,\n  ...props\n}: ManagementEmployeeListProps & BaseComponentInterface) {\n  return (\n    <BaseBoundaries\n      componentName=\"Employee.ManagementEmployeeList\"\n      FallbackComponent={FallbackComponent}\n    >\n      <ManagementEmployeeListRoot {...props} />\n    </BaseBoundaries>\n  )\n}\n"],"names":["mapTabToEmployeeType","tab","ManagementEmployeeListRoot","companyId","initialTab","onEvent","dictionary","useI18n","useComponentDictionary","selectedTab","setSelectedTab","useState","employeeType","useMemo","employeeList","useEmployeeList","BaseLayout","handleEdit","employeeId","componentEvents","handleAddEmployee","handleDismiss","handleRehire","handleTabChange","jsx","ManagementEmployeeListView","id","ManagementEmployeeList","FallbackComponent","props","BaseBoundaries"],"mappings":";;;;;;;AAoBA,MAAMA,IAAuB,CAACC,MAAmC;AAC/D,UAAQA,GAAA;AAAA,IACN,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,EAAA;AAEb;AAEA,SAASC,EAA2B;AAAA,EAClC,WAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,SAAAC;AAAA,EACA,YAAAC;AACF,GAAgC;AAC9B,EAAAC,EAAQ,iCAAiC,GACzCC,EAAuB,mCAAmCF,CAAU;AAEpE,QAAM,CAACG,GAAaC,CAAc,IAAIC,EAAsBP,CAAU,GAEhEQ,IAAeC,EAAQ,MAAMb,EAAqBS,CAAW,GAAG,CAACA,CAAW,CAAC,GAE7EK,IAAeC,EAAgB;AAAA,IACnC,WAAAZ;AAAA,IACA,cAAAS;AAAA,EAAA,CACD;AAED,MAAIE,EAAa;AACf,6BAAQE,GAAA,EAAW,WAAS,IAAC,OAAOF,EAAa,cAAc,QAAQ;AAGzE,QAAMG,IAAa,CAACC,MAAuB;AACzC,IAAAb,EAAQc,EAAgB,iBAAiB,EAAE,YAAAD,EAAA,CAAY;AAAA,EACzD,GAEME,IAAoB,MAAM;AAC9B,IAAAf,EAAQc,EAAgB,eAAe;AAAA,EACzC,GAEME,IAAgB,CAACH,MAAuB;AAC5C,IAAAb,EAAQc,EAAgB,kBAAkB,EAAE,YAAAD,EAAA,CAAY;AAAA,EAC1D,GAEMI,IAAe,CAACJ,MAAuB;AAC3C,IAAAb,EAAQc,EAAgB,iBAAiB,EAAE,YAAAD,EAAA,CAAY;AAAA,EACzD,GAEMK,IAAkB,CAACtB,MAAqB;AAC5C,IAAAS,EAAeT,CAAG;AAAA,EACpB;AAEA,SACE,gBAAAuB,EAACR,GAAA,EAAW,OAAOF,EAAa,cAAc,QAC5C,UAAA,gBAAAU;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAAhB;AAAA,MACA,aAAac;AAAA,MACb,WAAWT,EAAa,KAAK;AAAA,MAC7B,YAAYA,EAAa,OAAO;AAAA,MAChC,YAAYA,EAAa;AAAA,MACzB,QAAQA,EAAa;AAAA,MACrB,QAAQG;AAAA,MACR,WAAWI;AAAA,MACX,UAAU,OAAOH,MAAuB;AACtC,cAAMJ,EAAa,QAAQ,SAASI,GAAY;AAAA,UAC9C,UAAU,CAACQ,MAAe;AACxB,YAAArB,EAAQc,EAAgB,kBAAkB,EAAE,YAAYO,GAAI;AAAA,UAC9D;AAAA,QAAA,CACD;AAAA,MACH;AAAA,MACA,UAAUJ;AAAA,MACV,eAAeF;AAAA,IAAA;AAAA,EAAA,GAEnB;AAEJ;AAEO,SAASO,EAAuB;AAAA,EACrC,mBAAAC;AAAA,EACA,GAAGC;AACL,GAAyD;AACvD,SACE,gBAAAL;AAAA,IAACM;AAAA,IAAA;AAAA,MACC,eAAc;AAAA,MACd,mBAAAF;AAAA,MAEA,UAAA,gBAAAJ,EAACtB,GAAA,EAA4B,GAAG2B,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAG7C;"}

package/dist/components/Employee/EmployeeList/ManagementEmployeeListView.d.ts

@@ -0,0 +1,17 @@
+import { UseEmployeeListResult, EmployeeWithActions } from './useEmployeeList';
+type EmployeeTab = 'active' | 'onboarding' | 'dismissed';
+export interface ManagementEmployeeListViewProps extends Pick<Extract<UseEmployeeListResult, {
+    isLoading: false;
+}>, 'pagination' | 'status'> {
+    employees: EmployeeWithActions[];
+    isFetching: boolean;
+    selectedTab: EmployeeTab;
+    onTabChange: (tab: EmployeeTab) => void;
+    onEdit: (employeeId: string) => void;
+    onDismiss: (employeeId: string) => void;
+    onDelete: (employeeId: string) => Promise<void>;
+    onRehire: (employeeId: string) => void;
+    onAddEmployee: () => void;
+}
+export declare function ManagementEmployeeListView({ selectedTab, onTabChange, employees, isFetching, status, onEdit, onDismiss, onDelete, onRehire, onAddEmployee, pagination, }: ManagementEmployeeListViewProps): import("react/jsx-runtime").JSX.Element;
+export {};