From ff419656903fb51b83c0a436c06c51ad11f61c5c Mon Sep 17 00:00:00 2001
From: melloware <mellowaredev@gmail.com>
Date: Fri, 23 Dec 2022 13:22:42 -0500
Subject: [PATCH] Fix #3817: Row reorder fixes from PrimeNG

---
 components/doc/datatable/reorderdoc.js | 14 +++++++-------
 components/lib/datatable/TableBody.js  |  4 ++--
 components/lib/utils/ObjectUtils.js    |  9 ++-------
 3 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/components/doc/datatable/reorderdoc.js b/components/doc/datatable/reorderdoc.js
index 8a261e803d..025c03af15 100644
--- a/components/doc/datatable/reorderdoc.js
+++ b/components/doc/datatable/reorderdoc.js
@@ -1,8 +1,8 @@
-import React, { useState, useEffect, useRef } from 'react';
-import { DataTable } from '../../lib/datatable/DataTable';
+import React, { useEffect, useRef, useState } from 'react';
+import { ProductService } from '../../../service/ProductService';
 import { Column } from '../../lib/column/Column';
+import { DataTable } from '../../lib/datatable/DataTable';
 import { Toast } from '../../lib/toast/Toast';
-import { ProductService } from '../../../service/ProductService';
 import { DocSectionCode } from '../common/docsectioncode';
 import { DocSectionText } from '../common/docsectiontext';
 
@@ -37,7 +37,7 @@ export function ReorderDoc(props) {
 
     const code = {
         basic: `
-<DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll">
+<DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll" paginator rows={5}>
     <Column rowReorder style={{width: '3em'}} />
     {dynamicColumns}
 </DataTable>
@@ -83,7 +83,7 @@ const ReorderDoc = () => {
             <Toast ref={toast}></Toast>
 
             <div className="card">
-                <DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll">
+                <DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll" paginator rows={5}>
                     <Column rowReorder style={{width: '3em'}} />
                     {dynamicColumns}
                 </DataTable>
@@ -133,7 +133,7 @@ const ReorderDoc = () => {
             <Toast ref={toast}></Toast>
 
             <div className="card">
-                <DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll">
+                <DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll" paginator rows={5}>
                     <Column rowReorder style={{width: '3em'}} />
                     {dynamicColumns}
                 </DataTable>
@@ -151,7 +151,7 @@ const ReorderDoc = () => {
             </DocSectionText>
             <div className="card">
                 <Toast ref={toast}></Toast>
-                <DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll">
+                <DataTable value={products} reorderableColumns reorderableRows onRowReorder={onRowReorder} onColReorder={onColReorder} responsiveLayout="scroll" paginator rows={5}>
                     <Column rowReorder style={{ width: '3em' }} />
                     {dynamicColumns}
                 </DataTable>
diff --git a/components/lib/datatable/TableBody.js b/components/lib/datatable/TableBody.js
index d55f7f02d6..6d984ba7fa 100644
--- a/components/lib/datatable/TableBody.js
+++ b/components/lib/datatable/TableBody.js
@@ -654,7 +654,7 @@ export const TableBody = React.memo(
 
             if (droppedRowIndex.current != null) {
                 let dropIndex = draggedRowIndex.current > droppedRowIndex.current ? droppedRowIndex.current : droppedRowIndex.current === 0 ? 0 : droppedRowIndex.current - 1;
-                let val = [...props.value];
+                let val = [...props.tableProps.value];
 
                 ObjectUtils.reorderArray(val, draggedRowIndex.current, dropIndex);
 
@@ -663,7 +663,7 @@ export const TableBody = React.memo(
                         originalEvent: event,
                         value: val,
                         dragIndex: draggedRowIndex.current,
-                        dropIndex: droppedRowIndex.current
+                        dropIndex: dropIndex
                     });
                 }
             }
diff --git a/components/lib/utils/ObjectUtils.js b/components/lib/utils/ObjectUtils.js
index 9a5a3aab52..737b44715a 100644
--- a/components/lib/utils/ObjectUtils.js
+++ b/components/lib/utils/ObjectUtils.js
@@ -130,15 +130,10 @@ export default class ObjectUtils {
     }
 
     static reorderArray(value, from, to) {
-        let target;
-
         if (value && from !== to) {
             if (to >= value.length) {
-                target = to - value.length;
-
-                while (target-- + 1) {
-                    value.push(undefined);
-                }
+                to %= value.length;
+                from %= value.length;
             }
 
             value.splice(to, 0, value.splice(from, 1)[0]);