From 44fdc5edff154775164b217325ac5185dc664c2d Mon Sep 17 00:00:00 2001 From: Will McVay Date: Fri, 9 Apr 2021 17:02:04 +0100 Subject: [PATCH] feat: #3689 #3812 #3913 aml app fixes (#3922) --- .../ui/forms/__tests__/identification.tsx | 2 +- .../components/ui/forms/identification.tsx | 205 +++++++++++------- .../__snapshots__/update-status.tsx.snap | 33 +-- .../__tests__/primary-identification.tsx | 2 +- .../__tests__/secondary-identification.tsx | 2 +- .../ui/modal/__tests__/update-status.tsx | 6 + .../address-information.tsx.snap | 28 +++ .../__tests__/address-information.tsx | 9 +- .../address-information.tsx | 67 +++++- .../ui/modal/primary-identification.tsx | 3 +- .../__tests__/__snapshots__/profile.tsx.snap | 2 +- .../components/ui/modal/profile/profile.tsx | 8 +- .../ui/modal/secondary-identification.tsx | 3 +- .../src/components/ui/modal/update-status.tsx | 88 +++++--- .../aml-checklist/src/services/documents.ts | 39 +--- .../src/tests/badges/badge-branches.svg | 2 +- .../src/tests/badges/badge-functions.svg | 2 +- .../src/tests/badges/badge-lines.svg | 2 +- .../src/tests/badges/badge-statements.svg | 2 +- .../elements/src/components/Input/index.tsx | 2 +- .../components/ModalV2/__styles__/index.ts | 2 + .../src/webpack/webpack.config.dev.js | 1 - .../src/webpack/webpack.config.prod.js | 1 - 23 files changed, 327 insertions(+), 184 deletions(-) diff --git a/packages/aml-checklist/src/components/ui/forms/__tests__/identification.tsx b/packages/aml-checklist/src/components/ui/forms/__tests__/identification.tsx index 01c8a79cdf..4577a94080 100644 --- a/packages/aml-checklist/src/components/ui/forms/__tests__/identification.tsx +++ b/packages/aml-checklist/src/components/ui/forms/__tests__/identification.tsx @@ -23,7 +23,7 @@ describe('Identification', () => { const mockEvent = { preventDefault: jest.fn(), } - handleFilenameClick(mockValues)(mockEvent) + handleFilenameClick(mockValues, jest.fn())(mockEvent) expect(mockEvent.preventDefault).toBeCalled() expect(downloadDocument).toBeCalledWith(mockValues.documentId) }) diff --git a/packages/aml-checklist/src/components/ui/forms/identification.tsx b/packages/aml-checklist/src/components/ui/forms/identification.tsx index 0542336f0f..740986c976 100644 --- a/packages/aml-checklist/src/components/ui/forms/identification.tsx +++ b/packages/aml-checklist/src/components/ui/forms/identification.tsx @@ -1,6 +1,6 @@ -import React from 'react' +import React, { Dispatch, SetStateAction, useState } from 'react' import { ContactModel, IdentityDocumentModel } from '@reapit/foundations-ts-definitions' -import { Button, Input, DatePicker, CameraImageInput, Formik, Form, ButtonGroup } from '@reapit/elements' +import { Button, Input, CameraImageInput, Formik, Form, ButtonGroup, ModalV2, Loader, Section } from '@reapit/elements' import SelectIdentity from '@/components/ui/inputs/select-identity' import styles from '@/styles/pages/checklist-detail.scss?mod' import { downloadDocument } from '@/services/documents' @@ -30,15 +30,30 @@ export type IdentificationProps = { onPrevHandler: () => void } +export interface ModalState { + image: string | null + isLoading: boolean + isVisible: boolean +} + export const onSubmitHandler = (onSaveHandler: (formValues: IdentityDocumentForm) => void) => ( formValues: IdentityDocumentForm, ) => onSaveHandler(formValues) -export const handleFilenameClick = (values: IdentityDocumentForm) => { - return (e) => { - e.preventDefault() - downloadDocument(values.documentId) - } +export const handleFilenameClick = ( + values: IdentityDocumentForm, + setModalState: Dispatch>, +) => async (e) => { + e.preventDefault() + console.log(values) + setModalState({ isLoading: true, isVisible: true, image: null }) + const imageURL = await downloadDocument(values.documentId) + const image = imageURL ? imageURL : null + setModalState({ isLoading: false, isVisible: true, image }) +} + +export const handleCloseModal = (setModalState: Dispatch>) => () => { + setModalState({ isLoading: false, isVisible: false, image: null }) } export const Identification: React.FC = ({ @@ -49,82 +64,110 @@ export const Identification: React.FC = ({ onNextHandler, onPrevHandler, disabled = false, -}) => ( - - {({ values, isValid }) => { - const id = contact?.id || '' - return ( - <> - {disabled && ( -

- *Please ensure the Primary ID has been completed before adding a Secondary ID -

- )} -
- - - - -
-
-
-
- RPS Ref: - {id} +}) => { + const [modalState, setModalState] = useState({ + image: null, + isLoading: false, + isVisible: false, + }) + return ( + + {({ values, isValid }) => { + const id = contact?.id || '' + return ( + <> + {disabled && ( +

+ *Please ensure the Primary ID has been completed before adding a Secondary ID +

+ )} + + + + + +
+
+
+
+ RPS Ref: + {id} +
+ + + + +
- - - - -
-
-

* Indicates fields that are required in order to ‘Complete’ this section.

- - - ) - }} - -) +

* Indicates fields that are required in order to ‘Complete’ this section.

+ + + {modalState.isLoading ? ( + + ) : ( +
+ +
+ )} +
+ + ) + }} + + ) +} export default Identification diff --git a/packages/aml-checklist/src/components/ui/modal/__tests__/__snapshots__/update-status.tsx.snap b/packages/aml-checklist/src/components/ui/modal/__tests__/__snapshots__/update-status.tsx.snap index 3a951cb23d..9c701bae6f 100644 --- a/packages/aml-checklist/src/components/ui/modal/__tests__/__snapshots__/update-status.tsx.snap +++ b/packages/aml-checklist/src/components/ui/modal/__tests__/__snapshots__/update-status.tsx.snap @@ -2,7 +2,9 @@ exports[`UpdateStatus should match snapshot 1`] = ` -

+

You have completed 2 out of @@ -11,26 +13,15 @@ exports[`UpdateStatus should match snapshot 1`] = ` Mrs H Phillips . Please now select one of the following options in order to continue

-
- - ID Check Successful - -
+ } + onSubmit={[Function]} + > + +
`; diff --git a/packages/aml-checklist/src/components/ui/modal/__tests__/primary-identification.tsx b/packages/aml-checklist/src/components/ui/modal/__tests__/primary-identification.tsx index 84c0044569..f70375b1b8 100644 --- a/packages/aml-checklist/src/components/ui/modal/__tests__/primary-identification.tsx +++ b/packages/aml-checklist/src/components/ui/modal/__tests__/primary-identification.tsx @@ -43,7 +43,7 @@ describe('PrimaryIdentification', () => { initFormValues: { typeId: idCheck.identityDocument1?.typeId, details: idCheck.identityDocument1?.details, - expiry: new Date(idCheck.identityDocument1?.expiry as string), + expiry: idCheck.identityDocument1?.expiry, documentId: 'SOME_ID', }, } diff --git a/packages/aml-checklist/src/components/ui/modal/__tests__/secondary-identification.tsx b/packages/aml-checklist/src/components/ui/modal/__tests__/secondary-identification.tsx index d5c062db24..1ac995acb2 100644 --- a/packages/aml-checklist/src/components/ui/modal/__tests__/secondary-identification.tsx +++ b/packages/aml-checklist/src/components/ui/modal/__tests__/secondary-identification.tsx @@ -42,7 +42,7 @@ describe('SecondaryIdentification', () => { initFormValues: { typeId: idCheck.identityDocument2?.typeId, details: idCheck.identityDocument2?.details, - expiry: new Date(idCheck.identityDocument2?.expiry as string), + expiry: idCheck.identityDocument2?.expiry, documentId: 'SOME_ID', }, } diff --git a/packages/aml-checklist/src/components/ui/modal/__tests__/update-status.tsx b/packages/aml-checklist/src/components/ui/modal/__tests__/update-status.tsx index 489a45c16a..7e5be371b3 100644 --- a/packages/aml-checklist/src/components/ui/modal/__tests__/update-status.tsx +++ b/packages/aml-checklist/src/components/ui/modal/__tests__/update-status.tsx @@ -16,6 +16,7 @@ describe('UpdateStatus', () => { status: sectionsStatus, loginMode: 'WEB', updateIdentityCheckStatus: jest.fn(), + idCheckStatus: 'unchecked', } const wrapper = shallow() expect(wrapper).toMatchSnapshot() @@ -27,6 +28,9 @@ describe('UpdateStatus', () => { checklistDetail: { checklistDetailData: { contact, + idCheck: { + status: 'checked', + }, }, status: sectionsStatus, isSubmitting: false, @@ -37,6 +41,7 @@ describe('UpdateStatus', () => { isSubmitting: false, contact, status: sectionsStatus, + idCheckStatus: 'checked', }) }) it('should run correctly', () => { @@ -46,6 +51,7 @@ describe('UpdateStatus', () => { isSubmitting: false, contact: null, status: defaultStatus, + idCheckStatus: 'unchecked', }) }) }) diff --git a/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/__snapshots__/address-information.tsx.snap b/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/__snapshots__/address-information.tsx.snap index 83e3c69f68..c45697a986 100644 --- a/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/__snapshots__/address-information.tsx.snap +++ b/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/__snapshots__/address-information.tsx.snap @@ -612,8 +612,22 @@ exports[`AddressInformation AddressInput should render correctly 1`] = ` isNarrowWidth={true} labelText="Upload File" name="metadata.primaryAddress[documentImage]" + onFilenameClick={[Function]} required={true} /> + +
+ +
+
`; @@ -1229,8 +1243,22 @@ exports[`AddressInformation renderSencondaryAddress should match snapshot 1`] = isNarrowWidth={true} labelText="Upload File" name="metadata.secondaryAddress[documentImage]" + onFilenameClick={[Function]} required={true} /> + +
+ +
+
`; diff --git a/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/address-information.tsx b/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/address-information.tsx index 924a77c2c0..00676685a7 100644 --- a/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/address-information.tsx +++ b/packages/aml-checklist/src/components/ui/modal/address-information/__tests__/address-information.tsx @@ -34,7 +34,9 @@ describe('AddressInformation', () => { describe('renderSencondaryAddress', () => { it('should match snapshot', () => { - const wrapper = shallow(renderSencondaryAddress(contact.secondaryAddress, false, jest.fn())) + const wrapper = shallow( + renderSencondaryAddress(contact.secondaryAddress, false, jest.fn(), { documentId: 'SOME_ID' }), + ) expect(wrapper).toMatchSnapshot() }) }) @@ -95,7 +97,10 @@ describe('AddressInformation', () => { it('should render correctly', () => { const mockProps = { index: 0, - addressType: 'primaryAddress', + addressType: 'primaryAddress' as 'primaryAddress' | 'secondaryAddress', + documentImage: { + documentId: 'https://someimage.com', + }, } const wrapper = shallow() expect(wrapper).toMatchSnapshot() diff --git a/packages/aml-checklist/src/components/ui/modal/address-information/address-information.tsx b/packages/aml-checklist/src/components/ui/modal/address-information/address-information.tsx index 6cee405cab..a8b21d8f20 100644 --- a/packages/aml-checklist/src/components/ui/modal/address-information/address-information.tsx +++ b/packages/aml-checklist/src/components/ui/modal/address-information/address-information.tsx @@ -1,4 +1,4 @@ -import React from 'react' +import React, { SetStateAction, useState } from 'react' import { Input, Button, @@ -8,6 +8,9 @@ import { Formik, Form, ButtonGroup, + ModalV2, + Loader, + Section, } from '@reapit/elements' import { connect } from 'react-redux' import { Dispatch } from 'redux' @@ -19,6 +22,7 @@ import { updateAddressHistory, checklistDetailShowModal } from '@/actions/checkl import { STEPS } from '@/components/ui/modal/modal' import { formFields } from './form-schema/form-fields' import validationSchema from './form-schema/validation-schema' +import { handleCloseModal, IdentityDocumentForm, ModalState } from '../../forms/identification' const optionsMonth = [ { label: '0', value: '0' }, @@ -72,8 +76,28 @@ export const handleMoreThreeYear = ({ setShowMoreThreeYearInput, isShowMoreThree setShowMoreThreeYearInput(!isShowMoreThreeYearInput) } -export const AddressInput = ({ addressType }) => { +export type AddressType = 'primaryAddress' | 'secondaryAddress' + +export interface AddressInputProps { + addressType: AddressType + documentImage: IdentityDocumentForm +} + +export const handleFilenameClick = ( + values: IdentityDocumentForm, + setModalState: React.Dispatch>, +) => (e) => { + e.preventDefault() + setModalState({ isLoading: false, isVisible: true, image: values.documentId }) +} + +export const AddressInput = ({ addressType, documentImage }: AddressInputProps) => { const fields = formFields(addressType) + const [modalState, setModalState] = useState({ + image: null, + isLoading: false, + isVisible: false, + }) const { typeField, buildingNameField, @@ -134,23 +158,44 @@ export const AddressInput = ({ addressType }) => { labelText={documentImageField.label || ''} id={documentImageField.name} name={documentImageField.name} + onFilenameClick={handleFilenameClick(documentImage, setModalState)} allowClear={true} required isNarrowWidth accept="image/*" /> + + {modalState.isLoading ? ( + + ) : ( +
+ +
+ )} +
) } -export const renderSencondaryAddress = (secondaryAddress, isShowMoreThreeYearInput, setShowMoreThreeYearInput) => { +export const renderSencondaryAddress = ( + secondaryAddress, + isShowMoreThreeYearInput, + setShowMoreThreeYearInput, + documentImage, +) => { if (secondaryAddress) { - return + return } if (isShowMoreThreeYearInput) { return ( <> - +
= ({ {({ values, isValid }) => { return (
- - {renderSencondaryAddress(secondaryAddress, isShowMoreThreeYearInput, setShowMoreThreeYearInput)} + + {renderSencondaryAddress( + secondaryAddress, + isShowMoreThreeYearInput, + setShowMoreThreeYearInput, + formatedMetadata?.secondaryAddress?.documentImage, + )}
diff --git a/packages/aml-checklist/src/components/ui/modal/primary-identification.tsx b/packages/aml-checklist/src/components/ui/modal/primary-identification.tsx index f96b44f0e9..1f294ae284 100644 --- a/packages/aml-checklist/src/components/ui/modal/primary-identification.tsx +++ b/packages/aml-checklist/src/components/ui/modal/primary-identification.tsx @@ -14,6 +14,7 @@ import { selectCheckListDetailIsSubmitting, } from '@/selectors/checklist-detail' import { ContactModel } from '@reapit/foundations-ts-definitions' +import dayjs from 'dayjs' export type PrimaryIdentiticationProps = DispatchProps & StateProps @@ -53,7 +54,7 @@ export const mapStateToProps = (state: ReduxState): StateProps => { initFormValues = { typeId: typeId || DEFAULT_TYPE, - expiry: expiry ? new Date(expiry) : '', + expiry: expiry ? dayjs(expiry).format('YYYY-MM-DD') : '', details: details || '', documentId: documentId || '', } as IdentityDocumentForm diff --git a/packages/aml-checklist/src/components/ui/modal/profile/__tests__/__snapshots__/profile.tsx.snap b/packages/aml-checklist/src/components/ui/modal/profile/__tests__/__snapshots__/profile.tsx.snap index 862a52932e..7daf6eb4a4 100644 --- a/packages/aml-checklist/src/components/ui/modal/profile/__tests__/__snapshots__/profile.tsx.snap +++ b/packages/aml-checklist/src/components/ui/modal/profile/__tests__/__snapshots__/profile.tsx.snap @@ -5,7 +5,7 @@ exports[` 1`] = ` = ({ contact, updateContact, isSubm [titleField.name]: title, [forenameField.name]: forename, [surnameField.name]: surname, - [dateOfBirthField.name]: dateOfBirth ? new Date(dateOfBirth) : null, + [dateOfBirthField.name]: dateOfBirth ? dayjs(dateOfBirth).format('YYYY-MM-DD') : null, [homePhoneField.name]: homePhone, [workPhoneField.name]: workPhone, [mobilePhoneField.name]: mobilePhone, @@ -64,7 +65,8 @@ export const Profile: React.FC = ({ contact, updateContact, isSubm - { initFormValues = { typeId: typeId || DEFAULT_TYPE, - expiry: expiry ? new Date(expiry) : undefined, + expiry: expiry ? dayjs(expiry).format('YYYY-MM-DD') : '', details: details || '', documentId: documentId || '', } as IdentityDocumentForm diff --git a/packages/aml-checklist/src/components/ui/modal/update-status.tsx b/packages/aml-checklist/src/components/ui/modal/update-status.tsx index 76a30214be..acdb956635 100644 --- a/packages/aml-checklist/src/components/ui/modal/update-status.tsx +++ b/packages/aml-checklist/src/components/ui/modal/update-status.tsx @@ -1,9 +1,8 @@ import React from 'react' import { connect } from 'react-redux' import { Dispatch } from 'redux' -import { DynamicLinkParams, AcButton, EntityType } from '@reapit/elements' +import { DynamicLinkParams, AcButton, EntityType, Formik, Form, RadioSelect } from '@reapit/elements' import { ReduxState } from '@/types/core' -import styles from '@/styles/pages/checklist-detail.scss?mod' import { checkListDetailIdentityCheckUpdateData } from '@/actions/checklist-detail' import { ContactModel, IdentityCheckModel } from '@reapit/foundations-ts-definitions' import { selectCheckListDetailContact, selectCheckListDetailStatus } from '@/selectors/checklist-detail' @@ -15,11 +14,26 @@ import { reapitConnectBrowserSession } from '@/core/connect-session' export type UpdateStatusProps = StateProps & DispatchProps +const initialProps = { + name: 'status', + labelText: 'Identity Check Status', + id: 'status', + options: [ + { label: 'Passed', value: 'pass' }, + { label: 'Fail', value: 'fail' }, + { label: 'Pending', value: 'pending' }, + { label: 'Cancelled', value: 'cancelled' }, + { label: 'Warnings', value: 'warnings' }, + { label: 'Unchecked', value: 'unchecked' }, + ], +} + export const UpdateStatus: React.FC = ({ contact, status, isSubmitting, updateIdentityCheckStatus, + idCheckStatus, }) => { const { id, title, forename, surname } = contact || {} @@ -31,36 +45,50 @@ export const UpdateStatus: React.FC = ({ return ( <> -

+

You have completed {progress.completed} out of {progress.total} sections for contact {name}. Please now select one of the following options in order to continue

-
- - updateIdentityCheckStatus( - { status: 'pass' }, - { - entityType: EntityType.CONTACT, - entityCode: id, - appMode: loginMode, - webRoute: `${Routes.CHECKLIST_DETAIL_WITHOUT_ID}/${id}`, - }, - ), - }} - > - ID Check Successful - -
+ { + updateIdentityCheckStatus( + { status: values.status }, + { + entityType: EntityType.CONTACT, + entityCode: id, + appMode: loginMode, + webRoute: `${Routes.CHECKLIST_DETAIL_WITHOUT_ID}/${id}`, + }, + ) + }} + > + {({ setFieldValue, values }) => ( + + + + ID Check Successful + + + )} + ) } @@ -69,6 +97,7 @@ export type StateProps = { isSubmitting: boolean contact: ContactModel | null status: SectionsStatus + idCheckStatus: string } export const mapStateToProps = (state: ReduxState) => { @@ -76,6 +105,7 @@ export const mapStateToProps = (state: ReduxState) => { contact: selectCheckListDetailContact(state), status: selectCheckListDetailStatus(state), isSubmitting: state?.checklistDetail?.isSubmitting || false, + idCheckStatus: state?.checklistDetail?.checklistDetailData?.idCheck?.status || 'unchecked', } } diff --git a/packages/aml-checklist/src/services/documents.ts b/packages/aml-checklist/src/services/documents.ts index 916593b1c2..fa000f3f4b 100644 --- a/packages/aml-checklist/src/services/documents.ts +++ b/packages/aml-checklist/src/services/documents.ts @@ -1,4 +1,4 @@ -import { fetcherWithBlob, fetcher } from '@reapit/elements' +import { fetcherWithBlob } from '@reapit/elements' import { URLS } from '@/constants/api' import { initAuthorizedRequestHeaders } from '@/utils/api' import { logger } from '@reapit/utils' @@ -7,34 +7,17 @@ export const downloadDocument = async (documentId: string) => { try { const headers = await initAuthorizedRequestHeaders() - const [identityDocument, documentBlob] = await Promise.all([ - fetcher({ - url: `${URLS.documents}/${documentId}`, - api: window.reapit.config.platformApiUrl, - method: 'GET', - headers: headers, - }), - fetcherWithBlob({ - url: `${URLS.documents}/${documentId}/download`, - api: window.reapit.config.platformApiUrl, - method: 'GET', - headers: { - ...headers, - accept: 'application/octet-stream', - }, - }), - ]) + const documentBlob = await fetcherWithBlob({ + url: `${URLS.documents}/${documentId}/download`, + api: window.reapit.config.platformApiUrl, + method: 'GET', + headers: { + ...headers, + accept: 'application/octet-stream', + }, + }) - const url = window.URL.createObjectURL(documentBlob) - const a = window.document.createElement('a') - a.href = url - a.target = '_blank' - a.download = `${identityDocument.name}` - // we need to append the element to the dom -> otherwise it will not work in firefox - window.document.body.appendChild(a) - - a.click() - a.remove() //afterwards we remove the element again + return window.URL.createObjectURL(documentBlob) } catch (error) { logger(error) return error diff --git a/packages/aml-checklist/src/tests/badges/badge-branches.svg b/packages/aml-checklist/src/tests/badges/badge-branches.svg index d720b26770..1c2d8ccac4 100644 --- a/packages/aml-checklist/src/tests/badges/badge-branches.svg +++ b/packages/aml-checklist/src/tests/badges/badge-branches.svg @@ -1 +1 @@ -Coverage:branches: 67.45%Coverage:branches67.45% \ No newline at end of file +Coverage:branches: 67.06%Coverage:branches67.06% \ No newline at end of file diff --git a/packages/aml-checklist/src/tests/badges/badge-functions.svg b/packages/aml-checklist/src/tests/badges/badge-functions.svg index 55c277b9f2..b39616b03b 100644 --- a/packages/aml-checklist/src/tests/badges/badge-functions.svg +++ b/packages/aml-checklist/src/tests/badges/badge-functions.svg @@ -1 +1 @@ -Coverage:functions: 78.6%Coverage:functions78.6% \ No newline at end of file +Coverage:functions: 77.98%Coverage:functions77.98% \ No newline at end of file diff --git a/packages/aml-checklist/src/tests/badges/badge-lines.svg b/packages/aml-checklist/src/tests/badges/badge-lines.svg index e865ae11bf..131fa0ecc3 100644 --- a/packages/aml-checklist/src/tests/badges/badge-lines.svg +++ b/packages/aml-checklist/src/tests/badges/badge-lines.svg @@ -1 +1 @@ -Coverage:lines: 88.48%Coverage:lines88.48% \ No newline at end of file +Coverage:lines: 88.3%Coverage:lines88.3% \ No newline at end of file diff --git a/packages/aml-checklist/src/tests/badges/badge-statements.svg b/packages/aml-checklist/src/tests/badges/badge-statements.svg index 9fccb3c044..6bead8ef05 100644 --- a/packages/aml-checklist/src/tests/badges/badge-statements.svg +++ b/packages/aml-checklist/src/tests/badges/badge-statements.svg @@ -1 +1 @@ -Coverage:statements: 87.46%Coverage:statements87.46% \ No newline at end of file +Coverage:statements: 87.24%Coverage:statements87.24% \ No newline at end of file diff --git a/packages/elements/src/components/Input/index.tsx b/packages/elements/src/components/Input/index.tsx index 3ace2b1d0e..b4954b766e 100644 --- a/packages/elements/src/components/Input/index.tsx +++ b/packages/elements/src/components/Input/index.tsx @@ -5,7 +5,7 @@ import { fieldValidateRequire } from '../../utils/validators' import { cx } from 'linaria' export interface InputProps { - type: 'text' | 'password' | 'email' | 'tel' | 'hidden' | 'time' + type: 'text' | 'password' | 'email' | 'tel' | 'hidden' | 'time' | 'date' placeholder?: string id: string labelText?: string diff --git a/packages/elements/src/components/ModalV2/__styles__/index.ts b/packages/elements/src/components/ModalV2/__styles__/index.ts index 78aa0ebc5d..105ad75c94 100644 --- a/packages/elements/src/components/ModalV2/__styles__/index.ts +++ b/packages/elements/src/components/ModalV2/__styles__/index.ts @@ -31,6 +31,8 @@ export const modalCentered = css` ` // same styles as our .container class export const modalResponsiveContainer = css` + max-height: 100vh; + @media screen and (min-width: 1024px) { width: 960px; } diff --git a/packages/ts-scripts/src/webpack/webpack.config.dev.js b/packages/ts-scripts/src/webpack/webpack.config.dev.js index d9964c05d6..19c54b9c10 100644 --- a/packages/ts-scripts/src/webpack/webpack.config.dev.js +++ b/packages/ts-scripts/src/webpack/webpack.config.dev.js @@ -124,7 +124,6 @@ const webpackConfigDev = { loader: 'file-loader', options: { name: '[name].[ext]', - outputPath: '/assets', }, }, ], diff --git a/packages/ts-scripts/src/webpack/webpack.config.prod.js b/packages/ts-scripts/src/webpack/webpack.config.prod.js index a0a8d9c61e..b08920d82d 100644 --- a/packages/ts-scripts/src/webpack/webpack.config.prod.js +++ b/packages/ts-scripts/src/webpack/webpack.config.prod.js @@ -121,7 +121,6 @@ const webpackConfigProd = { loader: 'file-loader', options: { name: '[name].[ext]', - outputPath: '/assets', }, }, ],