feat(ui): Workspace CRUD #261
Conversation
- workspace read team members
✅ Deploy Preview for reearth-flow ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
- Add methods for members Crud on workspace
- fixed type
ui/src/features/WorkspaceSettings/components/GeneralSettings.tsx
Outdated
Show resolved
Hide resolved
ui/src/features/WorkspaceSettings/components/MembersSettings.tsx
Outdated
Show resolved
Hide resolved
ui/src/features/WorkspaceSettings/components/MembersSettings.tsx
Outdated
Show resolved
Hide resolved
ui/src/features/WorkspaceSettings/components/MembersSettings.tsx
Outdated
Show resolved
Hide resolved
WalkthroughThe changes enhance user and workspace management features across several components. This includes updating hooks for retrieving and displaying user data, refactoring workspace-related functionalities, adding new GraphQL mutations and queries, and switching role types to enums. These modifications streamline data handling, improve error management, and enhance the UI for collaborative workspace settings. Changes
Tip Early access features: enabledWe are currently testing the following features in early access:
Note:
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 20
Outside diff range and nitpick comments (2)
ui/src/features/WorkspaceSettings/components/IntegrationsSettings.tsx (2)
Line range hint
19-32: Fix role duplication and ensure consistency.The
Role.Readeris duplicated and should be replaced withRole.Maintainer.{ id: Role.Owner, title: t("Owner") }, { id: Role.Reader, title: t("Reader") }, { id: Role.Maintainer, title: t("Maintainer") }, { id: Role.Writer, title: t("Writer") },
Line range hint
55-55: Add a key to the button component.The button component inside the map function should have a unique key.
<Button key={integration.id} className="h-[25px]" size="sm" variant="destructive"> {t("Remove selected")} </Button>
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (25)
- ui/src/features/NotFoundPage/index.tsx (1 hunks)
- ui/src/features/PageWrapper/WorkspaceId.tsx (2 hunks)
- ui/src/features/TopNavigation/components/UserNavigation.tsx (2 hunks)
- ui/src/features/WorkspaceSettings/components/GeneralSettings.tsx (2 hunks)
- ui/src/features/WorkspaceSettings/components/IntegrationsSettings.tsx (2 hunks)
- ui/src/features/WorkspaceSettings/components/MembersSettings.tsx (2 hunks)
- ui/src/lib/gql/gen/gql.ts (2 hunks)
- ui/src/lib/gql/gen/graphql.ts (2 hunks)
- ui/src/lib/gql/gen/plugins/graphql-request.ts (7 hunks)
- ui/src/lib/gql/user/queries.graphql (1 hunks)
- ui/src/lib/gql/user/useApi.ts (1 hunks)
- ui/src/lib/gql/user/useQueries.ts (1 hunks)
- ui/src/lib/gql/workspace/queries.graphql (2 hunks)
- ui/src/lib/gql/workspace/useApi.ts (4 hunks)
- ui/src/lib/gql/workspace/useQueries.ts (4 hunks)
- ui/src/lib/i18n/locales/en.json (2 hunks)
- ui/src/lib/i18n/locales/es.json (2 hunks)
- ui/src/lib/i18n/locales/fr.json (2 hunks)
- ui/src/lib/i18n/locales/ja.json (2 hunks)
- ui/src/lib/i18n/locales/zh.json (2 hunks)
- ui/src/pages/LoadingPage.tsx (1 hunks)
- ui/src/routes/workspace_.$workspaceId_.settings.$tab.lazy.tsx (1 hunks)
- ui/src/types/member.ts (1 hunks)
- ui/src/types/user.ts (1 hunks)
- ui/src/types/workspace.ts (2 hunks)
Files skipped from review due to trivial changes (2)
- ui/src/routes/workspace_.$workspaceId_.settings.$tab.lazy.tsx
- ui/src/types/user.ts
Additional comments not posted (57)
ui/src/lib/gql/user/queries.graphql (1)
10-16: Ensure proper error handling for theSearchUserquery.The
SearchUserquery looks correct, but ensure that the implementation handles cases where the user is not found or there are errors in the GraphQL response.Please verify that the components using this query handle errors appropriately.
ui/src/types/member.ts (1)
4-9: EnumRolelooks correct.The new
Roleenum is well-defined and improves type safety.ui/src/types/workspace.ts (3)
7-7: Ensure all workspace objects includemembers.The
membersfield is now required in theWorkspacetype. Ensure that all workspace objects in the codebase include this field.Please verify that all workspace objects in the codebase include the
membersfield.
11-12: Check for correct usage ofWorkspaceMutation.The
WorkspaceMutationtype is added. Ensure that it is used correctly in all relevant mutations.Please verify that the
WorkspaceMutationtype is used correctly in all relevant mutations.
16-17: Ensure correct handling of optionalworkspacesfield.The
workspacesfield in theGetWorkspacestype is now optional. Ensure that the code handles cases where this field is undefined.Please verify that the code handles cases where the
workspacesfield is undefined.ui/src/pages/LoadingPage.tsx (1)
9-10: Ensure proper error handling foruseGetMehook.The
useGetMehook is used to fetch user data. Ensure that the implementation handles loading and error states properly.Please verify that the implementation handles loading and error states properly.
ui/src/lib/gql/user/useApi.ts (4)
1-1: Import statement update looks good.The import statement has been updated to include
SearchUserfrom@flow/types/user. This is necessary for the newsearchUserfunction.
7-7: Consider renaming the key for consistency.The
SearchUserkey inUserQueryKeysis named "User". Consider renaming it to "SearchUser" for consistency and clarity.- SearchUser = "User", + SearchUser = "SearchUser",
11-11: Ensure proper error handling and data validation.The
useGetMeQueryandsearchUserQueryfunctions should include error handling and data validation to ensure robustness.Do you have error handling and data validation in place for these queries?
13-18: Ensure data structure consistency.The
useGetMefunction returns an object withmeandrestproperties. Ensure that the data structure returned byuseGetMeQueryis consistent with this format.Are there any other parts of the codebase relying on this data structure?
ui/src/features/PageWrapper/WorkspaceId.tsx (1)
15-15: Ensure proper usage of theuseCurrentWorkspacehook.The underscore variable
_is used to ignore the first element of the array returned byuseCurrentWorkspace. Ensure that this is intentional and does not affect other parts of the code.Is the first element of the array intentionally ignored here?
ui/src/features/NotFoundPage/index.tsx (1)
13-14: Ensure proper error handling and data validation.The
useGetMefunction should include error handling and data validation to ensure robustness.Do you have error handling and data validation in place for this query?
ui/src/lib/gql/user/useQueries.ts (1)
10-25: Ensure proper error handling and data validation.The
useGetMeQueryfunction should include error handling and data validation to ensure robustness.Do you have error handling and data validation in place for this query?
ui/src/lib/gql/workspace/queries.graphql (3)
54-60: AddMemberToWorkspace Mutation: Ensure Error HandlingThe
AddMemberToWorkspacemutation is correctly defined. However, ensure that the client-side implementation handles potential errors gracefully, such as user not found or user already a member.
62-68: RemoveMemberFromWorkspace Mutation: Ensure Proper ValidationThe
RemoveMemberFromWorkspacemutation is correctly defined. Ensure that the client-side implementation validates that the user being removed is indeed a member of the workspace and handles errors appropriately.
70-76: UpdateMemberOfWorkspace Mutation: Verify Role ChangesThe
UpdateMemberOfWorkspacemutation is correctly defined. Verify that role changes are properly validated and that only authorized users can update member roles.ui/src/features/WorkspaceSettings/components/GeneralSettings.tsx (2)
14-14: Ensure Proper Cleanup of Workspace StateEnsure that the
useWorkspacehook properly cleans up or resets any state related to the workspace when the component unmounts or the workspace changes.
17-18: Consider Using useMemo or useCallbackThe state variables
workspaceNameandloadingcould potentially benefit fromuseMemooruseCallbackto optimize performance, especially if they are passed to other components or hooks.ui/src/features/TopNavigation/components/UserNavigation.tsx (2)
36-37: Ensure Consistent Naming for HooksThe
useGetMehook is used but destructured fromuseUser. Ensure that this naming is consistent across the codebase to avoid confusion.
50-55: Handle Missing User Data GracefullyThe
meobject is used to display the user's name. Ensure that the UI handles cases wheremeis null or undefined gracefully, possibly by showing a default avatar or name.ui/src/lib/i18n/locales/en.json (3)
120-121: Ensure Consistency in Error MessagesThe error messages "Failed to delete Workspace" and "Failed to update Workspace" are added. Ensure consistency in capitalization and punctuation across all error messages.
123-125: Verify Role Names ConsistencyThe role names "Owner," "Reader," "Maintainer," and "Writer" are added. Verify that these names are consistent with the roles defined in the application and used across the UI.
135-136: Localization for Member ManagementThe strings "Enter email" and "Add Member" are added for member management. Ensure that these strings are used appropriately in the UI and are user-friendly.
ui/src/lib/i18n/locales/zh.json (3)
120-121: Verify the Chinese translations for accuracy.Ensure that the translations for "Failed to delete Workspace" and "Failed to update Workspace" are accurate and contextually appropriate.
123-125: Verify the Chinese translations for role names.Ensure that the translations for "Owner," "Reader," "Maintainer," and "Writer" are accurate and contextually appropriate.
135-136: Verify the Chinese translations for member management.Ensure that the translations for "Enter email" and "Add Member" are accurate and contextually appropriate.
ui/src/lib/i18n/locales/fr.json (3)
120-121: Verify the French translations for accuracy.Ensure that the translations for "Failed to delete Workspace" and "Failed to update Workspace" are accurate and contextually appropriate.
123-125: Verify the French translations for role names.Ensure that the translations for "Owner," "Reader," "Maintainer," and "Writer" are accurate and contextually appropriate.
135-136: Verify the French translations for member management.Ensure that the translations for "Enter email" and "Add Member" are accurate and contextually appropriate.
ui/src/lib/i18n/locales/es.json (3)
120-121: Verify the Spanish translations for accuracy.Ensure that the translations for "Failed to delete Workspace" and "Failed to update Workspace" are accurate and contextually appropriate.
123-125: Verify the Spanish translations for role names.Ensure that the translations for "Owner," "Reader," "Maintainer," and "Writer" are accurate and contextually appropriate.
135-136: Verify the Spanish translations for member management.Ensure that the translations for "Enter email" and "Add Member" are accurate and contextually appropriate.
ui/src/lib/gql/workspace/useApi.ts (1)
16-19: Ensure proper error handling for new mutations.Verify that the added mutations (
updateWorkspaceMutation,addMemberToWorkspaceMutation,removeMemberFromWorkspaceMutation,updateMemberOfWorkspaceMutation) handle errors appropriately and consistently.ui/src/lib/gql/workspace/useQueries.ts (2)
74-78: Simplify flatMap usage.The
flatMapcan be simplified by directly returning the result ofcreateNewWorkspaceObject.return data?.me?.workspaces.flatMap(w => createNewWorkspaceObject(w) ? [createNewWorkspaceObject(w) as Workspace] : [], );
85-90: Simplify conditional return.The return statement can be simplified using optional chaining.
return data?.node?.__typename === "Workspace" ? createNewWorkspaceObject(data.node) : undefined;ui/src/features/WorkspaceSettings/components/MembersSettings.tsx (3)
31-31: Optimize the use ofuseGetMehook.Destructure the
meobject directly from the hook.const { me } = useGetMe();
41-43: Optimize the filter function.The filter function can be simplified.
const members = currentWorkspace?.members?.filter( m => "userId" in m && (currentFilter === "all" || m.role === currentFilter), ) as UserMember[];
136-137: Improve accessibility by adding aria-disabled attribute.Add the
aria-disabledattribute to theDropdownMenuTriggerto improve accessibility.<DropdownMenuTrigger disabled={m.userId === me?.id} aria-disabled={m.userId === me?.id} className={`flex-1 flex items-center gap-1 ${m.userId === me?.id ? "opacity-50" : ""}`}> <p className="text-sm">{t("Change role")}</p> <CaretDown className="w-2 h-2" /> </DropdownMenuTrigger>ui/src/lib/gql/__gen__/gql.ts (5)
42-42: Verify the correctness of the newSearchUserquery.Ensure that the
SearchUserquery works as expected and returns the correct data.
46-46: Verify the correctness of the newWorkspacemutations.Ensure that the new
Workspacemutations (AddMemberToWorkspace,RemoveMemberFromWorkspace,UpdateMemberOfWorkspace) work as expected and return the correct data.
Line range hint
581-589: Ensure the newmembersfield in theWorkspacefragment is correct.Verify that the
membersfield in theWorkspacefragment is correctly implemented and returns the expected data.Verification successful
Verified: The
membersfield in theWorkspacefragment is correctly implemented and returns the expected data.
ui/src/lib/gql/workspace/queries.graphql: TheWorkspacefragment and themembersfield are correctly defined and used.api/gql/workspace.graphql: Themembersfield is correctly referenced.Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `members` field in the `Workspace` fragment. # Test: Search for the function usage. Expect: Only occurrences of the new field. rg --type graphql $'fragment Workspace'Length of output: 72
Script:
#!/bin/bash # Description: Verify the `members` field in the `Workspace` fragment. # Test 1: Search for the `Workspace` fragment definition in .graphql files. rg --glob '*.graphql' 'fragment Workspace' # Test 2: Search for the usage of the `members` field in .graphql files. rg --glob '*.graphql' 'members'Length of output: 261
17-17: Verify the correctness of the newSearchUserquery.Ensure that the
SearchUserquery works as expected and returns the correct data.Verification successful
The
SearchUserquery is correctly implemented and integrated.The
SearchUserquery is found in multiple locations across the codebase, indicating proper usage and integration.
ui/src/lib/gql/__gen__/gql.tsui/src/lib/gql/__gen__/plugins/graphql-request.tsui/src/lib/gql/user/useQueries.tsui/src/lib/gql/user/useApi.tsapi/internal/adapter/gql/resolver_query.goapi/internal/adapter/gql/loader_user.goapi/internal/adapter/gql/generated.goapi/e2e/gql_user_test.goScripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `SearchUser` query functionality. # Test: Search for the function usage. Expect: Only occurrences of the new query. rg --type graphql $'query SearchUser'Length of output: 70
Script:
#!/bin/bash # Description: Verify the `SearchUser` query functionality. # Test: Search for the function usage in TypeScript files. Expect occurrences of the new query. rg --type ts 'query SearchUser'Length of output: 843
Script:
#!/bin/bash # Description: Verify the usage of the `SearchUser` query. # Test: Search for the usage of the `SearchUser` query in the codebase. rg 'SearchUser'Length of output: 4546
18-18: Verify the correctness of the newWorkspacemutations.Ensure that the new
Workspacemutations (AddMemberToWorkspace,RemoveMemberFromWorkspace,UpdateMemberOfWorkspace) work as expected and return the correct data.ui/src/lib/gql/__gen__/plugins/graphql-request.ts (9)
508-509: Ensure the newSearchUserquery is correct.Verify that the
SearchUserquery is correctly implemented and returns the expected data.
517-517: Ensure the newCreateWorkspacemutation variables are correct.Verify that the
CreateWorkspacemutation variables are correctly implemented and used.
529-529: Ensure the newGetWorkspaceByIdquery is correct.Verify that the
GetWorkspaceByIdquery is correctly implemented and returns the expected data.Verification successful
The
GetWorkspaceByIdquery is correctly implemented.The query is present in multiple relevant files and appears to be properly integrated.
ui/src/lib/gql/__gen__/plugins/graphql-request.tsui/src/lib/gql/__gen__/gql.tsui/src/lib/gql/workspace/queries.graphqlScripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `GetWorkspaceById` query. # Test: Search for the function usage. Expect: Only occurrences of the new query. rg --type graphql $'query GetWorkspaceById'Length of output: 76
Script:
#!/bin/bash # Description: Identify GraphQL query files and verify the `GetWorkspaceById` query. # Step 1: Find files containing GraphQL queries. graphql_files=$(rg --files-with-matches 'query ') # Step 2: Search for the `GetWorkspaceById` query within identified GraphQL files. if [ -n "$graphql_files" ]; then rg 'query GetWorkspaceById' $graphql_files else echo "No GraphQL query files found." fiLength of output: 5739
503-505: Ensure the newSearchUserquery variables are correct.Verify that the
SearchUserquery variables are correctly implemented and used.Verification successful
The
SearchUserquery variables are correctly implemented and used.The
SearchUserquery variables are defined and utilized across multiple files, ensuring proper integration and functionality.
ui/src/lib/gql/__gen__/plugins/graphql-request.tsui/src/lib/gql/user/useApi.tsui/src/lib/gql/user/useQueries.tsui/src/lib/gql/user/queries.graphqlScripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `SearchUser` query variables. # Test: Search for the function usage. Expect: Only occurrences of the new variables. rg --type graphql $'query SearchUser'Length of output: 70
Script:
#!/bin/bash # Description: Verify the `SearchUser` query variables. # Test: Search for the function usage. Expect: Only occurrences of the new variables. rg 'SearchUser'Length of output: 4546
552-554: Ensure the newRemoveMemberFromWorkspacemutation variables are correct.Verify that the
RemoveMemberFromWorkspacemutation variables are correctly implemented and used.Verification successful
The
RemoveMemberFromWorkspacemutation variables are correctly implemented and used.
- The mutation variables are defined and referenced consistently across multiple files, ensuring correct implementation.
ui/src/lib/gql/workspace/useQueries.tsui/src/lib/gql/__gen__/graphql.tsui/src/lib/gql/__gen__/plugins/graphql-request.tsui/src/lib/gql/__gen__/gql.tsScripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `RemoveMemberFromWorkspace` mutation variables. # Test: Search for the function usage. Expect: Only occurrences of the new variables. rg --type graphql $'mutation RemoveMemberFromWorkspace'Length of output: 88
Script:
#!/bin/bash # Description: Verify the `RemoveMemberFromWorkspace` mutation variables. # Test: Search for the usage of `RemoveMemberFromWorkspace` mutation in TypeScript and JavaScript files. rg 'RemoveMemberFromWorkspace' --type js --type tsLength of output: 9327
559-561: Ensure the newUpdateMemberOfWorkspacemutation variables are correct.Verify that the
UpdateMemberOfWorkspacemutation variables are correctly implemented and used.Verification successful
The
UpdateMemberOfWorkspacemutation variables are correctly implemented and used.The
UpdateMemberOfWorkspaceInputtype is defined and consistently used across multiple files, ensuring that the mutation variables are correctly implemented.
ui/src/lib/gql/__gen__/graphql.ts: Definition and usage ofUpdateMemberOfWorkspaceInput.ui/src/lib/gql/__gen__/plugins/graphql-request.ts: Usage ofUpdateMemberOfWorkspaceInput.api/internal/adapter/gql/generated.go: Various usages and unmarshalling ofUpdateMemberOfWorkspaceInput.api/gql/workspace.graphql: Definition ofUpdateMemberOfWorkspaceInputand its usage in the mutation.Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `UpdateMemberOfWorkspace` mutation variables. # Test: Search for the function usage. Expect: Only occurrences of the new variables. rg --type graphql $'mutation UpdateMemberOfWorkspace'Length of output: 86
Script:
#!/bin/bash # Description: Verify the `UpdateMemberOfWorkspace` mutation variables. # Test: Search for the function usage. Expect: Only occurrences of the new variables. rg 'mutation UpdateMemberOfWorkspace'Length of output: 4375
Script:
#!/bin/bash # Description: Verify the `UpdateMemberOfWorkspaceInput` type and its usage. # Test: Search for the definition and usage of `UpdateMemberOfWorkspaceInput`. rg 'UpdateMemberOfWorkspaceInput'Length of output: 9395
522-522: Ensure the newGetWorkspacesquery is correct.Verify that the
GetWorkspacesquery is correctly implemented and returns the expected data.
536-536: Ensure the newUpdateWorkspacemutation variables are correct.Verify that the
UpdateWorkspacemutation variables are correctly implemented and used.Verification successful
The
UpdateWorkspacemutation variables are correctly implemented and used.The
UpdateWorkspaceInputtype and its usage in theUpdateWorkspacemutation have been verified across multiple files and are consistent with the expected implementation.
- Verified in
ui/src/lib/gql/workspace/queries.graphql- Verified in
ui/src/lib/gql/__gen__/gql.ts- Verified in
ui/src/lib/gql/__gen__/plugins/graphql-request.ts- Verified in
api/gql/workspace.graphql- Verified in
api/internal/adapter/gql/generated.goScripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `UpdateWorkspace` mutation variables. # Test: Search for the function usage. Expect: Only occurrences of the new variables. rg --type graphql $'mutation UpdateWorkspace'Length of output: 78
Script:
#!/bin/bash # Description: Verify the `UpdateWorkspace` mutation variables. # Test: Search for the mutation usage. Expect: Only occurrences of the new variables. rg 'mutation UpdateWorkspace'Length of output: 4335
Script:
#!/bin/bash # Description: Verify the `UpdateWorkspace` mutation variables. # Find the definition of `UpdateWorkspaceInput`. rg 'input UpdateWorkspaceInput' # Find all usages of the `UpdateWorkspace` mutation. rg 'UpdateWorkspace'Length of output: 14675
545-547: Ensure the newAddMemberToWorkspacemutation variables are correct.Verify that the
AddMemberToWorkspacemutation variables are correctly implemented and used.Verification successful
The
AddMemberToWorkspacemutation variables appear to be correctly implemented and used.The mutation
AddMemberToWorkspaceis consistently defined with theinput: AddMemberToWorkspaceInput!variable across multiple files:
ui/src/lib/gql/workspace/queries.graphqlui/src/lib/gql/__gen__/gql.tsui/src/lib/gql/__gen__/plugins/graphql-request.tsThese definitions confirm that the mutation variables are correctly implemented and used.
Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify the `AddMemberToWorkspace` mutation variables. # Test: Search for the function usage. Expect: Only occurrences of the new variables. rg --type graphql $'mutation AddMemberToWorkspace'Length of output: 83
Script:
#!/bin/bash # Description: Verify the `AddMemberToWorkspace` mutation variables. # Test: Search for the usage of the `AddMemberToWorkspace` mutation in all files. rg 'mutation AddMemberToWorkspace'Length of output: 4360
Script:
#!/bin/bash # Description: Verify the `AddMemberToWorkspace` mutation variables. # Extract the relevant parts of the identified files to verify the correct implementation and usage of the `AddMemberToWorkspace` mutation variables. rg --context 5 'mutation AddMemberToWorkspace' ui/src/lib/gql/workspace/queries.graphql rg --context 5 'mutation AddMemberToWorkspace' ui/src/lib/gql/__gen__/gql.ts rg --context 5 'mutation AddMemberToWorkspace' ui/src/lib/gql/__gen__/plugins/graphql-request.tsLength of output: 6777
ui/src/lib/gql/__gen__/graphql.ts (5)
514-516: LGTM!The
SearchUserQueryVariablestype definition is correct and follows the established pattern.
519-519: LGTM!The
SearchUserQuerytype definition is correct and follows the established pattern.
568-570: LGTM!The
AddMemberToWorkspaceMutationVariablestype definition is correct and follows the established pattern.
573-576: LGTM!The
AddMemberToWorkspaceMutationtype definition is correct and follows the established pattern.
578-586: LGTM!The type definitions for
RemoveMemberFromWorkspaceMutationVariables,RemoveMemberFromWorkspaceMutation,UpdateMemberOfWorkspaceMutationVariables, andUpdateMemberOfWorkspaceMutationare correct and follow the established pattern.Also applies to: 588-596
| const handleUpdateWorkspace = async () => { | ||
| setLoading(true); | ||
| setShowError(undefined); | ||
| if (!currentWorkspace?.id || !workspaceName) return; | ||
| const { workspace } = await updateWorkspace(currentWorkspace?.id, workspaceName); | ||
| setLoading(false); | ||
| if (!workspace) { | ||
| setShowError("update"); | ||
| return; | ||
| } | ||
| }; |
There was a problem hiding this comment.
Handle Errors in Update Workspace
The handleUpdateWorkspace function should also handle potential errors from the updateWorkspace mutation, such as network issues or API errors, and provide user feedback accordingly.
- const { workspace } = await updateWorkspace(currentWorkspace?.id, workspaceName);
+ try {
+ const { workspace } = await updateWorkspace(currentWorkspace?.id, workspaceName);
+ setLoading(false);
+ if (!workspace) {
+ setShowError("update");
+ return;
+ }
+ } catch (error) {
+ setLoading(false);
+ setShowError("update");
+ }Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const handleUpdateWorkspace = async () => { | |
| setLoading(true); | |
| setShowError(undefined); | |
| if (!currentWorkspace?.id || !workspaceName) return; | |
| const { workspace } = await updateWorkspace(currentWorkspace?.id, workspaceName); | |
| setLoading(false); | |
| if (!workspace) { | |
| setShowError("update"); | |
| return; | |
| } | |
| }; | |
| const handleUpdateWorkspace = async () => { | |
| setLoading(true); | |
| setShowError(undefined); | |
| if (!currentWorkspace?.id || !workspaceName) return; | |
| try { | |
| const { workspace } = await updateWorkspace(currentWorkspace?.id, workspaceName); | |
| setLoading(false); | |
| if (!workspace) { | |
| setShowError("update"); | |
| return; | |
| } | |
| } catch (error) { | |
| setLoading(false); | |
| setShowError("update"); | |
| } | |
| }; |
| const addMemberToWorkspace = async ( | ||
| workspaceId: string, | ||
| userId: string, | ||
| role: Role, | ||
| ): Promise<WorkspaceMutation> => { | ||
| const { mutateAsync, ...rest } = addMemberToWorkspaceMutation; | ||
| try { | ||
| const data = await mutateAsync({ workspaceId, userId, role }); | ||
| return { workspace: data, ...rest }; | ||
| } catch (err) { | ||
| return { workspace: undefined, ...rest }; | ||
| } | ||
| }; |
There was a problem hiding this comment.
Consider logging errors for addMemberToWorkspace.
To aid in debugging, consider logging the error in the catch block.
- } catch (err) {
- return { workspace: undefined, ...rest };
+ } catch (err) {
+ console.error("Failed to add member to workspace:", err);
+ return { workspace: undefined, ...rest };Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const addMemberToWorkspace = async ( | |
| workspaceId: string, | |
| userId: string, | |
| role: Role, | |
| ): Promise<WorkspaceMutation> => { | |
| const { mutateAsync, ...rest } = addMemberToWorkspaceMutation; | |
| try { | |
| const data = await mutateAsync({ workspaceId, userId, role }); | |
| return { workspace: data, ...rest }; | |
| } catch (err) { | |
| return { workspace: undefined, ...rest }; | |
| } | |
| }; | |
| try { | |
| const data = await mutateAsync({ workspaceId, userId, role }); | |
| return { workspace: data, ...rest }; | |
| } catch (err) { | |
| console.error("Failed to add member to workspace:", err); | |
| return { workspace: undefined, ...rest }; | |
| } |
| const updateWorkspace = async (workspaceId: string, name: string): Promise<WorkspaceMutation> => { | ||
| const { mutateAsync, ...rest } = updateWorkspaceMutation; | ||
| try { | ||
| const data = await mutateAsync({ workspaceId, name }); | ||
| return { workspace: data, ...rest }; | ||
| } catch (err) { | ||
| return { workspace: undefined, ...rest }; | ||
| } | ||
| }; |
There was a problem hiding this comment.
Consider logging errors for updateWorkspace.
To aid in debugging, consider logging the error in the catch block.
- } catch (err) {
- return { workspace: undefined, ...rest };
+ } catch (err) {
+ console.error("Failed to update workspace:", err);
+ return { workspace: undefined, ...rest };Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const updateWorkspace = async (workspaceId: string, name: string): Promise<WorkspaceMutation> => { | |
| const { mutateAsync, ...rest } = updateWorkspaceMutation; | |
| try { | |
| const data = await mutateAsync({ workspaceId, name }); | |
| return { workspace: data, ...rest }; | |
| } catch (err) { | |
| return { workspace: undefined, ...rest }; | |
| } | |
| }; | |
| const updateWorkspace = async (workspaceId: string, name: string): Promise<WorkspaceMutation> => { | |
| const { mutateAsync, ...rest } = updateWorkspaceMutation; | |
| try { | |
| const data = await mutateAsync({ workspaceId, name }); | |
| return { workspace: data, ...rest }; | |
| } catch (err) { | |
| console.error("Failed to update workspace:", err); | |
| return { workspace: undefined, ...rest }; | |
| } | |
| }; |
| useGetMe, | ||
| searchUser, |
There was a problem hiding this comment.
Ensure proper error handling for the async function.
The searchUserQuery function includes a try-catch block but does not handle the error properly. Consider logging the error or providing feedback to the user.
- try {
- const data = await graphQLContext?.SearchUser({ email });
- if (!data?.searchUser) return;
- return {
- id: data.searchUser.id,
- name: data.searchUser.name,
- email: data.searchUser.email,
- };
- } catch (err) {
- return;
- }
+ try {
+ const data = await graphQLContext?.SearchUser({ email });
+ if (!data?.searchUser) return;
+ return {
+ id: data.searchUser.id,
+ name: data.searchUser.name,
+ email: data.searchUser.email,
+ };
+ } catch (err) {
+ console.error("Failed to search user:", err);
+ throw err;
+ }Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| useGetMe, | |
| searchUser, | |
| useGetMe, | |
| searchUser, | |
| try { | |
| const data = await graphQLContext?.SearchUser({ email }); | |
| if (!data?.searchUser) return; | |
| return { | |
| id: data.searchUser.id, | |
| name: data.searchUser.name, | |
| email: data.searchUser.email, | |
| }; | |
| } catch (err) { | |
| console.error("Failed to search user:", err); | |
| throw err; | |
| } |
| "Owner": "", | ||
| "Reader": "", | ||
| "Maintainer": "", |
There was a problem hiding this comment.
Provide translations for the added role names.
The role names "Owner", "Maintainer", and "Writer" are not translated into Japanese.
"Owner": "オーナー",
"Maintainer": "メンテナ",
"Writer": "ライター",Committable suggestion was skipped due to low confidence.
| @@ -2,9 +2,15 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; | |||
| import { useCallback } from "react"; | |||
|
|
|||
| import { useGraphQLContext } from "@flow/lib/gql"; | |||
| import { Workspace } from "@flow/types"; | |||
| import { Member, Workspace } from "@flow/types"; | |||
There was a problem hiding this comment.
Remove unused import.
The Member type is not used in the file.
- import { Member, Workspace } from "@flow/types";
+ import { Workspace } from "@flow/types";Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { Member, Workspace } from "@flow/types"; | |
| import { Workspace } from "@flow/types"; |
| queryClient.setQueryData([WorkspaceQueryKeys.GetWorkspaces], (data: Workspace[]) => { | ||
| data.splice( | ||
| data.findIndex(w => w.id === workspace?.id), | ||
| 1, | ||
| workspace, | ||
| ); | ||
| return [...data]; | ||
| }); |
There was a problem hiding this comment.
Handle potential null values in query data.
Ensure that data is not null before performing operations on it.
queryClient.setQueryData([WorkspaceQueryKeys.GetWorkspaces], (data: Workspace[] | undefined) => {
if (!data) return [];
data.splice(
data.findIndex(w => w.id === workspace?.id),
1,
workspace,
);
return [...data];
});Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| queryClient.setQueryData([WorkspaceQueryKeys.GetWorkspaces], (data: Workspace[]) => { | |
| data.splice( | |
| data.findIndex(w => w.id === workspace?.id), | |
| 1, | |
| workspace, | |
| ); | |
| return [...data]; | |
| }); | |
| queryClient.setQueryData([WorkspaceQueryKeys.GetWorkspaces], (data: Workspace[] | undefined) => { | |
| if (!data) return []; | |
| data.splice( | |
| data.findIndex(w => w.id === workspace?.id), | |
| 1, | |
| workspace, | |
| ); | |
| return [...data]; | |
| }); |
| const createNewWorkspaceObject = useCallback((w?: WorkspaceFragment): Workspace | undefined => { | ||
| if (!w) return; | ||
| return { | ||
| id: w.id, | ||
| name: w.name, | ||
| personal: w.personal, | ||
| }), | ||
| [], | ||
| ); | ||
| members: w.members.map( | ||
| (m): Member => ({ | ||
| userId: m.userId, | ||
| role: m.role, | ||
| user: m.user | ||
| ? { | ||
| id: m.user?.id, | ||
| name: m.user?.name, | ||
| email: m.user?.email, | ||
| } | ||
| : undefined, | ||
| }), | ||
| ), | ||
| }; | ||
| }, []); |
There was a problem hiding this comment.
Handle potential null values when mapping members.
The members field might be null or undefined. Add a null check before mapping.
return {
id: w.id,
name: w.name,
personal: w.personal,
members: w.members?.map(
(m): Member => ({
userId: m.userId,
role: m.role,
user: m.user
? {
id: m.user?.id,
name: m.user?.name,
email: m.user?.email,
}
: undefined,
}),
) ?? [],
};Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const createNewWorkspaceObject = useCallback((w?: WorkspaceFragment): Workspace | undefined => { | |
| if (!w) return; | |
| return { | |
| id: w.id, | |
| name: w.name, | |
| personal: w.personal, | |
| }), | |
| [], | |
| ); | |
| members: w.members.map( | |
| (m): Member => ({ | |
| userId: m.userId, | |
| role: m.role, | |
| user: m.user | |
| ? { | |
| id: m.user?.id, | |
| name: m.user?.name, | |
| email: m.user?.email, | |
| } | |
| : undefined, | |
| }), | |
| ), | |
| }; | |
| }, []); | |
| const createNewWorkspaceObject = useCallback((w?: WorkspaceFragment): Workspace | undefined => { | |
| if (!w) return; | |
| return { | |
| id: w.id, | |
| name: w.name, | |
| personal: w.personal, | |
| members: w.members?.map( | |
| (m): Member => ({ | |
| userId: m.userId, | |
| role: m.role, | |
| user: m.user | |
| ? { | |
| id: m.user?.id, | |
| name: m.user?.name, | |
| email: m.user?.email, | |
| } | |
| : undefined, | |
| }), | |
| ) ?? [], | |
| }; | |
| }, []); |
| import { useT } from "@flow/lib/i18n"; | ||
| import { useCurrentWorkspace } from "@flow/stores"; | ||
| import { Role, UserMember } from "@flow/types"; | ||
|
|
||
| type Filter = "all" | Role; | ||
|
|
||
| const roles = ["admin", "reader", "writer"]; | ||
| const roles: Role[] = Object.values(Role); |
There was a problem hiding this comment.
Fix role duplication and ensure consistency.
The Role array contains all roles, including Role.Maintainer.
const roles: Role[] = Object.values(Role);Committable suggestion was skipped due to low confidence.
There was a problem hiding this comment.
Actionable comments posted: 3
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (1)
- ui/src/features/WorkspaceSettings/components/MembersSettings.tsx (2 hunks)
Additional comments not posted (1)
ui/src/features/WorkspaceSettings/components/MembersSettings.tsx (1)
19-19: Fix role duplication and ensure consistency.The
rolesarray contains all roles, includingRole.Maintainer.const roles: Role[] = Object.values(Role);Likely invalid or redundant comment.
| const handleRemoveMembers = async (userId: string) => { | ||
| setError(undefined); | ||
| if (!currentWorkspace?.id) return; | ||
| const { workspace } = await removeMemberFromWorkspace(currentWorkspace.id, userId); | ||
| if (!workspace) { | ||
| setError(t("Failed to remove member")); | ||
| return; | ||
| } | ||
| }; |
There was a problem hiding this comment.
Handle potential errors in async functions.
Wrap the async function calls in try-catch blocks to handle potential errors.
const handleRemoveMembers = async (userId: string) => {
setError(undefined);
if (!currentWorkspace?.id) return;
try {
const { workspace } = await removeMemberFromWorkspace(currentWorkspace.id, userId);
if (!workspace) {
setError(t("Failed to remove member"));
return;
}
} catch (error) {
setError(t("An error occurred while removing the member"));
}
};Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const handleRemoveMembers = async (userId: string) => { | |
| setError(undefined); | |
| if (!currentWorkspace?.id) return; | |
| const { workspace } = await removeMemberFromWorkspace(currentWorkspace.id, userId); | |
| if (!workspace) { | |
| setError(t("Failed to remove member")); | |
| return; | |
| } | |
| }; | |
| const handleRemoveMembers = async (userId: string) => { | |
| setError(undefined); | |
| if (!currentWorkspace?.id) return; | |
| try { | |
| const { workspace } = await removeMemberFromWorkspace(currentWorkspace.id, userId); | |
| if (!workspace) { | |
| setError(t("Failed to remove member")); | |
| return; | |
| } | |
| } catch (error) { | |
| setError(t("An error occurred while removing the member")); | |
| } | |
| }; |
| const handleChangeRole = async (userId: string, role: Role) => { | ||
| setError(undefined); | ||
| if (!currentWorkspace?.id) return; | ||
| const { workspace } = await updateMemberOfWorkspace(currentWorkspace.id, userId, role); | ||
| if (!workspace) { | ||
| setError(t("Failed to change role of the member")); | ||
| return; | ||
| } | ||
| }; |
There was a problem hiding this comment.
Handle potential errors in async functions.
Wrap the async function calls in try-catch blocks to handle potential errors.
const handleChangeRole = async (userId: string, role: Role) => {
setError(undefined);
if (!currentWorkspace?.id) return;
try {
const { workspace } = await updateMemberOfWorkspace(currentWorkspace.id, userId, role);
if (!workspace) {
setError(t("Failed to change role of the member"));
return;
}
} catch (error) {
setError(t("An error occurred while changing the role"));
}
};Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const handleChangeRole = async (userId: string, role: Role) => { | |
| setError(undefined); | |
| if (!currentWorkspace?.id) return; | |
| const { workspace } = await updateMemberOfWorkspace(currentWorkspace.id, userId, role); | |
| if (!workspace) { | |
| setError(t("Failed to change role of the member")); | |
| return; | |
| } | |
| }; | |
| const handleChangeRole = async (userId: string, role: Role) => { | |
| setError(undefined); | |
| if (!currentWorkspace?.id) return; | |
| try { | |
| const { workspace } = await updateMemberOfWorkspace(currentWorkspace.id, userId, role); | |
| if (!workspace) { | |
| setError(t("Failed to change role of the member")); | |
| return; | |
| } | |
| } catch (error) { | |
| setError(t("An error occurred while changing the role")); | |
| } | |
| }; |
| const { user } = await searchUser(email); | ||
| if (!user) { | ||
| setError(t("Could not find the user")); | ||
| return; | ||
| } | ||
| const { workspace } = await addMemberToWorkspace(currentWorkspace.id, user.id, Role.Reader); | ||
|
|
There was a problem hiding this comment.
Handle potential errors in async functions.
Wrap the async function calls in try-catch blocks to handle potential errors.
const handleAddMember = async (email: string) => {
setError(undefined);
if (!currentWorkspace?.id) return;
try {
const { user } = await searchUser(email);
if (!user) {
setError(t("Could not find the user"));
return;
}
const { workspace } = await addMemberToWorkspace(currentWorkspace.id, user.id, Role.Reader);
if (!workspace) {
setError(t("Failed to add member"));
return;
}
setEmail("");
} catch (error) {
setError(t("An error occurred while adding the member"));
}
};Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| const { user } = await searchUser(email); | |
| if (!user) { | |
| setError(t("Could not find the user")); | |
| return; | |
| } | |
| const { workspace } = await addMemberToWorkspace(currentWorkspace.id, user.id, Role.Reader); | |
| const handleAddMember = async (email: string) => { | |
| setError(undefined); | |
| if (!currentWorkspace?.id) return; | |
| try { | |
| const { user } = await searchUser(email); | |
| if (!user) { | |
| setError(t("Could not find the user")); | |
| return; | |
| } | |
| const { workspace } = await addMemberToWorkspace(currentWorkspace.id, user.id, Role.Reader); | |
| if (!workspace) { | |
| setError(t("Failed to add member")); | |
| return; | |
| } | |
| setEmail(""); | |
| } catch (error) { | |
| setError(t("An error occurred while adding the member")); | |
| } | |
| }; |
There was a problem hiding this comment.
Actionable comments posted: 1
Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Files selected for processing (3)
- ui/src/lib/gql/project/useQueries.ts (2 hunks)
- ui/src/lib/gql/workspace/useQueries.ts (4 hunks)
- ui/src/lib/utils.ts (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- ui/src/lib/gql/workspace/useQueries.ts
Additional comments not posted (1)
ui/src/lib/gql/project/useQueries.ts (1)
58-60: Verify the logic of theisDefinedfunction.The
isDefinedfunction uses||instead of&&to check if the argument is defined. Ensure the logic is correct.
| export function isDefined<T>(argument: T | undefined | null): argument is T { | ||
| return argument !== undefined || argument !== null; | ||
| } |
There was a problem hiding this comment.
Fix the logical error in the isDefined function.
The condition should use && instead of || to correctly check if the argument is defined.
- return argument !== undefined || argument !== null;
+ return argument !== undefined && argument !== null;Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| export function isDefined<T>(argument: T | undefined | null): argument is T { | |
| return argument !== undefined || argument !== null; | |
| } | |
| export function isDefined<T>(argument: T | undefined | null): argument is T { | |
| return argument !== undefined && argument !== null; | |
| } |
Overview
Workspace CRUD
What I've done
What I haven't done
NA
How I tested
Screenshot
NA
Which point I want you to review particularly
NA
Memo
NA
Summary by CodeRabbit
New Features
Improvements
WorkspaceIdWrapperandNotFoundPagecomponents for improved data handling.Bug Fixes
Refactor
Documentation
Chores