changover to use the components settings and not the prefs

src/component/ComponentCard.tsx

@@ -285,7 +285,7 @@ export default function ComponentCard(props: Props) {
           // ) : (
             <UnitMeasurementSummary
               component={component}
-              excludedNodes={deviceComponentPreferences?.excludedNodes}
+              excludedNodes={component.settings.excludedNodes}
               reading={UnitMeasurement.convertLastMeasurement(measurements)}
               //dense
             />

src/component/ComponentChart.tsx

@@ -148,7 +148,7 @@ export default function ComponentChart(props: Props) {
 
   //use the excluded nodes to set the default for the graph filters
   useEffect(() => {
-    let excludedNodes = deviceComponentPreferences?.excludedNodes;
+    let excludedNodes = component.settings.excludedNodes;
     if (excludedNodes === undefined || excludedNodes.length === 0) return;
     let updatedFilters = cloneDeep(graphFilters);
     if (excludedNodes && component.lastMeasurement[0]) {
@@ -165,7 +165,7 @@ export default function ComponentChart(props: Props) {
       updatedFilters.selectedNodes = includedNodes;
     }
     setGraphFilters(updatedFilters);
-  }, [deviceComponentPreferences, component]); //eslint-disable-line react-hooks/exhaustive-deps
+  }, [component]); //eslint-disable-line react-hooks/exhaustive-deps
 
   const updateDateRange = (newStartDate: any, newEndDate: any, live: boolean) => {
     setStartDate(newStartDate);
@@ -211,10 +211,11 @@ export default function ComponentChart(props: Props) {
   };
 
   const cableControls = () => {
-    const { component, samples, deviceComponentPreferences } = props;
-    const excludedNodes = deviceComponentPreferences?.excludedNodes ?? [];
+    const { component, samples } = props;
     const selectedNodes = graphFilters.selectedNodes ? graphFilters.selectedNodes : ["all"];
     const lastMeasurement = component.status.lastMeasurement;
+    const excludedNodes = component.settings.excludedNodes ?? [];
+    
     let numNodes = 0;
     if (samples) {
       numNodes = GetNumNodes(
@@ -322,7 +323,7 @@ export default function ComponentChart(props: Props) {
                 checked={selectedNodes.includes((i - 1).toString()) ? true : false}
                 onChange={handleGrainCableControlsChange((i - 1).toString())}
                 value={(i - 1).toString()}
-                disabled={excludedNodes.includes(i - 1)}
+                //disabled={excludedNodes.includes(i - 1)}
               />
             }
             label={<Typography variant="body2">{nodeLabel}</Typography>}
@@ -724,7 +725,7 @@ export default function ComponentChart(props: Props) {
                 <UnitMeasurementSummary
                   component={component}
                   reading={convertedLastMeasurement}
-                  excludedNodes={deviceComponentPreferences?.excludedNodes}
+                  excludedNodes={component.settings.excludedNodes}
                 />
               </Card>
             )}
@@ -764,7 +765,7 @@ export default function ComponentChart(props: Props) {
                       reading={convertedLastMeasurement}
                       largeText
                       boldMeasurements
-                      excludedNodes={deviceComponentPreferences?.excludedNodes}
+                      excludedNodes={component.settings.excludedNodes}
                     />
                   </Card>
                 )}

src/component/ComponentSettings.tsx

@@ -180,11 +180,11 @@ export default function ComponentSettings(props: Props) {
     setTabVal(newValue);
   };
 
-  useEffect(() => {
-    if (deviceComponentPrefs) {
-      setExcludedNodes(deviceComponentPrefs.excludedNodes);
-    }
-  }, [deviceComponentPrefs]);
+  // useEffect(() => {
+  //   if (deviceComponentPrefs) {
+  //     setExcludedNodes(deviceComponentPrefs.excludedNodes);
+  //   }
+  // }, [deviceComponentPrefs]);
 
   const init = useCallback(() => {
     let component = props.component;
@@ -207,6 +207,7 @@ export default function ComponentSettings(props: Props) {
       )
     );
     setFormComponent(initComponent);
+    setExcludedNodes(initComponent.settings.excludedNodes)
   }, [props.component, componentTypeOptions]);
 
   useEffect(() => {
@@ -238,7 +239,6 @@ export default function ComponentSettings(props: Props) {
     componentType: quack.ComponentType
   ): number[] => {
     let positions = availablePositions.get(addressType);
-    console.log(positions)
     if (!positions) return [];
     switch (addressType) {
       case quack.AddressType.ADDRESS_TYPE_I2C:
@@ -320,20 +320,21 @@ export default function ComponentSettings(props: Props) {
 
   const updateComponent = () => {
     const component = formComponent;
+    component.settings.excludedNodes = excludedNodes
     componentAPI
       .update(device.id(), component.settings, getContextKeys(), getContextTypes(), as)
       .then((_response: any) => {
         success(component.name() + " was successfully updated!");
-        let updatedPrefs = pond.DeviceComponentPreferences.create();
-        updatedPrefs.excludedNodes = excludedNodes;
-        deviceAPI
-          .updateComponentPreferences(device.id(), component.key(), updatedPrefs, undefined, undefined, as)
-          .then(_resp => {
-            console.log("Preferences updated");
-          })
-          .catch(_err => {
-            console.log("Preferences failed to update");
-          });
+        // let updatedPrefs = pond.DeviceComponentPreferences.create();
+        // updatedPrefs.excludedNodes = excludedNodes;
+        // deviceAPI
+        //   .updateComponentPreferences(device.id(), component.key(), updatedPrefs, undefined, undefined, as)
+        //   .then(_resp => {
+        //     console.log("Preferences updated");
+        //   })
+        //   .catch(_err => {
+        //     console.log("Preferences failed to update");
+        //   });
         refresh();
       })
       .catch((_err: any) => {
@@ -413,7 +414,6 @@ export default function ComponentSettings(props: Props) {
     for (let i = 0; i < addressTypes.length; i++) {
       let addressType = addressTypes[i];
       let availablePositions = getAvailablePositions(addressType, type);
-      console.log(availablePositions)
 
       availableMenuItemPositions.push(
         <MenuItem key={addressType} divider disabled>
@@ -976,24 +976,6 @@ export default function ComponentSettings(props: Props) {
           }}>
           Clear Excluded Nodes
         </Button>
-        {/* button for testing the pref update */}
-        {/* {prevComponent && (
-          <Button
-            onClick={() => {
-              let pref = pond.DeviceComponentPreferences.create();
-              pref.excludedNodes = excludedNodes;
-              deviceAPI
-                .updateComponentPreferences(device.id(), prevComponent.key(), pref)
-                .then(resp => {
-                  console.log("no errors");
-                })
-                .catch(err => {
-                  console.log("errors");
-                });
-            }}>
-            Update Prefs
-          </Button>
-        )} */}
       </Box>
     );
   };
@@ -1019,7 +1001,7 @@ export default function ComponentSettings(props: Props) {
                   onChange={handleChange}>
                   <Tab label="General" />
                   <Tab label="Overlays" />
-                  <Tab label="Preferences" disabled={!prevComponent} />
+                  <Tab label="Nodes" disabled={!prevComponent} />
                 </Tabs>
               )}
               <TabPanelMine value={tabVal} index={0}>

src/pages/DeviceComponent.tsx

@@ -487,7 +487,7 @@ export default function DeviceComponent() {
               component={component}
               reading={row}
               tableCell={true}
-              excludedNodes={deviceComponentPrefs?.excludedNodes}
+              excludedNodes={component.settings.excludedNodes}
             />
           )
         }
@@ -528,7 +528,7 @@ export default function DeviceComponent() {
   //                 component={component}
   //                 reading={row}
   //                 tableCell={true}
-  //                 excludedNodes={deviceComponentPrefs?.excludedNodes}
+  //                 excludedNodes={component.settings.excludedNodes}
   //               />
   //             )
   //           }