From ac15627237ffadfe1a81814160bdc028856c3e3d Mon Sep 17 00:00:00 2001
From: 1ilit <1ilit@proton.me>
Date: Sun, 4 May 2025 21:56:10 +0400
Subject: [PATCH] Fix inputs

---
 .../EditorSidePanel/TablesTab/SearchBar.jsx     |  1 -
 .../EditorSidePanel/TablesTab/TableField.jsx    |  6 ++++--
 .../EditorSidePanel/TablesTab/TableInfo.jsx     |  9 ++-------
 .../EditorSidePanel/TablesTab/TablesTab.jsx     |  3 ++-
 src/components/SortableList/SortableList.jsx    | 17 ++++++++++-------
 5 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/components/EditorSidePanel/TablesTab/SearchBar.jsx b/src/components/EditorSidePanel/TablesTab/SearchBar.jsx
index 3b4cd3d..95e6a9b 100644
--- a/src/components/EditorSidePanel/TablesTab/SearchBar.jsx
+++ b/src/components/EditorSidePanel/TablesTab/SearchBar.jsx
@@ -11,7 +11,6 @@ export default function SearchBar({ tables }) {
 
   const treeData = useMemo(() => {
     return tables.map(({ id, name: parentName, fields }, i) => {
-      console.log(fields)
       const children = fields?.map(({ name }, j) => ({
         tableId: id,
         id: `${j}`,
diff --git a/src/components/EditorSidePanel/TablesTab/TableField.jsx b/src/components/EditorSidePanel/TablesTab/TableField.jsx
index b8e746a..46fda6d 100644
--- a/src/components/EditorSidePanel/TablesTab/TableField.jsx
+++ b/src/components/EditorSidePanel/TablesTab/TableField.jsx
@@ -18,11 +18,13 @@ export default function TableField({ data, tid, index }) {
   const [editField, setEditField] = useState({});
 
   return (
-    <div className="hover-1 my-2 flex gap-2 items-center" >
+    <div
+      id={`scroll_table_${tid}_input_${index}`}
+      className="hover-1 my-2 flex gap-2 items-center"
+    >
       <DragHandle id={data.id} />
       <div className="min-w-20 flex-1/3">
         <Input
-          id={`scroll_table_${tid}_input_${index}`}
           value={data.name}
           validateStatus={data.name.trim() === "" ? "error" : "default"}
           placeholder="Name"
diff --git a/src/components/EditorSidePanel/TablesTab/TableInfo.jsx b/src/components/EditorSidePanel/TablesTab/TableInfo.jsx
index 12cf2f9..fb6d477 100644
--- a/src/components/EditorSidePanel/TablesTab/TableInfo.jsx
+++ b/src/components/EditorSidePanel/TablesTab/TableInfo.jsx
@@ -65,13 +65,8 @@ export default function TableInfo({ data }) {
           });
         }}
         afterChange={() => setSaveState(State.SAVING)}
-        renderItem={(item) => (
-          <TableField
-            key={"field_" + item.id}
-            data={item}
-            tid={data.id}
-            index={item.id}
-          />
+        renderItem={(item, i) => (
+          <TableField data={item} tid={data.id} index={i} />
         )}
       />
       {data.indices.length > 0 && (
diff --git a/src/components/EditorSidePanel/TablesTab/TablesTab.jsx b/src/components/EditorSidePanel/TablesTab/TablesTab.jsx
index 62c7365..a2ba07b 100644
--- a/src/components/EditorSidePanel/TablesTab/TablesTab.jsx
+++ b/src/components/EditorSidePanel/TablesTab/TablesTab.jsx
@@ -47,8 +47,9 @@ export default function TablesTab() {
           accordion
         >
           <SortableList
+            type="table"
             items={tables}
-            onChange={setTables}
+            onChange={(newTables) => setTables(newTables)}
             afterChange={() => setSaveState(State.SAVING)}
             renderItem={(item) => <TableListItem table={item} />}
           />
diff --git a/src/components/SortableList/SortableList.jsx b/src/components/SortableList/SortableList.jsx
index 2bc5ac7..a557e88 100644
--- a/src/components/SortableList/SortableList.jsx
+++ b/src/components/SortableList/SortableList.jsx
@@ -12,7 +12,13 @@ import {
 } from "@dnd-kit/sortable";
 import { SortableItem } from "./SortableItem";
 
-export function SortableList({ items, onChange, afterChange, renderItem }) {
+export function SortableList({
+  items,
+  onChange,
+  afterChange,
+  renderItem,
+  type = "",
+}) {
   const sensors = useSensors(useSensor(PointerSensor));
 
   const handleDragEnd = (event) => {
@@ -34,12 +40,9 @@ export function SortableList({ items, onChange, afterChange, renderItem }) {
       onDragEnd={handleDragEnd}
     >
       <SortableContext items={items} strategy={verticalListSortingStrategy}>
-        {items.map((item) => (
-          <SortableItem
-            key={`sortable-item-${item.name ?? ""}-${item.id}`}
-            id={item.id}
-          >
-            {renderItem(item)}
+        {items.map((item, i) => (
+          <SortableItem id={item.id} key={`sortable-item-${type}-${item.id}`}>
+            {renderItem(item, i)}
           </SortableItem>
         ))}
       </SortableContext>