From 0f5b7c11bba56cd2367626ead9cac99c038469a1 Mon Sep 17 00:00:00 2001
From: Troels Ugilt Jensen <6103205+tuj@users.noreply.github.com>
Date: Mon, 9 Oct 2023 11:55:03 +0200
Subject: [PATCH 1/2] SUPPORT-1257: Added pagination button to
 drag-and-drop-table

---
 CHANGELOG.md                                             | 2 ++
 .../util/drag-and-drop-table/drag-and-drop-table.jsx     | 9 +++------
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 67fad407..c5c5db35 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,8 @@ All notable changes to this project will be documented in this file.
 
 ## [Unreleased]
 
+- Fixed missing pagination button in drag-and-drop-table.
+
 ## [1.4.0] - 2023-09-14
 
 - [#210](https://github.com/os2display/display-admin-client/pull/210)
diff --git a/src/components/util/drag-and-drop-table/drag-and-drop-table.jsx b/src/components/util/drag-and-drop-table/drag-and-drop-table.jsx
index 54b6257b..08d98950 100644
--- a/src/components/util/drag-and-drop-table/drag-and-drop-table.jsx
+++ b/src/components/util/drag-and-drop-table/drag-and-drop-table.jsx
@@ -10,10 +10,6 @@ import ColumnProptypes from "../../proptypes/column-proptypes";
 import PaginationButton from "../forms/multiselect-dropdown/pagination-button";
 import "./drag-and-drop-table.scss";
 
-// Drag and drop component (react-beautiful-dnd) is replaced with hello-pangea/dnd,
-// because the drag and drop component does not work with react 18
-// https://github.com/atlassian/react-beautiful-dnd/issues/2350
-// If it some day works with react, we should consider changing it back
 /**
  * @param {object} props The props.
  * @param {Array} props.columns The columns for the table.
@@ -126,7 +122,7 @@ function DragAndDropTable({
                   {data.map((item, index) => (
                     <Draggable
                       key={item["@id"]}
-                      draggableId={item.title}
+                      draggableId={item["@id"]}
                       index={index}
                     >
                       {(providedDraggable, providedSnapshot) => (
@@ -164,7 +160,7 @@ function DragAndDropTable({
       <Row>
         <Col>
           {totalItems > data.length && (
-            <PaginationButton label={label} callback={callback} />
+            <PaginationButton label={label} callback={callback} showButton />
           )}
         </Col>
       </Row>
@@ -184,4 +180,5 @@ DragAndDropTable.propTypes = {
   callback: PropTypes.func.isRequired,
   totalItems: PropTypes.number.isRequired,
 };
+
 export default DragAndDropTable;

From 0b2fe00c8da2d67d84d943212500e32c76489bd2 Mon Sep 17 00:00:00 2001
From: Troels Ugilt Jensen <6103205+tuj@users.noreply.github.com>
Date: Mon, 9 Oct 2023 12:07:50 +0200
Subject: [PATCH 2/2] SUPPORT-1257: Updated changelog

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index c5c5db35..ebce0516 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,7 @@ All notable changes to this project will be documented in this file.
 
 ## [Unreleased]
 
+- [#221](https://github.com/os2display/display-admin-client/pull/221)
 - Fixed missing pagination button in drag-and-drop-table.
 
 ## [1.4.0] - 2023-09-14