apply changes based on QA

ohcnetwork · Sep 13, 2023 · c18637a · c18637a
1 parent 08ed650
commit c18637a
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 13 deletions.
diff --git a/src/CAREUI/misc/PaginatedList.tsx b/src/CAREUI/misc/PaginatedList.tsx
@@ -143,11 +143,16 @@ PaginatedList.Items = Items;
 
 interface PaginatorProps {
   className?: string;
+  hideIfSinglePage?: boolean;
 }
 
-const Paginator = ({ className }: PaginatorProps) => {
+const Paginator = ({ className, hideIfSinglePage }: PaginatorProps) => {
   const { data, perPage, currentPage, setPage } = useContextualized<object>();
 
+  if (hideIfSinglePage && (data?.count ?? 0) <= perPage) {
+    return null;
+  }
+
   return (
     <Pagination
       className={className}

diff --git a/src/Components/Facility/LocationManagement.tsx b/src/Components/Facility/LocationManagement.tsx
@@ -24,18 +24,26 @@ export default function LocationManagement({ facilityId }: Props) {
           title="Location Management"
           backUrl={`/facility/${facilityId}`}
           options={
-            <div className="flex justify-end gap-2">
-
-              <ButtonV2
-                href={`/facility/${facilityId}/location/add`}
-                authorizeFor={NonReadOnlyUsers}
-              >
-                <CareIcon icon="l-plus" className="text-lg" />
-                Add New Location
-              </ButtonV2>
-            </div>
+            <ButtonV2
+              href={`/facility/${facilityId}/location/add`}
+              authorizeFor={NonReadOnlyUsers}
+              className="mr-8 hidden lg:block"
+            >
+              <CareIcon icon="l-plus" className="text-lg" />
+              Add New Location
+            </ButtonV2>
           }
         >
+          <div className="mx-auto">
+            <ButtonV2
+              href={`/facility/${facilityId}/location/add`}
+              authorizeFor={NonReadOnlyUsers}
+              className="w-full lg:hidden"
+            >
+              <CareIcon icon="l-plus" className="text-lg" />
+              Add New Location
+            </ButtonV2>
+          </div>
           <PaginatedList.WhenEmpty className="flex w-full justify-center border-b border-gray-200 bg-white p-5 text-center text-2xl font-bold text-gray-500">
             <span>No locations available</span>
           </PaginatedList.WhenEmpty>
@@ -44,12 +52,12 @@ export default function LocationManagement({ facilityId }: Props) {
             <Loading />
           </PaginatedList.WhenLoading>
 
-          <PaginatedList.Items<LocationModel> className="m-8 flex grow flex-col gap-3">
+          <PaginatedList.Items<LocationModel> className="my-8 flex grow flex-col gap-3 lg:mx-8">
             {(item) => <Location {...item} />}
           </PaginatedList.Items>
 
           <div className="flex w-full items-center justify-center">
-            <PaginatedList.Paginator />
+            <PaginatedList.Paginator hideIfSinglePage />
           </div>
         </Page>
       )}