replaces js interfaces with types

frontend/src/components/AsyncMethodComponent.tsx

@@ -6,7 +6,7 @@ import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { LevelName } from './NotificationsComponent';
 import { WebSettingsContext } from '../WebSettings';
 
-interface AsyncMethodProps {
+type AsyncMethodProps = {
   name: string;
   parentPath: string;
   parameters: Record<string, string>;
@@ -14,7 +14,7 @@ interface AsyncMethodProps {
   docString?: string;
   hideOutput?: boolean;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const AsyncMethodComponent = React.memo((props: AsyncMethodProps) => {
   const { name, parentPath, docString, value: runningTask, addNotification } = props;

frontend/src/components/ButtonComponent.tsx

@@ -6,7 +6,7 @@ import { DocStringComponent } from './DocStringComponent';
 import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { LevelName } from './NotificationsComponent';
 
-interface ButtonComponentProps {
+type ButtonComponentProps = {
   name: string;
   parentPath?: string;
   value: boolean;
@@ -14,7 +14,7 @@ interface ButtonComponentProps {
   docString: string;
   mapping?: [string, string]; // Enforce a tuple of two strings
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const ButtonComponent = React.memo((props: ButtonComponentProps) => {
   const { name, parentPath, value, readOnly, docString, addNotification } = props;

frontend/src/components/ColouredEnumComponent.tsx

@@ -6,7 +6,7 @@ import { DocStringComponent } from './DocStringComponent';
 import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { LevelName } from './NotificationsComponent';
 
-interface ColouredEnumComponentProps {
+type ColouredEnumComponentProps = {
   name: string;
   parentPath: string;
   value: string;
@@ -14,7 +14,7 @@ interface ColouredEnumComponentProps {
   readOnly: boolean;
   enumDict: Record<string, string>;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const ColouredEnumComponent = React.memo((props: ColouredEnumComponentProps) => {
   const {

frontend/src/components/DocStringComponent.tsx

@@ -1,9 +1,9 @@
 import { Badge, Tooltip, OverlayTrigger } from 'react-bootstrap';
 import React from 'react';
 
-interface DocStringProps {
+type DocStringProps = {
   docString?: string;
-}
+};
 
 export const DocStringComponent = React.memo((props: DocStringProps) => {
   const { docString } = props;

frontend/src/components/EnumComponent.tsx

@@ -6,14 +6,14 @@ import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { DocStringComponent } from './DocStringComponent';
 import { LevelName } from './NotificationsComponent';
 
-interface EnumComponentProps {
+type EnumComponentProps = {
   name: string;
   parentPath: string;
   value: string;
   docString?: string;
   enumDict: Record<string, string>;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const EnumComponent = React.memo((props: EnumComponentProps) => {
   const {

frontend/src/components/GenericComponent.tsx

@@ -27,7 +27,7 @@ type AttributeType =
   | 'ColouredEnum';
 
 type ValueType = boolean | string | number | object;
-export interface Attribute {
+export type Attribute = {
   type: AttributeType;
   value?: ValueType | ValueType[];
   readonly: boolean;
@@ -35,7 +35,7 @@ export interface Attribute {
   parameters?: Record<string, string>;
   async?: boolean;
   enum?: Record<string, string>;
-}
+};
 type GenericComponentProps = {
   attribute: Attribute;
   name: string;

frontend/src/components/ImageComponent.tsx

@@ -6,7 +6,7 @@ import { ChevronDown, ChevronRight } from 'react-bootstrap-icons';
 import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { LevelName } from './NotificationsComponent';
 
-interface ImageComponentProps {
+type ImageComponentProps = {
   name: string;
   parentPath: string;
   value: string;
@@ -14,7 +14,7 @@ interface ImageComponentProps {
   docString: string;
   format: string;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const ImageComponent = React.memo((props: ImageComponentProps) => {
   const { name, parentPath, value, docString, format, addNotification } = props;

frontend/src/components/ListComponent.tsx

@@ -4,14 +4,14 @@ import { Attribute, GenericComponent } from './GenericComponent';
 import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { LevelName } from './NotificationsComponent';
 
-interface ListComponentProps {
+type ListComponentProps = {
   name: string;
   parentPath?: string;
   value: Attribute[];
   docString: string;
   isInstantUpdate: boolean;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const ListComponent = React.memo((props: ListComponentProps) => {
   const { name, parentPath, value, docString, isInstantUpdate, addNotification } =

frontend/src/components/MethodComponent.tsx

@@ -6,14 +6,14 @@ import { DocStringComponent } from './DocStringComponent';
 import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { LevelName } from './NotificationsComponent';
 
-interface MethodProps {
+type MethodProps = {
   name: string;
   parentPath: string;
   parameters: Record<string, string>;
   docString?: string;
   hideOutput?: boolean;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const MethodComponent = React.memo((props: MethodProps) => {
   const { name, parentPath, docString, addNotification } = props;

frontend/src/components/NumberComponent.tsx

@@ -32,7 +32,7 @@ export type FloatObject = {
 };
 export type NumberObject = IntObject | FloatObject | QuantityObject;
 
-interface NumberComponentProps {
+type NumberComponentProps = {
   name: string;
   type: 'float' | 'int';
   parentPath?: string;
@@ -43,7 +43,7 @@ interface NumberComponentProps {
   unit?: string;
   showName?: boolean;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 // TODO: highlight the digit that is being changed by setting both selectionStart and
 // selectionEnd

frontend/src/components/SliderComponent.tsx

@@ -8,7 +8,7 @@ import { NumberComponent, NumberObject } from './NumberComponent';
 import { getIdFromFullAccessPath } from '../utils/stringUtils';
 import { LevelName } from './NotificationsComponent';
 
-interface SliderComponentProps {
+type SliderComponentProps = {
   name: string;
   min: NumberObject;
   max: NumberObject;
@@ -19,7 +19,7 @@ interface SliderComponentProps {
   stepSize: NumberObject;
   isInstantUpdate: boolean;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const SliderComponent = React.memo((props: SliderComponentProps) => {
   const renderCount = useRef(0);

frontend/src/components/StringComponent.tsx

@@ -9,7 +9,7 @@ import { WebSettingsContext } from '../WebSettings';
 
 // TODO: add button functionality
 
-interface StringComponentProps {
+type StringComponentProps = {
   name: string;
   parentPath?: string;
   value: string;
@@ -17,7 +17,7 @@ interface StringComponentProps {
   docString: string;
   isInstantUpdate: boolean;
   addNotification: (message: string, levelname?: LevelName) => void;
-}
+};
 
 export const StringComponent = React.memo((props: StringComponentProps) => {
   const { name, parentPath, readOnly, docString, isInstantUpdate, addNotification } =