Merge pull request #523 from components-ai/remove-actions-up-down

Removes up / down reorder actions since we have drag and drop now

Author: tesseralis

packages/gui/src/components/FieldArray.tsx

@@ -1,6 +1,5 @@
-import produce from 'immer'
 import { useState } from 'react'
-import { flip, replace, remove, insert } from '../lib/array'
+import { replace, remove, insert } from '../lib/array'
 import { EditorPropsWithLabel } from '../types/editor'
 import { SchemaInput } from './inputs/SchemaInput'
 import { DataTypeSchema } from './schemas/types'
@@ -21,13 +20,6 @@ export default function FieldArray<T>(props: FieldArrayProps<T>) {
   const [dragIndex, setDragIndex] = useState(-1)
   const isDragging = dragIndex >= 0
 
-  const handleReorder = (i1: number, i2: number) => {
-    if (typeof value === 'string') {
-      return
-    }
-    onChange(flip(value, i1, i2))
-  }
-
   const handleDragDrop = (i1: number, i2: number) => {
     const item = value[i1]
     const removed = remove(value, i1)
@@ -74,20 +66,6 @@ export default function FieldArray<T>(props: FieldArrayProps<T>) {
                 onDragEnd={() => {
                   setDragIndex(-1)
                 }}
-                reorder={{
-                  onMoveUp:
-                    i === 0
-                      ? undefined
-                      : () => {
-                          handleReorder(i, i - 1)
-                        },
-                  onMoveDown:
-                    i === value.length - 1
-                      ? undefined
-                      : () => {
-                          handleReorder(i, i + 1)
-                        },
-                }}
               />
             </div>
           </div>

packages/gui/src/components/inputs/SchemaInput.tsx

@@ -14,10 +14,6 @@ interface Props<T> {
   onRemove?(): void
   onDrag?(): void
   onDragEnd?(): void
-  reorder?: {
-    onMoveUp?(): void
-    onMoveDown?(): void
-  }
 }
 
 /**

packages/gui/src/components/ui/InputHeader.tsx

@@ -1,11 +1,5 @@
 import { ReactNode } from 'react'
-import {
-  AlignJustify,
-  ChevronDown,
-  ChevronUp,
-  RefreshCw,
-  X,
-} from 'react-feather'
+import { AlignJustify, RefreshCw, X } from 'react-feather'
 import { EditorPropsWithLabel } from '../../types/editor'
 import { Label } from '../primitives'
 import { useTheme } from '../providers/ThemeContext'
@@ -16,10 +10,6 @@ interface Props extends Omit<EditorPropsWithLabel<any>, 'keywords'> {
   regenerate?(options: any): any
   onDrag?(): void
   onDragEnd?(): void
-  reorder?: {
-    onMoveUp?(): void
-    onMoveDown?(): void
-  }
 }
 
 export function InputHeader({
@@ -31,7 +21,6 @@ export function InputHeader({
   onDrag,
   onDragEnd,
   regenerate,
-  reorder,
   ruleset,
   property,
 }: Props) {
@@ -72,27 +61,6 @@ export function InputHeader({
           </IconButton>
         )}
         {onRemove && <DeleteButton onRemove={onRemove} />}
-        {reorder && (
-          <div
-            sx={{
-              display: 'flex',
-              flexDirection: 'column',
-              justifySelf: 'right',
-              alignSelf: 'center',
-              gap: '-0.5rem',
-            }}
-          >
-            <IconButton disabled={!reorder.onMoveUp} onClick={reorder.onMoveUp}>
-              <ChevronUp size={16} />
-            </IconButton>
-            <IconButton
-              disabled={!reorder.onMoveDown}
-              onClick={reorder.onMoveDown}
-            >
-              <ChevronDown size={16} />
-            </IconButton>
-          </div>
-        )}
       </div>
     </div>
   )