improve documentation, get interfaceName from Channels

README.md

@@ -22,13 +22,13 @@ This project is built with a robust set of technologies to ensure high performan
 
 # Prerequisites
 
-For this add-on to work, it is necessary to have rooms configured in your CCU3. These rooms should have channels assigned to them, and these channels should have appropriate names. Without this setup, the add-on is not working as expected.
+For this add-on to function properly, it is necessary to have rooms configured in your CCU3. These rooms should have channels assigned to them, and these channels should have appropriate names. This is because the add-on queries the rooms, their channels, and in turn, the datapoints of those channels. Without this setup, the add-on will not work as expected.
 
 # Efficiency
 
 The WebApp uses the same JSON-RPC interface as the CCU3.
 
-To optimize performance we've tailored [Rega Scripts with Github Copilot](/apps/ccu-addon-mui/src/rega) to fetch data in the exact structure required by our Webapp.
+To optimize performance we've tailored [RegaScripts](/apps/ccu-addon-mui/src/rega) to fetch data in the exact structure required by our Webapp.
 
 In addition, we are utilizing [React-Query](https://react-query.tanstack.com/), adhering to their best practices to ensure our data requests are as efficient as possible.
 
@@ -52,17 +52,20 @@ To develop and build this project, follow these steps:
 1. Clone the repository: `git clone https://github.com/ccu-addon-mui.git`
 2. Navigate into the project directory: `cd ccu-addon-mui`
 3. Install the dependencies: `npm install`
-4. Set your CCU3 IP in: `apps/ccu-addon-mui/proxy.config.json`
-5. Currently InterfaceName (HmIP-RF) is fix in: `apps/ccu-addon-mui/src/hooks/useApi.ts` (line 7)
-6. Start the development server: `npm start`
-7. To build the project, use: `npm run build`
+4. Set your CCU3 IP in: [proxy.config.json](apps/ccu-addon-mui/proxy.config.json)
+5. Start the development server: `npm start`
+6. To build the project, use: `npm run build`
 
 # Issues
 
 Want to start contributing to this project? 
 
 Please visit our [issues page](https://github.com/your-repo-name/issues) for the latest issues and feature requests.
 
+# Homematic API Summary
+
+[API Docs](/docs/api/README.md)
+
 # Currently supported devices
 
 - [Light](/apps/ccu-addon-mui/src/app/LightControl.tsx)

apps/ccu-addon-mui/src/app/BlindsControl.tsx

@@ -1,5 +1,5 @@
 import { Box, IconButton, ListItemText, Typography } from '@mui/material';
-import { BlindVirtualReceiverChannel, interfaceName, useSetValueMutation } from '../hooks/useApi';
+import { BlindVirtualReceiverChannel, useSetValueMutation } from '../hooks/useApi';
 import BlindsOutlinedIcon from '@mui/icons-material/BlindsOutlined';
 import BlindsClosedIcon from '@mui/icons-material/BlindsClosed';
 import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
@@ -14,9 +14,8 @@ export const BlindsControl = ({
   channel
 }: ControlProps) => {
   const setValueMutation = useSetValueMutation();
-  const blindValue = Number(channel.datapoints.LEVEL);
-  const name = channel.name;
-  const address = channel.address;
+  const { datapoints, name, address, interfaceName } = channel;
+  const blindValue = Number(datapoints.LEVEL);
   return (
     <>
       {blindValue === 1 ? <BlindsOutlinedIcon /> : <BlindsClosedIcon />}

apps/ccu-addon-mui/src/app/LightControl.tsx

@@ -1,5 +1,5 @@
 import { ListItemText, Switch } from '@mui/material';
-import { SwitchVirtualReceiverChannel, SwitchVirtualReceiverDatapoint, interfaceName, useGetValue, useSetValueMutation } from '../hooks/useApi';
+import { SwitchVirtualReceiverChannel, useSetValueMutation } from '../hooks/useApi';
 import LightbulbOutlinedIcon from '@mui/icons-material/LightbulbOutlined';
 import LightbulbIcon from '@mui/icons-material/Lightbulb';
 
@@ -13,8 +13,8 @@ export const LightControl = ({
 }: ControlProps) => {
 
   const setValueMutation = useSetValueMutation();
-  const { datapoints: { STATE }, name, address } = channel;
-  const checked = STATE === 'true';
+  const { datapoints, name, address, interfaceName } = channel;
+  const checked = datapoints.STATE === 'true';
 
   return (
     <>
@@ -47,9 +47,6 @@ export const LightControl = ({
           refetch();
         }}
         checked={checked}
-        inputProps={{
-          'aria-labelledby': 'switch-list-label-wifi',
-        }}
       />
     </>
   );

apps/ccu-addon-mui/src/app/Room.tsx

@@ -16,7 +16,6 @@ import { ThermostatControl } from './ThermostatControl';
 export const Room = () => {
   const { roomId } = useParams<{ roomId: string }>();
 
-
   const { data: channelsForRoom, refetch, isLoading } = useGetChannelsForRoom(Number(roomId));
 
   if(isLoading) {

apps/ccu-addon-mui/src/app/ThermostatControl.tsx

@@ -6,7 +6,7 @@ import {
   Typography,
 } from '@mui/material';
 
-import { HeatingClimateControlTransceiverChannel, interfaceName, useSetValueMutation } from '../hooks/useApi';
+import { HeatingClimateControlTransceiverChannel, useSetValueMutation } from '../hooks/useApi';
 import ThermostatOutlinedIcon from '@mui/icons-material/ThermostatOutlined';
 import ThermostatAutoIcon from '@mui/icons-material/ThermostatAuto';
 import WaterDamageOutlinedIcon from '@mui/icons-material/WaterDamageOutlined';
@@ -36,13 +36,13 @@ export const ThermostatControl = ({
     },
   ];
 
-  const value = channel.datapoints;
-  const name = channel.name;
-  const address = channel.address;
+  const { datapoints, name, address, interfaceName } = channel;
+  const setPointModevalue = Number(datapoints?.SET_POINT_MODE ?? 0);
+  const setPoinTemperaturevalue = Number(datapoints?.SET_POINT_TEMPERATURE ?? 0);
+
   const setValueMutation = useSetValueMutation();
-  const setPoinTemperaturevalue = Number(value?.SET_POINT_TEMPERATURE ?? 0);
+
   const [pointTemp, setPointTemp] = useState<number>(setPoinTemperaturevalue);
-  const setPointModevalue = Number(value?.SET_POINT_MODE ?? 0);
   const [pointMode, setPointMode] = useState<number>(setPointModevalue);
 
   useEffect(() => {
@@ -58,10 +58,10 @@ export const ThermostatControl = ({
       <ThermostatOutlinedIcon
         sx={{
           color:
-            Number(value?.ACTUAL_TEMPERATURE) < 15
+            Number(datapoints?.ACTUAL_TEMPERATURE) < 15
               ? 'blue'
-              : Number(value?.ACTUAL_TEMPERATURE) > 15 &&
-                Number(value?.ACTUAL_TEMPERATURE) < 20
+              : Number(datapoints?.ACTUAL_TEMPERATURE) > 15 &&
+                Number(datapoints?.ACTUAL_TEMPERATURE) < 20
               ? 'orange'
               : 'red',
         }}
@@ -88,7 +88,7 @@ export const ThermostatControl = ({
           >
             <WaterDamageOutlinedIcon sx={{ marginRight: '3px' }} />
             <Typography variant="caption" sx={{ mr: 1 }}>
-              {value?.HUMIDITY ? Number(value?.HUMIDITY) : null}%
+              {datapoints?.HUMIDITY ? Number(datapoints?.HUMIDITY) : null}%
             </Typography>
             <IconButton
               sx={{ padding: 0, color: 'black' }}
@@ -106,8 +106,8 @@ export const ThermostatControl = ({
               {pointMode ? <ThermostatOutlinedIcon /> : <ThermostatAutoIcon />}
             </IconButton>
             <Typography variant="caption" sx={{}}>
-              {value?.ACTUAL_TEMPERATURE
-                ? Number(value?.ACTUAL_TEMPERATURE).toLocaleString('de-DE', {
+              {datapoints?.ACTUAL_TEMPERATURE
+                ? Number(datapoints?.ACTUAL_TEMPERATURE).toLocaleString('de-DE', {
                     maximumFractionDigits: 2,
                     minimumFractionDigits: 2,
                   })

apps/ccu-addon-mui/src/hooks/useApi.ts

@@ -63,6 +63,7 @@ interface BaseChannel {
   id: number;
   name: string;
   address: string;
+  interfaceName: string;
 }
 
 export interface SwitchVirtualReceiverChannel extends BaseChannel {

apps/ccu-addon-mui/src/rega/getChannelsForRoomId.tcl

@@ -15,7 +15,9 @@ foreach(channelId, roomObject.EnumUsedIDs()) {
     } else {
         isFirstChannel = false;
     }
-    Write('{"id": ' # channelId # ', "address": "' # channelObject.Address() # '", "name": "' # channelObject.Name() # '", "type": "' # channelObject.HssType() # '", "interface": "' # channelObject.Interface() # '", "datapoints":{');
+    var interface = dom.GetObject(channelObject.Interface());
+    var interfaceName = interface.Name();
+    Write('{"id": ' # channelId # ', "address": "' # channelObject.Address() # '", "name": "' # channelObject.Name() # '", "type": "' # channelObject.HssType() # '", "interfaceName": "' # interfaceName # '", "datapoints":{');
     isFirstDatapoint = true;
 
     foreach(datapointId, channelObject.DPs().EnumUsedIDs()) {