Added description tooltip to Boolean Widget (#290)

* Added description tooltip to Boolean Widget

* Cleanup code smell

* smell is required. Added default value for const

cockpit/IPC/src/Components/Form/BoolWidget.tsx

@@ -0,0 +1,64 @@
+/* eslint-disable import/prefer-default-export */
+import React, { useEffect, useState } from 'react';
+import { FormControlLabel, Switch, Tooltip } from '@mui/material';
+import {
+  TransTitle, WidgetProps, WithValue, useUIStore,
+} from '@ui-schema/ui-schema';
+import { MuiWidgetBinding } from '@ui-schema/ds-material/widgetsBinding';
+import { useUID } from 'react-uid';
+
+export function BooleanWidget<P extends WidgetProps<MuiWidgetBinding> = WidgetProps<MuiWidgetBinding>>({
+  storeKeys, schema, onChange,
+}: P & WithValue): React.ReactElement {
+  const uid = useUID();
+  const { store } = useUIStore();
+
+  function getNestedValue(obj: any, path: any) {
+    console.log('getNestedValue: ', obj, path);
+    console.log('getNestedValueRES: ', path.reduce((xs: any, x: any) => (xs && xs[x] ? xs[x] : false), obj));
+    return path.reduce((xs: any, x: any) => (xs && xs[x] ? xs[x] : false), obj);
+  }
+
+  const [value, setValue] = useState<boolean>(getNestedValue(store?.toJS().values, storeKeys.toJS()));
+  const isConst = schema.get('const') as boolean ?? false;
+
+  useEffect(() => {
+    if (isConst) {
+      setValue(getNestedValue(store?.toJS().values, storeKeys.toJS()));
+    }
+  }, [store]);
+
+  const handleToggle = (event: React.ChangeEvent<HTMLInputElement>) => {
+    setValue(event.target.checked);
+    onChange({
+      storeKeys,
+      scopes: ['value'],
+      type: 'set',
+      schema,
+      required: schema.get('required') as boolean,
+      data: { value: event.target.checked },
+    });
+  };
+
+  const description = schema.get('description') as string;
+
+  return (
+    // eslint-disable-next-line react/jsx-no-useless-fragment
+    isConst ? <></>
+      : (
+        <Tooltip title={description || ''}>
+          <FormControlLabel
+            control={(
+              <Switch
+                checked={value}
+                onChange={handleToggle}
+                color="primary"
+                id={`uis-${uid}`}
+              />
+        )}
+            label={schema.get('title') as string ?? <TransTitle schema={schema} storeKeys={storeKeys} />}
+          />
+        </Tooltip>
+      )
+  );
+}

cockpit/IPC/src/Components/Form/Form.tsx

@@ -26,6 +26,7 @@ import Immutable from 'immutable';
 import { AlertVariant, Button } from '@patternfly/react-core';
 import { WidgetProps as BaseWidgetProps } from '@ui-schema/ui-schema/Widget';
 import { UnitWidget } from './UnitWidget';
+import { BooleanWidget } from './BoolWidget';
 import { VariantWidget } from './VariantWidget';
 import { useAlertContext } from '../Alert/AlertContext';
 
@@ -52,6 +53,7 @@ export default function FormGenerator(
       ...widgets.custom,
       Units: UnitWidget as React.FunctionComponent<ExtendedWidgetProps>,
       Variant: VariantWidget as React.FunctionComponent<ExtendedWidgetProps>,
+      Boolean: BooleanWidget as React.FunctionComponent<ExtendedWidgetProps>,
     } as CustomWidgetBinding,
     pluginSimpleStack: validators,
   };
@@ -98,6 +100,8 @@ export default function FormGenerator(
       json[key].widget = 'Units';
     } else if (type.includes('string')) {
       json[key].widget = 'Text';
+    } else if (type.includes('boolean')) {
+      json[key].widget = 'Boolean';
     } else if (type.includes('array')) {
       json[key].widget = 'GenericList';
       json[key].notSortable = true;