Add shouldShowItemId

cultuurnet · Nov 21, 2024 · f1a6e09 · f1a6e09
1 parent 2260698
commit f1a6e09
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git 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
@@ -63,13 +63,15 @@ const Actions = ({ request, onDelete, onApprove, onReject }: ActionProps) => {
 
 type Props = {
   requests: OwnershipRequest[];
+  shouldShowItemId: boolean;
 } & ActionHandlers;
 
 export const OwnershipsTable = ({
   requests,
   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,17 +121,17 @@ 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};
               }
             `}
           >
             <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}