Refactor interfaces to types for improved consistency across the code base

src/main/frontend/app/components/datamapper/basic-components/import-button.tsx

@@ -3,7 +3,7 @@ import clsx from 'clsx'
 import Button from '../../inputs/button'
 import { showErrorToast } from '../../toast'
 
-interface ImportButtonProperties {
+type ImportButtonProperties = {
   fileType: string
   importFunc: (file: File) => void
   file: File | null

src/main/frontend/app/components/datamapper/forms/add-conditions-form.tsx

@@ -14,7 +14,7 @@ import type {
 import conditionConfigJson from '~/utils/datamapper_utils/config/condition-config.json'
 import { generateConditionName } from '~/utils/datamapper_utils/function-utils'
 
-interface AddConditionFormProperties {
+type AddConditionFormProperties = {
   sources: Source[]
   onSave: (condition: Condition) => void
   conditionToEdit?: Condition

src/main/frontend/app/components/datamapper/forms/add-field-form.tsx

@@ -13,7 +13,7 @@ import Dropdown from '~/components/inputs/dropdown'
 import Button from '~/components/inputs/button'
 import Checkbox from '~/components/inputs/checkbox'
 
-export interface FieldModalProperties {
+export type FieldModalProperties = {
   fieldType: 'source' | 'target'
   onSave: (data: CustomNodeData) => void
   parents: NodeLabels[]

src/main/frontend/app/components/datamapper/forms/add-mapping-form.tsx

@@ -12,7 +12,7 @@ import EditButton from '../basic-components/edit-button'
 import Button from '~/components/inputs/button'
 import type { Condition, Mutation } from '~/types/datamapper_types/function-types'
 
-export interface MappingModalProps {
+export type MappingModalProps = {
   onSave: (data: MappingNodeData) => void
   sources: NodeLabels[]
   targets: NodeLabels[]

src/main/frontend/app/components/datamapper/react-flow/array-group-node.tsx

@@ -5,7 +5,7 @@ import DeleteButton from '../basic-components/delete-button'
 import clsx from 'clsx'
 import VariableTypeIcon from '../basic-components/variable-type-icon'
 
-export interface ArrayGroupNodeProperties {
+export type ArrayGroupNodeProperties = {
   id: string
   data: CustomNodeData
   variant?: 'source' | 'target'

src/main/frontend/app/components/datamapper/react-flow/array-mapping-node.tsx

@@ -3,7 +3,7 @@ import type { ArrayNodeData } from '~/types/datamapper_types/react-node-types'
 import DeleteButton from '../basic-components/delete-button'
 import { MAPPING_WIDTH } from '~/utils/datamapper_utils/constant'
 
-export interface ArrayMappingNodeProperties {
+export type ArrayMappingNodeProperties = {
   id: string
   data: ArrayNodeData
   onClick?: (id: string) => void

src/main/frontend/app/components/datamapper/react-flow/extra-source-node.tsx

@@ -3,7 +3,7 @@ import type { CustomNodeData } from '~/types/datamapper_types/react-node-types'
 import HighlightButton from '../basic-components/highlight-button'
 import DeleteButton from '../basic-components/delete-button'
 
-export interface ExtraSourceNodeProperties {
+export type ExtraSourceNodeProperties = {
   id: string
   data: CustomNodeData
   onDelete?: (id: string) => void

src/main/frontend/app/components/datamapper/react-flow/import-schematic-node.tsx

@@ -10,7 +10,7 @@ import clsx from 'clsx'
 import { showErrorToast } from '~/components/toast'
 
 //DataType needed
-export interface ImportSchematicNodeprops {
+export type ImportSchematicNodeprops = {
   data: {
     fileType: string
     side: 'source' | 'target'

src/main/frontend/app/components/datamapper/react-flow/labeled-group-node.tsx

@@ -6,7 +6,7 @@ import DeleteButton from '../basic-components/delete-button'
 import VariableTypeIcon from '../basic-components/variable-type-icon'
 import clsx from 'clsx'
 
-export interface LabeledGroupNodeProperties {
+export type LabeledGroupNodeProperties = {
   id: string
   data: CustomNodeData
   onEdit?: (data: CustomNodeData) => void

src/main/frontend/app/components/datamapper/react-flow/mapping-node.tsx

@@ -5,7 +5,7 @@ import EditButton from '../basic-components/edit-button'
 import { MAPPING_WIDTH } from '~/utils/datamapper_utils/constant'
 import HoverInfo from '../basic-components/hover-info'
 
-export interface MappingNodeProperties {
+export type MappingNodeProperties = {
   id: string
   data: MappingNodeData
 

src/main/frontend/app/components/datamapper/react-flow/node-types.tsx

@@ -11,7 +11,7 @@ import type { ArrayMappingNodeProperties } from './array-mapping-node'
 import ArrayMappingNode from './array-mapping-node'
 import ImportSchematicNode, { type ImportSchematicNodeprops } from './import-schematic-node'
 
-interface GetNodeTypesParameters {
+type GetNodeTypesParameters = {
   flow: ReturnType<typeof useFlowManagement>
   setReactFlowNodes: Dispatch<SetStateAction<Node[]>>
   setEditingNode: Dispatch<SetStateAction<CustomNodeData | null>>

src/main/frontend/app/components/datamapper/react-flow/one-edge-node.tsx

@@ -7,7 +7,7 @@ import HighlightButton from '../basic-components/highlight-button'
 import VariableTypeIcon from '../basic-components/variable-type-icon'
 import HoverInfo from '../basic-components/hover-info'
 
-export interface OneEdgeNodeProperties {
+export type OneEdgeNodeProperties = {
   id: string
   data: CustomNodeData
   variant?: 'source' | 'target'

src/main/frontend/app/components/directory-picker/directory-picker.tsx

@@ -8,7 +8,7 @@ import { useDirectoryWatcher } from '~/hooks/use-file-watcher'
 import Button from '../inputs/button'
 import CloseButton from '../inputs/close-button'
 
-interface DirectoryPickerProperties {
+type DirectoryPickerProperties = {
   onSelect: (absolutePath: string) => void
   onCancel: () => void
   rootLabel?: string

src/main/frontend/app/components/file-structure/confirm-delete-dialog.tsx

@@ -2,7 +2,7 @@ import { useEffect, useRef } from 'react'
 import { createPortal } from 'react-dom'
 import Button from '~/components/inputs/button'
 
-interface ConfirmDeleteDialogProps {
+type ConfirmDeleteDialogProps = {
   name: string
   isFolder: boolean
   onConfirm: () => void

src/main/frontend/app/components/file-structure/context-menu.tsx

@@ -2,7 +2,7 @@ import { useRef } from 'react'
 import { createPortal } from 'react-dom'
 import { useContextMenuDismiss } from '~/hooks/use-context-menu-dismiss'
 
-interface ContextMenuProps {
+type ContextMenuProps = {
   position: { x: number; y: number }
   isFolder: boolean
   isRoot?: boolean

src/main/frontend/app/components/file-structure/editor-data-provider.ts

@@ -6,7 +6,7 @@ import { sortChildren } from './tree-utilities'
 import type { DataProviderLike } from './use-file-tree-context-menu'
 import { BaseFilesDataProvider } from './base-files-data-provider'
 
-export interface FileNode {
+export type FileNode = {
   name: string
   path: string
   projectRoot?: boolean

src/main/frontend/app/components/file-structure/file-tree-dialogs.tsx

@@ -3,7 +3,7 @@ import NameInputDialog from './name-input-dialog'
 import ConfirmDeleteDialog from './confirm-delete-dialog'
 import type { ContextMenuState, NameDialogState, DeleteTargetState } from './use-file-tree-context-menu'
 
-interface FileTreeDialogsProps {
+type FileTreeDialogsProps = {
   contextMenu: ContextMenuState | null
   nameDialog: NameDialogState | null
   deleteTarget: DeleteTargetState | null

src/main/frontend/app/components/file-structure/inline-rename-input.tsx

@@ -1,7 +1,7 @@
 import type { TreeItemIndex } from 'react-complex-tree'
 import Input from '~/components/inputs/input'
 
-interface InlineRenameInputProps {
+type InlineRenameInputProps = {
   icon: React.ComponentType<{ className?: string }>
   value: string
   onChange: (value: string) => void

src/main/frontend/app/components/file-structure/name-input-dialog.tsx

@@ -22,7 +22,7 @@ export const CONFIGURATION_NAME_PATTERNS: Record<string, RegExp> = {
 
 export const FOLDER_OR_ADAPTER_NAME_PATTERNS: Record<string, RegExp> = BASE_NAME_PATTERNS
 
-interface NameInputDialogProps {
+type NameInputDialogProps = {
   title: string
   initialValue?: string
   submitLabel?: string

src/main/frontend/app/components/file-structure/studio-context-menu.tsx

@@ -3,7 +3,7 @@ import { createPortal } from 'react-dom'
 import { useContextMenuDismiss } from '~/hooks/use-context-menu-dismiss'
 import type { StudioItemType } from './use-studio-context-menu'
 
-interface StudioContextMenuProps {
+type StudioContextMenuProps = {
   position: { x: number; y: number }
   itemType: StudioItemType
   onNewConfiguration: () => void

src/main/frontend/app/components/file-structure/studio-file-tree-dialogs.tsx

@@ -3,7 +3,7 @@ import NameInputDialog from './name-input-dialog'
 import ConfirmDeleteDialog from './confirm-delete-dialog'
 import type { StudioContextMenuState, NameDialogState, DeleteTargetState } from './use-studio-context-menu'
 
-interface StudioFileTreeDialogsProps {
+type StudioFileTreeDialogsProps = {
   contextMenu: StudioContextMenuState | null
   nameDialog: NameDialogState | null
   deleteTarget: DeleteTargetState | null

src/main/frontend/app/components/file-structure/studio-files-data-provider.ts

@@ -5,12 +5,12 @@ import { fetchProjectTree, fetchStudioDirectoryByPath, fetchAncestorPath } from
 import type { FileTreeNode } from '~/types/filesystem.types'
 import { BaseFilesDataProvider } from './base-files-data-provider'
 
-export interface StudioFolderData {
+export type StudioFolderData = {
   name: string
   path: string
   adapterNames?: string[]
 }
-export interface StudioAdapterData {
+export type StudioAdapterData = {
   adapterName: string
   configPath: string
   adapterPosition: number

src/main/frontend/app/components/file-structure/use-file-tree-context-menu.ts

@@ -11,7 +11,7 @@ import { FILE_NAME_PATTERNS, FOLDER_OR_ADAPTER_NAME_PATTERNS } from '~/component
 import { logApiError } from '~/utils/logger'
 import { openInEditor } from '~/actions/navigationActions'
 
-export interface ContextMenuState {
+export type ContextMenuState = {
   position: { x: number; y: number }
   itemId: TreeItemIndex
   isFolder: boolean
@@ -20,29 +20,29 @@ export interface ContextMenuState {
   name: string
 }
 
-export interface NameDialogState {
+export type NameDialogState = {
   title: string
   initialValue?: string
   submitLabel?: string
   onSubmit: (name: string) => void
   patterns?: Record<string, RegExp>
 }
 
-export interface DeleteTargetState {
+export type DeleteTargetState = {
   name: string
   path: string
   isFolder: boolean
   parentItemId: TreeItemIndex
 }
 
-export interface DataProviderLike {
+export type DataProviderLike = {
   getTreeItem(
     itemId: TreeItemIndex,
   ): Promise<{ data: { path: string; name: string; projectRoot?: boolean }; isFolder?: boolean } | undefined>
   reloadDirectory(itemId: TreeItemIndex): Promise<void>
 }
 
-interface UseFileTreeContextMenuOptions {
+type UseFileTreeContextMenuOptions = {
   projectName: string | undefined
   dataProvider: DataProviderLike | null
   configurationsRootPath?: string

src/main/frontend/app/components/file-structure/use-studio-context-menu.ts

@@ -17,7 +17,7 @@ import { openInStudio } from '~/actions/navigationActions'
 
 export type StudioItemType = 'root' | 'folder' | 'configuration' | 'adapter' | 'file'
 
-export interface StudioContextMenuState {
+export type StudioContextMenuState = {
   position: { x: number; y: number }
   itemId: TreeItemIndex
   itemType: StudioItemType
@@ -26,21 +26,21 @@ export interface StudioContextMenuState {
   name: string
 }
 
-export interface NameDialogState {
+export type NameDialogState = {
   title: string
   initialValue?: string
   submitLabel?: string
   onSubmit: (name: string) => void
   patterns?: Record<string, RegExp>
 }
 
-export interface DeleteTargetState {
+export type DeleteTargetState = {
   name: string
   itemType: StudioItemType
   path: string
 }
 
-export interface StudioDataProviderLike {
+export type StudioDataProviderLike = {
   getTreeItem(itemId: TreeItemIndex): Promise<{ data: StudioItemData; isFolder?: boolean } | undefined>
   reloadDirectory(itemId: TreeItemIndex): Promise<void>
   getRootPath(): string
@@ -113,7 +113,7 @@ function removeAdapterTab(configPath: string, adapterName: string): void {
   }
 }
 
-interface UseStudioContextMenuOptions {
+type UseStudioContextMenuOptions = {
   projectName: string | undefined
   dataProvider: StudioDataProviderLike | null
 }

src/main/frontend/app/components/flow/add-subcomponent-modal.tsx

@@ -4,7 +4,7 @@ import Search from '~/components/search/search'
 import type { ElementDetails } from '@frankframework/doc-library-core'
 import { useMemo, useState, type ChangeEvent } from 'react'
 
-interface AddSubcomponentModalProps {
+type AddSubcomponentModalProps = {
   isOpen: boolean
   onClose: () => void
   possibleChildren: ElementDetails[]

src/main/frontend/app/components/flow/canvas-context-menu.tsx

@@ -3,7 +3,7 @@ import { createPortal } from 'react-dom'
 import { useContextMenuDismiss } from '~/hooks/use-context-menu-dismiss'
 import { useShortcutStore, formatShortcutParts } from '~/stores/shortcut-store'
 
-interface CanvasContextMenuProps {
+type CanvasContextMenuProps = {
   position: { x: number; y: number }
   onClose: () => void
   onAddNote: () => void

src/main/frontend/app/components/flow/create-node-modal.tsx

@@ -7,7 +7,7 @@ import CloseButton from '../inputs/close-button'
 import Search from '~/components/search/search'
 import type { Elements, FFDocJson } from '@frankframework/doc-library-core'
 
-interface CreateNodeModalProperties {
+type CreateNodeModalProperties = {
   isOpen: boolean
   onClose: () => void
   addNodeAtPosition: (

src/main/frontend/app/components/git/diff-tab-view.tsx

@@ -62,7 +62,7 @@ function applyHunkDecorations(
   return modifiedEditor.deltaDecorations(prevDecorations, decorations)
 }
 
-interface DiffTabViewProps {
+type DiffTabViewProps = {
   diffData: DiffTabData
 }
 

src/main/frontend/app/components/git/git-changes.tsx

@@ -3,7 +3,7 @@ import clsx from 'clsx'
 import type { GitStatus, FileHunkState } from '~/types/git.types'
 import Checkbox from '~/components/inputs/checkbox'
 
-interface GitChangesProps {
+type GitChangesProps = {
   status: GitStatus | null
   selectedFile: string | null
   fileHunkStates: Record<string, FileHunkState>

src/main/frontend/app/components/git/git-commit-box.tsx

@@ -1,6 +1,6 @@
 import Button from '~/components/inputs/button'
 
-interface GitCommitBoxProps {
+type GitCommitBoxProps = {
   commitMessage: string
   onMessageChange: (message: string) => void
   onCommit: () => void

src/main/frontend/app/components/git/git-panel.tsx

@@ -17,7 +17,7 @@ import GitToolbar from './git-toolbar'
 import GitChanges from './git-changes'
 import GitCommitBox from './git-commit-box'
 
-interface GitPanelProps {
+type GitPanelProps = {
   projectName: string
   hasStoredToken: boolean
 }

src/main/frontend/app/components/git/git-toolbar.tsx

@@ -9,7 +9,7 @@ import AltArrowDownIcon from '/icons/solar/Alt Arrow Down.svg?react'
 import AltArrowUpIcon from '/icons/solar/Alt Arrow Up.svg?react'
 import KeyIcon from '/icons/solar/Key.svg?react'
 
-interface GitToolbarProps {
+type GitToolbarProps = {
   status: GitStatus | null
   onRefresh: () => void
   onPush: () => void

src/main/frontend/app/components/inputs/close-button.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import CloseIcon from '/icons/custom/Close.svg?react'
 import IconButton from '~/components/inputs/icon-button'
 
-interface CloseButtonProps {
+type CloseButtonProps = {
   onClick?: (event: React.MouseEvent) => void
   className?: string
 }

src/main/frontend/app/components/inputs/dropdown.tsx

@@ -4,7 +4,7 @@ import AltArrowDownIcon from '/icons/solar/Alt Arrow Down.svg?react'
 
 export type DropdownOptions = Record<string, string>
 
-export interface DropdownProperties {
+export type DropdownProperties = {
   options: DropdownOptions
   onChange: (value: string) => void
   value?: string

src/main/frontend/app/components/inputs/icon-button.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import clsx from 'clsx'
 
-interface IconButtonProps {
+type IconButtonProps = {
   title?: string
   onClick?: (event: React.MouseEvent) => void
   onContextMenu?: (event: React.MouseEvent) => void

src/main/frontend/app/components/inputs/icon-label-button.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import clsx from 'clsx'
 
-interface IconLabelButtonProps {
+type IconLabelButtonProps = {
   icon: React.ReactNode
   label: string
   onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void