Skip to content

feat(use-cases): add reusable bottom bar baseline#2527

Draft
TheoGrandin74 wants to merge 177 commits into
stagingfrom
codex/use-case-bottom-bar-base
Draft

feat(use-cases): add reusable bottom bar baseline#2527
TheoGrandin74 wants to merge 177 commits into
stagingfrom
codex/use-case-bottom-bar-base

Conversation

@TheoGrandin74
Copy link
Copy Markdown
Contributor

Summary

Issue:

Screenshots / Recordings

Testing

  • Changes tested locally in the relevant Console's pages and Storybooks
  • yarn test or yarn test -u (if you need to regenerate snapshots)
  • yarn format
  • yarn lint

PR Checklist

  • I followed naming, styling, and TypeScript rules (see .cursor/rules)
  • I performed a self-review (diff inspected, dead code removed)
  • I titled the PR using Conventional Commits with a scope when possible (e.g. feat(service): add new Terraform service) - required for semantic-release
  • I only kept necessary comments, written in English (watch for useless AI comments)
  • I involved a designer to validate UI changes if I am not a designer
  • I covered new business logic with tests (unit)
  • I confirmed CI is green (Codecov red can be accepted)
  • I reviewed and executed locally any AI-assisted code

RemiBonnet and others added 30 commits January 19, 2026 10:56
* feat: add navbar and init layout

* feat: start breadcrumb and update all popover and dropdown menu colors

* feat(new-nav): add basis for routing (#2206)

feat: add basis for routing

---------

Co-authored-by: Romain Billard <rmnbrd@users.noreply.github.com>
Update Dockerfile and package.json for console-v5 build and preview commands
* Init organization overview

* Add webflow libraries
* feat: add basis for authentication

* chore: rename orgId to organizationId

* fix: glitch when switching routes

* impr: cleaning up auth-redirect component

* fix: import statements
impr: add logout button and better redirection
…d sections (#2238)

feat(organization-overview): add first part of sections
* feat(navigation): add general layout (#2110)

* feat: add navbar and init layout

* feat: start breadcrumb and update all popover and dropdown menu colors

* feat(new-nav): add basis for routing (#2206)

feat: add basis for routing

---------

Co-authored-by: Romain Billard <rmnbrd@users.noreply.github.com>

* feat(organization-overview): first part production health cluster

* fix(routes): routeTree.gen.ts

* Add feedback

* Remove useless file

---------

Co-authored-by: Romain Billard <rmnbrd@users.noreply.github.com>
* feat(cluster-card): token

* feat(organization-navigation): implement dynamic navigation context and refactor organization route

* feat(routes): add audit logs and cluster settings routes, update breadcrumbs for cluster navigation
… service components (tanstack not compatible)
* feat(routes): add cluster logs and settings routes, refactor organization route structure and navigation components

* fix(cluster-overview): card colors

* fix(cluster-overview): table colors

* fix(cluster-setup-modal): update text colors and improve layout consistency

* fix(cluster-access-modal): add new token

* fix(cluster): update token overview

* Enhance layout consistency in cluster overview components

* fix: some tests
* feat(sidebar): add new component deprecated navigation-left

* feat(sidebar): add new component
* feat(cluster-logs): init new row with token

* feat(routes): update route tree and add layout configuration

- Refactored route imports in `routeTree.gen.ts` to include new routes and improve organization.
- Introduced `route-layout-config.ts` to manage layout options for routes.
- Enhanced `OrganizationRoute` to conditionally apply full-width layout based on route context.
- Updated `ClusterLogs` component to include scrolling behavior and improved layout handling.
- Added new components for cluster log rows and headers with associated tests.

* fix(cluster-logs): adjust scroll behavior and layout improvements

- Updated scroll behavior to include additional padding for better visibility of logs.
- Enhanced layout structure by modifying the component hierarchy for improved responsiveness.
- Adjusted styling for the log header and container to ensure consistent appearance across different states.
* feat(cluster): add general settings

* refactor(routes): update route tree and improve organization of authenticated routes

- Refactored route imports in `routeTree.gen.ts` to include new routes for login and organization settings.
- Enhanced `ClusterGeneralSettingsForm` component by separating it from the main route component for better readability and maintainability.
- Updated form handling logic to simplify the submission process and improve user experience.
* feat(cluster): add credentials settings

- Added a new form for managing cluster credentials in the `credentials.tsx` file, improving user interaction with cloud provider credentials.
- Updated the `general.tsx` file to enhance the layout and user experience of the general settings form.
- Refactored the `route.tsx` file to improve the sidebar layout and ensure consistent styling.
- Enhanced the `ClusterCredentialsSettingsFeature` to utilize the correct `useParams` hook for better parameter handling.

* feat(cluster-settings): enhance sidebar links based on cluster type

- Introduced dynamic sidebar links in the settings route based on the cluster's cloud provider and Kubernetes management type.
- Added a new link for EKS Anywhere configuration when applicable.
- Refactored the sidebar link structure for improved readability and maintainability.
- Integrated feature flag for EKS Anywhere to conditionally display relevant settings.

* refactor(link): update link styles and improve consistency

- Modified link component styles to enhance visual consistency across the application.
- Updated color classes for better alignment with design standards.
- Adjusted snapshot tests to reflect the new styling changes.

* refactor(routes): update route imports and enhance organization

- Refactored route imports in `routeTree.gen.ts` to include additional routes for login and organization settings.
- Improved the structure and readability of the route definitions.
- Updated the link component styles to include a gap between items for better visual consistency.
* fix(sticky): ensure dropdown overlays above sticky header

* feat(z-index): introduce z-index variables and apply them across modal and header components

- Added z-index variables for header, dropdown, overlay, modal, tooltip, and toast in main.scss.
- Updated tailwind-workspace-preset.js to include new z-index values.
- Refactored modal and header components to utilize the new z-index variables for improved layering and visibility.

* feat(sidebar): implement keyboard navigation for focusable elements

- Added keyboard navigation support in the Sidebar component to allow users to navigate through focusable elements using ArrowUp and ArrowDown keys.
- Refactored the SidebarRoot component to include a handleKeyDown function that manages focus based on keyboard input.

* refactor(breadcrumbs): reorder class names for consistency and improve z-index usage
* feat(cluster): add danger-zone settings

* refactor(header): adjust z-index for dropdown menu and header layout
* feat(organization-overview): add webflow changelog section (#2230)

* Init organization overview

* Add webflow libraries

* feat(organization-overview): changelog, links + draft project and prod sections (#2238)

feat(organization-overview): add first part of sections

* feat(cluster): implement advanced settings for clusters

- Added a new component for managing advanced cluster settings, allowing users to view and edit settings with validation.
- Integrated form handling using react-hook-form for better state management and user experience.
- Included tests for the new advanced settings component to ensure functionality and reliability.
- Updated routing to accommodate the new advanced settings page and adjusted sidebar links accordingly.
- Enhanced UI components for better styling and consistency across the application.

* refactor(tests): simplify ClusterAdvancedSettings tests with wrapWithReactHookForm

* Add comment for complex advanced settings logic
* feat(main): integrate PostHog for analytics trackingt

* feat(eks-anywhere): add EKS Anywhere settings page

- Introduced a new route for managing EKS Anywhere cluster settings.
- Implemented form handling using react-hook-form for state management.
- Added loading states and error handling for cluster data retrieval and editing.
- Enhanced UI with a settings heading and a submit button for saving changes.

* refactor(ui): update spacing and text color in cluster overview and EKS settings

- Adjusted margin classes in the ClusterOverview component for consistent spacing.
- Updated text color classes in the ClusterEksSettings component for improved readability and design consistency.
- Enhanced sidebar item layout by wrapping icons in a span for better alignment and styling.
* feat(cluster): add image registry page

* feat(cluster): add network settings page and refactor routing

* refactor(cluster-network-settings): update styling for AWS and GCP existing VPC components for improved colors token

* refactor(container-registry-form): update tokens

* refactor(settings): adjust sidebar height for improved layout consistency
* Add new tokens with tailwind alias config

* Add toggle theme and new app console-v5

* feat(navigation): add general layout (#2110)

* feat: add navbar and init layout

* feat: start breadcrumb and update all popover and dropdown menu colors

* feat(new-nav): add basis for routing (#2206)

feat: add basis for routing

---------

Co-authored-by: Romain Billard <rmnbrd@users.noreply.github.com>

* Update Dockerfile and package.json for console-v5 (#2225)

Update Dockerfile and package.json for console-v5 build and preview commands

* fix(new-nav): update router and its layouts (#2227)

feat: add login route

* feat(organization-overview): add webflow changelog section (#2230)

* Init organization overview

* Add webflow libraries

* feat(new-nav): add authentication (#2232)

* feat: add basis for authentication

* chore: rename orgId to organizationId

* fix: glitch when switching routes

* impr: cleaning up auth-redirect component

* fix: import statements

* impr(new-nav): add logout button and better redirection (#2237)

impr: add logout button and better redirection

* feat(organization-overview): changelog, links + draft project and prod sections (#2238)

feat(organization-overview): add first part of sections

* fix(new-nav): auth context (#2239)

* feat(organization-overview): start production health cluster (#2242)

* feat(navigation): add general layout (#2110)

* feat: add navbar and init layout

* feat: start breadcrumb and update all popover and dropdown menu colors

* feat(new-nav): add basis for routing (#2206)

feat: add basis for routing

---------

Co-authored-by: Romain Billard <rmnbrd@users.noreply.github.com>

* feat(organization-overview): first part production health cluster

* fix(routes): routeTree.gen.ts

* Add feedback

* Remove useless file

---------

Co-authored-by: Romain Billard <rmnbrd@users.noreply.github.com>

* feat(badge): update token (#2245)

* feat(cluster): starting views (#2249)

* feat(cluster-card): token

* feat(organization-navigation): implement dynamic navigation context and refactor organization route

* feat(routes): add audit logs and cluster settings routes, update breadcrumbs for cluster navigation

* refactor(routes): remove pathname state from links in environment and service components (tanstack not compatible)

* feat(cluster): add overview (#2253)

* feat(routes): add cluster logs and settings routes, refactor organization route structure and navigation components

* fix(cluster-overview): card colors

* fix(cluster-overview): table colors

* fix(cluster-setup-modal): update text colors and improve layout consistency

* fix(cluster-access-modal): add new token

* fix(cluster): update token overview

* Enhance layout consistency in cluster overview components

* fix: some tests

* feat(sidebar): add new component for navigation (#2259)

* feat(sidebar): add new component deprecated navigation-left

* feat(sidebar): add new component

* feat(cluster-logs): add new view (#2260)

* feat(cluster-logs): init new row with token

* feat(routes): update route tree and add layout configuration

- Refactored route imports in `routeTree.gen.ts` to include new routes and improve organization.
- Introduced `route-layout-config.ts` to manage layout options for routes.
- Enhanced `OrganizationRoute` to conditionally apply full-width layout based on route context.
- Updated `ClusterLogs` component to include scrolling behavior and improved layout handling.
- Added new components for cluster log rows and headers with associated tests.

* fix(cluster-logs): adjust scroll behavior and layout improvements

- Updated scroll behavior to include additional padding for better visibility of logs.
- Enhanced layout structure by modifying the component hierarchy for improved responsiveness.
- Adjusted styling for the log header and container to ensure consistent appearance across different states.

* fix(tokens): update callout & progress-bar components

* feat(cluster): add general settings (#2264)

* feat(cluster): add general settings

* refactor(routes): update route tree and improve organization of authenticated routes

- Refactored route imports in `routeTree.gen.ts` to include new routes for login and organization settings.
- Enhanced `ClusterGeneralSettingsForm` component by separating it from the main route component for better readability and maintainability.
- Updated form handling logic to simplify the submission process and improve user experience.

* feat(cluster): add credentials settings (#2268)

* feat(cluster): add credentials settings

- Added a new form for managing cluster credentials in the `credentials.tsx` file, improving user interaction with cloud provider credentials.
- Updated the `general.tsx` file to enhance the layout and user experience of the general settings form.
- Refactored the `route.tsx` file to improve the sidebar layout and ensure consistent styling.
- Enhanced the `ClusterCredentialsSettingsFeature` to utilize the correct `useParams` hook for better parameter handling.

* feat(cluster-settings): enhance sidebar links based on cluster type

- Introduced dynamic sidebar links in the settings route based on the cluster's cloud provider and Kubernetes management type.
- Added a new link for EKS Anywhere configuration when applicable.
- Refactored the sidebar link structure for improved readability and maintainability.
- Integrated feature flag for EKS Anywhere to conditionally display relevant settings.

* refactor(link): update link styles and improve consistency

- Modified link component styles to enhance visual consistency across the application.
- Updated color classes for better alignment with design standards.
- Adjusted snapshot tests to reflect the new styling changes.

* refactor(routes): update route imports and enhance organization

- Refactored route imports in `routeTree.gen.ts` to include additional routes for login and organization settings.
- Improved the structure and readability of the route definitions.
- Updated the link component styles to include a gap between items for better visual consistency.

* fix(sticky): ensure dropdown overlays above sticky header (#2269)

* fix(sticky): ensure dropdown overlays above sticky header

* feat(z-index): introduce z-index variables and apply them across modal and header components

- Added z-index variables for header, dropdown, overlay, modal, tooltip, and toast in main.scss.
- Updated tailwind-workspace-preset.js to include new z-index values.
- Refactored modal and header components to utilize the new z-index variables for improved layering and visibility.

* feat(sidebar): implement keyboard navigation for focusable elements

- Added keyboard navigation support in the Sidebar component to allow users to navigate through focusable elements using ArrowUp and ArrowDown keys.
- Refactored the SidebarRoot component to include a handleKeyDown function that manages focus based on keyboard input.

* refactor(breadcrumbs): reorder class names for consistency and improve z-index usage

* feat(cluster): add danger-zone settings (#2272)

* feat(cluster): add danger-zone settings

* refactor(header): adjust z-index for dropdown menu and header layout

* feat(cluster): add resources settings (#2271)

* feat(new-nav): add onboarding views

* feat(new-nav): add plans and project onboarding views

* feat: add accept-invite route

* post-review fixes

* impr: post-review fixes

* fix: post-review fixes part 1

* impr: move accept-invite to onboarding lib

* impr: get rid of the onboarding pages

* fix: accept-invitation page

* impr: remove useless chargebee utility functions

* impr: update tokens

* fix: add missing redirection after logging in with a brand new account

---------

Co-authored-by: RemiBonnet <bonnet.rem@gmail.com>
feat(header): add user-menu dropdown
* feat(cluster): add cluster new page

* refactor(section-production-health): replace Button with Link for cluster creation in EmptyState component
TheoGrandin74 and others added 21 commits March 19, 2026 08:26
#2498)

* fix(git-webhook-status-badge): standardize badge labels and update icon names for consistency

* refactor(input-toggle): add forceAlignCenter prop for improved alignment control

* refactor(input-toggle): format check

* refactor(input-toggle): replace forceAlignTop with align prop for improved alignment control

* chore(snapshots): update class names for consistency in input-toggle and modal components
* fix(need-redeploy-flag): full width outside container

* fix:  banner.tsx
* feat(new-nav): add deployment logs

* Fix failing unit tests

* Fix navigate's params

* Simplifying the FilterStage UI states

* Removing useless comment

* Add version dropdown

* Better separation of concerns

* Fix a bug where switching between executions was not working correctly

* Update outdated snapshot

* Fix failing unit tests

* Fix font-weight and remove useless condition

* Fix missing iconOnly variant for ServiceActions

* Remove "service logs" link from the service's deployment table

* Use scroll icon instead of pipeline one

* Fix "skipped" icon

* Remove useless props

* Rename versionId to executionId

* Remove outdated color token

* Rename DeploymentLogsFeatureProps

* Fix overflow issue
…ervice health check and resources sections (#2508)

* refactor(monitoring-dashboard): replace Heading with styled div for service health check and resources sections

* refactor(monitoring-dashboard): replace text divs with Heading components for service health check and resources sections
* feat(environments): enhance environments table with skeleton loading state and improve layout

* fix(scroll-to-top): remove condition

* refactor(root-layout): remove commented code for cleaner structure

* fix(create-clone-environment-modal): update snapshot styles for input focus and label size consistency

* refactor(environments-table): simplify rendering logic by directly using EnvironmentsTable in tests

* fix(header): update Suspense fallback to include height for better layout consistency
* fix(webflow): webflow changelog synchronization on build

* refactor(changelog): update changelog handling and remove Webflow integration

* fix(webflow): update error message for API response handling

* chore(build): integrate changelog synchronization into build process and update workflow
* feat(database): add managed database mode selection logic and update tests

* refactor(database-step-general): remove unnecessary console logs for cleaner code

* fix(database-step-general): maintain form state validity when managed mode is unavailable
…ze looks of docker run format and helm install format (#2515)
Add visual differentiation between nodes that are being provisioned
(deploying) and nodes that are being terminated (removing) in the
node list table. Previously both appeared as "NotReady".

- Deploying: Ready=False without unschedulable/disruption taints → blue icon + subtle brand background
- Removing: unschedulable=true or Karpenter/autoscaler disruption taint → neutral minus icon

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
feat(posthog): synchronize identified user with Auth0 session using useEffect
Remove unused imports and clean up service logs layout

- Remove unused `match` from ts-pattern
- Remove unused `ServiceStateChip`, `Link` imports
- Remove unused route constants
- Remove sticky positioning from header
- Adjust container heights from 216px to 209px
- Add overflow handling to log containers
- Add relative positioning for proper stacking context
* feat(new-nav): add last deployment section to env overview

* Simplify empty state by removing new cluster button

* Add size prop to DropdownServices and StageStatusChip

Support small and medium size variants for the dropdown services
component and stage status chip. Update navigation to use TanStack
Router params instead of concatenated URL constants.

* Change "deploys" to "deployments" for clarity

* Remove heading level and update Link styling

- Remove explicit `level={2}` prop from Heading components,
  using default level instead
- Change Link `size` to "ssm" and adjust `className` gap and
  hover color for consistency
* fix(posthog): enhance organization tracking with group and feature flag reload

* refactor(organization-route): simplify comment for clarity; style(scroll-shadow): change overflow-x to auto; style(themes): add color-scheme for light and dark themes

* refactor(root-layout): remove TanStackRouterDevtools from RootLayout component for cleaner structure
* fix(login): SSO add color token

* fix(login): update background color token for login page
@TheoGrandin74 TheoGrandin74 force-pushed the codex/use-case-bottom-bar-base branch from 2916cf0 to 0a5afc6 Compare March 23, 2026 13:35
@codecov
Copy link
Copy Markdown

codecov Bot commented Mar 23, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
⚠️ Please upload report for BASE (new-navigation@556c611). Learn more about missing BASE report.

Additional details and impacted files
@@                Coverage Diff                @@
##             new-navigation    #2527   +/-   ##
=================================================
  Coverage                  ?   44.28%           
=================================================
  Files                     ?     1060           
  Lines                     ?    21614           
  Branches                  ?     6307           
=================================================
  Hits                      ?     9572           
  Misses                    ?    10311           
  Partials                  ?     1731           
Flag Coverage Δ
unittests 44.28% <100.00%> (?)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@rmnbrd rmnbrd added the V5 label Mar 24, 2026
Base automatically changed from new-navigation to staging May 11, 2026 07:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants