Skip to content

feat(frontend): update secret overview UI and migrate to v3 components#5289

Merged
scott-ray-wilson merged 17 commits intomainfrom
overview-page-updates
Jan 29, 2026
Merged

feat(frontend): update secret overview UI and migrate to v3 components#5289
scott-ray-wilson merged 17 commits intomainfrom
overview-page-updates

Conversation

@scott-ray-wilson
Copy link
Contributor

Context

This PR updates the secret overview page with v3 components

Screenshots

CleanShot 2026-01-27 at 18 11 27@2x

Steps to verify the change

  • ensure all previous functionality for secrets, folder, dynamic secrets, rotations and table (filter, search, etc.) is preserved
  • test responsiveness and style handling

Type

  • Fix
  • Feature
  • Improvement
  • Breaking
  • Docs
  • Chore

Checklist

  • Title follows the conventional commit format: type(scope): short description (scope is optional, e.g., fix: prevent crash on sync or fix(api): handle null response).
  • Tested locally
  • Updated docs (if needed)
  • Read the contributing guide

@maidul98
Copy link
Collaborator

maidul98 commented Jan 28, 2026

Snyk checks have passed. No issues have been found so far.

Status Scanner Critical High Medium Low Total (0)
Open Source Security 0 0 0 0 0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

@greptile-apps
Copy link
Contributor

greptile-apps bot commented Jan 28, 2026

Greptile Overview

Greptile Summary

This PR migrates the secret overview page from v2 to v3 components, refactoring the UI with modern design patterns and improved responsiveness.

Key Changes

  • Replaced FontAwesome icons with lucide-react icons throughout
  • Migrated table components from v2 to v3 (UnstableTable, UnstableTableRow, etc.)
  • Extracted inline components into separate files for better organization (FolderBreadcrumb, EnvironmentSelect, ResourceFilter, etc.)
  • Removed environment collapse/expand functionality (commented out for potential future use)
  • Changed from scrollOffset tracking to tableWidth for responsive behavior
  • Added new dependencies: cmdk and @radix-ui/react-slot

Issues Found

  • Critical: FolderBreadcrumb component has a hardcoded default path (/backend/api/services/datadog/apm/config/telemetry/grafana/prometheus/poseidon/persephone) that should be removed - this was likely left in during development
  • Logic Change: handleFolderCreate now creates folders only in visibleEnvs (filtered environments) instead of userAvailableEnvs (all environments). This means if a user has filtered to specific environments, folders will only be created in those environments, not across all available ones. This appears intentional based on the PR context but should be verified as expected behavior.

Component Organization

The refactor improves maintainability by splitting the large OverviewPage.tsx file (reduced from ~1500+ lines to ~900 lines) into smaller, focused components:

  • SecretTableRow with SecretEditTableRow, SecretNoAccessTableRow, SecretRenameForm
  • FolderTableRow, DynamicSecretTableRow, SecretRotationTableRow
  • ResourceFilter, ResourceSearchInput, ResourceCount
  • EnvironmentSelect, FolderBreadcrumb, EmptyResourceDisplay

Confidence Score: 3/5

  • This PR is safe to merge after fixing the hardcoded default path, but the folder creation behavior change should be verified
  • Score reflects one critical issue (hardcoded path) and one behavioral change (folder creation scope) that need attention. The refactoring is well-structured and the v3 component migration appears sound, but the functional changes need verification.
  • Pay close attention to FolderBreadcrumb.tsx (hardcoded path) and verify the folder creation behavior change in OverviewPage.tsx is intentional

Important Files Changed

Filename Overview
frontend/src/pages/secret-manager/OverviewPage/OverviewPage.tsx refactored to use v3 components, removed environment collapse feature, changed folder creation from all envs to visible envs only
frontend/src/pages/secret-manager/OverviewPage/components/FolderBreadcrumb/FolderBreadcrumb.tsx new breadcrumb component with responsive design and measurement logic, contains hardcoded default path
frontend/src/pages/secret-manager/OverviewPage/components/SecretTableRow/SecretEditTableRow.tsx new component for editing secrets with proper permission checks and value fetching logic

@ghost
Copy link

ghost commented Jan 28, 2026

This is so cool! Love the direction this is heading. 🚀

@scott-ray-wilson
Copy link
Contributor Author

@greptile re-review the PR changes since last review

Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

3 files reviewed, 2 comments

Edit Code Review Agent Settings | Greptile

@scott-ray-wilson scott-ray-wilson merged commit ccdfec8 into main Jan 29, 2026
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants