From 772c5476fa9202a4d7e9c9b5eefcdca7c926a8ec Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 11:53:54 +0100 Subject: [PATCH 01/30] Remove create react app defaults --- packages/app/public/manifest.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/app/public/manifest.json b/packages/app/public/manifest.json index 01358342..a120b2b7 100644 --- a/packages/app/public/manifest.json +++ b/packages/app/public/manifest.json @@ -1,6 +1,6 @@ { - "short_name": "React App", - "name": "Create React App Sample", + "short_name": "zapEHR Telehealth", + "name": "zapEHR Telehealth", "icons": [ { "src": "favicon.png", From 1b4b2c2ed55188042d2635628c743486c320781f Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 11:56:19 +0100 Subject: [PATCH 02/30] Simplify api exports --- packages/app/src/api/index.ts | 4 ++-- packages/app/src/api/zapehrApi.ts | 4 +--- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/app/src/api/index.ts b/packages/app/src/api/index.ts index ea4338b9..0488e716 100644 --- a/packages/app/src/api/index.ts +++ b/packages/app/src/api/index.ts @@ -1,2 +1,2 @@ -export { apiErrorToThrow } from './apiErrorToThrow'; -export { default as zapehrApi } from './zapehrApi'; +export * from './apiErrorToThrow'; +export * from './zapehrApi'; diff --git a/packages/app/src/api/zapehrApi.ts b/packages/app/src/api/zapehrApi.ts index a7c58461..35ecb3b4 100644 --- a/packages/app/src/api/zapehrApi.ts +++ b/packages/app/src/api/zapehrApi.ts @@ -110,6 +110,4 @@ class API { } } -const api = new API(); - -export default api; +export const zapehrApi = new API(); From 5b5cf060bd20388d8495356b5d95566fcf379264 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 12:17:32 +0100 Subject: [PATCH 03/30] Simplify assets exports --- .../{check_circle.png => checkCircle.png} | Bin ...n.svg => customRadioButtonCheckedIcon.svg} | 0 ...svg => customRadioButtonUncheckedIcon.svg} | 0 .../icons/{Ellipse 4.png => ellipse4.png} | Bin .../icons/{Ellipse 5.png => ellipse5.png} | Bin packages/app/src/assets/icons/index.ts | 22 ++++++++++++++---- .../{stethiscope.png => stethoscope.png} | Bin .../{virtual-visit.png => virtualVisit.png} | Bin 8 files changed, 17 insertions(+), 5 deletions(-) rename packages/app/src/assets/icons/{check_circle.png => checkCircle.png} (100%) rename packages/app/src/assets/icons/{custom-radio-button-checked-icon.svg => customRadioButtonCheckedIcon.svg} (100%) rename packages/app/src/assets/icons/{custom-radio-button-unchecked-icon.svg => customRadioButtonUncheckedIcon.svg} (100%) rename packages/app/src/assets/icons/{Ellipse 4.png => ellipse4.png} (100%) rename packages/app/src/assets/icons/{Ellipse 5.png => ellipse5.png} (100%) rename packages/app/src/assets/icons/{stethiscope.png => stethoscope.png} (100%) rename packages/app/src/assets/icons/{virtual-visit.png => virtualVisit.png} (100%) diff --git a/packages/app/src/assets/icons/check_circle.png b/packages/app/src/assets/icons/checkCircle.png similarity index 100% rename from packages/app/src/assets/icons/check_circle.png rename to packages/app/src/assets/icons/checkCircle.png diff --git a/packages/app/src/assets/icons/custom-radio-button-checked-icon.svg b/packages/app/src/assets/icons/customRadioButtonCheckedIcon.svg similarity index 100% rename from packages/app/src/assets/icons/custom-radio-button-checked-icon.svg rename to packages/app/src/assets/icons/customRadioButtonCheckedIcon.svg diff --git a/packages/app/src/assets/icons/custom-radio-button-unchecked-icon.svg b/packages/app/src/assets/icons/customRadioButtonUncheckedIcon.svg similarity index 100% rename from packages/app/src/assets/icons/custom-radio-button-unchecked-icon.svg rename to packages/app/src/assets/icons/customRadioButtonUncheckedIcon.svg diff --git a/packages/app/src/assets/icons/Ellipse 4.png b/packages/app/src/assets/icons/ellipse4.png similarity index 100% rename from packages/app/src/assets/icons/Ellipse 4.png rename to packages/app/src/assets/icons/ellipse4.png diff --git a/packages/app/src/assets/icons/Ellipse 5.png b/packages/app/src/assets/icons/ellipse5.png similarity index 100% rename from packages/app/src/assets/icons/Ellipse 5.png rename to packages/app/src/assets/icons/ellipse5.png diff --git a/packages/app/src/assets/icons/index.ts b/packages/app/src/assets/icons/index.ts index e3f6ff92..27007191 100644 --- a/packages/app/src/assets/icons/index.ts +++ b/packages/app/src/assets/icons/index.ts @@ -1,13 +1,25 @@ +export { default as cancel } from './cancel.png'; +export { default as checkCircle } from './checkCircle.png'; export { default as clipboard } from './clipboard.png'; +export { default as customRadioButtonCheckedIcon } from './customRadioButtonCheckedIcon.svg'; +export { default as customRadioButtonUncheckedIcon } from './customRadioButtonUncheckedIcon.svg'; +export { default as dashboardLogo } from './dashboardLogo.svg'; +export { default as ellipse4 } from './ellipse4.png'; +export { default as ellipse5 } from './ellipse5.png'; +export { default as footerLogo } from './footerLogo.svg'; export { default as inPersonInfo } from './inPersonInfo.svg'; export { default as insuranceCard } from './insuranceCard.png'; export { default as introGroup } from './introGroup.svg'; +export { default as ottehrDefaultPatient } from './ottehrDefaultPatient.svg'; +export { default as ottehrDefaultProvider } from './ottehrDefaultProvider.svg'; +export { default as ottehrPatientIcon } from './ottehrPatientIcon.svg'; +export { default as ottehrProviderIcon } from './ottehrProviderIcon.svg'; +export { default as ottehrRegistrationLogo } from './ottehrRegistrationLogo.svg'; +export { default as people } from './people.png'; export { default as speechBubbles } from './speechBubbles.png'; +export { default as stethoscope } from './stethoscope.png'; export { default as sun } from './sun.png'; export { default as sun2 } from './sun2.png'; -export { default as virtualVisit } from './virtual-visit.png'; -export { default as people } from './people.png'; -export { default as customRadioButtonUncheckedIcon } from './custom-radio-button-unchecked-icon.svg'; -export { default as customRadioButtonCheckedIcon } from './custom-radio-button-checked-icon.svg'; -export { default as stethiscope } from './stethiscope.png'; export { default as videoCallMock } from './videoCallMock.png'; +export { default as virtualVisit } from './virtualVisit.png'; +export { default as waitingRoomLogo } from './waitingRoomLogo.png'; diff --git a/packages/app/src/assets/icons/stethiscope.png b/packages/app/src/assets/icons/stethoscope.png similarity index 100% rename from packages/app/src/assets/icons/stethiscope.png rename to packages/app/src/assets/icons/stethoscope.png diff --git a/packages/app/src/assets/icons/virtual-visit.png b/packages/app/src/assets/icons/virtualVisit.png similarity index 100% rename from packages/app/src/assets/icons/virtual-visit.png rename to packages/app/src/assets/icons/virtualVisit.png From 5fd8c68ab07648b024be50b911785a944c9d792d Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 12:49:10 +0100 Subject: [PATCH 04/30] Update root src files --- packages/app/src/App.tsx | 38 +++++++++---------- ...meProvider.tsx => OttehrThemeProvider.tsx} | 34 ++++++++--------- packages/app/src/index.css | 4 +- packages/app/src/index.tsx | 14 +++---- 4 files changed, 44 insertions(+), 46 deletions(-) rename packages/app/src/{IntakeThemeProvider.tsx => OttehrThemeProvider.tsx} (96%) diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index 89ce6e69..a5e85be5 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -1,22 +1,24 @@ -import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; import { useAuth0 } from '@auth0/auth0-react'; +import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'; +import { OttehrThemeProvider } from './OttehrThemeProvider'; import { ScrollToTop } from './components'; -import { IntakeThemeProvider } from './IntakeThemeProvider'; -import Version from './pages/Version'; -import ProviderRegistration from './pages/ProviderRegistration'; -import PatientCheckIn from './pages/PatientCheckin'; -import CheckInPermission from './pages/CheckInPermission'; -import ProviderDashboard from './pages/ProviderDashboard'; -import ProviderSettings from './pages/ProviderSettings'; -import WaitingRoom from './pages/WaitingRoom'; -import PostCall from './pages/PostCall'; -import { PatientProvider } from './store/IntakeContext'; +import { + CheckInPermission, + PatientCheckIn, + PostCall, + ProviderDashboard, + ProviderRegistration, + ProviderSettings, + Version, + WaitingRoom, +} from './pages'; +import { PatientProvider } from './store'; -function App(): JSX.Element { +export default function App(): JSX.Element { const { isAuthenticated } = useAuth0(); return ( - + {!isAuthenticated ? ( @@ -26,11 +28,11 @@ function App(): JSX.Element { } />; } />; } />; - } />; - } />; + } />; + } />; } />; - } />; + } />; ) : ( @@ -38,8 +40,6 @@ function App(): JSX.Element { )} - + ); } - -export default App; diff --git a/packages/app/src/IntakeThemeProvider.tsx b/packages/app/src/OttehrThemeProvider.tsx similarity index 96% rename from packages/app/src/IntakeThemeProvider.tsx rename to packages/app/src/OttehrThemeProvider.tsx index 5e996086..f7e3c4ab 100644 --- a/packages/app/src/IntakeThemeProvider.tsx +++ b/packages/app/src/OttehrThemeProvider.tsx @@ -1,6 +1,6 @@ -import { FC, ReactNode } from 'react'; -import { BreakpointsOptions, Components, createTheme, PaletteColor, ThemeProvider } from '@mui/material'; +import { BreakpointsOptions, Components, PaletteColor, ThemeProvider, createTheme } from '@mui/material'; import { TypographyOptions } from '@mui/material/styles/createTypography'; +import { FC, ReactNode } from 'react'; export const textFonts = ['Work Sans']; export const headerFonts = ['Work Sans']; @@ -20,32 +20,31 @@ export const otherColors = { background: '#5324BE', borderGray: '#D6D8DF', borderLightBlue: '#4294F3', + brown: '#604203', + cardBackground: '#F7F8F9', checkIcon: '#7045F2', clearImage: '#EB5757', coachingVisit: '#EDE8FF', - lightBlue: '#CFF5FF', - darkPurple: '#301367', + darkBackgroundPaper: '#263954', darkGreen: '#0F5A4C', - lightGreen: '#C1FBEA', - purple: '#4D15B7', - brown: '#604203', - lightPurple: '#F5F2FF', + darkPurple: '#301367', + footerBackground: '#202A3E', languageIcon: 'rgba(15, 229, 189, 1)', - lightblue: '#ECF5FF', + lightBlue: '#CFF5FF', lightGray: '#CED4DA', + lightGreen: '#C1FBEA', + lightPurple: '#F5F2FF', + patientGreen: '#C7FDD3', + patientSubtitle: '#545454', placeholder: '#A9A9A9', - primaryBackground: '#F5F2FF', popupBackground: 'rgba(97, 97, 97, 0.9)', + primaryBackground: '#F5F2FF', primaryBoxShadow: 'rgba(77, 21, 183, 0.25)', + purple: '#4D15B7', scheduleBorder: '#8F9AA7', translateIcon: '#0FE5BD', transparent: 'rgba(0, 0, 0, 0)', - patientGreen: '#C7FDD3', - patientSubtitle: '#545454', wrongPatient: '#8F9AA7', - cardBackground: '#F7F8F9', - footerBackground: '#202A3E', - darkBackgroundPaper: '#263954', }; export const typography: TypographyOptions = { @@ -195,7 +194,6 @@ export const components: Components = { '&:not($sizeLarge):not($sizeSmall) $label': { fontSize: 16, }, - // borderRadius: 49, }, sizeLarge: { '& $label': { @@ -293,11 +291,11 @@ export const components: Components = { }, }; -interface IntakeThemeProviderProps { +interface OttehrThemeProviderProps { children: ReactNode; } -export const IntakeThemeProvider: FC = ({ children }) => { +export const OttehrThemeProvider: FC = ({ children }) => { const theme = createTheme({ palette: palette, components: components, diff --git a/packages/app/src/index.css b/packages/app/src/index.css index b4a5fbbb..c79460f1 100644 --- a/packages/app/src/index.css +++ b/packages/app/src/index.css @@ -1,3 +1,5 @@ +@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@100;200;300;400;500;700&display=swap'); + body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', @@ -10,8 +12,6 @@ code { font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace; } -@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@100;200;300;400;500;700&display=swap'); - @font-face { font-family: 'PMDiatype'; src: local('PMDiatype'), url(./fonts/PMDiatype-Regular.woff2) format('woff2'), diff --git a/packages/app/src/index.tsx b/packages/app/src/index.tsx index ffd5f242..d0a6f86d 100644 --- a/packages/app/src/index.tsx +++ b/packages/app/src/index.tsx @@ -1,14 +1,14 @@ -import React from 'react'; -import ReactDOM from 'react-dom/client'; -import './index.css'; +import { Auth0Provider } from '@auth0/auth0-react'; +import React, { StrictMode } from 'react'; +import { createRoot } from 'react-dom/client'; import App from './App'; +import './index.css'; import './lib/i18n'; -import { Auth0Provider } from '@auth0/auth0-react'; import { IntakeDataProvider } from './store'; -const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement); +const root = createRoot(document.getElementById('root') as HTMLElement); root.render( - + - + ); From 9be99b443d20686e18a9b885cf2f36a03e0e96fb Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 13:59:36 +0100 Subject: [PATCH 05/30] Clean up helpers files --- packages/app/src/helpers/dateUtils.ts | 17 ----- packages/app/src/helpers/index.ts | 16 ++--- packages/app/src/helpers/locations.tsx | 97 -------------------------- packages/app/src/helpers/validation.ts | 12 ---- 4 files changed, 4 insertions(+), 138 deletions(-) delete mode 100644 packages/app/src/helpers/locations.tsx diff --git a/packages/app/src/helpers/dateUtils.ts b/packages/app/src/helpers/dateUtils.ts index 10911661..40d31798 100644 --- a/packages/app/src/helpers/dateUtils.ts +++ b/packages/app/src/helpers/dateUtils.ts @@ -7,9 +7,6 @@ interface timezone { label: string; } -export const MINIMUM_AGE = 5; -export const MAXIMUM_AGE = 26; - export const availableTimezones = (date: DateTime | undefined): timezone[] => { if (!date) { date = DateTime.now(); @@ -131,12 +128,6 @@ export const yupDateTransform = (d: any): string => { } }; -export function ageIsInRange(dateOfBirth: string): boolean { - // make sure string is in iso format - const iso = isoStringFromMDYString(dateOfBirth); - const age = Math.floor(-DateTime.fromISO(iso).diffNow('years').years); - return age >= MINIMUM_AGE && age <= MAXIMUM_AGE; -} export const yupDateRegex = /^\d{2}\/\d{2}\/\d{4}$/; export function getLocaleDateTimeString( @@ -167,14 +158,6 @@ export function getLocaleDateTimeString( return returnString; } -export function createMinimumAndMaximumTime(date: DateTime, buffer?: number): { minimum: DateTime; maximum: DateTime } { - // PMP requirement to allow at least 24 hours for their team to review bookings. - const minimum = date.plus({ hours: buffer ?? 24 }); - // Could do #plus({ months: 1 }), but 30 days is easier to test - const maximum = date.plus({ days: 30 }); - return { minimum: minimum, maximum: maximum }; -} - // for now assuming timestamp will be in ISO format export function getQueuedTimeFromTimestamp(timestamp: string): string { const now = new Date(); diff --git a/packages/app/src/helpers/index.ts b/packages/app/src/helpers/index.ts index 128abfb8..84c11f0e 100644 --- a/packages/app/src/helpers/index.ts +++ b/packages/app/src/helpers/index.ts @@ -1,13 +1,5 @@ -export { CustomAdapterLuxon } from './CustomAdapterLuxon'; +export * from './CustomAdapterLuxon'; export * from './dateUtils'; -export { findLabelFromOptions, findValueFromOptions } from './findPropertyFromOptions'; -export { stateNames } from './stateNames'; -export { - ageIsInRange, - cardExpirationRegex, - MINIMUM_AGE, - MAXIMUM_AGE, - phoneRegex, - stateRegex, - zipRegex, -} from './validation'; +export * from './findPropertyFromOptions'; +export * from './stateNames'; +export * from './validation'; diff --git a/packages/app/src/helpers/locations.tsx b/packages/app/src/helpers/locations.tsx deleted file mode 100644 index 83e41eb5..00000000 --- a/packages/app/src/helpers/locations.tsx +++ /dev/null @@ -1,97 +0,0 @@ -import { Location } from 'fhir/r4'; - -export const LOCATIONS: Location[] = [ - { - id: '1', - resourceType: 'Location', - name: 'Dutchess / Hopewell Junction', - address: { - line: ['1983 Route 52', 'Hopewell Junction, NY 12533'], - state: 'New York', - }, - telecom: [ - { - system: 'phone', - value: '845.897.4500', - }, - { - system: 'fax', - value: '845.897.4550', - }, - ], - hoursOfOperation: [ - { - daysOfWeek: ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'], - openingTime: '12:00', - closingTime: '00:00', - }, - { - daysOfWeek: ['sun'], - openingTime: '10:00', - closingTime: '22:00', - }, - ], - }, - { - id: '2', - resourceType: 'Location', - name: 'North Carolina / Cary', - address: { - line: ['2007 Walnut Street', 'Cary, NC 27518'], - state: 'North Carolina', - }, - telecom: [ - { - system: 'phone', - value: '919.823.5437', - }, - { - system: 'fax', - value: '919.823.5437', - }, - ], - hoursOfOperation: [ - { - daysOfWeek: ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'], - openingTime: '12:00', - closingTime: '00:00', - }, - { - daysOfWeek: ['sun'], - openingTime: '10:00', - closingTime: '00:00', - }, - ], - }, - { - id: '3', - resourceType: 'Location', - name: 'Long Island / Carle Place', - address: { - line: ['181 Old Country Road', 'Carle Place, NY 11514'], - state: 'New York', - }, - telecom: [ - { - system: 'phone', - value: '516.248.5437', - }, - { - system: 'fax', - value: '516.248.5452', - }, - ], - hoursOfOperation: [ - { - daysOfWeek: ['mon', 'tue', 'wed', 'thu', 'fri', 'sat'], - openingTime: '12:00', - closingTime: '00:00', - }, - { - daysOfWeek: ['sun'], - openingTime: '10:00', - closingTime: '00:00', - }, - ], - }, -]; diff --git a/packages/app/src/helpers/validation.ts b/packages/app/src/helpers/validation.ts index 355735a1..3a2290e7 100644 --- a/packages/app/src/helpers/validation.ts +++ b/packages/app/src/helpers/validation.ts @@ -1,21 +1,9 @@ -import { DateTime } from 'luxon'; -import { isoStringFromMDYString } from './dateUtils'; - -export const MINIMUM_AGE = 0; -export const MAXIMUM_AGE = 26; export const emailRegex = /^\S+@\S+\.\S+$/; export const stateRegex = /^[A-Za-z]{2}$/; export const zipRegex = /^\d{5}$/; export const phoneRegex = /^\(\d{3}\) \d{3}-\d{4}$/; export const cardExpirationRegex = /^\d{2} \/ \d{2}$/; -export function ageIsInRange(dateOfBirth: string): boolean { - // make sure string is in iso format - const iso = isoStringFromMDYString(dateOfBirth); - const age = Math.floor(-DateTime.fromISO(iso).diffNow('years').years); - return age >= MINIMUM_AGE && age <= MAXIMUM_AGE; -} - // modified from https://stackoverflow.com/a/50376498 export function isNumber(value: string): boolean { if (value.includes(' ')) { From 65401566d5dbb6717c85240f21b85d5db468a5e2 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 14:00:20 +0100 Subject: [PATCH 06/30] Clean up hooks imports --- packages/app/src/hooks/useClients.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/app/src/hooks/useClients.tsx b/packages/app/src/hooks/useClients.tsx index 6eb274e8..863add60 100644 --- a/packages/app/src/hooks/useClients.tsx +++ b/packages/app/src/hooks/useClients.tsx @@ -1,6 +1,6 @@ +import { FhirClient, ZambdaClient } from '@zapehr/sdk'; import { useContext } from 'react'; import { IntakeDataContext } from '../store'; -import { FhirClient, ZambdaClient } from '@zapehr/sdk'; export function useFhirClient(): FhirClient | null { const { state } = useContext(IntakeDataContext); From ce7db56c35c5e53d27f503dc82f764f15c242080 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 14:10:22 +0100 Subject: [PATCH 07/30] Sync translation files --- packages/app/src/lib/i18n-en.json | 4 ++-- packages/app/src/lib/i18n-es.json | 12 +++++++++++- 2 files changed, 13 insertions(+), 3 deletions(-) diff --git a/packages/app/src/lib/i18n-en.json b/packages/app/src/lib/i18n-en.json index ef54b26b..8443b4ea 100644 --- a/packages/app/src/lib/i18n-en.json +++ b/packages/app/src/lib/i18n-en.json @@ -19,7 +19,7 @@ "lastName": "Last name is required", "dateOfBirth": { "format": "Date must be in the format MM/DD/YYYY", - "required": "Birth date is required" + "required": "Date of birth is required" }, "zip": { "number": "Zip code must be 5 digits", @@ -35,7 +35,7 @@ "required": "required field", "footer": "Powered by", "goodMorning": "Good Morning", - "shareLink": "To invite patient to your room share this link", + "shareLink": "To invite patients to your room share this link", "copyLink": "Copy Link", "sendEmail": "Send Email", "patientsQueue": "Patients queue", diff --git a/packages/app/src/lib/i18n-es.json b/packages/app/src/lib/i18n-es.json index 9172e03a..6e5baf0a 100644 --- a/packages/app/src/lib/i18n-es.json +++ b/packages/app/src/lib/i18n-es.json @@ -25,12 +25,22 @@ "number": "El código postal debe tener cinco dígitos", "required": "El código postal es obligatorio" } + }, + "submit": { + "title": "TODO There was an issue booking an appointment" } }, "firstName": "Nombre", - "footer": "Este servicio no es para problemas de salud conductual de emergencia. Si cree que usted o su hijo(a) están teniendo una emergencia y corren el riesgo de hacerse daño a sí mismos o a otra persona, llame al 988 o acuda a la sala de emergencias más cercana de inmediato.", "lastName": "Apellido", "required": "campo obligatorio", + "footer": "TODO Powered by", + "goodMorning": "TODO Good Morning", + "shareLink": "TODO To invite patients to your room share this link", + "copyLink": "TODO Copy Link", + "sendEmail": "TODO Send Email", + "patientsQueue": "TODO Patients queue", + "waiting": "TODO Waiting", + "startCall": "TODO Start Call", "stateFullNames": { "AK": "Alaska", "AL": "Alabama", From 96f6e25a69d3a7f65a1af7e086c95cbaf0817f39 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 14:13:02 +0100 Subject: [PATCH 08/30] Clean up types files --- packages/app/src/types/index.ts | 2 +- packages/app/src/types/types.ts | 57 +-------------------------------- 2 files changed, 2 insertions(+), 57 deletions(-) diff --git a/packages/app/src/types/index.ts b/packages/app/src/types/index.ts index 67985ff4..fcb073fe 100644 --- a/packages/app/src/types/index.ts +++ b/packages/app/src/types/index.ts @@ -1 +1 @@ -export type { RadioOption } from './types'; +export * from './types'; diff --git a/packages/app/src/types/types.ts b/packages/app/src/types/types.ts index 801f09d7..86bc2154 100644 --- a/packages/app/src/types/types.ts +++ b/packages/app/src/types/types.ts @@ -1,63 +1,8 @@ import { ReactElement } from 'react'; -export const AllStates = [ - { value: 'AL', label: 'AL' }, // Alabama - { value: 'AK', label: 'AK' }, // Alaska - { value: 'AZ', label: 'AZ' }, // Arizona - { value: 'AR', label: 'AR' }, // Arkansas - { value: 'CA', label: 'CA' }, // California - { value: 'CO', label: 'CO' }, // Colorado - { value: 'CT', label: 'CT' }, // Connecticut - { value: 'DE', label: 'DE' }, // Delaware - { value: 'DC', label: 'DC' }, - { value: 'FL', label: 'FL' }, // Florida - { value: 'GA', label: 'GA' }, // Georgia - { value: 'HI', label: 'HI' }, // Hawaii - { value: 'ID', label: 'ID' }, // Idaho - { value: 'IL', label: 'IL' }, // Illinois - { value: 'IN', label: 'IN' }, // Indiana - { value: 'IA', label: 'IA' }, // Iowa - { value: 'KS', label: 'KS' }, // Kansas - { value: 'KY', label: 'KY' }, // Kentucky - { value: 'LA', label: 'LA' }, // Louisiana - { value: 'ME', label: 'ME' }, // Maine - { value: 'MD', label: 'MD' }, // Maryland - { value: 'MA', label: 'MA' }, // Massachusetts - { value: 'MI', label: 'MI' }, // Michigan - { value: 'MN', label: 'MN' }, // Minnesota - { value: 'MS', label: 'MS' }, // Mississippi - { value: 'MO', label: 'MO' }, // Missouri - { value: 'MT', label: 'MT' }, // Montana - { value: 'NE', label: 'NE' }, // Nebraska - { value: 'NV', label: 'NV' }, // Nevada - { value: 'NH', label: 'NH' }, // New Hampshire - { value: 'NJ', label: 'NJ' }, // New Jersey - { value: 'NM', label: 'NM' }, // New Mexico - { value: 'NY', label: 'NY' }, // New York - { value: 'NC', label: 'NC' }, // North Carolina - { value: 'ND', label: 'ND' }, // North Dakota - { value: 'OH', label: 'OH' }, // Ohio - { value: 'OK', label: 'OK' }, // Oklahoma - { value: 'OR', label: 'OR' }, // Oregon - { value: 'PA', label: 'PA' }, // Pennsylvania - { value: 'RI', label: 'RI' }, // Rhode Island - { value: 'SC', label: 'SC' }, // South Carolina - { value: 'SD', label: 'SD' }, // South Dakota - { value: 'TN', label: 'TN' }, // Tennessee - { value: 'TX', label: 'TX' }, // Texas - { value: 'UT', label: 'UT' }, // Utah - { value: 'VT', label: 'VT' }, // Vermont - { value: 'VA', label: 'VA' }, // Virginia - { value: 'VI', label: 'VI' }, - { value: 'WA', label: 'WA' }, // Washington - { value: 'WV', label: 'WV' }, // West Virginia - { value: 'WI', label: 'WI' }, // Wisconsin - { value: 'WY', label: 'WY' }, // Wyoming -]; - export interface RadioOption { - label?: string; value: string; + label?: string; description?: string | ReactElement; image?: string; imageAlt?: string; From c3d3be55d2d13c805ccc558c5100659779723ec4 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 14:40:12 +0100 Subject: [PATCH 09/30] Remove old auth0 provider details --- packages/app/src/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/app/src/index.tsx b/packages/app/src/index.tsx index d0a6f86d..2b9f5585 100644 --- a/packages/app/src/index.tsx +++ b/packages/app/src/index.tsx @@ -11,10 +11,10 @@ root.render( From 5e9f8c53c6499dcd1b4f2847c915d92bd1b29519 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 14:40:46 +0100 Subject: [PATCH 10/30] Clean up store files --- packages/app/src/store/IntakeActions.tsx | 107 ++++++++++++----------- packages/app/src/store/IntakeContext.tsx | 58 ++++++------ packages/app/src/store/index.ts | 4 +- packages/app/src/store/types.ts | 98 ++++++++++----------- 4 files changed, 129 insertions(+), 138 deletions(-) diff --git a/packages/app/src/store/IntakeActions.tsx b/packages/app/src/store/IntakeActions.tsx index b2572c22..ad83c423 100644 --- a/packages/app/src/store/IntakeActions.tsx +++ b/packages/app/src/store/IntakeActions.tsx @@ -1,7 +1,7 @@ -import { Dispatch } from 'react'; +import { FhirClient, ZambdaClient } from '@zapehr/sdk'; import { Location, Patient, Slot } from 'fhir/r4'; +import { Dispatch } from 'react'; import { IntakeAction, PatientInfo } from './types'; -import { FhirClient, ZambdaClient } from '@zapehr/sdk'; export const setFhirClient = (token: string, dispatch: Dispatch): void => { const fhirClient = new FhirClient({ @@ -25,38 +25,39 @@ export const setZambdaClient = (token: string | undefined, dispatch: Dispatch): void => { +export const updateAdditionalInformation = (additionalInfo: string, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_PHONE_NUMBER', - phoneNumber: phoneNumber, + type: 'UPDATE_ADDITIONAL_INFORMATION', + additionalInformation: additionalInfo, }); }; -export const updateSubmittedInsuranceType = ({ type }: { type: string }, dispatch: Dispatch): void => { +export const updateAppointmentId = (appointment: { id: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_SUBMITTED_INSURANCE_TYPE', - submittedInsuranceType: type, + type: 'UPDATE_APPOINTMENT_ID', + appointmentId: appointment.id, }); }; -export const updateCoverageId = ({ id }: { id: string }, dispatch: Dispatch): void => { +// TODO Shouldn't this be a slot? +export const updateAppointmentSlot = (appointmentSlot: string, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_COVERAGE_ID', - coverageId: id, + type: 'UPDATE_APPOINTMENT_SLOT', + appointmentSlot: appointmentSlot, }); }; -export const updateResponsiblePartyId = ({ id }: { id: string }, dispatch: Dispatch): void => { +export const updateCancellationReason = (cancellationReason: string, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_RESPONSIBLE_PARTY_ID', - responsiblePartyId: id, + type: 'UPDATE_CANCELLATION_REASON', + cancellationReason: cancellationReason, }); }; -export const updateRelatedPersonId = ({ id }: { id: string }, dispatch: Dispatch): void => { +export const updateConsentFormId = ({ id }: { id: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_RELATED_PERSON_ID', - relatedPersonId: id, + type: 'UPDATE_CONSENT_FORM_ID', + consentFormId: id, }); }; @@ -67,87 +68,87 @@ export const updateConsentFormSignerId = ({ id }: { id: string }, dispatch: Disp }); }; -export const updateConsentFormId = ({ id }: { id: string }, dispatch: Dispatch): void => { +export const updateCoverageId = ({ id }: { id: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_CONSENT_FORM_ID', - consentFormId: id, + type: 'UPDATE_COVERAGE_ID', + coverageId: id, }); }; -export const updatePatients = (patients: Patient[], dispatch: Dispatch): void => { +export const updateLocationId = (location: { id: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_PATIENTS', - patients: patients, + type: 'UPDATE_LOCATION_ID', + locationId: location.id, }); }; -export const updatePatient = (patient: PatientInfo | undefined, dispatch: Dispatch): void => { +export const updateLocations = (locations: Location[], dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_PATIENT', - patient: patient, + type: 'UPDATE_LOCATIONS', + locations: locations, }); }; -export const updateLocationId = (location: { id: string }, dispatch: Dispatch): void => { +export const updatePatient = (patient: PatientInfo | undefined, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_LOCATION_ID', - locationId: location.id, + type: 'UPDATE_PATIENT', + patient: patient, }); }; -export const updateSelectedAppointmentSlotId = ({ id }: { id: string }, dispatch: Dispatch): void => { +export const updatePatients = (patients: Patient[], dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_SELECTED_APPOINTMENT_SLOT_ID', - selectedApptSlotId: id, + type: 'UPDATE_PATIENTS', + patients: patients, }); }; -export const updateLocations = (locations: Location[], dispatch: Dispatch): void => { +export const updatePhoneNumber = (phoneNumber: string, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_LOCATIONS', - locations: locations, + type: 'UPDATE_PHONE_NUMBER', + phoneNumber: phoneNumber, }); }; -export const updateSelectedLocation = (location: Location, dispatch: Dispatch): void => { +export const updateRelatedPersonId = ({ id }: { id: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_SELECTED_LOCATION', - location: location, + type: 'UPDATE_RELATED_PERSON_ID', + relatedPersonId: id, }); }; -export const updateSlots = (slots: Slot[], dispatch: Dispatch): void => { +export const updateResponsiblePartyId = ({ id }: { id: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_SLOTS', - slots: slots, + type: 'UPDATE_RESPONSIBLE_PARTY_ID', + responsiblePartyId: id, }); }; -export const updateAppointmentSlot = (appointmentSlot: string, dispatch: Dispatch): void => { +export const updateSelectedAppointmentSlotId = ({ id }: { id: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_APPOINTMENT_SLOT', - appointmentSlot: appointmentSlot, + type: 'UPDATE_SELECTED_APPOINTMENT_SLOT_ID', + selectedApptSlotId: id, }); }; -export const updateAppointmentId = (appointment: { id: string }, dispatch: Dispatch): void => { +export const updateSelectedLocation = (location: Location, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_APPOINTMENT_ID', - appointmentId: appointment.id, + type: 'UPDATE_SELECTED_LOCATION', + location: location, }); }; -export const updateAdditionalInformation = (additionalInfo: string, dispatch: Dispatch): void => { +export const updateSlots = (slots: Slot[], dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_ADDITIONAL_INFORMATION', - additionalInformation: additionalInfo, + type: 'UPDATE_SLOTS', + slots: slots, }); }; -export const updateCancellationReason = (cancellationReason: string, dispatch: Dispatch): void => { +export const updateSubmittedInsuranceType = ({ type }: { type: string }, dispatch: Dispatch): void => { dispatch({ - type: 'UPDATE_CANCELLATION_REASON', - cancellationReason: cancellationReason, + type: 'UPDATE_SUBMITTED_INSURANCE_TYPE', + submittedInsuranceType: type, }); }; diff --git a/packages/app/src/store/IntakeContext.tsx b/packages/app/src/store/IntakeContext.tsx index 2b928ac3..10b88fe2 100644 --- a/packages/app/src/store/IntakeContext.tsx +++ b/packages/app/src/store/IntakeContext.tsx @@ -1,6 +1,6 @@ -import { createContext, Dispatch, FC, ReactNode, useContext, useReducer, useState } from 'react'; -import { IntakeState, IntakeAction } from './types'; +import { Dispatch, FC, ReactNode, createContext, useContext, useReducer, useState } from 'react'; import { Outlet } from 'react-router-dom'; +import { IntakeAction, IntakeState } from './types'; const initialState = {}; @@ -29,7 +29,7 @@ export const usePatient = (): PatientContextProps => { }; export const PatientProvider: React.FC = () => { - const [patientName, setPatientName] = useState(''); + const [patientName, setPatientName] = useState(''); const [isVideoOpen, setIsVideoOpen] = useState(false); const [isMicOpen, setIsMicOpen] = useState(false); @@ -50,40 +50,40 @@ const intakeDataReducer = (state: IntakeState, action: IntakeAction): IntakeStat return { ...state, fhirClient: action.fhirClient }; case 'SET_ZAMBDA_CLIENT': return { ...state, zambdaClient: action.zambdaClient }; - case 'UPDATE_PHONE_NUMBER': - return { ...state, phoneNumber: action.phoneNumber }; - case 'UPDATE_PATIENTS': - return { ...state, patients: action.patients }; - case 'UPDATE_PATIENT': - return { ...state, patientInfo: action.patient }; + case 'UPDATE_APPOINTMENT_ID': + return { ...state, appointmentId: action.appointmentId }; + case 'UPDATE_ADDITIONAL_INFORMATION': + return { ...state, additionalInformation: action.additionalInformation }; + case 'UPDATE_APPOINTMENT_SLOT': + return { ...state, appointmentSlot: action.appointmentSlot }; + case 'UPDATE_CANCELLATION_REASON': + return { ...state, additionalInformation: action.cancellationReason }; + case 'UPDATE_CONSENT_FORM_ID': + return { ...state, consentFormId: action.consentFormId }; + case 'UPDATE_CONSENT_FORM_SIGNER_ID': + return { ...state, consentFormSignerId: action.consentFormSignerId }; + case 'UPDATE_COVERAGE_ID': + return { ...state, coverageId: action.coverageId }; case 'UPDATE_LOCATIONS': return { ...state, locations: action.locations }; - case 'UPDATE_SELECTED_LOCATION': - return { ...state, selectedLocation: action.location }; case 'UPDATE_LOCATION_ID': return { ...state, locationId: action.locationId }; - case 'UPDATE_SELECTED_APPOINTMENT_SLOT_ID': - return { ...state, selectedApptSlotId: action.selectedApptSlotId }; - case 'UPDATE_COVERAGE_ID': - return { ...state, coverageId: action.coverageId }; - case 'UPDATE_RESPONSIBLE_PARTY_ID': - return { ...state, responsiblePartyId: action.responsiblePartyId }; + case 'UPDATE_PATIENT': + return { ...state, patientInfo: action.patient }; + case 'UPDATE_PATIENTS': + return { ...state, patients: action.patients }; + case 'UPDATE_PHONE_NUMBER': + return { ...state, phoneNumber: action.phoneNumber }; case 'UPDATE_RELATED_PERSON_ID': return { ...state, relatedPersonId: action.relatedPersonId }; - case 'UPDATE_CONSENT_FORM_SIGNER_ID': - return { ...state, consentFormSignerId: action.consentFormSignerId }; - case 'UPDATE_CONSENT_FORM_ID': - return { ...state, consentFormId: action.consentFormId }; - case 'UPDATE_ADDITIONAL_INFORMATION': - return { ...state, additionalInformation: action.additionalInformation }; - case 'UPDATE_CANCELLATION_REASON': - return { ...state, additionalInformation: action.cancellationReason }; + case 'UPDATE_RESPONSIBLE_PARTY_ID': + return { ...state, responsiblePartyId: action.responsiblePartyId }; + case 'UPDATE_SELECTED_APPOINTMENT_SLOT_ID': + return { ...state, selectedApptSlotId: action.selectedApptSlotId }; + case 'UPDATE_SELECTED_LOCATION': + return { ...state, selectedLocation: action.location }; case 'UPDATE_SLOTS': return { ...state, slots: action.slots }; - case 'UPDATE_APPOINTMENT_SLOT': - return { ...state, appointmentSlot: action.appointmentSlot }; - case 'UPDATE_APPOINTMENT_ID': - return { ...state, appointmentId: action.appointmentId }; case 'UPDATE_SUBMITTED_INSURANCE_TYPE': return { ...state, submittedInsuranceType: action.submittedInsuranceType }; case 'UPDATE_TIMEZONE': diff --git a/packages/app/src/store/index.ts b/packages/app/src/store/index.ts index 9215d034..f8d23506 100644 --- a/packages/app/src/store/index.ts +++ b/packages/app/src/store/index.ts @@ -1,2 +1,2 @@ -export { setFhirClient, updateAppointmentSlot, updateTimezone, updateSlots } from './IntakeActions'; -export { IntakeDataContext, IntakeDataProvider } from './IntakeContext'; +export * from './IntakeActions'; +export * from './IntakeContext'; diff --git a/packages/app/src/store/types.ts b/packages/app/src/store/types.ts index 26e23cd0..a4333951 100644 --- a/packages/app/src/store/types.ts +++ b/packages/app/src/store/types.ts @@ -1,17 +1,36 @@ -import { Location, Patient, Slot } from 'fhir/r4'; import { FhirClient, ZambdaClient } from '@zapehr/sdk'; +import { Location, Patient, Slot } from 'fhir/r4'; -export enum PatientSex { - Male = 'male', - Female = 'female', - Other = 'other', +export enum AdditionalInformationOptions { + 'Friend/Family' = 'Friend/Family', + 'Healthcare Professional' = 'Healthcare Professional', + 'Google/internet search' = 'Google/internet search', + 'Internet ad' = 'Internet ad', + 'Social media community group' = 'Social media community group', + 'Webinar' = 'Webinar', + 'TV/Radio' = 'TV/Radio', + 'Newsletter' = 'Newsletter', + 'School' = 'School', + 'Drive by/Signage' = 'Drive by/Signage', } -export const PatientSexValues: { [key: string]: string } = { - Male: 'male', - Female: 'female', - Other: 'other', -}; +export enum CancellationReasonCodes { + 'Duplicate Visit or Account Error' = 'duplicate-visit-account-error', + 'Financial Responsibility Concern' = 'financial-concern', + 'Non-par or inactive insurance' = 'inactive-insurance', + 'Patient improved' = 'patient-improved', + 'Wait Time' = 'wait-time', + 'Went to outside facility' = 'outside-facility', +} + +export enum CancellationReasonOptions { + 'Duplicate Visit or Account Error' = 'Duplicate Visit or Account Error', + 'Financial Responsibility Concern' = 'Financial Responsibility Concern', + 'Non-par or inactive insurance' = 'Non-par or inactive insurance', + 'Patient improved' = 'Patient improved', + 'Wait Time' = 'Wait Time', + 'Went to outside facility' = 'Went to outside facility', +} export enum PatientEthnicity { 'Hispanic/Latino' = 'Hispanic/Latino', @@ -47,17 +66,10 @@ export const PatientRaceCode = { White: '2106-3', }; -export enum AdditionalInformationOptions { - 'Friend/Family' = 'Friend/Family', - 'Healthcare Professional' = 'Healthcare Professional', - 'Google/internet search' = 'Google/internet search', - 'Internet ad' = 'Internet ad', - 'Social media community group' = 'Social media community group', - 'Webinar' = 'Webinar', - 'TV/Radio' = 'TV/Radio', - 'Newsletter' = 'Newsletter', - 'School' = 'School', - 'Drive by/Signage' = 'Drive by/Signage', +export enum PatientSex { + Male = 'male', + Female = 'female', + Other = 'other', } export enum RelationshipToPatientOptions { @@ -68,27 +80,19 @@ export enum RelationshipToPatientOptions { 'Spouse ' = 'Spouse ', } -export enum CancellationReasonOptions { - 'Duplicate Visit or Account Error' = 'Duplicate Visit or Account Error', - 'Financial Responsibility Concern' = 'Financial Responsibility Concern', - 'Non-par or inactive insurance' = 'Non-par or inactive insurance', - 'Patient improved' = 'Patient improved', - 'Service not offered at PM' = 'Service not offered at PM', - 'Wait Time' = 'Wait Time', - 'Went to other PM or PMPT' = 'Went to other PM or PMPT', - 'Went to outside facility' = 'Went to outside facility', +export enum ResponsiblePartySex { + Male = 'male', + Female = 'female', + Other = 'other', } -export const CancellationReasonCodes = { - 'Duplicate Visit or Account Error': 'duplicate-visit-account-error', - 'Financial Responsibility Concern': 'financial-concern', - 'Non-par or inactive insurance': 'inactive-insurance', - 'Patient improved': 'patient-improved', - 'Service not offered at PM': 'service-not-offered', - 'Wait Time': 'wait-time', - 'Went to other PM or PMPT': 'other-pm', - 'Went to outside facility': 'outside-facility', -}; +export enum ResponsiblePartyRelationship { + 'Self' = 'Self', + 'Legal Guardian' = 'Legal Guardian', + 'Father' = 'Father', + 'Mother' = 'Mother', + 'Spouse' = 'Spouse', +} export type PatientInfo = { id: string | undefined; @@ -102,20 +106,6 @@ export type PatientInfo = { reasonForVisit: string[] | undefined; }; -export enum ResponsiblePartySex { - Male = 'male', - Female = 'female', - Other = 'other', -} - -export enum ResponsiblePartyRelationship { - 'Self' = 'Self', - 'Legal Guardian' = 'Legal Guardian', - 'Father' = 'Father', - 'Mother' = 'Mother', - 'Spouse' = 'Spouse', -} - export type IntakeAction = | { type: 'SET_FHIR_CLIENT'; fhirClient: FhirClient } | { type: 'SET_ZAMBDA_CLIENT'; zambdaClient: ZambdaClient } From 66190d3239cee43131f2f53cb9743e01cca2d1d8 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 15:58:15 +0100 Subject: [PATCH 11/30] Clean up pages files --- packages/app/src/pages/CheckInPermission.tsx | 20 +++---- packages/app/src/pages/PatientCheckin.tsx | 12 ++-- packages/app/src/pages/PostCall.tsx | 20 +++---- packages/app/src/pages/ProviderDashboard.tsx | 18 +++--- .../app/src/pages/ProviderRegistration.tsx | 55 ++++++++----------- packages/app/src/pages/ProviderSettings.tsx | 22 +++----- packages/app/src/pages/Version.tsx | 4 +- packages/app/src/pages/WaitingRoom.tsx | 17 +++--- packages/app/src/pages/index.ts | 8 +++ 9 files changed, 75 insertions(+), 101 deletions(-) create mode 100644 packages/app/src/pages/index.ts diff --git a/packages/app/src/pages/CheckInPermission.tsx b/packages/app/src/pages/CheckInPermission.tsx index 82c365d0..8292ef66 100644 --- a/packages/app/src/pages/CheckInPermission.tsx +++ b/packages/app/src/pages/CheckInPermission.tsx @@ -1,12 +1,10 @@ -import { Button, Typography, Box, useTheme } from '@mui/material'; import VideocamOffIcon from '@mui/icons-material/VideocamOff'; -import React from 'react'; -import Footer from '../components/Footer'; -import ProviderHeaderSection from '../components/ProviderHeaderSection'; -import { usePatient } from '../store/IntakeContext'; +import { Button, Box, Typography, useTheme } from '@mui/material'; import { useNavigate } from 'react-router-dom'; +import { Footer, ProviderHeaderSection } from '../components'; +import { usePatient } from '../store'; -const CheckInPermission = (): JSX.Element => { +export const CheckInPermission = (): JSX.Element => { const { setIsVideoOpen, setIsMicOpen } = usePatient(); const theme = useTheme(); const navigate = useNavigate(); @@ -14,7 +12,7 @@ const CheckInPermission = (): JSX.Element => { const toggleCamMic = (userInput: boolean): void => { setIsVideoOpen(userInput); setIsMicOpen(userInput); - navigate('/waitingroom'); + navigate('/waiting-room'); }; return ( @@ -89,9 +87,10 @@ const CheckInPermission = (): JSX.Element => { sx={{ color: 'white', borderRadius: '4px', + textTransform: 'uppercase', }} > - ENABLE CAMERA AND MIC + Enable camera and mic @@ -112,5 +112,3 @@ const CheckInPermission = (): JSX.Element => { ); }; - -export default CheckInPermission; diff --git a/packages/app/src/pages/PatientCheckin.tsx b/packages/app/src/pages/PatientCheckin.tsx index 7a05340e..a108b327 100644 --- a/packages/app/src/pages/PatientCheckin.tsx +++ b/packages/app/src/pages/PatientCheckin.tsx @@ -1,12 +1,11 @@ import { Button, TextField, Typography, useTheme } from '@mui/material'; import { Box } from '@mui/system'; -import Footer from '../components/Footer'; -import ProviderHeaderSection from '../components/ProviderHeaderSection'; -import { usePatient } from '../store/IntakeContext'; import { useState } from 'react'; import { useNavigate } from 'react-router-dom'; +import { Footer, ProviderHeaderSection } from '../components'; +import { usePatient } from '../store'; -const PatientCheckIn = (): JSX.Element => { +export const PatientCheckIn = (): JSX.Element => { const { patientName, setPatientName } = usePatient(); const [name, setName] = useState(patientName); const [isError, setIsError] = useState(false); @@ -34,7 +33,7 @@ const PatientCheckIn = (): JSX.Element => { justifyContent: 'space-between', }} > - + {/* Middle Section */} { Please enter your name to join the call line of Dr. Olivia Smith + {/* TODO Should we use React hook form? */}
{ ); }; - -export default PatientCheckIn; diff --git a/packages/app/src/pages/PostCall.tsx b/packages/app/src/pages/PostCall.tsx index cc347d36..faee4836 100644 --- a/packages/app/src/pages/PostCall.tsx +++ b/packages/app/src/pages/PostCall.tsx @@ -1,10 +1,8 @@ -import { Typography, Box, Button, useTheme } from '@mui/material'; -import React from 'react'; -import Footer from '../components/Footer'; -import ProviderHeaderSection from '../components/ProviderHeaderSection'; +import { Box, Button, Typography, useTheme } from '@mui/material'; import { useNavigate } from 'react-router-dom'; +import { Footer, ProviderHeaderSection } from '../components'; -const PostCall = (): JSX.Element => { +export const PostCall = (): JSX.Element => { const navigate = useNavigate(); const theme = useTheme(); @@ -25,7 +23,7 @@ const PostCall = (): JSX.Element => { justifyContent: 'space-between', }} > - + {/* Middle Section */} { }, }} > + {/* TODO If these sx props are the same, can we extract them to default primary/secondary button components? */} { Duration {mockCallDuration} mins - {isProvider ? ( + {isProvider && ( - ) : ( - '' )} @@ -84,5 +82,3 @@ const PostCall = (): JSX.Element => { ); }; - -export default PostCall; diff --git a/packages/app/src/pages/ProviderDashboard.tsx b/packages/app/src/pages/ProviderDashboard.tsx index 52ac4617..71b085cf 100644 --- a/packages/app/src/pages/ProviderDashboard.tsx +++ b/packages/app/src/pages/ProviderDashboard.tsx @@ -1,14 +1,12 @@ -import React from 'react'; -import { Footer } from '../components'; -import { Container, Box, Grid, Typography, Button, Divider } from '@mui/material'; -import defaultProvider from '../assets/icons/ottehrDefaultProvider.svg'; -import { useTranslation } from 'react-i18next'; import ContentCopyIcon from '@mui/icons-material/ContentCopy'; import MailOutlineIcon from '@mui/icons-material/MailOutline'; -import PatientQueue from '../components/PatientQueue'; -import TopAppBar from '../components/AppBar'; +import { Container, Box, Button, Divider, Grid, Typography } from '@mui/material'; +import React from 'react'; +import { useTranslation } from 'react-i18next'; +import { ottehrDefaultProvider } from '../assets/icons'; +import { Footer, PatientQueue, TopAppBar } from '../components'; -const ProviderDashboard = (): JSX.Element => { +export const ProviderDashboard = (): JSX.Element => { const { t } = useTranslation(); const patientsData = [ @@ -70,7 +68,7 @@ const ProviderDashboard = (): JSX.Element => { textAlign: 'right', }} > - Provider Image + Provider Image { ); }; - -export default ProviderDashboard; diff --git a/packages/app/src/pages/ProviderRegistration.tsx b/packages/app/src/pages/ProviderRegistration.tsx index cc6d04d9..172d6951 100644 --- a/packages/app/src/pages/ProviderRegistration.tsx +++ b/packages/app/src/pages/ProviderRegistration.tsx @@ -1,32 +1,26 @@ -import React, { useState } from 'react'; +import CallEndIcon from '@mui/icons-material/CallEnd'; +import CancelIcon from '@mui/icons-material/Cancel'; +import ChatIcon from '@mui/icons-material/Chat'; +import CheckIcon from '@mui/icons-material/CheckCircle'; +import MicIcon from '@mui/icons-material/Mic'; +import VideocamIcon from '@mui/icons-material/Videocam'; import { Box, - Typography, - TextField, - FormControl, - Select, - MenuItem, - InputLabel, + Button, Checkbox, + FormControl, FormControlLabel, - Button, + InputLabel, + MenuItem, + Select, + TextField, + Typography, } from '@mui/material'; +import { useState } from 'react'; +import { ellipse4, ellipse5, ottehrPatientIcon, ottehrProviderIcon, ottehrRegistrationLogo } from '../assets/icons'; +import { Logo } from '../components'; -import MicIcon from '@mui/icons-material/Mic'; -import ChatIcon from '@mui/icons-material/Chat'; -import CallEndIcon from '@mui/icons-material/CallEnd'; -import VideocamIcon from '@mui/icons-material/Videocam'; - -import Patient from '../assets/icons/ottehrPatientIcon.svg'; -import Doctor from '../assets/icons/ottehrProviderIcon.svg'; -import CheckIcon from '@mui/icons-material/CheckCircle'; -import CancelIcon from '@mui/icons-material/Cancel'; -import EllipseDark from '../assets/icons/Ellipse 4.png'; -import EllipseLight from '../assets/icons/Ellipse 5.png'; -import RegistrationLogo from '../assets/icons/ottehrRegistrationLogo.svg'; -import { Logo } from '../components/Logo'; - -const ProviderRegistration = (): JSX.Element => { +export const ProviderRegistration = (): JSX.Element => { const handleSubmit = (event: any): void => { event.preventDefault(); // TODO: form submission structure @@ -58,7 +52,7 @@ const ProviderRegistration = (): JSX.Element => { alignItems: 'center', }} > - + @@ -76,7 +70,7 @@ const ProviderRegistration = (): JSX.Element => { > { /> { zIndex: '2', }} > - + - { zIndex: '1', }} > - + - { } label="I am not a patient" /> + {/* TODO too much whitespace here? */} } label="I accept the terms and conditions" /> ))} - @@ -99,20 +98,21 @@ const TopAppBar: FC = () => { email@example.com - {settings.map((setting, index) => ( - + - {setting.name === 'Profile' && } - + {setting.name === 'Profile' && ( + + )} + {setting.name} {index < settings.length - 1 && } - + ))} @@ -121,4 +121,3 @@ const TopAppBar: FC = () => { ); }; -export default TopAppBar; diff --git a/packages/app/src/components/UploadComponent.tsx b/packages/app/src/components/UploadComponent.tsx index 50e5b722..35228e16 100644 --- a/packages/app/src/components/UploadComponent.tsx +++ b/packages/app/src/components/UploadComponent.tsx @@ -1,7 +1,7 @@ -import { ChangeEvent, FC, ReactNode } from 'react'; import { Box, Button, useTheme } from '@mui/material'; +import { ChangeEvent, FC, ReactNode } from 'react'; import { Controller, useFormContext } from 'react-hook-form'; -import { otherColors } from '../IntakeThemeProvider'; +import { otherColors } from '../OttehrThemeProvider'; interface UploadComponentProps { name: string; @@ -10,7 +10,7 @@ interface UploadComponentProps { handleFileUpload: (event: ChangeEvent) => string | null; } -const UploadComponent: FC = ({ +export const UploadComponent: FC = ({ name, defaultValue, uploadDescription, @@ -61,5 +61,3 @@ const UploadComponent: FC = ({ ); }; - -export default UploadComponent; diff --git a/packages/app/src/components/Logo.tsx b/packages/app/src/components/ZapEHRLogo.tsx similarity index 97% rename from packages/app/src/components/Logo.tsx rename to packages/app/src/components/ZapEHRLogo.tsx index bc0465da..e6a26736 100644 --- a/packages/app/src/components/Logo.tsx +++ b/packages/app/src/components/ZapEHRLogo.tsx @@ -1,10 +1,8 @@ -import React from 'react'; - -export interface LogoProps { +interface LogoProps { width: number; } -export function Logo(props: LogoProps): JSX.Element { +export function ZapEHRLogo(props: LogoProps): JSX.Element { return ( zapEHR Logo diff --git a/packages/app/src/components/index.ts b/packages/app/src/components/index.ts index 367c85cd..92db4c6b 100644 --- a/packages/app/src/components/index.ts +++ b/packages/app/src/components/index.ts @@ -1,20 +1,30 @@ -export { BoldPurpleInputLabel } from './BoldPurpleInputLabel'; -export { default as CheckIconWithText } from './CheckIconWithText'; -export { default as ControlButtons } from './ControlButtons'; -export { default as ControlledCheckBox } from './ControlledCheckBox'; -export { default as CustomContainer } from './CustomContainer'; -export { default as DateInput } from './DateInput'; -export { default as ErrorDialog } from './ErrorDialog'; -export { default as Footer } from './Footer'; -export { default as FormInput } from './FormInput'; -export { default as FreeMultiSelectInput } from './FreeMultiSelectInput'; -export { InputHelperText } from './InputHelperText'; -export { default as IntakeFlow } from './IntakeFlow'; -export { default as LoadingComponent } from './LoadingComponent'; -export { default as RadioInput } from './RadioInput'; -export { default as RequiredNote } from './RequiredNote'; -export { default as RenderLabelFromSelect } from './RenderLabelFromSelect'; -export { default as ScrollToTop } from './ScrollToTop'; -export { default as SelectInput } from './SelectInput'; -export type { SelectInputOption } from './SelectInput'; -export { SelectSlot } from './SelectSlot'; +export * from './BoldPurpleInputLabel'; +export * from './CardComponent'; +export * from './CardWithDescription'; +export * from './CardWithLink'; +export * from './CheckIconWithText'; +export * from './ControlButtons'; +export * from './ControlledCheckBox'; +export * from './CustomContainer'; +export * from './DateInput'; +export * from './ErrorDialog'; +export * from './FileUpload'; +export * from './Footer'; +export * from './FormInput'; +export * from './FreeMultiSelectInput'; +export * from './InputHelperText'; +export * from './InputMask'; +export * from './LoadingComponent'; +export * from './PageForm'; +export * from './PatientQueue'; +export * from './ProviderHeaderSection'; +export * from './RadioInput'; +export * from './RadioListInput'; +export * from './RenderLabelFromSelect'; +export * from './RequiredNote'; +export * from './ScrollToTop'; +export * from './SelectInput'; +export * from './SelectSlot'; +export * from './TopAppBar'; +export * from './UploadComponent'; +export * from './ZapEHRLogo'; From 48b5b5a452430a1f6209598b838d9aa2cb9b6947 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 16:58:12 +0100 Subject: [PATCH 13/30] Fix broken import --- packages/app/src/pages/ProviderRegistration.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/app/src/pages/ProviderRegistration.tsx b/packages/app/src/pages/ProviderRegistration.tsx index 172d6951..c0e97af8 100644 --- a/packages/app/src/pages/ProviderRegistration.tsx +++ b/packages/app/src/pages/ProviderRegistration.tsx @@ -18,7 +18,7 @@ import { } from '@mui/material'; import { useState } from 'react'; import { ellipse4, ellipse5, ottehrPatientIcon, ottehrProviderIcon, ottehrRegistrationLogo } from '../assets/icons'; -import { Logo } from '../components'; +import { ZapEHRLogo } from '../components'; export const ProviderRegistration = (): JSX.Element => { const handleSubmit = (event: any): void => { @@ -144,7 +144,7 @@ export const ProviderRegistration = (): JSX.Element => { Powered by - + {/* right side */} From 700b0ff75b146af1d36324fef180e3448d780464 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 16:58:58 +0100 Subject: [PATCH 14/30] Remove PMP specific function --- packages/zambdas/src/shared/dateUtils.ts | 7 ------- 1 file changed, 7 deletions(-) diff --git a/packages/zambdas/src/shared/dateUtils.ts b/packages/zambdas/src/shared/dateUtils.ts index 1f0e8bd0..f543afbb 100644 --- a/packages/zambdas/src/shared/dateUtils.ts +++ b/packages/zambdas/src/shared/dateUtils.ts @@ -21,13 +21,6 @@ export function formatDate(date: DateTime): string { return `${date.toISO()}`; } -export function createMinimumAndMaximumTime(date: DateTime, buffer?: number): { minimum: string; maximum: string } { - const minimum = formatDate(date); - const tomorrow = date.plus({ days: buffer ?? 1 }); - const maximum = formatDate(tomorrow.endOf('day')); - return { minimum: minimum, maximum: maximum }; -} - export const getDateTimeFromDateAndTime = (currentDate: DateTime, currentTime: string): DateTime => { const time = DateTime.fromFormat(currentTime, 'HH:mm:ss'); // Combine date and time into a single DateTime object From 5ae9eb0c86d0f9a013de036c1b5b596fc5f316c1 Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 17:04:26 +0100 Subject: [PATCH 15/30] Remove cross-package imports --- packages/app/src/store/types.ts | 35 --------------- packages/zambdas/src/shared/fhir.ts | 33 ++++++++------ packages/zambdas/src/types.ts | 70 +++++++++++++++++++++++++++++ 3 files changed, 89 insertions(+), 49 deletions(-) diff --git a/packages/app/src/store/types.ts b/packages/app/src/store/types.ts index a4333951..7d01acf7 100644 --- a/packages/app/src/store/types.ts +++ b/packages/app/src/store/types.ts @@ -14,36 +14,12 @@ export enum AdditionalInformationOptions { 'Drive by/Signage' = 'Drive by/Signage', } -export enum CancellationReasonCodes { - 'Duplicate Visit or Account Error' = 'duplicate-visit-account-error', - 'Financial Responsibility Concern' = 'financial-concern', - 'Non-par or inactive insurance' = 'inactive-insurance', - 'Patient improved' = 'patient-improved', - 'Wait Time' = 'wait-time', - 'Went to outside facility' = 'outside-facility', -} - -export enum CancellationReasonOptions { - 'Duplicate Visit or Account Error' = 'Duplicate Visit or Account Error', - 'Financial Responsibility Concern' = 'Financial Responsibility Concern', - 'Non-par or inactive insurance' = 'Non-par or inactive insurance', - 'Patient improved' = 'Patient improved', - 'Wait Time' = 'Wait Time', - 'Went to outside facility' = 'Went to outside facility', -} - export enum PatientEthnicity { 'Hispanic/Latino' = 'Hispanic/Latino', 'Not Hispanic/Latino' = 'Not Hispanic/Latino', 'Prefer not to answer' = 'Prefer not to answer', } -export const PatientEthnicityCode = { - 'Hispanic/Latino': '2135-2', - 'Not Hispanic/Latino': '2186-5', - 'Prefer not to answer': undefined, -}; - export enum PatientRace { 'American Indian or Alaskan Native' = 'American Indian or Alaskan Native', 'Asian' = 'Asian', @@ -55,17 +31,6 @@ export enum PatientRace { 'White' = 'White', } -export const PatientRaceCode = { - 'American Indian or Alaskan Native': '1002-5', - Asian: '2028-9', - 'Black or African American': '2054-5', - 'Hawaiian or Pacific Islander': '2076-8', - Other: '2131-1', - 'Prefer not to answer': undefined, - Unknown: undefined, - White: '2106-3', -}; - export enum PatientSex { Male = 'male', Female = 'female', diff --git a/packages/zambdas/src/shared/fhir.ts b/packages/zambdas/src/shared/fhir.ts index 48c69058..c8c05bc9 100644 --- a/packages/zambdas/src/shared/fhir.ts +++ b/packages/zambdas/src/shared/fhir.ts @@ -1,26 +1,31 @@ +import { FhirClient, SearchParam } from '@zapehr/sdk'; +import { Operation } from 'fast-json-patch'; import { - Patient, - Practitioner, - Resource, - Slot, - Location, - RelatedPerson, - Schedule, Account, Appointment, - Encounter, + CodeableConcept, + Consent, DocumentReference, DocumentReferenceContent, - Consent, - CodeableConcept, + Encounter, Extension, + Location, + Patient, + Practitioner, + RelatedPerson, + Resource, + Schedule, + Slot, } from 'fhir/r4'; import { DateTime } from 'luxon'; -import { CancellationReasonOptions, PatientInfo } from '../../../app/src/store/types'; -import { PatientEthnicityCode, PatientRaceCode, CancellationReasonCodes } from '../../../app/src/store/types'; import { removeTimeFromDate } from './dateUtils'; -import { FhirClient, SearchParam } from '@zapehr/sdk'; -import { Operation } from 'fast-json-patch'; +import { + CancellationReasonCodes, + CancellationReasonOptions, + PatientEthnicityCode, + PatientInfo, + PatientRaceCode, +} from '../types'; export async function createPatientResource(parameters: PatientInfo, fhirClient: FhirClient): Promise { try { diff --git a/packages/zambdas/src/types.ts b/packages/zambdas/src/types.ts index 4165863c..620f32a9 100644 --- a/packages/zambdas/src/types.ts +++ b/packages/zambdas/src/types.ts @@ -1,3 +1,73 @@ +export enum CancellationReasonCodes { + 'Duplicate Visit or Account Error' = 'duplicate-visit-account-error', + 'Financial Responsibility Concern' = 'financial-concern', + 'Non-par or inactive insurance' = 'inactive-insurance', + 'Patient improved' = 'patient-improved', + 'Wait Time' = 'wait-time', + 'Went to outside facility' = 'outside-facility', +} + +export enum CancellationReasonOptions { + 'Duplicate Visit or Account Error' = 'Duplicate Visit or Account Error', + 'Financial Responsibility Concern' = 'Financial Responsibility Concern', + 'Non-par or inactive insurance' = 'Non-par or inactive insurance', + 'Patient improved' = 'Patient improved', + 'Wait Time' = 'Wait Time', + 'Went to outside facility' = 'Went to outside facility', +} + +export enum PatientEthnicity { + 'Hispanic/Latino' = 'Hispanic/Latino', + 'Not Hispanic/Latino' = 'Not Hispanic/Latino', + 'Prefer not to answer' = 'Prefer not to answer', +} + +export const PatientEthnicityCode = { + 'Hispanic/Latino': '2135-2', + 'Not Hispanic/Latino': '2186-5', + 'Prefer not to answer': undefined, +}; + +export type PatientInfo = { + id: string | undefined; + newPatient: boolean; + firstName: string | undefined; + lastName: string | undefined; + dateOfBirth: string | undefined; + sex: PatientSex | undefined; + ethnicity: PatientEthnicity | undefined; + race: PatientRace | undefined; + reasonForVisit: string[] | undefined; +}; + +export enum PatientRace { + 'American Indian or Alaskan Native' = 'American Indian or Alaskan Native', + 'Asian' = 'Asian', + 'Black or African American' = 'Black or African American', + 'Hawaiian or Pacific Islander' = 'Hawaiian or Pacific Islander', + 'Other' = 'Other', + 'Prefer not to answer' = 'Prefer not to answer', + 'Unknown' = 'Unknown', + 'White' = 'White', +} + +export const PatientRaceCode = { + 'American Indian or Alaskan Native': '1002-5', + Asian: '2028-9', + 'Black or African American': '2054-5', + 'Hawaiian or Pacific Islander': '2076-8', + Other: '2131-1', + 'Prefer not to answer': undefined, + Unknown: undefined, + White: '2106-3', +}; + +export enum PatientSex { + Male = 'male', + Female = 'female', + Other = 'other', +} + export interface Secrets { [secretName: string]: string; } From 83d0e6034273f81da4442e28cc8842d143ca7ceb Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 17:05:47 +0100 Subject: [PATCH 16/30] Remove uses of 'React.*' --- packages/app/src/components/ProviderHeaderSection.tsx | 3 ++- packages/app/src/pages/ProviderDashboard.tsx | 6 +++--- packages/app/src/store/IntakeContext.tsx | 10 +++++----- 3 files changed, 10 insertions(+), 9 deletions(-) diff --git a/packages/app/src/components/ProviderHeaderSection.tsx b/packages/app/src/components/ProviderHeaderSection.tsx index 53d0318d..52d6ade1 100644 --- a/packages/app/src/components/ProviderHeaderSection.tsx +++ b/packages/app/src/components/ProviderHeaderSection.tsx @@ -1,4 +1,5 @@ import { Typography, Box, useTheme } from '@mui/material'; +import { FC } from 'react'; import { ottehrDefaultProvider } from '../assets/icons'; interface ProviderHeaderSectionProps { @@ -6,7 +7,7 @@ interface ProviderHeaderSectionProps { title: string; } -export const ProviderHeaderSection: React.FC = ({ providerName, title }) => { +export const ProviderHeaderSection: FC = ({ providerName, title }) => { const theme = useTheme(); return ( { {patientsData.map((patient, index) => ( - + {index !== patientsData.length - 1 && } - + ))} diff --git a/packages/app/src/store/IntakeContext.tsx b/packages/app/src/store/IntakeContext.tsx index 10b88fe2..3d31ef73 100644 --- a/packages/app/src/store/IntakeContext.tsx +++ b/packages/app/src/store/IntakeContext.tsx @@ -1,4 +1,4 @@ -import { Dispatch, FC, ReactNode, createContext, useContext, useReducer, useState } from 'react'; +import { Dispatch, FC, ReactNode, SetStateAction, createContext, useContext, useReducer, useState } from 'react'; import { Outlet } from 'react-router-dom'; import { IntakeAction, IntakeState } from './types'; @@ -13,11 +13,11 @@ type IntakeDataContextProps = { type PatientContextProps = { patientName: string; - setPatientName: React.Dispatch>; + setPatientName: Dispatch>; isVideoOpen: boolean; - setIsVideoOpen: React.Dispatch>; + setIsVideoOpen: Dispatch>; isMicOpen: boolean; - setIsMicOpen: React.Dispatch>; + setIsMicOpen: Dispatch>; }; export const usePatient = (): PatientContextProps => { @@ -28,7 +28,7 @@ export const usePatient = (): PatientContextProps => { return context; }; -export const PatientProvider: React.FC = () => { +export const PatientProvider: FC = () => { const [patientName, setPatientName] = useState(''); const [isVideoOpen, setIsVideoOpen] = useState(false); const [isMicOpen, setIsMicOpen] = useState(false); From 345130097c759890cef8080a88e2bdb36d07ddba Mon Sep 17 00:00:00 2001 From: Omar Zubaidi <66521244+OmarZubaidi@users.noreply.github.com> Date: Tue, 10 Oct 2023 17:08:40 +0100 Subject: [PATCH 17/30] Rename BoldPurpleInputLabel --- .../{BoldPurpleInputLabel.tsx => BoldPrimaryInputLabel.tsx} | 2 +- packages/app/src/components/DateInput.tsx | 6 +++--- packages/app/src/components/FileUpload.tsx | 6 +++--- packages/app/src/components/FormInput.tsx | 6 +++--- packages/app/src/components/FreeMultiSelectInput.tsx | 6 +++--- packages/app/src/components/RadioInput.tsx | 6 +++--- packages/app/src/components/RadioListInput.tsx | 6 +++--- packages/app/src/components/SelectInput.tsx | 6 +++--- packages/app/src/components/index.ts | 2 +- 9 files changed, 23 insertions(+), 23 deletions(-) rename packages/app/src/components/{BoldPurpleInputLabel.tsx => BoldPrimaryInputLabel.tsx} (70%) diff --git a/packages/app/src/components/BoldPurpleInputLabel.tsx b/packages/app/src/components/BoldPrimaryInputLabel.tsx similarity index 70% rename from packages/app/src/components/BoldPurpleInputLabel.tsx rename to packages/app/src/components/BoldPrimaryInputLabel.tsx index aae2755e..a2dd5abe 100644 --- a/packages/app/src/components/BoldPurpleInputLabel.tsx +++ b/packages/app/src/components/BoldPrimaryInputLabel.tsx @@ -1,6 +1,6 @@ import { InputLabel, styled } from '@mui/material'; -export const BoldPurpleInputLabel = styled(InputLabel)(({ theme }) => ({ +export const BoldPrimaryInputLabel = styled(InputLabel)(({ theme }) => ({ fontWeight: 700, fontSize: 16, transform: 'translate(0, -9px) scale(1)', diff --git a/packages/app/src/components/DateInput.tsx b/packages/app/src/components/DateInput.tsx index cc9961b2..581a84fa 100644 --- a/packages/app/src/components/DateInput.tsx +++ b/packages/app/src/components/DateInput.tsx @@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next'; import { CustomAdapterLuxon } from '../helpers'; import i18n from '../lib/i18n'; import { otherColors } from '../OttehrThemeProvider'; -import { BoldPurpleInputLabel } from './BoldPurpleInputLabel'; +import { BoldPrimaryInputLabel } from './BoldPrimaryInputLabel'; import { InputHelperText } from './InputHelperText'; type DateInputProps = { @@ -39,9 +39,9 @@ export const DateInput: FC = ({ name, label, helperText, require }} > - + {label} - + = ({ name, label, defaultValue, opt return ( <> - + {label} - + {showCard()} ); diff --git a/packages/app/src/components/FormInput.tsx b/packages/app/src/components/FormInput.tsx index 488a3cdb..3c509ede 100644 --- a/packages/app/src/components/FormInput.tsx +++ b/packages/app/src/components/FormInput.tsx @@ -3,7 +3,7 @@ import { alpha, useTheme } from '@mui/material/styles'; import { FC } from 'react'; import { Controller, useFormContext } from 'react-hook-form'; import { otherColors } from '../OttehrThemeProvider'; -import { BoldPurpleInputLabel } from './BoldPurpleInputLabel'; +import { BoldPrimaryInputLabel } from './BoldPrimaryInputLabel'; import { InputHelperText } from './InputHelperText'; import { InputMask } from './InputMask'; @@ -71,9 +71,9 @@ export const FormInput: FC = ({ width: '100%', }} > - + {label} - + = ({ width: '100%', }} > - + {label} - + = ({ {/* Had to add a margin here and on FormControl because none of the variants worked properly */} {/* Same for padding. I want to emphasize how much I hate this. */} - + {label} - + = ({ {/* Had to add a margin here and on FormControl because none of the variants worked properly */} {/* Same for padding. I want to emphasize how much I hate this. */} - + {label} - + {options.map((option) => { return ( diff --git a/packages/app/src/components/SelectInput.tsx b/packages/app/src/components/SelectInput.tsx index da7e6e57..a3652777 100644 --- a/packages/app/src/components/SelectInput.tsx +++ b/packages/app/src/components/SelectInput.tsx @@ -4,7 +4,7 @@ import { FC } from 'react'; import { Controller, useFormContext } from 'react-hook-form'; import { otherColors } from '../OttehrThemeProvider'; import { findLabelFromOptions } from '../helpers'; -import { BoldPurpleInputLabel } from './BoldPurpleInputLabel'; +import { BoldPrimaryInputLabel } from './BoldPrimaryInputLabel'; import { InputHelperText } from './InputHelperText'; import { RenderLabelFromSelect } from './RenderLabelFromSelect'; @@ -50,9 +50,9 @@ export const SelectInput: FC = ({ width: '100%', }} > - + {label} - +