From 433eca1bfbc90e44fb480f1a0d00c1a22cbcef32 Mon Sep 17 00:00:00 2001
From: SilviaAmAm <silvia@maykinmedia.nl>
Date: Tue, 4 Jun 2024 12:16:20 +0200
Subject: [PATCH] :recycle: Update components after changes in admin UI

---
 frontend/src/pages/destructionlist/Assignees.tsx       |  8 ++++----
 .../pages/destructionlist/DestructionListDetail.tsx    | 10 +++++++---
 .../src/pages/destructionlist/DestructionListItems.tsx |  2 +-
 3 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/frontend/src/pages/destructionlist/Assignees.tsx b/frontend/src/pages/destructionlist/Assignees.tsx
index b55dbc56..5109fef9 100644
--- a/frontend/src/pages/destructionlist/Assignees.tsx
+++ b/frontend/src/pages/destructionlist/Assignees.tsx
@@ -5,7 +5,7 @@ import {
   Errors,
   Form,
   FormField,
-  ObjectData,
+  LabeledAttributeData,
   Outline,
   SerializedFormData,
 } from "@maykin-ui/admin-ui";
@@ -76,7 +76,7 @@ export function AssigneesForm({
 export function AssigneesEditable({ assignees }: AssigneesEditableProps) {
   const [isEditing, setIsEditing] = useState(false);
 
-  const assigneesData: ObjectData = {};
+  const assigneesData: LabeledAttributeData = {};
   assignees.map((assignee) => {
     assigneesData[assignee.user.username] = {
       label:
@@ -87,7 +87,7 @@ export function AssigneesEditable({ assignees }: AssigneesEditableProps) {
     };
   });
 
-  const assigneesDisplay = <AttributeTable object={assigneesData} />;
+  const assigneesDisplay = <AttributeTable labeledObject={assigneesData} />;
 
   const assigneesForm = (
     <AssigneesForm
@@ -115,7 +115,7 @@ export function AssigneesEditable({ assignees }: AssigneesEditableProps) {
 
   return (
     <AttributeTable
-      object={{
+      labeledObject={{
         assignees: {
           label: label,
           value: isEditing ? assigneesForm : assigneesDisplay,
diff --git a/frontend/src/pages/destructionlist/DestructionListDetail.tsx b/frontend/src/pages/destructionlist/DestructionListDetail.tsx
index 68596d7a..99214a3c 100644
--- a/frontend/src/pages/destructionlist/DestructionListDetail.tsx
+++ b/frontend/src/pages/destructionlist/DestructionListDetail.tsx
@@ -5,7 +5,7 @@ import {
   Column,
   Grid,
   H1,
-  ObjectData,
+  LabeledAttributeData,
   P,
 } from "@maykin-ui/admin-ui";
 import { ActionFunctionArgs } from "@remix-run/router/utils";
@@ -28,7 +28,9 @@ import {
 } from "./types";
 import { formatUser } from "./utils";
 
-function getDisplayableList(destructionList: DestructionListData): ObjectData {
+function getDisplayableList(
+  destructionList: DestructionListData,
+): LabeledAttributeData {
   const createdOn = new Date(destructionList.created);
   const formattedCreatedOn = createdOn.toLocaleString("nl-nl", {
     year: "numeric",
@@ -74,7 +76,9 @@ export function DestructionListDetailPage() {
           <P>
             <Grid>
               <Column span={3}>
-                <AttributeTable object={getDisplayableList(destructionList)} />
+                <AttributeTable
+                  labeledObject={getDisplayableList(destructionList)}
+                />
               </Column>
               <Column span={9}>
                 <AssigneesEditable assignees={destructionList.assignees} />
diff --git a/frontend/src/pages/destructionlist/DestructionListItems.tsx b/frontend/src/pages/destructionlist/DestructionListItems.tsx
index bbd5bd3f..763e4992 100644
--- a/frontend/src/pages/destructionlist/DestructionListItems.tsx
+++ b/frontend/src/pages/destructionlist/DestructionListItems.tsx
@@ -106,7 +106,7 @@ export function DestructionListItems({
             },
           ]}
           onSelect={onSelect}
-          customComparisonFunction={(item1, item2) => item1.uuid === item2.uuid}
+          equalityChecker={(item1, item2) => item1.uuid === item2.uuid}
           paginatorProps={{
             count: allZaken.count,
             pageSize: 100,