feat(project): Edit project feature #685

Swastik19Nit · 2025-02-03T10:20:29Z

User description

Description

_Description

Added change tracking functionality to the EditProjectSheet component to fix the issue of editing the project_

Fixes #627

Dependencies

jotai - For state management
sonner - For toast notifications
@keyshade/api-client - For API interactions
@/components/ui/* - Internal UI components (Sheet, Button, Label, Input, Switch)

Future Improvements

Add field-level validation before submission
Implement optimistic updates to improve perceived performance
Add ability to track unsaved changes and warn users before closing
Consider adding form state management library (e.g., react-hook-form) for more complex form handling
Add loading states for individual fields during update
Implement retry logic for failed API calls

Mentions

@rajdip-b

Screenshots of relevant screens

Add screenshots of relevant screens

Developer's checklist

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

If changes are made in the code:

[ .] I have followed the coding guidelines
[ .] My changes in code generate no new warnings
[ .] My changes are breaking another fix/feature of the project
[. ] I have added test cases to show that my feature works
[ .] I have added relevant screenshots in my PR
[ .] There are no UI/UX issues

Documentation Update

[ .] This PR requires an update to the documentation at docs.keyshade.xyz
[ .] I have made the necessary updates to the documentation, or no documentation changes are required.

PR Type

Enhancement, Bug fix

Description

Implemented full functionality for editing projects in EditProjectSheet.
- Added state management for form data and initial data.
- Integrated API calls for updating project details.
- Added error handling and toast notifications for user feedback.
Enhanced ProjectCard to support editing and display project access levels.
- Added SVG icons for access levels.
- Improved context menu for edit and delete actions.
Fixed CreateProjectDialogue to bind accessLevel value dynamically.

Changes walkthrough 📝

Relevant files

Bug fix

index.tsx `Fix access level binding in project creation` apps/platform/src/components/dashboard/project/createProjectDialogue/index.tsx Updated `Select` component to dynamically bind `accessLevel` value. Improved state management for project creation.	+1/-1

Enhancement

index.tsx `Implement full functionality for editing projects` apps/platform/src/components/dashboard/project/editProjectSheet/index.tsx Added state management for form data and initial data. Integrated API calls for updating project details. Implemented error handling and toast notifications. Added logic to track and reset unsaved changes.	+183/-25
index.tsx `Enhance project card with edit functionality and access level display` apps/platform/src/components/dashboard/project/projectCard/index.tsx Added support for editing projects via `handleEditProject`. Displayed project access levels with corresponding SVG icons. Improved context menu for edit and delete actions.	+37/-13

Need help?
Type /help how to ... in the comments thread for any questions about Qodo Merge usage.
Check out the documentation for more information.

codiumai-pr-agent-free · 2025-02-03T10:21:01Z

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

🎫 Ticket compliance analysis ✅ 627 - PR Code Verified Compliant requirements: Make the "Edit" project sheet functional by calling endpoints to edit the project Allow editing project name, description and store private key settings Show appropriate feedback messages to users Integrate with existing API client update project endpoint Requires further human verification: Verify that the edit functionality works correctly in the browser Check that error messages are displayed properly Validate that form validation works as expected
⏱️ Estimated effort to review: 3 🔵🔵🔵⚪⚪
🧪 No relevant tests
🔒 No security concerns identified
⚡ Recommended focus areas for review Error Handling The error handling in handleSubmit() may need refinement. The catch block has multiple type checks but could miss some error scenarios. Consider adding a default error case. } catch (error) { console.error('Update project error:', error) if (error instanceof Response && error.status === 404) { toast.error('Project not found. Please refresh the page and try again.') } else if (error instanceof SyntaxError) { toast.error('Invalid response from server. Please try again later.') } else if (error instanceof Error) { toast.error(`Error: ${error.message}`) } else { toast.error('An unexpected error occurred while updating the project') } } finally { Page Reload Using window.location.reload() after successful update is not ideal for user experience. Consider using state management to update the UI without a full page reload. window.location.reload()

codiumai-pr-agent-free · 2025-02-03T10:21:22Z

PR Code Suggestions ✨

Explore these optional code suggestions:

Category	Suggestion	Score
Security	Sanitize user input data Add input sanitization for project name and description to prevent XSS attacks and invalid characters before sending to the server. apps/platform/src/components/dashboard/project/editProjectSheet/index.tsx [74-79] const changes: Partial<FormData> = {} if (formData.name !== initialData.name) { - changes.name = formData.name.trim() + changes.name = formData.name.trim().replace(/[<>]/g, '') } if (formData.description !== initialData.description) { - changes.description = formData.description.trim() + changes.description = formData.description.trim().replace(/[<>]/g, '') } Apply this suggestion Suggestion importance[1-10]: 8 Why: Basic input sanitization is crucial for security to prevent XSS attacks. The suggestion adds important protection while preserving the core functionality.	8
General	Add input length validation Add validation for project name length before submitting to prevent potential issues with overly long names. Project names should typically have a reasonable maximum length. apps/platform/src/components/dashboard/project/editProjectSheet/index.tsx [100-103] -if (changes.name !== undefined && !changes.name) { - toast.error('Project name is required') - return +if (changes.name !== undefined) { + if (!changes.name) { + toast.error('Project name is required') + return + } + if (changes.name.length > 100) { + toast.error('Project name must be 100 characters or less') + return + } } Apply this suggestion Suggestion importance[1-10]: 7 Why: Adding length validation for project names is important for data integrity and UX. The suggestion provides a reasonable limit and clear error message.	7

rajdip-b

Could you also post a screenshot of the feature?

apps/platform/src/components/dashboard/project/editProjectSheet/index.tsx

Swastik19Nit · 2025-02-03T15:37:15Z

@rajdip-b

"I understand now, sir. I will share the screenshot as well and make all the proposed changes by midnight. Thank you for your support!"

Swastik19Nit · 2025-02-03T19:14:33Z

Screencast from 2025-02-04 00-42-54.webm
@rajdip-b

ScreenCast

apps/platform/src/components/dashboard/project/editProjectSheet/index.tsx

…s && Clear selected project state when closing sheet or after successful update

kriptonian1

LGTM 🚀🚀🚀

## [2.11.0-stage.15](v2.11.0-stage.14...v2.11.0-stage.15) (2025-02-06) ### 🚀 Features * **project:** Edit project feature ([#685](#685)) ([a906920](a906920))

rajdip-b · 2025-02-06T15:32:51Z

🎉 This PR is included in version 2.11.0-stage.15 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

## [2.11.0](v2.10.0...v2.11.0) (2025-02-10) ### 🚀 Features * **api, schema:** Add preview field in API Key ([#680](#680)) ([06d8c44](06d8c44)) * **api:** Workspace-membership invitationAccepted included ([#665](#665)) ([3877249](3877249)) * **platform:** Add CopySVG icon to the Slug component and update imports ([#677](#677)) ([2ad93ba](2ad93ba)) * **platform:** Add Google OAuth ([#689](#689)) ([ad3a3d2](ad3a3d2)) * **platform:** Add new access level SVGs and integrate into ProjectCard component ([#678](#678)) ([cc3ef77](cc3ef77)) * **platform:** Add new design for slug ([#675](#675)) ([2b8985c](2b8985c)) * **platform:** Add SVGs to projectTabs ([#673](#673)) ([37bfddf](37bfddf)) * **platform:** Added the feature for deleting a [secure] ([#674](#674)) ([37e7960](37e7960)) * **platform:** Edit [secure] in project ([#684](#684)) ([1e34030](1e34030)) * **platform:** Restructure workspace settings and user settings ([#682](#682)) ([cd0013a](cd0013a)) * **platform:** Update table ui and change variable to accordion ([#676](#676)) ([71e9ae9](71e9ae9)) * **project:** Edit project feature ([#685](#685)) ([a906920](a906920)) * Update details in listing [secure]s ([#686](#686)) ([84aa5f4](84aa5f4)) * Variables listing revamp ([#735](#735)) ([38b42fa](38b42fa)) ### 🐛 Bug Fixes * **api:** Convert email to lowercase ([#694](#694)) ([b41db33](b41db33)) * **api:** Github OAuth redirect not working ([#692](#692)) ([3495f8a](3495f8a)) * **api:** Project hard sync existing entities deleted ([#660](#660)) ([3632217](3632217)) * **cli:** Version flag causing errors ([#679](#679)) ([65bb70b](65bb70b)) * **platform:** ContextMenu not working on variable card ([#688](#688)) ([fbb147a](fbb147a)) * **platform:** Fixed the typo in query params ([#723](#723)) ([6c6bb7f](6c6bb7f)) ### 📚 Documentation * Added section for building packages ([#720](#720)) ([ecfde92](ecfde92)) ### 🔧 Miscellaneous Chores * **api:** Remove failing environment tests ([d1b9767](d1b9767)) * **cli:** Bumped CLI to v2.5.1 ([2d39815](2d39815)) * **platform:** Fixed formatting ([81f86de](81f86de)) * **release:** 2.11.0-stage.1 [skip ci] ([b442fe0](b442fe0)), closes [#675](#675) * **release:** 2.11.0-stage.10 [skip ci] ([cf34066](cf34066)), closes [#665](#665) * **release:** 2.11.0-stage.11 [skip ci] ([1344cf1](1344cf1)), closes [#660](#660) * **release:** 2.11.0-stage.12 [skip ci] ([92cecfc](92cecfc)), closes [#686](#686) * **release:** 2.11.0-stage.13 [skip ci] ([c91d48a](c91d48a)), closes [#684](#684) * **release:** 2.11.0-stage.14 [skip ci] ([5d20407](5d20407)), closes [#688](#688) * **release:** 2.11.0-stage.15 [skip ci] ([110e265](110e265)), closes [#685](#685) * **release:** 2.11.0-stage.16 [skip ci] ([2a7cba6](2a7cba6)), closes [#689](#689) * **release:** 2.11.0-stage.17 [skip ci] ([e071a74](e071a74)), closes [#692](#692) [#690](#690) * **release:** 2.11.0-stage.18 [skip ci] ([94f3938](94f3938)), closes [#694](#694) * **release:** 2.11.0-stage.19 [skip ci] ([f9b095c](f9b095c)), closes [#723](#723) [#720](#720) * **release:** 2.11.0-stage.2 [skip ci] ([f9d05de](f9d05de)), closes [#673](#673) * **release:** 2.11.0-stage.20 [skip ci] ([02972f2](02972f2)), closes [#735](#735) * **release:** 2.11.0-stage.3 [skip ci] ([c2398a6](c2398a6)), closes [#677](#677) * **release:** 2.11.0-stage.4 [skip ci] ([6c7e41a](6c7e41a)), closes [#676](#676) * **release:** 2.11.0-stage.5 [skip ci] ([defdbcd](defdbcd)), closes [#678](#678) * **release:** 2.11.0-stage.6 [skip ci] ([5060fe7](5060fe7)), closes [#679](#679) * **release:** 2.11.0-stage.7 [skip ci] ([b2be010](b2be010)), closes [#674](#674) * **release:** 2.11.0-stage.8 [skip ci] ([972e55b](972e55b)), closes [#680](#680) * **release:** 2.11.0-stage.9 [skip ci] ([fd92c3b](fd92c3b)), closes [#682](#682) ### 🔨 Code Refactoring * **platform:** Updated the [secure] table and changed edit variable dialog to a sheet ([#690](#690)) ([f51ad34](f51ad34))

rajdip-b · 2025-02-10T14:22:28Z

🎉 This PR is included in version 2.11.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Edit project feature

e528cd2

Swastik19Nit requested a review from kriptonian1 as a code owner February 3, 2025 10:20

codiumai-pr-agent-free bot added the Review effort [1-5]: 3 label Feb 3, 2025

rajdip-b changed the title ~~Edit project feature~~ feat(project): Edit project feature Feb 3, 2025

Merge branch 'develop' into feat/edit-project

a79c266

rajdip-b requested changes Feb 3, 2025

View reviewed changes

Modifications as suggested

7114e9f

rajdip-b requested changes Feb 4, 2025

View reviewed changes

apps/platform/src/components/dashboard/project/editProjectSheet/index.tsx Outdated Show resolved Hide resolved

apps/platform/src/components/dashboard/project/editProjectSheet/index.tsx Show resolved Hide resolved

Fix name validation to check for empty strings instead of falsy value…

c62f77f

…s && Clear selected project state when closing sheet or after successful update

rajdip-b approved these changes Feb 5, 2025

View reviewed changes

Merge branch 'develop' into feat/edit-project

0eef110

kriptonian1 approved these changes Feb 6, 2025

View reviewed changes

Merge branch 'develop' into feat/edit-project

f3478b6

rajdip-b merged commit a906920 into keyshade-xyz:develop Feb 6, 2025
2 checks passed

rajdip-b pushed a commit that referenced this pull request Feb 6, 2025

chore(release): 2.11.0-stage.15 [skip ci]

110e265

## [2.11.0-stage.15](v2.11.0-stage.14...v2.11.0-stage.15) (2025-02-06) ### 🚀 Features * **project:** Edit project feature ([#685](#685)) ([a906920](a906920))

rajdip-b added the released on @develop label Feb 6, 2025

rajdip-b added the released label Feb 10, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(project): Edit project feature #685

feat(project): Edit project feature #685

Swastik19Nit commented Feb 3, 2025 •

edited by codiumai-pr-agent-free bot

Loading

codiumai-pr-agent-free bot commented Feb 3, 2025

codiumai-pr-agent-free bot commented Feb 3, 2025 •

edited

Loading

rajdip-b left a comment

Swastik19Nit commented Feb 3, 2025

Swastik19Nit commented Feb 3, 2025 •

edited

Loading

kriptonian1 left a comment

rajdip-b commented Feb 6, 2025

rajdip-b commented Feb 10, 2025

feat(project): Edit project feature #685

feat(project): Edit project feature #685

Conversation

Swastik19Nit commented Feb 3, 2025 • edited by codiumai-pr-agent-free bot Loading

User description

Description

Dependencies

Future Improvements

Mentions

Screenshots of relevant screens

Developer's checklist

Documentation Update

PR Type

Description

Changes walkthrough 📝

codiumai-pr-agent-free bot commented Feb 3, 2025

PR Reviewer Guide 🔍

codiumai-pr-agent-free bot commented Feb 3, 2025 • edited Loading

PR Code Suggestions ✨

rajdip-b left a comment

Choose a reason for hiding this comment

Swastik19Nit commented Feb 3, 2025

Swastik19Nit commented Feb 3, 2025 • edited Loading

kriptonian1 left a comment

Choose a reason for hiding this comment

rajdip-b commented Feb 6, 2025

rajdip-b commented Feb 10, 2025

Swastik19Nit commented Feb 3, 2025 •

edited by codiumai-pr-agent-free bot

Loading

codiumai-pr-agent-free bot commented Feb 3, 2025 •

edited

Loading

Swastik19Nit commented Feb 3, 2025 •

edited

Loading