[Souvik9205]

User description

Description

Project overview tab to show the secret-variable-environment list and have option to save and regenerate key

This is a draft PR, and we must further update the functionality.

Future Improvements

Mention any improvements to be done in the future related to any file/feature

Developer's checklist

• [x ] My PR follows the style guidelines of this project
• [ x] I have performed a self-check on my work

---

PR Type

Enhancement, Tests

---

Description

• Added an "Overview" tab for project management.

  • Displays project details, secrets, variables, and environments.
  • Includes private key setup and regeneration features.

• Introduced utilities for local key storage and time formatting.

• Updated navigation and project card links to include the "Overview" tab.

• Added reusable components for key management and loading states.

---

Changes walkthrough 📝

Relevant files

Enhancement

13 files index.ts Added new SVG icons for key management.                                    +7/-1      utils.ts Added utilities for local key storage and time formatting. +30/-0    index.ts Added atom for managing project private keys.                        +2/-0      page.tsx Implemented "Overview" page with project details and key management. +170/-0  page.tsx Refactored secret page to use centralized private key atom. +12/-9    layout.tsx Integrated "Overview" tab into project layout.                      +11/-6    index.tsx Added component for local private key setup.                          +77/-0    index.tsx Added component for regenerating private keys.                      +31/-0    index.tsx Added component for server-side private key setup.              +84/-0    index.tsx Added dialog component for local private key setup.            +82/-0    index.tsx Added skeleton loader for "Overview" page.                              +10/-0    index.tsx Updated project card links to default to "Overview" tab.  +1/-1      index.tsx Added "Overview" tab to project navigation.                            +7/-1

---

Need help?

Type /help how to ... in the comments thread for any questions about Qodo Merge usage.

Check out the documentation for more information.

[rajdip-b]

Task linked: CU-86cy8d32f Modifications in Edit Project

[codiumai-pr-agent-free]

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 3 🔵🔵🔵⚪⚪

🧪 No relevant tests

🔒 Security concerns Sensitive information exposure: The project stores private keys in localStorage which is not secure for cryptographic keys. While the implementation includes options to reveal/hide the key in the UI, localStorage is vulnerable to XSS attacks and other client-side exploits. Consider using more secure storage options like the Web Crypto API's CryptoKey storage or a secure enclave if available.

⚡ Recommended focus areas for review Empty Private Key The regenerateKey function is sending an empty string as privateKey. The code comment indicates this needs to be changed later, but it could cause issues if deployed as is. regenerateKeyPair: true, privateKey: '' //Need to change the logic later }) Incomplete Implementation The "Remove Key" button is rendered but has no onClick handler implemented, making it non-functional. <button className="flex w-[8rem] items-center justify-center gap-[10px] rounded-[8px] bg-[#DC2626] p-[16px] text-white" type="button" > <div className="text-[14px] font-[700]">Remove Key</div> </button> Potential Error When privateKey is null, the code attempts to call replace() and substring() methods on it in the LocalKeySetup component, which would cause runtime errors. <div className="flex flex-col gap-2"> <div className="flex items-center gap-3"> <KeyshadeLogoSVG />

[codiumai-pr-agent-free]

PR Code Suggestions ✨

Explore these optional code suggestions:

Category	Suggestion	Impact
Possible issue	✅ Fix contradictory key parameters Suggestion Impact: The commit addressed the contradictory parameters issue by replacing 'regenerateKeyPair: true' with 'storePrivateKey: true', which aligns with the suggestion's intent to prevent regenerating keys when storing an existing private key. code diff: const updatePrivateKey = useHttp((key: string) => ControllerInstance.getInstance().projectController.updateProject({ projectSlug, - regenerateKeyPair: true, + storePrivateKey: true, privateKey: key }) ) The updatePrivateKey function is setting regenerateKeyPair to true while also providing a privateKey. This is contradictory and potentially dangerous - regenerating keys would create new keys that would make the provided privateKey invalid. This could lead to data loss or encryption failures. apps/platform/src/components/dashboard/overview/ServerKeySetup/index.tsx [19-25] const updatePrivateKey = useHttp((key: string) => ControllerInstance.getInstance().projectController.updateProject({ projectSlug, - regenerateKeyPair: true, + regenerateKeyPair: false, privateKey: key }) ) [Suggestion has been applied] Suggestion importance[1-10]: 9 __ Why: This suggestion identifies a critical security issue where regenerateKeyPair is set to true while also providing a privateKey, which is contradictory and could lead to encryption failures or data loss. Setting regenerateKeyPair to false when storing an existing key is the correct approach.	High
	✅ Fix empty privateKey parameter Suggestion Impact: The commit removed the privateKey parameter from the regenerateKey function, addressing the issue highlighted in the suggestion. code diff: - const regenerateKey = useHttp(() => - ControllerInstance.getInstance().projectController.updateProject({ - projectSlug, - regenerateKeyPair: true, - privateKey: '' //Need to change the logic later - }) The regenerateKey function is sending an empty string as privateKey which could cause issues when regenerating keys. This might lead to data loss or security problems. Either remove the privateKey parameter if it's not needed for regeneration or implement the proper logic to provide a valid key. apps/platform/src/components/dashboard/overview/RegenerateKey/index.tsx [11-17] const regenerateKey = useHttp(() => ControllerInstance.getInstance().projectController.updateProject({ projectSlug, - regenerateKeyPair: true, - privateKey: '' //Need to change the logic later + regenerateKeyPair: true }) ) [Suggestion has been applied] Suggestion importance[1-10]: 8 __ Why: The suggestion correctly identifies a potential security issue where an empty string is being sent as privateKey during key regeneration. Removing this parameter is appropriate since it's not needed when regenerateKeyPair is true, preventing potential data loss or security problems.	Medium
	Handle negative time differences The formatTimeAgo function doesn't handle negative time differences, which can occur if the dateString is in the future or if there are clock synchronization issues. This could lead to incorrect time displays or potential bugs. apps/platform/src/lib/utils.ts [91-115] export function formatTimeAgo(dateString: Date): string { const updatedDate = new Date(dateString) const now = new Date() const diffInSeconds = Math.floor( (now.getTime() - updatedDate.getTime()) / 1000 ) + + if (diffInSeconds < 0) { + return 'Updated recently' + } const timeIntervals = [ { label: 'year', seconds: 31536000 }, { label: 'month', seconds: 2592000 }, { label: 'week', seconds: 604800 }, { label: 'day', seconds: 86400 }, { label: 'hour', seconds: 3600 }, { label: 'minute', seconds: 60 } ] for (const interval of timeIntervals) { const count = Math.floor(diffInSeconds / interval.seconds) if (count >= 1) { return `Updated ${count} ${interval.label}${count > 1 ? 's' : ''} ago` } } return 'Updated just now' } Apply this suggestion Suggestion importance[1-10]: 7 __ Why: The suggestion addresses a potential edge case where negative time differences could occur due to future dates or clock synchronization issues. Adding this check improves the robustness of the formatTimeAgo function and prevents unexpected behavior.	Medium
Update

[rajdip-b]

I have dropped a lot of reviews. Once you are done with these, i believe it will be in a presentable state. I'll execute the code then, and drop more reviews if needed

[github-actions]

@Souvik9205, please resolve all open reviews!

[github-actions]

@Souvik9205, please resolve all open reviews; otherwise this PR will be closed after Tue Apr 01 2025 14:33:05 GMT+0000 (Coordinated Universal Time)!

[rajdip-b]

I have dropped quite a few reviews with "here". Need the styles updated for them

[Souvik9205]

updated UI

[kriptonian1]

LGTM

[rajdip-b]

🎉 This PR is included in version 2.14.0-stage.23 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

[rajdip-b]

🎉 This PR is included in version 2.14.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀