✨(frontend) implement the new ui #544
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This branch is a transition branch to gradually merge the new UI.
In order to use the spaces and grays of the DSFR, we update the cunningham.ts file
In the new interface there is a new left panel. We implement it and add it to the MainLayout
Some minor changes have been integrated into the list of documents. The tests must therefore be adapted accordingly.
Previously we added a left panel. We now need to adapt the layout so that it becomesresponsive. We therefore add a burger menu on the left on mobile which, when clicked, deploys the left-panel over all the content.
Deleted two components that were no longer needed following the implementation of the new interface. This cleanup helps streamline he codebase and avoid unnecessary maintenance.
Previously we added a left panel. We now need to adapt the layout so that it becomesresponsive. We therefore add a burger menu on the left on mobile which, when clicked, deploys the left-panel over all the content.
- Install `react-intersection-observer` to manage element visibility detection. - Enables features like lazy loading, animations on scroll, and triggering events when elements appear in the viewport.
- update primary colors,and spacing. - update tertiary button
Implement the new version of the DocsGrid component
- Adjust selectors and assertions to reflect updates in the UI layout and design. - Ensure all modified tests maintain compatibility with the updated structure. - Fix any broken test cases caused by the redesign.
Implement dropdown menu with functionality to delete a document from the list
We had already deleted this file but it must have reappeared with a bad rebase
Modification of the header style to be consistent with the new UI : - We replace the option menu with the DropdownMenu component - We add a dowload button - We put an input in place of an editable div.
Since we no longer use an editable div but an input, we must modify the tests accordingly
In the new interface, the export modal changes a little. - We put the buttons on the right - We remove the alert - We transform the radio into select
- Updated tests for document member list and versioning to utilize 'Load more' button instead of mouse wheel scrolling. - Improved UI for document versioning, including visibility checks and modal interactions. - Refactored InfiniteScroll component to include a button for loading more items, enhancing user experience. - Adjusted DocEditor and DocHeader components to handle version IDs more effectively. - Removed deprecated versioning pages to streamline the codebase.
- Removed the versioning route from the default configuration to streamline the documentation structure. - Updated the service worker to eliminate references to the deprecated versioning fallback, enhancing the offline experience for users.
- Introduced a new enum for default document filters to improve code clarity. - Updated the API call to support filtering documents based on the creator. - Enhanced the DocsGrid component to accept a target filter, allowing dynamic content rendering based on user selection. - Modified the main layout to include a left panel for improved navigation and user experience. - Added a new test suite for document filters, verifying the visibility and selection states of 'All docs', 'My docs', and 'Shared with me'.
- fix for icon-only buttons to have auto width.
- Enhanced the document summary UI for better visibility and interaction. - Refactored the DocHeader and DocEditor components to improve layout and responsiveness. - Updated tests for the DocTableContent to reflect changes in heading interactions and visibility checks.
- Deleted the PanelEditor and TableContent components as they are no longer needed in the application.
- Adjusted the document editor height in the DocEditor component - Updated translations for various terms to ensure consistency cross the application. - Improved layout and spacing in the DocsGridItem component for a cleaner presentation.
- Added new dependencies: `luxon` and its type definitions to the e2e app - Introduced `cmdk` and `use-debounce` to the impress app for enhanced UI components and debouncing functionality.
- Introduced a new Quick Search feature with multiple components - Implemented styling for the Quick Search components to ensure a cohesive look and feel across the application.
- Added a new DocSearchModal component for searching documents. - Introduced DocSearchItem component to display individua document results. - Enhanced the useDocs API to support title-based searching. - Implemented e2e tests for document search visibility and functionality. - Included an empty state illustration for no search results. - Updated the LeftPanelHeader to open the document search modal.
- Introduced a comprehensive set of color tokens for blue, brown, cyan, gold, green, olive, orange, pink, purple, and yellow shades.
- Simplified QuickSearchProps by removing unused properties and enhancing type definitions. - Updated QuickSearch component to utilize children for rendering, improving flexibility. - Added separator prop to QuickSearchInput for better control over layout. - Removed data prop from DocSearchModal's QuickSearch to streamline the component's usage.
- Introduced new hooks and components for improved document sharing functionality, including `useTranslatedShareSettings` and `DocShareModal`. - Added role management capabilities with `DocRoleDropdown` and `DocShareAddMemberList` components, allowing users to manage document access and roles effectively. - Implemented user invitation handling with `DocShareInvitationItem` and `DocShareMemberItem` components, enhancing the user experience for managing document collaborators. - Updated translation handling for role and visibility settings to ensure consistency across the application. - Refactored existing components to integrate new features and improve overall code organization.
- Updated DropButton and DropdownMenu components to include new props for accessibility and improved layout. - Introduced LoadMoreText component for better user experience in loading additional content. - Added SearchUserRow and UserAvatar components for improved user search functionality. - Cleaned up unused imports and adjusted styles for better consistency across components.
- Deleted `DocVisibility`, `ModalShare`, `InvitationList`, `MemberList`, and related components to streamline the document management feature. - Updated component exports to reflect the removal of these components. - Cleaned up associated assets and styles to improve code maintainability.
- Enhanced test coverage for document sharing, member roles, and visibility settings
- Added functionality to mark documents as favorites, including new hooks `useMakeFavoriteDoc` and `useRemoveFavoriteDoc` for managing favorite status. - Enhanced the document management API to support favorite filtering with the `is_favorite` parameter. - Created a new e2e test for the favorite workflow to ensure proper functionality. - Updated the UI components to reflect favorite status, including changes in `DocsGridActions`, `DocsGridItem`, and the new `LeftPanelFavorites` component for displaying pinned documents. - Adjusted SVG assets for better visual representation of pinned documents.
- Modified color tokens for danger and info categories to enhance visual consistency and accessibility. - Updated button and modal styles, including adjustments to padding and dimensions for improved layout. - Replaced font files for Marianne with updated versions to ensure better typography.
- Updated padding and radius styles in LeftPanelTargetFilters and LeftPanelFavorites for improved layout consistency. - Introduced LeftPanelDocContent component to display document details when navigating to specific documentation pages. - Enhanced LeftPanelContent to conditionally render LeftPanelDocContent based on the current route. - Adjusted LeftPanelHeader button colors for better visual hierarchy. - Refactored MainLayout padding for a more responsive design.
- Updated the layout and styling of the DocsGrid and DocsGridItem components for improved responsiveness and visual consistency. - Added a new background prop to the UserAvatar component for customizable user avatars. - Enhanced the DocsGridActions component to include a share option, allowing users to share documents easily. - Refactored SVG assets for pinned and simple documents to improve their dimensions and visual representation. - Improved the SimpleDocItem component to display document update times and access indicators more effectively. - Adjusted padding and spacing across various components to enhance overall user experience.
- Updated QuickSearchItemContent to ensure full width for better layout consistency. - Adjusted padding in QuickSearchStyle for improved spacing and visual hierarchy. - Refactored DocSearchItem to utilize Box component for consistent styling and layout. - Removed unused imports in DocSearchItem to streamline the codebase.
- Updated DropdownMenu and ButtonLogin components for better accessibility and visual consistency. - Refactored Header and Title components to utilize new theming and spacing tokens. - Enhanced LanguagePicker styles for improved user experience. - Introduced new utility functions in doc-management for better handling of ProseMirror nodes and Yjs integration. - Cleaned up unused imports and adjusted component styles for overall code maintainability.
- Improved styling for headings in BlockNoteEditor for better visual hierarchy. - Adjusted padding in DocEditor and DocHeader based on device type for responsive design. - Updated DocTitle and ModalExport components to enhance typography and spacing. - Refactored DocToolBox to improve share button functionality and access display. - Enhanced versioning modal with better layout and accessibility features. - Cleaned up unused imports and optimized component structures for maintainability.
- Refactored DocShareAddMemberList to simplify button styling and improve loading state handling. - Updated DocShareAddMemberListItem and DocShareMemberItem to enhance spacing and button color for better visual consistency. - Improved DocShareInvitationItem and SearchUserRow with new theming and spacing tokens for a more cohesive design. - Adjusted padding and layout in DocShareModal and DocShareModalFooter for improved responsiveness. - Enhanced DocVisibility component with updated padding and text styling for better readability. - Cleaned up unused imports and optimized component structures for maintainability.
- Updated test cases to improve accessibility by replacing 'more_vert' with 'more_horiz' for action buttons across various components. - Refactored document deletion confirmation messages to use consistent heading roles for better visibility. - Simplified keyboard interactions in document table content tests for improved clarity. - Adjusted visibility checks for the share button to utilize more descriptive labels. - Cleaned up test code for maintainability and consistency.
- add scroll inside the doc grid
- Updated DropdownMenu to include index-based styling for better visual consistency. - Refactored QuickSearchStyle to remove unnecessary transitions for smoother performance. - Adjusted modal styles in cunningham-style.css for improved layout. - Changed BlockNoteEditor to update block type from 'heading' to 'paragraph' for better content structure. - Enhanced DocHeader and DocToolBox components with updated color themes for improved visibility. - Modified ModalRemoveDoc to change size and clean up unnecessary props for better usability. - Improved Heading and TableContent components to handle empty states more gracefully. - Updated DocsGrid to conditionally render content based on document availability, enhancing user experience. - Refined LeftPanel components for better layout and visual hierarchy, including adjustments to padding and separators.
- Refactored DocShareModal to improve user experience with dynamic list height and responsive design adjustments. - Introduced new styling for modal elements using createGlobalStyle for better visual consistency. - Updated footer button text from 'Ok' to 'OK' for improved clarity. - Enhanced user selection handling and search functionality within the modal for better document sharing experience.
- Updated test cases to replace 'docs-grid-loader' with 'grid-loader' for improved consistency across document grid tests. - Refactored document interaction tests to utilize the 'docs-grid' locator for better readability and maintainability. - Enhanced document table content tests by refining element selection methods for improved clarity and performance. - Cleaned up test code to ensure better structure and maintainability.
PanchoutNathan
force-pushed
the
main-new-ui
branch
from
073ad6f to
7b0e190
Compare
- Fixed minor bugs in the frontend codebase for improved stability. - Enhanced DocTitle component to update title display dynamically using useEffect. - Refactored DocShareModal to improve modal content height calculation for better responsiveness.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Purpose
Implemented the new UI designed by Robin. This update introduces a refreshed design with enhanced usability and aesthetics.
Proposal
Description...