2536 - JSON Schema Builder - SF

Author: kresimir-coko

client/src/components/JsonSchemaBuilder/components/SchemaControls.tsx

@@ -1,9 +1,11 @@
 import SchemaInput from '@/components/JsonSchemaBuilder/components/SchemaInput';
 import SchemaMenuPopover from '@/components/JsonSchemaBuilder/components/SchemaMenuPopover';
 import SchemaTypesSelect from '@/components/JsonSchemaBuilder/components/SchemaTypesSelect';
+import {Badge} from '@/components/ui/badge';
 import {Button} from '@/components/ui/button';
 import {CircleEllipsisIcon, PlusIcon, TrashIcon} from 'lucide-react';
 import {useEffect, useState} from 'react';
+import {twMerge} from 'tailwind-merge';
 
 import {
     addSchemaProperty,
@@ -13,8 +15,6 @@ import {
     setSchemaTypeAndRemoveWrongFields,
 } from '../utils/helpers';
 import {SchemaRecordType} from '../utils/types';
-import {Badge} from '@/components/ui/badge';
-import {twMerge} from 'tailwind-merge';
 
 interface SchemaControlsProps {
     schema: SchemaRecordType;

client/src/components/JsonSchemaBuilder/components/SchemaCreator.tsx

@@ -1,3 +1,4 @@
+import {Badge} from '@/components/ui/badge';
 import {Button} from '@/components/ui/button';
 import {AsteriskIcon, ChevronDownIcon} from 'lucide-react';
 import {PropsWithChildren, useState} from 'react';
@@ -18,7 +19,6 @@ import {
 } from '../utils/helpers';
 import {SchemaRecordType} from '../utils/types';
 import {SchemaArrayControls, SchemaControls} from './SchemaControls';
-import {Badge} from '@/components/ui/badge';
 
 interface SchemaCreatorProps {
     isRequired?: boolean;

client/src/components/JsonSchemaBuilder/components/SchemaMenuItem.tsx

@@ -36,7 +36,7 @@ const Item = ({children, onDelete}: ItemProps) => (
         <div className="min-w-0 flex-1">{children}</div>
 
         <Button
-            className="flex-shrink-0 text-content-destructive/50 hover:bg-surface-destructive-secondary hover:text-content-destructive"
+            className="shrink-0 text-content-destructive/50 hover:bg-surface-destructive-secondary hover:text-content-destructive"
             onClick={onDelete}
             size="icon"
             variant="ghost"

client/src/components/Note.tsx

@@ -5,7 +5,7 @@ import {twMerge} from 'tailwind-merge';
 import {Button} from './ui/button';
 
 export const Note = ({content, icon}: {content: string; icon?: ReactNode}) => (
-    <div className={twMerge('bg-surface-warning-secondary relative flex items-center rounded-md p-4', icon && 'gap-2')}>
+    <div className={twMerge('relative flex items-center rounded-md bg-surface-warning-secondary p-4', icon && 'gap-2')}>
         {icon && icon}
 
         <p className="text-sm font-medium">{content}</p>