<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Introduced a new layout option for the TextInput component.
- Added support for GUMLET and TIKTOK video content types in
VideoBubbleContent.
- Enhanced VideoUploadContent to handle new properties like aspectRatio
and maxWidth.
- Updated VideoBubble to include aspect-ratio and max-width styles based
on content properties.
- **Refactor**
- Changed the extension used for internationalization (i18n) in the VS
Code environment.
- Modified how environment variables are accessed in tolgee.tsx.
- Updated parseVideoUrl function to include a new property
videoSizeSuggestion.
- **Chores**
- Updated the tolgeeEnv object in env.ts and added a new optional
parameter to the getRuntimeVariable function.
- Expanded video handling capabilities by introducing new video content
types and associated regular expressions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Closes#978#936#926
this PR fixes issue
https://github.com/baptisteArno/typebot.io/issues/1008 by making the
position of `HandDrawnArrow`'s parent relative, which confines the
absolute position of its children to be within the bounds of the parent,
causing layout not shift due to `right -30px`
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
- **New Features**
- Updated the layout behavior of the `RealTimeResults` component on the
landing page for better user experience.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- Refactor: Transitioned to a new translation library (`@tolgee/react`)
across the application, enhancing the localization capabilities and
consistency.
- New Feature: Introduced a JSON configuration file for application
settings, improving customization and flexibility.
- Refactor: Updated SVG attribute naming convention in the
`WhatsAppLogo` component to align with React standards.
- Chore: Adjusted the `.gitignore` file and added a new line at the end.
- Documentation: Added instructions for setting up environment variables
for the Tolgee i18n contribution dev tool, improving the self-hosting
configuration guide.
- Style: Updated the `CollaborationMenuButton` to hide the
`PopoverContent` component by scaling it down to zero.
- Refactor: Simplified error handling logic for fetching and updating
typebots in `TypebotProvider.tsx`, improving code readability and
maintenance.
- Refactor: Removed the dependency on the `parseGroupTitle` function,
simplifying the code in several components.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This PR fixes the flickering and improves the performance so panning
around the graph is much smoother than before.
https://github.com/baptisteArno/typebot.io/assets/62795688/56b91e20-1eb0-44b5-9a4a-c07525c2ba48
/claim #575
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- Refactor: Improved the Graph component's scaling calculation for
enhanced readability and maintenance.
- Style: Updated the Graph component's style properties to ensure better
compatibility and visual performance on webkit browsers.
These changes aim to enhance the user experience by ensuring the Graph
component displays consistently across different web browsers. The
refactoring of the scaling calculation also makes the code easier to
understand and maintain, potentially leading to quicker updates and bug
fixes in the future.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---------
Co-authored-by: Baptiste Arnaud <contact@baptiste-arnaud.fr>
/claim #667
The volume slider in audio element in windows chrome overflows.
Possible fixes:
1. Change the width of audio blocks. (Not suggested, as the width of all
blocks should be consistent)
2. Adjust the audio sub elements, so it doesn't overflow.(IMPLEMENTED)
It's not so straightforward to apply customization to audio tag element.
The best possible way I could find, to make the app look good, is by
hiding the timeline track in the audio. It was showing up very small
anyway(due to block width), so there shouldn't be an issue.
Please look at the before & after videos below.
https://github.com/baptisteArno/typebot.io/assets/29385192/f61c5b58-834d-470f-b684-bd82181e07f4https://github.com/baptisteArno/typebot.io/assets/29385192/88f932eb-dc7e-4346-bf64-6405a015013e
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- Style: Improved the visual layout of the audio player on Windows. The
update includes a cleaner interface by hiding the track timeline and
adjusting the media controls panel. This change enhances the user
experience by providing a more streamlined and intuitive audio player
design.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
**Fixed the drastic zoom increase decrease on ctrl + mouse scroll.**
The issue was occuring due to the "scale" property in the pinch gesture.
The scale was getting bigger values, leading to more zooming.
What I did was, made sure that maximum scale difference between current
and last value cannot be more than the scaling factor used in
zoomin/zoomout buttons. That is. 0.2
Also, the pinch zoom would work as expected.
/claim #567
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- Improvement: Enhanced zoom precision in the Graph component. This
update allows for more accurate scaling when adjusting the view in the
graph builder. The change ensures that the zoom level adjusts more
precisely, providing a smoother and more controlled user experience when
interacting with graphs.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
BREAKING CHANGE: Stripe environment variables simplified. Check out the
new configs to adapt your existing system.
Closes#906
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
**New Features:**
- Introduced a usage-based billing system, providing more flexibility
and options for users.
- Integrated with Stripe for a smoother and more secure payment process.
- Enhanced the user interface with improvements to the billing,
workspace, and pricing pages for a more intuitive experience.
**Improvements:**
- Simplified the billing logic, removing additional chats and yearly
billing for a more streamlined user experience.
- Updated email notifications to keep users informed about their usage
and limits.
- Improved pricing and currency formatting for better clarity and
understanding.
**Testing:**
- Updated tests and specifications to ensure the reliability of new
features and improvements.
**Note:** These changes aim to provide a more flexible and user-friendly
billing system, with clearer pricing and improved notifications. Users
should find the new system more intuitive and easier to navigate.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- New Feature: Updated WhatsApp logo with a new design and color scheme.
- New Feature: Added a help button in the UI linking to documentation,
enhancing user guidance.
- New Feature: Introduced an alert message indicating that the WhatsApp
integration is in beta testing.
- New Feature: Implemented a button to open WhatsApp Web directly from
the application, improving user convenience.
- Refactor: Adjusted the retrieval of `contactPhoneNumber` in
`receiveMessagePreview` function for better data structure
compatibility.
- Refactor: Optimized the initialization and management of the WhatsApp
session in `startWhatsAppPreview`.
- Refactor: Improved the `parseButtonsReply` function by refining
condition checks.
- Refactor: Enhanced the readability of serialized rich text in
`convertRichTextToWhatsAppText` by introducing newline characters.
- Bug Fix: Ensured preservation of `contact` information when resuming
the WhatsApp flow in `resumeWhatsAppFlow`.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
…bbles
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
**Release Notes**
- New Feature: Enhanced WhatsApp integration with improved phone number
formatting and session ID generation.
- Refactor: Updated the `startWhatsAppPreview` and
`receiveMessagePreview` functions for better consistency and
readability.
- Bug Fix: Added a check for `phoneNumberId` in the `receiveMessage`
function to prevent errors when it's undefined.
- Documentation: Expanded the WhatsApp integration guide and FAQs in the
docs, providing more detailed instructions and addressing common
queries.
- Chore: Introduced a new `metadata` field in the
`whatsAppWebhookRequestBodySchema` to store the `phone_number_id`.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
… string variables
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- Refactor: Updated `GoogleSheetsNodeContent` component to use the
`options` prop instead of `action`, and integrated the `useTypebot` hook
for better functionality.
- Style: Improved UI text and layout in `GoogleSheetsSettings.tsx`,
enhancing user experience when selecting rows.
- Refactor: Simplified rendering logic in `BlockNodeContent.tsx` by
directly calling `GoogleSheetsNodeContent` component, improving code
readability.
- Bug Fix: Enhanced `injectVariableValuesInPictureChoiceBlock` function
to handle different types of values for titles, descriptions, and
picture sources, fixing issues with variable value injection.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Closes#844, closes#839
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- New Feature: Added a `logOut` function to the user context for
improved logout handling.
- Refactor: Updated the redirect path in the `SignInForm` component for
better user redirection after authentication.
- New Feature: Enhanced the "Add" button and "Connect new" menu item in
`CredentialsDropdown` with role-based access control.
- Refactor: Replaced the `signOut` function with the `logOut` function
from the `useUser` hook in `DashboardHeader`.
- Bug Fix: Prevented execution of certain code blocks in
`TypebotProvider` when `typebotData` is read-only.
- Refactor: Optimized the `handleObserver` function in `ResultsTable`
with a `useCallback` hook.
- Bug Fix: Improved router readiness check in `WorkspaceProvider` to
prevent premature execution of certain operations.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
Closes#848
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- New Feature: Added "Environment name" as a new value type in the
SetVariable function, allowing users to distinguish between 'web' and
'whatsapp' environments.
- Refactor: Simplified session state handling in `resumeWhatsAppFlow.ts`
for improved code clarity.
- Refactor: Updated `startWhatsAppSession.ts` to include an initial
session state with WhatsApp contact and expiry timeout, enhancing
session management.
- Bug Fix: Improved null handling in `executeSetVariable.ts` for
'Contact name' and 'Phone number', preventing potential issues with
falsy values.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
**New Features:**
- Added WhatsApp integration feature to the Pro plan.
**Refactor:**
- Introduced the ability to exclude specific plans from being displayed
in the Change Plan Modal.
- Renamed the function `isProPlan` to `hasProPerks`, enhancing code
readability and maintainability.
- Updated the `EmbedButton` component to handle a new `lockTagPlan`
property and use the `modal` function instead of the `Modal` component.
**Chore:**
- Removed the `whatsAppPhoneNumberId` field from the `Typebot` model
across various files, simplifying the data structure of the model.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
### Summary by CodeRabbit
- New Feature: Introduced session expiry timeout for WhatsApp
integration, allowing users to set the duration after which a session
expires.
- New Feature: Added an option to enable/disable the start bot condition
in WhatsApp integration settings.
- Refactor: Enhanced error handling by throwing specific errors when
necessary conditions are not met.
- Refactor: Improved UI components like `NumberInput` and
`SwitchWithLabel` for better usability.
- Bug Fix: Fixed issues related to session resumption and message
sending in expired sessions. Now, if a session is expired, a new one
will be started instead of attempting to resume the old one.
- Chore: Updated various schemas to reflect changes in session
management and WhatsApp settings.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
