extern/bruno
1
0
Fork 1
mirror of https://github.com/usebruno/bruno.git synced 2024-11-21 15:33:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor: ReorderTable component to use useMemo for rowsOrder (#3227)

Browse Source
This commit is contained in:
Pragadesh-45 2024-09-30 17:19:18 +05:30 committed by GitHub
parent e2baed6724
commit 02a82c5371
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 5 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
packages/bruno-app/src/components/ReorderTable/index.js
View File

@ -1,4 +1,4 @@
import React, { useEffect, useRef, useState, useCallback } from 'react';
import React, { useEffect, useRef, useState, useMemo } from 'react';
import { IconGripVertical, IconMinusVertical } from '@tabler/icons';
/**
@ -13,17 +13,17 @@ import { IconGripVertical, IconMinusVertical } from '@tabler/icons';
const ReorderTable = ({ children, updateReorderedItem }) => {
const tbodyRef = useRef();
const [rowsOrder, setRowsOrder] = useState(React.Children.toArray(children));
const [hoveredRow, setHoveredRow] = useState(null);
const [dragStart, setDragStart] = useState(null);
const rowsOrder = useMemo(() => React.Children.toArray(children), [children]);
/**
* useEffect hook to update the rows order and handle row hover states
* useEffect hook to handle row hover states
*/
useEffect(() => {
setRowsOrder(React.Children.toArray(children));
handleRowHover(null, false);
}, [children, dragStart]);
}, [children]);
const handleRowHover = (index, hoverstatus = true) => {
setHoveredRow(hoverstatus ? index : null);
@ -48,7 +48,6 @@ const ReorderTable = ({ children, updateReorderedItem }) => {
const updatedRowsOrder = [...rowsOrder];
const [movedRow] = updatedRowsOrder.splice(fromIndex, 1);
updatedRowsOrder.splice(toIndex, 0, movedRow);
setRowsOrder(updatedRowsOrder);
updateReorderedItem({
updateReorderedItem: updatedRowsOrder.map((row) => row.props['data-uid'])