From 040a286f44b80d50fc5ac4c949222914dfab4cc4 Mon Sep 17 00:00:00 2001 From: Gokul Ram Date: Sat, 14 Jan 2023 15:22:49 +0530 Subject: [PATCH 1/3] added page component --- src/Components/Common/Export.tsx | 2 +- src/Components/Common/PageTitle.tsx | 10 +- src/Components/Common/components/Page.tsx | 33 +++ .../ExternalResult/ExternalResultUpload.tsx | 14 +- src/Components/Facility/HospitalList.tsx | 66 ++--- src/Components/Shifting/BoardView.tsx | 179 ++++++------- src/Components/Users/ManageUsers.tsx | 236 +++++++++--------- 7 files changed, 287 insertions(+), 253 deletions(-) create mode 100644 src/Components/Common/components/Page.tsx diff --git a/src/Components/Common/Export.tsx b/src/Components/Common/Export.tsx index 58e56a03ee1..68e27cb381e 100644 --- a/src/Components/Common/Export.tsx +++ b/src/Components/Common/Export.tsx @@ -71,7 +71,7 @@ export const ExportButton = ({ exportFile(props.action, props.filenamePrefix, type)} - className="mx-2 tooltip p-4 text-lg text-secondary-800 disabled:text-secondary-500 disabled:bg-transparent" + className="mx-2 tooltip px-4 text-lg text-secondary-800 disabled:text-secondary-500 disabled:bg-transparent" variant="secondary" ghost circle diff --git a/src/Components/Common/PageTitle.tsx b/src/Components/Common/PageTitle.tsx index 6ed7c442344..006258d83cb 100644 --- a/src/Components/Common/PageTitle.tsx +++ b/src/Components/Common/PageTitle.tsx @@ -3,12 +3,12 @@ import Breadcrumbs from "./Breadcrumbs"; import PageHeadTitle from "./PageHeadTitle"; import { classNames, goBack } from "../../Utils/utils"; -interface PageTitleProps { +export interface PageTitleProps { title: string; hideBack?: boolean; backUrl?: string; backButtonCB?: () => number | void; - className?: string; + // className?: string; componentRight?: React.ReactNode; justifyContents?: | "justify-center" @@ -27,7 +27,7 @@ export default function PageTitle({ hideBack = false, backUrl, backButtonCB, - className = "", + // className = "", componentRight = <>, breadcrumbs = true, crumbsReplacements = {}, @@ -46,13 +46,13 @@ export default function PageTitle({ backButtonCB ? goBack(backButtonCB()) : goBack(backUrl); return ( -
+
{!hideBack && ( diff --git a/src/Components/Common/components/Page.tsx b/src/Components/Common/components/Page.tsx new file mode 100644 index 00000000000..ab76c6d6978 --- /dev/null +++ b/src/Components/Common/components/Page.tsx @@ -0,0 +1,33 @@ +import PageTitle, { PageTitleProps } from "../PageTitle"; + +interface PageProps extends PageTitleProps { + children: any; + options?: any; + className?: string; +} + +export default function Page(props: PageProps) { + return ( +
+
+ + {props.options} +
+ {props.children} +
+ ); +} diff --git a/src/Components/ExternalResult/ExternalResultUpload.tsx b/src/Components/ExternalResult/ExternalResultUpload.tsx index 5650a63bf4c..3fe138d6df7 100644 --- a/src/Components/ExternalResult/ExternalResultUpload.tsx +++ b/src/Components/ExternalResult/ExternalResultUpload.tsx @@ -1,13 +1,12 @@ -import loadable from "@loadable/component"; import _ from "lodash"; import { navigate } from "raviger"; import { useState } from "react"; -//@ts-ignore import CSVReader from "react-csv-reader"; import { useDispatch } from "react-redux"; import { externalResultUploadCsv } from "../../Redux/actions"; import * as Notification from "../../Utils/Notifications.js"; -const PageTitle = loadable(() => import("../Common/PageTitle")); +import Page from "../Common/components/Page"; +// const PageTitle = loadable(() => import("../Common/PageTitle")); export default function ExternalResultUpload() { const dispatch: any = useDispatch(); @@ -59,12 +58,7 @@ export default function ExternalResultUpload() { }; return ( -
- +
@@ -139,6 +133,6 @@ export default function ExternalResultUpload() {
-
+ ); } diff --git a/src/Components/Facility/HospitalList.tsx b/src/Components/Facility/HospitalList.tsx index d0a335a5dbe..715536bae5f 100644 --- a/src/Components/Facility/HospitalList.tsx +++ b/src/Components/Facility/HospitalList.tsx @@ -23,9 +23,10 @@ import SearchInput from "../Form/SearchInput"; import useFilters from "../../Common/hooks/useFilters"; import { FacilityCard } from "./FacilityCard"; import ExportMenu from "../Common/Export"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); +// const PageTitle = loadable(() => import("../Common/PageTitle")); export const HospitalList = () => { const { @@ -209,34 +210,39 @@ export const HospitalList = () => { } return ( -
-
- - -
+ + + + } + >
@@ -329,6 +335,6 @@ export const HospitalList = () => {
{manageFacilities}
-
+ ); }; diff --git a/src/Components/Shifting/BoardView.tsx b/src/Components/Shifting/BoardView.tsx index 432d519f036..29224e434c0 100644 --- a/src/Components/Shifting/BoardView.tsx +++ b/src/Components/Shifting/BoardView.tsx @@ -12,9 +12,9 @@ import { formatFilter } from "./Commons"; import SearchInput from "../Form/SearchInput"; import useFilters from "../../Common/hooks/useFilters"; import { ExportButton } from "../Common/Export"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); const ScrollingComponent = withScrolling("div"); const shiftStatusOptions = SHIFTING_CHOICES.map((obj) => obj.text); @@ -31,97 +31,98 @@ export default function BoardView() { const [isLoading] = useState(false); return ( -
-
-
- - downloadShiftRequests({ ...formatFilter(qParams), csv: 1 }) + + downloadShiftRequests({ ...formatFilter(qParams), csv: 1 }) + } + filenamePrefix="shift_requests" + /> + } + options={ +
+
+ updateQuery({ [e.name]: e.value })} + placeholder="Search patient" + /> +
+ + +
+
+ + +
+
-
- updateQuery({ [e.name]: e.value })} - placeholder="Search patient" - /> -
- - + } + className="flex flex-col h-screen" + breadcrumbs={false} + > + <> + + +
+ {isLoading ? ( + + ) : ( + boardFilter.map((board) => ( + + )) + )}
-
- - + + +
+
-
-
- - -
- {isLoading ? ( - - ) : ( - boardFilter.map((board) => ( - - )) - )} -
-
- -
- -
-
-
+ + +
); } diff --git a/src/Components/Users/ManageUsers.tsx b/src/Components/Users/ManageUsers.tsx index 4175099e704..3c55ae81936 100644 --- a/src/Components/Users/ManageUsers.tsx +++ b/src/Components/Users/ManageUsers.tsx @@ -31,9 +31,9 @@ import useFilters from "../../Common/hooks/useFilters"; import { classNames } from "../../Utils/utils"; import ButtonV2 from "../Common/components/ButtonV2"; import CareIcon from "../../CAREUI/icons/CareIcon"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); export default function ManageUsers() { const { width } = useWindowDimensions(); @@ -559,131 +559,131 @@ export default function ManageUsers() { } return ( -
- {linkFacility.show && ( - - )} - - -
-
-
-
-
- Total Users -
- {/* Show spinner until count is fetched from server */} - {isLoading ? ( -
- -
- ) : ( -
- {totalCount} -
- )} -
-
-
-
-
- updateQuery({ [e.name]: e.value })} - value={qParams.username} - placeholder="Search by username" - /> + + <> + {linkFacility.show && ( + + )} + +
+
+
+
+
+ Total Users +
+ {/* Show spinner until count is fetched from server */} + {isLoading ? ( +
+ +
+ ) : ( +
+ {totalCount} +
+ )} +
+
+
+
+ updateQuery({ [e.name]: e.value })} + value={qParams.username} + placeholder="Search by username" + /> +
-
-
- + + + + {" "} + + + {" "} + + + {" "} + + + {" "} + + + {" "} + + + Advanced Filters + +
-
- -
- -
-
+ +
+ +
+
+
-
-
- [ - badge("Username", "username"), - badge("First Name", "first_name"), - badge("Last Name", "last_name"), - phoneNumber(), - phoneNumber("WhatsApp no.", "alt_phone_number"), - badge("Role", "user_type"), - value("District", "district_id", districtName || ""), - ]} - /> -
+
+ [ + badge("Username", "username"), + badge("First Name", "first_name"), + badge("Last Name", "last_name"), + phoneNumber(), + phoneNumber("WhatsApp no.", "alt_phone_number"), + badge("Role", "user_type"), + value("District", "district_id", districtName || ""), + ]} + /> +
-
{manageUsers}
-
- {userData.show && ( - - )} - {unlinkFacilityData.show && ( - - )} -
+ + {userData.show && ( + + )} + {unlinkFacilityData.show && ( + + )} + + ); } From cdbd82f9e3402f7ca5a7fbdb24ba0707610df511 Mon Sep 17 00:00:00 2001 From: Gokul Ram Date: Mon, 16 Jan 2023 19:06:53 +0530 Subject: [PATCH 2/3] fixed errors with pageTitle component --- src/Components/Common/components/Page.tsx | 17 ++- src/Components/Dashboard/HubDashboard.tsx | 1 - src/Components/ExternalResult/ResultItem.tsx | 12 +- .../ExternalResult/ResultUpdate.tsx | 7 +- src/Components/Facility/AssetCreate.tsx | 54 ++++----- src/Components/Facility/BedManagement.tsx | 26 ++-- .../Facility/ConsultationDetails.tsx | 114 +++++++++--------- src/Components/Facility/ConsultationForm.tsx | 22 ++-- src/Components/Facility/FacilityUsers.tsx | 22 +--- src/Components/Facility/InventoryList.tsx | 16 ++- src/Components/Facility/InventoryLog.tsx | 22 ++-- .../Investigations/ShowInvestigation.tsx | 21 ++-- .../Facility/LocationManagement.tsx | 16 ++- src/Components/Facility/MinQuantityList.tsx | 35 +++--- src/Components/Patient/PatientNotes.tsx | 23 ++-- src/Components/Patient/PatientRegister.tsx | 30 +++-- src/Components/Resource/ResourceBoardView.tsx | 49 ++++---- 17 files changed, 228 insertions(+), 259 deletions(-) diff --git a/src/Components/Common/components/Page.tsx b/src/Components/Common/components/Page.tsx index ab76c6d6978..0ae9741c08a 100644 --- a/src/Components/Common/components/Page.tsx +++ b/src/Components/Common/components/Page.tsx @@ -1,19 +1,24 @@ +import { RefObject } from "react"; import PageTitle, { PageTitleProps } from "../PageTitle"; interface PageProps extends PageTitleProps { children: any; options?: any; className?: string; + noImplicitPadding?: boolean; + ref?: RefObject; } export default function Page(props: PageProps) { + let padding = ""; + if (!props.noImplicitPadding) { + if (!props.hideBack || props.componentRight) padding = "px-6 py-3.5"; + else padding = "px-6 py-5"; + } + return ( -
-
+
+
import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); export default function ResultItem(props: any) { const dispatch: any = useDispatch(); - let initialData: any = {}; + const initialData: any = {}; const [data, setData] = useState(initialData); const [isLoading, setIsLoading] = useState(true); const [showDeleteAlert, setShowDeleteAlert] = useState(false); @@ -59,9 +59,7 @@ export default function ResultItem(props: any) { } return ( -
- - + {showDeleteAlert && ( )} -
+
-
+
); } diff --git a/src/Components/ExternalResult/ResultUpdate.tsx b/src/Components/ExternalResult/ResultUpdate.tsx index 1190a039513..54c91d8c7aa 100644 --- a/src/Components/ExternalResult/ResultUpdate.tsx +++ b/src/Components/ExternalResult/ResultUpdate.tsx @@ -22,9 +22,9 @@ import { MultilineInputField, SelectField } from "../Common/HelperInputFields"; import { navigate } from "raviger"; import { goBack } from "../../Utils/utils"; import { Cancel, Submit } from "../Common/components/ButtonV2"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); const initForm = { address: "", @@ -223,8 +223,7 @@ export default function UpdateResult(props: any) { } return ( -
- +

@@ -329,6 +328,6 @@ export default function UpdateResult(props: any) {

-
+ ); } diff --git a/src/Components/Facility/AssetCreate.tsx b/src/Components/Facility/AssetCreate.tsx index 7598b479d2a..7be561145b6 100644 --- a/src/Components/Facility/AssetCreate.tsx +++ b/src/Components/Facility/AssetCreate.tsx @@ -8,7 +8,6 @@ import { import { useDispatch } from "react-redux"; import * as Notification from "../../Utils/Notifications.js"; import CropFreeIcon from "@material-ui/icons/CropFree"; -import PageTitle from "../Common/PageTitle"; import { parsePhoneNumberFromString } from "libphonenumber-js"; import { validateEmailAddress } from "../../Common/validation"; import { @@ -32,6 +31,7 @@ import { SelectFormField } from "../Form/FormFields/SelectFormField"; import TextFormField from "../Form/FormFields/TextFormField"; import TextAreaFormField from "../Form/FormFields/TextAreaFormField"; import PhoneNumberFormField from "../Form/FormFields/PhoneNumberFormField"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); const formErrorKeys = [ @@ -385,15 +385,15 @@ const AssetCreate = (props: AssetProps) => { if (locations.length === 0) { return ( -
- +

@@ -411,7 +411,7 @@ const AssetCreate = (props: AssetProps) => { Add Location

-
+ ); } @@ -462,16 +462,15 @@ const AssetCreate = (props: AssetProps) => { yesterday.setDate(yesterday.getDate() - 1); return ( -
- +
{Object.keys(sections).map((sectionTitle) => { @@ -503,10 +502,9 @@ const AssetCreate = (props: AssetProps) => { className="rounded sm:rounded-xl bg-white p-6 sm:p-12 transition-all" >
-
+
{/* General Details Section */} {sectionTitle("General Details")} - {/* Asset Name */}
{
{/* Divider */} -
+ {/*

{ : "opacity-100 my-4") } /> -
+
*/} {/* Working Status */}
@@ -665,7 +663,7 @@ const AssetCreate = (props: AssetProps) => {
{/* Divider */} -
+ {/*

{ : "opacity-100 mb-7") } /> -
+
*/} {/* Asset QR ID */}
@@ -902,7 +900,7 @@ const AssetCreate = (props: AssetProps) => {
-
+ ); }; diff --git a/src/Components/Facility/BedManagement.tsx b/src/Components/Facility/BedManagement.tsx index 78385e30486..b0811489294 100644 --- a/src/Components/Facility/BedManagement.tsx +++ b/src/Components/Facility/BedManagement.tsx @@ -15,8 +15,8 @@ import { ReactElement } from "react"; import * as Notification from "../../Utils/Notifications.js"; import { LOCATION_BED_TYPES } from "../../Common/constants"; import BedDeleteDialog from "./BedDeleteDialog"; +import Page from "../Common/components/Page"; -const PageTitle = loadable(() => import("../Common/PageTitle")); const Loading = loadable(() => import("../Common/Loading")); interface BedManagementProps { @@ -237,18 +237,16 @@ export const BedManagement = (props: BedManagementProps) => { } return ( -
- +
{bed}
-
+ ); }; diff --git a/src/Components/Facility/ConsultationDetails.tsx b/src/Components/Facility/ConsultationDetails.tsx index 72aca852bc2..11801d296b0 100644 --- a/src/Components/Facility/ConsultationDetails.tsx +++ b/src/Components/Facility/ConsultationDetails.tsx @@ -50,6 +50,7 @@ import CareIcon from "../../CAREUI/icons/CareIcon"; import DialogModal from "../Common/Dialog"; import ButtonV2, { Cancel, Submit } from "../Common/components/ButtonV2"; import { SelectFormField } from "../Form/FormFields/SelectFormField"; +import Page from "../Common/components/Page"; interface PreDischargeFormInterface { discharge_reason: string; discharge_notes: string; @@ -331,7 +332,60 @@ export const ConsultationDetails = (props: any) => { }; return ( -
+ +
+ {patientData.is_active && ( +
+ + {patientData.last_consultation?.id && ( + + Camera Feed + + )} +
+ )} +
+ + Patient Details + + + Doctor's Notes + +
+
+ + } + > Download Discharge Summary @@ -447,58 +501,6 @@ export const ConsultationDetails = (props: any) => {
-
{ {tab === "UPDATES" && (
- +
+ +
{!consultationData.discharge_date && (
{ show={showDoctors} setShow={setShowDoctors} /> -
+ ); }; diff --git a/src/Components/Facility/ConsultationForm.tsx b/src/Components/Facility/ConsultationForm.tsx index d41bdc0dd32..ee476e5641b 100644 --- a/src/Components/Facility/ConsultationForm.tsx +++ b/src/Components/Facility/ConsultationForm.tsx @@ -58,9 +58,9 @@ import TextFormField from "../Form/FormFields/TextFormField"; import { DiagnosisSelectFormField } from "../Common/DiagnosisSelectFormField"; import { SymptomsSelect } from "../Common/SymptomsSelect"; import DateFormField from "../Form/FormFields/DateFormField"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); type BooleanStrings = "true" | "false"; @@ -617,16 +617,14 @@ export const ConsultationForm = (props: any) => { }; return ( -
- - +
{
)} -
+ ); }; diff --git a/src/Components/Facility/FacilityUsers.tsx b/src/Components/Facility/FacilityUsers.tsx index 54962e24a1f..f6505fc6065 100644 --- a/src/Components/Facility/FacilityUsers.tsx +++ b/src/Components/Facility/FacilityUsers.tsx @@ -23,9 +23,9 @@ import * as Notification from "../../Utils/Notifications.js"; import UserDetails from "../Common/UserDetails"; import UnlinkFacilityDialog from "../Users/UnlinkFacilityDialog"; import { classNames } from "../../Utils/utils"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); export default function FacilityUsers(props: any) { const { facilityId } = props; @@ -450,7 +450,7 @@ export default function FacilityUsers(props: any) { } return ( -
+ {linkFacility.show && ( )} - - -
+
-
+
Total Users @@ -486,10 +479,7 @@ export default function FacilityUsers(props: any) {
- -
-
{manageUsers}
-
+
{manageUsers}
{userData.show && ( )} -
+ ); } diff --git a/src/Components/Facility/InventoryList.tsx b/src/Components/Facility/InventoryList.tsx index 395f4eb69a8..15a0b36689b 100644 --- a/src/Components/Facility/InventoryList.tsx +++ b/src/Components/Facility/InventoryList.tsx @@ -8,7 +8,7 @@ import { getInventorySummary, getAnyFacility } from "../../Redux/actions"; import Pagination from "../Common/Pagination"; import { RoleButton } from "../Common/RoleButton"; import { classNames } from "../../Utils/utils"; -const PageTitle = loadable(() => import("../Common/PageTitle")); +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); export default function InventoryList(props: any) { @@ -152,13 +152,11 @@ export default function InventoryList(props: any) { } return ( -
- -
+ +
@@ -197,6 +195,6 @@ export default function InventoryList(props: any) { {inventoryItem}
-
+ ); } diff --git a/src/Components/Facility/InventoryLog.tsx b/src/Components/Facility/InventoryLog.tsx index faf285d9d15..86a11a2a923 100644 --- a/src/Components/Facility/InventoryLog.tsx +++ b/src/Components/Facility/InventoryLog.tsx @@ -12,7 +12,7 @@ import { statusType, useAbortableEffect } from "../../Common/utils"; import Pagination from "../Common/Pagination"; import { Tooltip } from "@material-ui/core"; import { formatDate } from "../../Utils/utils"; -const PageTitle = loadable(() => import("../Common/PageTitle")); +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); export default function InventoryLog(props: any) { @@ -244,16 +244,14 @@ export default function InventoryLog(props: any) { } return ( -
- -
+ +

Item: {itemName}

@@ -286,6 +284,6 @@ export default function InventoryLog(props: any) { {inventoryItem}
-
+
); } diff --git a/src/Components/Facility/Investigations/ShowInvestigation.tsx b/src/Components/Facility/Investigations/ShowInvestigation.tsx index b10fdf5a401..905c48e56b9 100644 --- a/src/Components/Facility/Investigations/ShowInvestigation.tsx +++ b/src/Components/Facility/Investigations/ShowInvestigation.tsx @@ -6,12 +6,12 @@ import { getInvestigation, getPatient, } from "../../../Redux/actions"; -import PageTitle from "../../Common/PageTitle"; import InvestigationTable from "./InvestigationTable"; import loadable from "@loadable/component"; import _ from "lodash"; import { navigate } from "raviger"; import * as Notification from "../../../Utils/Notifications.js"; +import Page from "../../Common/components/Page"; const Loading = loadable(() => import("../../Common/Loading")); @@ -160,15 +160,14 @@ export default function ShowInvestigation(props: any) { }, [state.initialValues]); return ( -
- + {isLoading ? ( ) : ( @@ -181,6 +180,6 @@ export default function ShowInvestigation(props: any) { handleSave={handleSubmit} /> )} -
+ ); } diff --git a/src/Components/Facility/LocationManagement.tsx b/src/Components/Facility/LocationManagement.tsx index b5e1922748d..04dea64fdb5 100644 --- a/src/Components/Facility/LocationManagement.tsx +++ b/src/Components/Facility/LocationManagement.tsx @@ -8,7 +8,7 @@ import Pagination from "../Common/Pagination"; import { RoleButton } from "../Common/RoleButton"; import { LocationModel } from "./models"; import { ReactElement } from "react"; -const PageTitle = loadable(() => import("../Common/PageTitle")); +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); interface LocationManagementProps { @@ -162,13 +162,11 @@ export const LocationManagement = (props: LocationManagementProps) => { } return ( -
- -
+ +
{
{location}
-
+ ); }; diff --git a/src/Components/Facility/MinQuantityList.tsx b/src/Components/Facility/MinQuantityList.tsx index 1168a85b8f2..053660d7b08 100644 --- a/src/Components/Facility/MinQuantityList.tsx +++ b/src/Components/Facility/MinQuantityList.tsx @@ -8,8 +8,8 @@ import { navigate } from "raviger"; import { RoleButton } from "../Common/RoleButton"; import { MinQuantityRequiredModal } from "./MinQuantityRequiredModal"; import ButtonV2 from "../Common/components/ButtonV2"; +import Page from "../Common/components/Page"; const Loading = loadable(() => import("../Common/Loading")); -const PageTitle = loadable(() => import("../Common/PageTitle")); export default function MinQuantityList(props: any) { const { facilityId }: any = props; @@ -207,25 +207,22 @@ export default function MinQuantityList(props: any) { } return ( -
- -
+ +
)} -
+ ); } diff --git a/src/Components/Patient/PatientNotes.tsx b/src/Components/Patient/PatientNotes.tsx index 2ef4e1f15b1..7ea574a274d 100644 --- a/src/Components/Patient/PatientNotes.tsx +++ b/src/Components/Patient/PatientNotes.tsx @@ -7,13 +7,13 @@ import { getPatient, } from "../../Redux/actions"; import * as Notification from "../../Utils/Notifications.js"; -import PageTitle from "../Common/PageTitle"; import Pagination from "../Common/Pagination"; import { navigate } from "raviger"; import { RESULTS_PER_PAGE_LIMIT } from "../../Common/constants"; import Loading from "../Common/Loading"; import { RoleButton } from "../Common/RoleButton"; import { formatDate } from "../../Utils/utils"; +import Page from "../Common/components/Page"; interface PatientNotesProps { patientId: any; @@ -105,16 +105,15 @@ const PatientNotes = (props: PatientNotesProps) => { } return ( -
- -

Add new notes

+ +

Add new notes