|
| 1 | +import React, { createContext, useContext, ReactElement } from 'react'; |
| 2 | +import { useMachine } from '@xstate/react'; |
| 3 | +import insurerMachine, { InsurerContext as EC } from './insurerMachine'; |
| 4 | +import { State, EventData } from 'xstate'; |
| 5 | +import { SpaceProps } from '@tpr/core'; |
| 6 | +import { i18n as i18nDefaults, InsurerI18nProps } from './i18n'; |
| 7 | +import { useI18n } from '../hooks/use-i18n'; |
| 8 | + |
| 9 | +export const InsurerContext = createContext<InsurerContextProps>({ |
| 10 | + current: {}, |
| 11 | + send: (_, __) => ({}), |
| 12 | + onCorrect: () => {}, |
| 13 | + onRemove: Promise.resolve, |
| 14 | + onSaveType: Promise.resolve, |
| 15 | + i18n: i18nDefaults, |
| 16 | +}); |
| 17 | + |
| 18 | +type RenderProps = (_props: InsurerContextProps) => ReactElement; |
| 19 | + |
| 20 | +export interface InsurerContextProps |
| 21 | + extends Omit<InsurerProviderProps, 'insurer'> { |
| 22 | + send: (event: any, payload?: EventData) => Partial<State<EC, any, any, any>>; |
| 23 | + current: Partial<State<EC, any, any, any>>; |
| 24 | +} |
| 25 | + |
| 26 | +export type RecursivePartial<T> = { |
| 27 | + [P in keyof T]?: RecursivePartial<T[P]>; |
| 28 | +}; |
| 29 | + |
| 30 | +export type InsurerProps = { |
| 31 | + id: string; |
| 32 | + schemeRoleId: number; |
| 33 | + effectiveDate: string; |
| 34 | + organisationReference: number; |
| 35 | + organisationName: string; |
| 36 | + insurerCompanyReference: string; |
| 37 | + addressLine1: string; |
| 38 | + addressLine2: string; |
| 39 | + addressLine3: string; |
| 40 | + postTown: string; |
| 41 | + county: string; |
| 42 | + postcode: string; |
| 43 | + countryId: string; |
| 44 | + telephoneNumber: string; |
| 45 | + emailAddress: string; |
| 46 | + [key: string]: any; |
| 47 | +}; |
| 48 | + |
| 49 | +export interface InsurerProviderProps { |
| 50 | + complete?: boolean; |
| 51 | + onCorrect?: (...args: any[]) => void; |
| 52 | + onRemove?: (...args: any[]) => Promise<any>; |
| 53 | + onSaveType?: (...args: any[]) => Promise<any>; |
| 54 | + testId?: string; |
| 55 | + /** insurer props from the API */ |
| 56 | + insurer: Partial<InsurerProps>; |
| 57 | + children?: RenderProps | ReactElement; |
| 58 | + /** overwrite any text that you need */ |
| 59 | + i18n?: RecursivePartial<InsurerI18nProps>; |
| 60 | + /** cfg space props */ |
| 61 | + cfg?: SpaceProps; |
| 62 | +} |
| 63 | + |
| 64 | +export const InsurerProvider = ({ |
| 65 | + complete, |
| 66 | + insurer, |
| 67 | + children, |
| 68 | + i18n: i18nOverrides = {}, |
| 69 | + ...rest |
| 70 | +}: InsurerProviderProps) => { |
| 71 | + const i18n = useI18n(i18nDefaults, i18nOverrides); |
| 72 | + const [current, send] = useMachine(insurerMachine, { |
| 73 | + context: { |
| 74 | + complete, |
| 75 | + insurer, |
| 76 | + }, |
| 77 | + }); |
| 78 | + |
| 79 | + const ui = |
| 80 | + typeof children === 'function' |
| 81 | + ? children({ current, send, i18n, ...rest }) |
| 82 | + : children; |
| 83 | + return ( |
| 84 | + <InsurerContext.Provider value={{ current, send, i18n, ...rest }}> |
| 85 | + {ui} |
| 86 | + </InsurerContext.Provider> |
| 87 | + ); |
| 88 | +}; |
| 89 | + |
| 90 | +export const useInsurerContext = (): InsurerContextProps => { |
| 91 | + const insurerUtils = useContext(InsurerContext); |
| 92 | + if (!insurerUtils) { |
| 93 | + throw new Error( |
| 94 | + `Insurer compound components cannot be rendered outside the InsurerProvider component`, |
| 95 | + ); |
| 96 | + } |
| 97 | + return insurerUtils; |
| 98 | +}; |
0 commit comments