fixed frontend login authentication progress problem

config/config.yml

@@ -1,3 +1,4 @@
+---  # config
 log:
   level: debug
   file: 'hanectl.log'

config/devices.yml

@@ -1,3 +1,4 @@
+---  # devices
 devices:
   - type: light
     device_key: licht-arbeitszimmer

config/notifications.yml

@@ -1,3 +1,4 @@
+---  # notifications
 notifications:
   - device_key: socket-washer
     trigger: change

frontend/src/component/auth/auth.tsx

@@ -13,7 +13,7 @@ export default function Authenticator(params: AuthenticatorParams) {
     const services = useServices();
     const [progress, setProgress] = useState(true);
     const [authenticated, setAuthenticated] = useState(false);
-    const [children, setChildren] = useState(null);
+    const [content, setContent] = useState(null);
 
     useEffect(() => {
             const sub = services.auth().authenticated().subscribe({
@@ -23,24 +23,25 @@ export default function Authenticator(params: AuthenticatorParams) {
                     setProgress(val => false);
                 }
             });
-        return sub.unsubscribe();
+        return () => sub.unsubscribe();
     }, [services]);
 
     useEffect(() => {
         const subs = services.auth().isAuthenticated().subscribe((val: boolean) => {
-            setAuthenticated(() => val);
-            if(val && children === null) {
-                setChildren(() => factory());
+            if(val && content === null) {
+                setContent(() => factory());
             }
+            setProgress(!val);
+            setAuthenticated(() => val);
         });
         return () => subs.unsubscribe();
-    }, [services, factory, children]);
+    }, [services, factory, content]);
 
     if (progress) {
          return <Spinner loading={progress}/>;
      }
     if (authenticated) {
-        return  children;
+        return  content;
     }
     return <Login/>
 }

frontend/src/component/devices/devices.tsx

@@ -48,13 +48,13 @@ export default function Devices(params: DevicesProperties) {
     const setRoomsConfig = useMemo(() => (roomsCfg: IRoomConfig, devCfg: IDeviceConfig) => {
         const newRooms = DevicesUtils.createRooms(roomsCfg, devCfg);
         const tabsDef = DevicesUtils.createTabsetDef(newRooms);
-        let tabs: React.ReactNode;
+        let roomTabs: React.ReactNode;
         if (tabsDef && tabsDef.length) {
-            tabs =
+            roomTabs =
                 <TabSet ref={tabsetRef} index={tabIndex} tabs={tabsDef} rolling={true} onChange={changeTabIndex}/>
         }
         setRooms(() => newRooms)
-        setTabs(() => tabs);
+        setTabs(() => roomTabs);
     }, [changeTabIndex, tabIndex]);
 
 
@@ -117,6 +117,8 @@ export default function Devices(params: DevicesProperties) {
         ...DevicesUtils.swipeOptions,
     });
 
+    console.log('dev', devicesConfig?.devices);
+
     return <div className={"devices-container"} {...handlers}>
         <div className={"tabs-panel"}>{tabs}</div>
         <div className={"devices-panel"} {...handlers}>