From 6943e394e58fd5cdc139ba0988082428a83aa19a Mon Sep 17 00:00:00 2001
From: soumya pratik <soumyapratik018@gmail.com>
Date: Thu, 26 Sep 2024 17:01:08 +0530
Subject: [PATCH 1/2] feat(client): added tooltip to block settings

---
 .../block-defaults/select-block/config.tsx        |  1 +
 .../block-defaults/text-block/config.tsx          |  1 +
 .../block-settings/BaseSettingSection.tsx         | 15 ++++++++++++++-
 .../block-settings/shared/SwitchSettings.tsx      |  8 +++++++-
 4 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/block-defaults/select-block/config.tsx b/packages/client/src/components/block-defaults/select-block/config.tsx
index 9e009c9bec..06ec53f2d8 100644
--- a/packages/client/src/components/block-defaults/select-block/config.tsx
+++ b/packages/client/src/components/block-defaults/select-block/config.tsx
@@ -52,6 +52,7 @@ export const config: BlockConfig<SelectBlockDef> = {
                             id={id}
                             label="Enable Multi Select"
                             path="multiple"
+                            description="This setting will enable the multi-select feature on the select input"
                         />
                     ),
                 },
diff --git a/packages/client/src/components/block-defaults/text-block/config.tsx b/packages/client/src/components/block-defaults/text-block/config.tsx
index a2a1ce9405..be86e9356c 100644
--- a/packages/client/src/components/block-defaults/text-block/config.tsx
+++ b/packages/client/src/components/block-defaults/text-block/config.tsx
@@ -46,6 +46,7 @@ export const config: BlockConfig<TextBlockDef> = {
                             id={id}
                             label="Enable Typewriting Effect"
                             path="isStreaming"
+                            description="This setting will enable the typewriting effect on the text"
                         />
                     ),
                 },
diff --git a/packages/client/src/components/block-settings/BaseSettingSection.tsx b/packages/client/src/components/block-settings/BaseSettingSection.tsx
index 64b7c0f33b..2e6cf215ee 100644
--- a/packages/client/src/components/block-settings/BaseSettingSection.tsx
+++ b/packages/client/src/components/block-settings/BaseSettingSection.tsx
@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
-import { styled, Stack, Typography } from '@semoss/ui';
+import { styled, Stack, Typography, Tooltip } from '@semoss/ui';
+import HelpOutlineIcon from '@mui/icons-material/HelpOutline';
 
 const StyledTypography = styled(Typography)(() => ({
     width: '30%',
@@ -13,6 +14,7 @@ export const BaseSettingSection = (props: {
     label: string;
     children: ReactNode;
     wide?: boolean;
+    description?: string;
 }) => {
     return (
         <Stack
@@ -22,6 +24,17 @@ export const BaseSettingSection = (props: {
             spacing={2}
         >
             <StyledTypography variant="body2">{props.label}</StyledTypography>
+            {!!props.description?.length && (
+                <Tooltip placement="top" title={props.description} arrow>
+                    <HelpOutlineIcon
+                        color="action"
+                        sx={{
+                            fontSize: 15,
+                            marginLeft: '5px',
+                        }}
+                    />
+                </Tooltip>
+            )}
             <Stack
                 direction="row"
                 justifyContent="end"
diff --git a/packages/client/src/components/block-settings/shared/SwitchSettings.tsx b/packages/client/src/components/block-settings/shared/SwitchSettings.tsx
index ccb2dc5221..e3134c7215 100644
--- a/packages/client/src/components/block-settings/shared/SwitchSettings.tsx
+++ b/packages/client/src/components/block-settings/shared/SwitchSettings.tsx
@@ -25,12 +25,18 @@ interface SwitchSettingsProps<D extends BlockDef = BlockDef> {
     path: Paths<Block<D>['data'], 4>;
 
     resetValueOnChange?: boolean;
+
+    /**
+     * Desciption that will show on tooltip, to inform user about the setting
+     */
+    description?: string;
 }
 
 export const SwitchSettings = observer(
     <D extends BlockDef = BlockDef>({
         id,
         label = '',
+        description = '',
         path,
         resetValueOnChange = false,
     }: SwitchSettingsProps<D>) => {
@@ -97,7 +103,7 @@ export const SwitchSettings = observer(
         };
 
         return (
-            <BaseSettingSection label={label}>
+            <BaseSettingSection label={label} description={description}>
                 <Switch
                     checked={value}
                     onChange={(e) => {

From 2340f5b612bdecb0bf8658a2f70c935c44c651a5 Mon Sep 17 00:00:00 2001
From: Baxter <johbaxter@deloitte.com>
Date: Mon, 30 Sep 2024 10:58:04 -0400
Subject: [PATCH 2/2] perf(client): add tooltip to rows on InputSettings

---
 .../src/components/block-defaults/input-block/config.tsx  | 1 +
 .../components/block-settings/shared/InputSettings.tsx    | 8 +++++++-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/client/src/components/block-defaults/input-block/config.tsx b/packages/client/src/components/block-defaults/input-block/config.tsx
index e6009a5293..2499aa070f 100644
--- a/packages/client/src/components/block-defaults/input-block/config.tsx
+++ b/packages/client/src/components/block-defaults/input-block/config.tsx
@@ -101,6 +101,7 @@ export const config: BlockConfig<InputBlockDef> = {
                             label="Rows"
                             path="rows"
                             type="number"
+                            description="This will determine how many rows are displayed on text input"
                         />
                     ),
                 },
diff --git a/packages/client/src/components/block-settings/shared/InputSettings.tsx b/packages/client/src/components/block-settings/shared/InputSettings.tsx
index 4c6a1e2783..0e8ceaba6a 100644
--- a/packages/client/src/components/block-settings/shared/InputSettings.tsx
+++ b/packages/client/src/components/block-settings/shared/InputSettings.tsx
@@ -36,6 +36,11 @@ interface InputSettingsProps<D extends BlockDef = BlockDef> {
      * Parse input as object to set value
      */
     valueAsObject?: boolean;
+
+    /**
+     * What to be displayed on the tooltip to explain setting
+     */
+    description?: string;
 }
 
 export const InputSettings = observer(
@@ -46,6 +51,7 @@ export const InputSettings = observer(
         secondaryPath = undefined,
         type = 'text',
         valueAsObject = false,
+        description,
     }: InputSettingsProps<D>) => {
         const { data, setData } = useBlockSettings<D>(id);
 
@@ -124,7 +130,7 @@ export const InputSettings = observer(
         };
 
         return (
-            <BaseSettingSection label={label}>
+            <BaseSettingSection label={label} description={description}>
                 <TextField
                     fullWidth
                     value={value}