frontend: updating App.tsx

This commit is contained in:
Mose Müller 2023-08-02 12:06:19 +02:00
parent b8fffb5e8b
commit ca4bb85be0

View File

@ -1,7 +1,8 @@
import { useEffect, useReducer } from 'react'; import { useEffect, useReducer } from 'react';
import { Component, ComponentLabel } from './components/component'; import { Component, ComponentLabel } from './components/component';
import { ButtonComponent } from './components/button'; import { ButtonComponent } from './components/ButtonComponent';
import { socket } from './socket'; import { socket } from './socket';
import { NumberComponent } from './components/NumberComponent';
type AttributeType = 'str' | 'bool' | 'float' | 'int' | 'method' | 'Subclass'; type AttributeType = 'str' | 'bool' | 'float' | 'int' | 'method' | 'Subclass';
@ -65,17 +66,11 @@ const reducer = (state: State, action: Action): State => {
switch (action.type) { switch (action.type) {
case 'SET_DATA': case 'SET_DATA':
return action.data; return action.data;
case 'UPDATE_ATTRIBUTE': case 'UPDATE_ATTRIBUTE': {
if (!state) { const path = action.parent_path.split('.').slice(1).concat(action.name);
console.log('No state is set');
return state;
}
{
const path = action.parent_path.split('.').slice(1).concat(action.name);
console.log(path);
return updateNestedObject(path, state, action.value); return updateNestedObject(path, state, action.value);
} }
default: default:
throw new Error(); throw new Error();
} }
@ -119,18 +114,44 @@ const App = () => {
<div key={key}> <div key={key}>
<ButtonComponent <ButtonComponent
name={key} name={key}
parent_path="DataService"
docString={value.doc} docString={value.doc}
readOnly={value.readonly} readOnly={value.readonly}
value={Boolean(value.value)} value={Boolean(value.value)}
/> />
</div> </div>
); );
} else if (value.type === 'int') {
return (
<div key={key}>
<NumberComponent
name={key}
parent_path="DataService"
docString={value.doc}
readOnly={value.readonly}
value={Number(value.value)}
/>
</div>
);
} else if (value.type === 'float') {
return (
<div key={key}>
<NumberComponent
name={key}
parent_path="DataService"
docString={value.doc}
readOnly={value.readonly}
value={Number(value.value)}
/>
</div>
);
} else if (!value.async) { } else if (!value.async) {
return ( return (
<div key={key}> <div key={key}>
<ComponentLabel name={key} docString={value.doc} /> <ComponentLabel name={key} docString={value.doc} />
<Component <Component
name={key} name={key}
parent_path="DataService"
value={value.value} value={value.value}
readOnly={value.readonly} readOnly={value.readonly}
type={value.type} type={value.type}