[WIP] - feat(frontend): #709 sidebar to show open bbb room #1015
Conversation
…tionDrawer components style: implement Figma design requirements for new components
…hensive Storybook examples and tests - Updated ListElement.vue to handle right content, icons, and images. - Added detailed Storybook stories for ListElement with text, icons, and images. - Fixed type issues in test files for ListElement, NavigationDrawer, and ListWithNavigationDrawer components. - Ensured all tests correctly type the wrapper variable as ReturnType<typeof mount>. fix: Ensure proper handling of right content and type safety in test files
2024-06-0716-17-18-ezgif.com-crop-video.mp4 |
|
Code Duplication in Templates: The component is repeated across multiple files. Consider abstracting it into a shared layout component to avoid redundancy. Hardcoded Strings in Templates: Some strings, such as label="Sign Out", are hardcoded. These should be replaced with localization-friendly alternatives using $t for better internationalization support. Magic Numbers and Inline Styles: Avoid using magic numbers directly in styles like blur(20 px), border-radius: 30 px 30 px 0 0;. Define these in variables or theme settings for better maintainability and consistency. Snapshot Updates: Ensure all updated snapshot files reflect the intended changes and are not simply reflecting unintended side effects. Storybook Configuration: The addition of the viewport addon is a good step, but ensure that all necessary viewports are defined and tested in stories to cover various device scenarios. TypeScript Configurations: Ensure all TypeScript files, especially those with complex setups or imports, are thoroughly type-checked and error-free. |
|
new PR #1080 |
🍰 Pullrequest
The GitHub pull request introduces two new elements, ListElement and ListWithNavigationDrawer, which are now available in Storybook for use. Additionally, it extends the TopMenu component. Here’s a summary of the main changes:
New Storybook Elements:
ListElement: A customizable list component with story examples for different item configurations.
ListWithNavigationDrawer: Combines a list with a navigation drawer, providing additional UI capabilities.
Extended TopMenu:
Enhancements to the TopMenu component, making it more versatile and user-friendly.
For more details, you can view the full changes on the GitHub PR page.
Next Steps:
a. Review and run the new Storybook elements to understand their functionality.
b. Integrate the new components into your application and test their interaction with existing elements.
Issues
Todo
ListElementandListWithNavigationDrawercomponents.