feat: add feature to reorder columns (#103)

Fixes #59

package.json

@@ -29,6 +29,7 @@
 		"just-compare": "^2.3.0",
 		"ms": "^2.1.3",
 		"react": "^18.2.0",
+		"react-beautiful-dnd": "^13.1.1",
 		"react-dom": "^18.2.0",
 		"react-error-boundary": "^4.0.10",
 		"react-resizable-panels": "^0.0.53",
@@ -39,6 +40,7 @@
 		"@types/ms": "^0.7.31",
 		"@types/node": "^20.3.2",
 		"@types/react": "^18.2.14",
+		"@types/react-beautiful-dnd": "^13.1.4",
 		"@types/react-dom": "^18.2.6",
 		"@types/react-window": "^1.8.5",
 		"@typescript-eslint/eslint-plugin": "^5.60.1",

src/hooks/useGetLogStreamSchema.ts

@@ -2,6 +2,7 @@ import { LogStreamSchemaData } from '@/@types/parseable/api/stream';
 import { getLogStreamSchema } from '@/api/logStream';
 import { StatusCodes } from 'http-status-codes';
 import useMountedState from './useMountedState';
+import { Field } from '@/@types/parseable/dataType';
 
 export const useGetLogStreamSchema = () => {
 	const [data, setData] = useMountedState<LogStreamSchemaData | null>(null);
@@ -36,5 +37,33 @@ export const useGetLogStreamSchema = () => {
 		setData(null);
 	};
 
-	return { data, error, loading, getDataSchema, resetData };
+	const reorderSchemaFields = (destination: number, source: number) => {
+		setData((prev) => {
+			if (prev != null) {
+				if (destination >= prev.fields.length || source >= prev.fields.length) {
+					setError('Unable to reorder fields');
+					return prev;
+				}
+				if (destination === source) return prev;
+
+				const newFields: Field[] = [...prev.fields];
+				for (let i = 0; i < prev.fields.length; i++) {
+					let offset = 0;
+					if (source < destination && i >= source && i < destination) offset = 1;
+					else if (destination < source && i > destination && i <= source) offset = -1;
+					newFields[i] = prev.fields[i + offset];
+				}
+				newFields[destination] = prev.fields[source];
+
+				return {
+					...prev,
+					fields: newFields,
+				};
+			}
+
+			return null;
+		});
+	};
+
+	return { data, error, loading, getDataSchema, resetData, reorderSchemaFields };
 };