Conversation
ogzhanolguncu
requested review from
chronark,
mcstepp and
perkinsjr
as code owners
|
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
Thank you for following the naming conventions for pull request titles! 🙏 |
📝 Walkthrough## Walkthrough
A new utility function, `shortenId`, is introduced to standardize the truncation and display of string IDs across the dashboard application. Multiple components are refactored to replace manual substring and truncation logic with calls to this utility, ensuring consistent ID shortening behavior throughout the UI.
## Changes
| File(s) | Change Summary |
|----------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------|
| apps/dashboard/lib/shorten-id.ts | Added new `shortenId` utility function for configurable string ID truncation. |
| .../apis/[apiId]/_overview/components/table/components/override-indicator.tsx | Replaced manual key ID truncation with `shortenId` utility. |
| .../apis/[apiId]/api-id-navbar.tsx | Refactored breadcrumb ID shortening to use `shortenId`. |
| .../apis/[apiId]/keys/[keyAuthId]/[keyId]/components/table/logs-table.tsx | Updated tag badge display to use `shortenId`; adjusted badge tooltip classes and alignment. |
| .../apis/[apiId]/keys/[keyAuthId]/_components/components/table/keys-list.tsx | Replaced manual key ID truncation with `shortenId` utility. |
| .../audit/components/controls/components/logs-filters/components/root-keys-filter.tsx | Refactored root key label truncation to use `shortenId`. |
## Sequence Diagram(s)
```mermaid
sequenceDiagram
participant UI_Component
participant shortenId_Util
UI_Component->>shortenId_Util: shortenId(id, options?)
shortenId_Util-->>UI_Component: Shortened ID string
UI_Component->>UI_Component: Render shortened ID in UIPossibly related PRs
Suggested labels
Suggested reviewers
Learnt from: ogzhanolguncu Learnt from: Flo4604 Learnt from: chronark Learnt from: ogzhanolguncu Learnt from: ogzhanolguncu Learnt from: ogzhanolguncu Learnt from: chronark Learnt from: ogzhanolguncu Learnt from: p6l-richard Learnt from: ogzhanolguncu Learnt from: chronark Learnt from: ogzhanolguncu Learnt from: ogzhanolguncu Learnt from: ogzhanolguncu Learnt from: ogzhanolguncu |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
📒 Files selected for processing (6)
apps/dashboard/app/(app)/apis/[apiId]/_overview/components/table/components/override-indicator.tsx(2 hunks)apps/dashboard/app/(app)/apis/[apiId]/api-id-navbar.tsx(2 hunks)apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/components/table/logs-table.tsx(4 hunks)apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/_components/components/table/keys-list.tsx(2 hunks)apps/dashboard/app/(app)/audit/components/controls/components/logs-filters/components/root-keys-filter.tsx(2 hunks)apps/dashboard/lib/shorten-id.ts(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (4)
- GitHub Check: autofix
- GitHub Check: Test Packages / Test ./packages/cache
- GitHub Check: Test Packages / Test ./internal/clickhouse
- GitHub Check: Analyze (javascript-typescript)
🔇 Additional comments (13)
apps/dashboard/lib/shorten-id.ts (1)
1-48: Excellent utility function implementation with comprehensive validation.The
shortenIdfunction is well-designed with proper input validation, edge case handling, and sensible defaults. The logic correctly handles scenarios where shortening isn't beneficial or possible.apps/dashboard/app/(app)/apis/[apiId]/api-id-navbar.tsx (2)
8-8: Clean import addition.The import is correctly placed and follows the existing import organization pattern.
138-138: Proper usage of the shortenId utility.The replacement of manual truncation logic with the centralized utility function improves maintainability and consistency across the codebase.
apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/_components/components/table/keys-list.tsx (2)
4-4: Import correctly positioned.The import follows the established pattern and is placed appropriately with other utility imports.
186-186: Consistent ID shortening implementation.The replacement standardizes ID display formatting across the dashboard, which improves user experience and code maintainability.
apps/dashboard/app/(app)/apis/[apiId]/_overview/components/table/components/override-indicator.tsx (2)
2-2: Import properly added.The import is correctly placed at the top of the file with other utility imports.
90-90: Centralized ID shortening logic applied.The change standardizes the key ID display format while maintaining all existing functionality for navigation and error handling.
apps/dashboard/app/(app)/audit/components/controls/components/logs-filters/components/root-keys-filter.tsx (2)
3-3: Import appropriately positioned.The import is correctly placed with other utility imports at the top of the file.
41-41: Consistent label formatting with centralized utility.The replacement ensures consistent ID formatting across filter labels, maintaining the same user experience while improving code maintainability.
apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/components/table/logs-table.tsx (4)
4-4: LGTM: Import statement correctly added.The import for the new
shortenIdutility function follows the established import conventions and path structure.
315-315: Minor styling improvement added.The addition of
px-2 py-1padding classes to the InfoTooltip improves the visual spacing around tag tooltips.
334-334: Improved vertical alignment.Changing from
items-starttoitems-centerprovides better visual alignment between the tag text and copy button elements.
358-362: Good refactoring to use standardized utility function.The replacement of manual string truncation with the
shortenIdutility improves consistency across the application. The parameters are well-chosen for this use case:
startChars: 10provides sufficient contextendChars: 0focuses on the beginning of tagsminLength: 14prevents unnecessary truncation of short tagsThis aligns perfectly with the PR objective to standardize ID/string shortening throughout the codebase.
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Plan: Pro
📒 Files selected for processing (2)
apps/dashboard/app/(app)/apis/[apiId]/api-id-navbar.tsx(2 hunks)apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/components/table/logs-table.tsx(4 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (2)
apps/dashboard/app/(app)/apis/[apiId]/api-id-navbar.tsx (1)
apps/dashboard/lib/shorten-id.ts (1)
shortenId(5-48)
apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/components/table/logs-table.tsx (1)
apps/dashboard/lib/shorten-id.ts (1)
shortenId(5-48)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: Test Packages / Test ./internal/clickhouse
- GitHub Check: Analyze (javascript-typescript)
🔇 Additional comments (5)
apps/dashboard/app/(app)/apis/[apiId]/api-id-navbar.tsx (1)
8-8: LGTM!The import of the
shortenIdutility function is correct and follows the established pattern.apps/dashboard/app/(app)/apis/[apiId]/keys/[keyAuthId]/[keyId]/components/table/logs-table.tsx (4)
4-4: LGTM!The import of the
shortenIdutility function is correct and consistent with the refactoring across multiple components.
315-315: LGTM!The addition of padding classes improves the tooltip styling and user experience.
334-334: LGTM!The alignment change from
items-starttoitems-centerprovides better visual alignment between the tag text and copy button.
358-362: LGTM!The replacement of manual truncation with
shortenIdprovides consistent behavior. The custom options are well-configured:
startChars: 10shows meaningful tag contentendChars: 0focuses on the beginning of tagsminLength: 14ensures only longer tags are shortenedThis maintains readability while standardizing the truncation logic across the application.
chronark
left a comment
chronark
left a comment
There was a problem hiding this comment.
check the data access comment from rabbit
|
@chronark this is good to go |
3 participants
What does this PR do?
This PR adds a util for shortening long keys e.g.
keyId,apiIdetc...Fixes # (issue)
If there is not an issue for this, please create one first. This is used to tracking purposes and also helps use understand why this PR exists
Type of change
How should this be tested?
Checklist
Required
pnpm buildpnpm fmtconsole.logsgit pull origin mainAppreciated
Summary by CodeRabbit
New Features
Refactor