✨ (rating) Add one click submit option

Closes #187

apps/builder/src/features/blocks/inputs/rating/components/RatingInputSettings.tsx

@@ -42,6 +42,9 @@ export const RatingInputSettings = ({
   const handleVariableChange = (variable?: Variable) =>
     onOptionsChange({ ...options, variableId: variable?.id })
 
+  const handleOneClickSubmitChange = (isOneClickSubmitEnabled: boolean) =>
+    onOptionsChange({ ...options, isOneClickSubmitEnabled })
+
   return (
     <Stack spacing={4}>
       <Stack>
@@ -108,6 +111,12 @@ export const RatingInputSettings = ({
           placeholder="Extremely likely"
         />
       </Stack>
+      <SwitchWithLabel
+        label="One click submit"
+        moreInfoContent='If enabled, the answer will be submitted as soon as the user clicks on a rating instead of showing the "Send" button.'
+        initialValue={options.isOneClickSubmitEnabled ?? false}
+        onCheckChange={handleOneClickSubmitChange}
+      />
       <Stack>
         <FormLabel mb="0" htmlFor="button">
           Button label:

apps/builder/src/features/blocks/inputs/rating/index.ts

@@ -1,3 +1,3 @@
-export { RatingInputSettings } from './components/RatingInputSettingsBody'
+export { RatingInputSettings } from './components/RatingInputSettings'
 export { RatingInputContent } from './components/RatingInputContent'
 export { RatingInputIcon } from './components/RatingInputIcon'

apps/builder/src/features/blocks/inputs/rating/rating.spec.ts

@@ -40,6 +40,7 @@ test('options should work', async ({ page }) => {
   await page.click('text=Rate from 0 to 10')
   await page.click('text="10"')
   await page.click('text="5"')
+  await page.getByText('One click submit').click()
   await page.click('text=Numbers')
   await page.click('text=Icons')
   await page.click('text="Custom icon?"')
@@ -56,6 +57,5 @@ test('options should work', async ({ page }) => {
     typebotViewer(page).locator(`text=Extremely likely`)
   ).toBeVisible()
   await typebotViewer(page).locator(`svg >> nth=4`).click()
-  await typebotViewer(page).locator(`text=Send`).click()
   await expect(typebotViewer(page).locator(`text=5`)).toBeVisible()
 })

packages/bot-engine/src/features/blocks/inputs/rating/components/RatingForm.tsx

@@ -18,7 +18,11 @@ export const RatingForm = ({ block, onSubmit }: Props) => {
     onSubmit({ value: rating.toString() })
   }
 
-  const handleClick = (rating: number) => setRating(rating)
+  const handleClick = (rating: number) => {
+    if (block.options.isOneClickSubmitEnabled)
+      onSubmit({ value: rating.toString() })
+    setRating(rating)
+  }
 
   return (
     <form className="flex flex-col" onSubmit={handleSubmit}>

packages/js/src/features/blocks/inputs/rating/components/RatingForm.tsx

@@ -21,7 +21,11 @@ export const RatingForm = (props: Props) => {
     props.onSubmit({ value: rating.toString() })
   }
 
-  const handleClick = (rating: number) => setRating(rating)
+  const handleClick = (rating: number) => {
+    if (props.block.options.isOneClickSubmitEnabled)
+      props.onSubmit({ value: rating.toString() })
+    setRating(rating)
+  }
 
   return (
     <form class="flex flex-col" onSubmit={handleSubmit}>

packages/models/src/features/blocks/inputs/rating.ts

@@ -26,6 +26,7 @@ export const ratingInputOptionsSchema = optionBaseSchema.and(
       isEnabled: z.boolean(),
       svg: z.string().optional(),
     }),
+    isOneClickSubmitEnabled: z.boolean().optional(),
   })
 )