From 7279fed2aa39e1ad8ee5ccab4e5565be33d6d51d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mose=20M=C3=BCller?= <mosemueller@gmail.com>
Date: Tue, 23 Jan 2024 13:13:50 +0100
Subject: [PATCH] frontend will can now display any serialization dict

---
 frontend/src/App.tsx             | 17 +++++++++--------
 frontend/src/utils/stateUtils.ts |  7 ++++++-
 2 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index bfeabd1..13cfc91 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,10 +1,6 @@
 import { useCallback, useEffect, useReducer, useState } from 'react';
 import { Navbar, Form, Offcanvas, Container } from 'react-bootstrap';
 import { hostname, port, socket } from './socket';
-import {
-  DataServiceComponent,
-  DataServiceJSON
-} from './components/DataServiceComponent';
 import './App.css';
 import {
   Notifications,
@@ -14,6 +10,7 @@ import {
 import { ConnectionToast } from './components/ConnectionToast';
 import { SerializedValue, setNestedValueByPath, State } from './utils/stateUtils';
 import { WebSettingsContext, WebSetting } from './WebSettings';
+import { Attribute, GenericComponent } from './components/GenericComponent';
 
 type Action =
   | { type: 'SET_DATA'; data: State }
@@ -35,7 +32,10 @@ const reducer = (state: State, action: Action): State => {
     case 'SET_DATA':
       return action.data;
     case 'UPDATE_ATTRIBUTE': {
-      return setNestedValueByPath(state, action.fullAccessPath, action.newValue);
+      return {
+        ...state,
+        value: setNestedValueByPath(state.value, action.fullAccessPath, action.newValue)
+      };
     }
     default:
       throw new Error();
@@ -184,9 +184,10 @@ const App = () => {
 
       <div className="App navbarOffset">
         <WebSettingsContext.Provider value={webSettings}>
-          <DataServiceComponent
-            name={''}
-            props={state as DataServiceJSON}
+          <GenericComponent
+            name=""
+            parentPath=""
+            attribute={state as Attribute}
             isInstantUpdate={isInstantUpdate}
             addNotification={addNotification}
           />
diff --git a/frontend/src/utils/stateUtils.ts b/frontend/src/utils/stateUtils.ts
index 06e491d..474daea 100644
--- a/frontend/src/utils/stateUtils.ts
+++ b/frontend/src/utils/stateUtils.ts
@@ -6,7 +6,12 @@ export interface SerializedValue {
   async?: boolean;
   parameters?: unknown;
 }
-export type State = Record<string, SerializedValue> | null;
+export type State = {
+  type: string;
+  value: Record<string, SerializedValue> | null;
+  readonly: boolean;
+  doc: string | null;
+};
 
 export function setNestedValueByPath(
   serializationDict: Record<string, SerializedValue>,