From f1a6e09427139ccd8b50ffd338953afdc5dc3601 Mon Sep 17 00:00:00 2001
From: simon-debruijn <simon.debruijn@hotmail.com>
Date: Thu, 21 Nov 2024 18:42:09 +0100
Subject: [PATCH] Add shouldShowItemId

---
 src/pages/manage/ownerships/index.page.tsx         |  2 +-
 .../[organizerId]/ownerships/OwnershipsTable.tsx   | 14 ++++++++------
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/pages/manage/ownerships/index.page.tsx b/src/pages/manage/ownerships/index.page.tsx
index 04ddc6b7a..9a89a6c7b 100644
--- a/src/pages/manage/ownerships/index.page.tsx
+++ b/src/pages/manage/ownerships/index.page.tsx
@@ -113,7 +113,7 @@ const OwnershipsOverviewPage = () => {
           {getOwnershipRequestsQuery.isLoading ? (
             <Spinner />
           ) : (
-            <OwnershipsTable requests={requests} />
+            <OwnershipsTable requests={requests} shouldShowItemId />
           )}
 
           {hasMoreThanOnePage && (
diff --git a/src/pages/organizers/[organizerId]/ownerships/OwnershipsTable.tsx b/src/pages/organizers/[organizerId]/ownerships/OwnershipsTable.tsx
index 09f07d93f..8de70dc9d 100644
--- a/src/pages/organizers/[organizerId]/ownerships/OwnershipsTable.tsx
+++ b/src/pages/organizers/[organizerId]/ownerships/OwnershipsTable.tsx
@@ -63,6 +63,7 @@ const Actions = ({ request, onDelete, onApprove, onReject }: ActionProps) => {
 
 type Props = {
   requests: OwnershipRequest[];
+  shouldShowItemId: boolean;
 } & ActionHandlers;
 
 export const OwnershipsTable = ({
@@ -70,6 +71,7 @@ export const OwnershipsTable = ({
   onDelete,
   onApprove,
   onReject,
+  shouldShowItemId = false,
 }: Props) => {
   const { grey3 } = colors;
   const { t } = useTranslation();
@@ -99,14 +101,14 @@ export const OwnershipsTable = ({
         paddingBottom={3}
         css={`
           display: grid;
-          grid-template-columns: repeat(3, 1fr);
+          grid-template-columns: 1fr 2fr 1fr;
           border-bottom: 1px solid ${grey3};
         `}
       >
         <Title size={3}>{t('organizers.ownerships.table.user')}</Title>
-        <Title size={3}>item id</Title>
+        {shouldShowItemId && <Title size={3}>item id</Title>}
         {hasActions && (
-          <Title size={3} justifyContent="flex-end">
+          <Title size={3}>
             {t('organizers.ownerships.table.actions.title')}
           </Title>
         )}
@@ -119,7 +121,7 @@ export const OwnershipsTable = ({
             paddingY={3}
             css={`
               display: grid;
-              grid-template-columns: repeat(3, 1fr);
+              grid-template-columns: 1fr 2fr 1fr;
 
               &:not(:last-child) {
                 border-bottom: 1px solid ${grey3};
@@ -127,9 +129,9 @@ export const OwnershipsTable = ({
             `}
           >
             <List.Item>{request.ownerEmail}</List.Item>
-            <List.Item>{request.itemId}</List.Item>
+            {shouldShowItemId && <List.Item>{request.itemId}</List.Item>}
             {hasActions && (
-              <List.Item justifyContent="flex-end">
+              <List.Item>
                 <Actions
                   request={request}
                   onDelete={onDelete}