overleaf/services/web/.storybook
Antoine Clausse b2e7477467 [web] Migrate AI Error Assistant to BS5 (#21129)
* [storybook] Rerender story when switching BS3/BS5

* [storybook] Add SCSS loader to storybook

* [storybook] Add some AI error assistant stories

* Rename ai-error-assistant.less to .scss

* Update less variables to sass

* Remove duplicated selector

* Replace react-bootstrap components by `OL...`

* Update Checkboxes after BS5 update

* Add IDs so clicking on labels work
* Add BS5 class name in SCSS

Note: `answer-not-detailed` is used twice in the Radios. I think it's a mistake: there should be another name for the "ai_feedback_the_suggestion_wasnt_the_best_fix_available" radio

* Rename ID `answer-not-detailed` -> `answer-not-best-fix`

* Pass name and value to BS3Radio/BS3Checkbox

* [storybook] Add delay before AI suggestion (shows the animation)

* Add a number after the checkbox/radio IDs, to allow multiple forms to be displayed

Without this, clicks on second form are updating the first form!

Another solution could be to wrap the input in the label, but it comes with other problems. See https://css-tricks.com/html-inputs-and-labels-a-love-story/

* [storybook] Update `LabsAiPromoBanner`

* Use CSS variables instead of hardcoded values

* Make radio input flex

* Replace `blue-10` by `bg-info-03`

* Fix `SuggestFixButton`

* Fix `AiErrorAssistantCopyCode`

* Fix button loading in BS5

* Use OLBadge

* Fix Button variants

* Update `suggestFixAction`

* Migrate Tooltip and Button to BS5 in LabsExperimentWidget

* Update BS3/BS5 button classname in AiErrorAssistantCopyCode

Co-authored-by: Rebeka <rebeka.dekany@overleaf.com>

* [storybook] Allow to choose props of `LabsExperimentWidget`

* Fixup `OLTooltip`: Display the tooltip on disabled button in BS5

* Update Tooltips to BS5

---------

Co-authored-by: Rebeka <rebeka.dekany@overleaf.com>
GitOrigin-RevId: 08d594e772c0a3b6db1c6081337cc2d079f478a5
2024-10-23 08:06:36 +00:00
..
utils
main.ts
manager.css
manager.ts
preview.tsx