thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

fix: workspace settings bugs (#2743)

Browse Source 
* fix: double layout in exports

* fix: typo in jira email address section

* fix: workspace members not mutating

* fix: removed un-used variable

* fix: workspace members can't be filtered using email

* fix: autocomplete in workspace delete

* fix: autocomplete in project delete modal

* fix: update member function in store

* fix: sidebar link not active when in github/jira

* style: margin top & icon inconsistency

* fix: typo in create workspace

* fix: workspace leave flow

* fix: redirection to delete issue

* fix: autocomplete off in jira api token

* refactor: reduced api call, added optional chaining & removed variable with low scope
This commit is contained in:
Dakshesh Jain 2023-11-13 13:34:05 +05:30 committed by sriram veeraghanta
parent 4d35c931cd
commit 21988e8528
12 changed files with 96 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/components/core/activity.tsx
View File

@ -42,9 +42,12 @@ const IssueLink = ({ activity }: { activity: IIssueActivity }) => {
return (
<Tooltip tooltipContent={activity.issue_detail ? activity.issue_detail.name : "This issue has been deleted"}>
<a
href={`/${workspaceSlug}/projects/${activity.project}/issues/${activity.issue}`}
target="_blank"
rel="noopener noreferrer"
aria-disabled={activity.issue === null}
href={`${
activity.issue_detail ? `/${workspaceSlug}/projects/${activity.project}/issues/${activity.issue}` : "#"
}`}
target={activity.issue === null ? "_self" : "_blank"}
rel={activity.issue === null ? "" : "noopener noreferrer"}
className="font-medium text-custom-text-100 inline-flex items-center gap-1 hover:underline"
>
{activity.issue_detail ? `${activity.project_detail.identifier}-${activity.issue_detail.sequence_id}` : "Issue"}

6
web/components/integration/github/root.tsx
View File

@ -163,7 +163,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
return (
<form onSubmit={handleSubmit(createGithubImporterService)}>
<div className="space-y-2">
<div className="space-y-2 mt-4">
<Link href={`/${workspaceSlug}/settings/imports`}>
<div className="inline-flex cursor-pointer items-center gap-2 text-sm font-medium text-custom-text-200 hover:text-custom-text-100">
<ArrowLeft className="h-3 w-3" />
@ -191,9 +191,7 @@ export const GithubImporterRoot: React.FC<Props> = ({ user }) => {
}`}
>
<integration.icon
width="18px"
height="18px"
color={index <= activeIntegrationState() ? "#ffffff" : "#d1d5db"}
className={`w-5 h-5 ${index <= activeIntegrationState() ? "text-white" : "text-custom-text-400"}`}
/>
</div>
{index < integrationWorkflowData.length - 1 && (

3
web/components/integration/jira/give-details.tsx
View File

@ -56,6 +56,7 @@ export const JiraGetImportDetail: React.FC = observer(() => {
ref={ref}
placeholder="XXXXXXXX"
className="w-full"
autoComplete="off"
/>
)}
/>
@ -94,7 +95,7 @@ export const JiraGetImportDetail: React.FC = observer(() => {
<div className="grid grid-cols-1 gap-10 md:grid-cols-2">
<div className="col-span-1">
<h3 className="font-semibold">Jira Email Address</h3>
<p className="text-sm text-custom-text-200">Enter the Gmail account that you use in Jira account</p>
<p className="text-sm text-custom-text-200">Enter the Email account that you use in Jira account</p>
</div>
<div className="col-span-1">
<Controller

8
web/components/integration/jira/root.tsx
View File

@ -5,7 +5,7 @@ import { useRouter } from "next/router";
import { mutate } from "swr";
import { FormProvider, useForm } from "react-hook-form";
// icons
import { ArrowLeft, Check, List, Settings } from "lucide-react";
import { ArrowLeft, Check, List, Settings, Users2 } from "lucide-react";
// services
import { JiraImporterService } from "services/integrations";
// fetch keys
@ -98,7 +98,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
};
return (
<div className="flex h-full flex-col space-y-2">
<div className="flex h-full flex-col space-y-2 mt-4">
<Link href={`/${workspaceSlug}/settings/imports`}>
<div className="inline-flex cursor-pointer items-center gap-2 text-sm font-medium text-custom-text-200 hover:text-custom-text-100">
<div>
@ -136,9 +136,7 @@ export const JiraImporterRoot: React.FC<Props> = ({ user }) => {
}`}
>
<integration.icon
width="18px"
height="18px"
color={index <= activeIntegrationState() ? "#ffffff" : "#d1d5db"}
className={`w-5 h-5 ${index <= activeIntegrationState() ? "text-white" : "text-custom-text-400"}`}
/>
</button>
{index < integrationWorkflowData.length - 1 && (

2
web/components/project/delete-project-modal.tsx
View File

@ -139,6 +139,7 @@ export const DeleteProjectModal: React.FC<DeleteProjectModal> = (props) => {
hasError={Boolean(errors.projectName)}
placeholder="Project name"
className="mt-2 w-full"
autoComplete="off"
/>
)}
/>
@ -162,6 +163,7 @@ export const DeleteProjectModal: React.FC<DeleteProjectModal> = (props) => {
hasError={Boolean(errors.confirmDelete)}
placeholder="Enter 'delete my project'"
className="mt-2 w-full"
autoComplete="off"
/>
)}
/>

2
web/components/workspace/create-workspace-form.tsx
View File

@ -161,7 +161,7 @@ export const CreateWorkspaceForm: FC<Props> = observer((props) => {
}}
ref={ref}
hasError={Boolean(errors.slug)}
placeholder="Enter workspace name..."
placeholder="Enter workspace url..."
className="block rounded-md bg-transparent py-2 !px-0 text-sm w-full border-none"
/>
)}

2
web/components/workspace/delete-workspace-modal.tsx
View File

@ -141,6 +141,7 @@ export const DeleteWorkspaceModal: React.FC<Props> = observer((props) => {
hasError={Boolean(errors.workspaceName)}
placeholder="Workspace name"
className="mt-2 w-full"
autoComplete="off"
/>
)}
/>
@ -165,6 +166,7 @@ export const DeleteWorkspaceModal: React.FC<Props> = observer((props) => {
hasError={Boolean(errors.confirmDelete)}
placeholder="Enter 'delete my workspace'"
className="mt-2 w-full"
autoComplete="off"
/>
)}
/>

36
web/components/workspace/settings/members-list-item.tsx
View File

@ -1,6 +1,7 @@
import { useState, FC } from "react";
import Link from "next/link";
import { useRouter } from "next/router";
import { mutate } from "swr";
// mobx store
import { useMobxStore } from "lib/mobx/store-provider";
// hooks
@ -39,7 +40,7 @@ export const WorkspaceMembersListItem: FC<Props> = (props) => {
// store
const {
workspaceMember: { removeMember, updateMember, deleteWorkspaceInvitation },
user: { currentWorkspaceMemberInfo, currentWorkspaceRole },
user: { currentWorkspaceMemberInfo, currentWorkspaceRole, currentUser, currentUserSettings },
} = useMobxStore();
const isAdmin = currentWorkspaceRole === 20;
// states
@ -51,14 +52,22 @@ export const WorkspaceMembersListItem: FC<Props> = (props) => {
if (!workspaceSlug) return;
if (member.member)
await removeMember(workspaceSlug.toString(), member.id).catch((err) => {
const error = err?.error;
setToastAlert({
type: "error",
title: "Error",
message: error || "Something went wrong",
await removeMember(workspaceSlug.toString(), member.id)
.then(() => {
const memberId = member.memberId;
if (memberId === currentUser?.id && currentUserSettings) {
if (currentUserSettings.workspace?.invites > 0) router.push("/invitations");
else router.push("/create-workspace");
}
})
.catch((err) => {
setToastAlert({
type: "error",
title: "Error",
message: err?.error || "Something went wrong",
});
});
});
else
await deleteWorkspaceInvitation(workspaceSlug.toString(), member.id)
.then(() => {
@ -69,12 +78,17 @@ export const WorkspaceMembersListItem: FC<Props> = (props) => {
});
})
.catch((err) => {
const error = err?.error;
setToastAlert({
type: "error",
title: "Error",
message: error || "Something went wrong",
message: err?.error || "Something went wrong",
});
})
.finally(() => {
mutate(`WORKSPACE_INVITATIONS_${workspaceSlug.toString()}`, (prevData: any) => {
if (!prevData) return prevData;
return prevData.filter((item: any) => item.id !== member.id);
});
});
};

10
web/components/workspace/settings/members-list.tsx
View File

@ -29,9 +29,15 @@ export const WorkspaceMembersList: FC<{ searchQuery: string }> = observer(({ sea
);
const searchedMembers = workspaceMembersWithInvitations?.filter((member: any) => {
const fullName = `${member.first_name} ${member.last_name}`.toLowerCase();
const email = member.email?.toLowerCase();
const displayName = member.display_name.toLowerCase();
return displayName.includes(searchQuery.toLowerCase()) || fullName.includes(searchQuery.toLowerCase());
const fullName = `${member.first_name} ${member.last_name}`.toLowerCase();
return (
displayName.includes(searchQuery.toLowerCase()) ||
fullName.includes(searchQuery.toLowerCase()) ||
email?.includes(searchQuery.toLowerCase())
);
});
if (

2
web/layouts/settings-layout/workspace/sidebar.tsx
View File

@ -64,7 +64,7 @@ export const WorkspaceSettingsSidebar = () => {
<a>
<div
className={`px-4 py-2 text-sm font-medium rounded-md ${
(link.label === "Import" ? router.asPath.includes(link.href) : router.asPath === link.href)
router.pathname.split("/")?.[3] === link.href.split("/")?.[3]
? "bg-custom-primary-100/10 text-custom-primary-100"
: "text-custom-sidebar-text-200 hover:bg-custom-sidebar-background-80 focus:bg-custom-sidebar-background-80"
}`}

12
web/pages/[workspaceSlug]/settings/exports.tsx
View File

@ -9,12 +9,12 @@ import ExportGuide from "components/exporter/guide";
import { NextPageWithLayout } from "types/app";
const ExportsPage: NextPageWithLayout = () => (
<div className="pr-9 py-8 w-full overflow-y-auto">
<div className="flex items-center py-3.5 border-b border-custom-border-100">
<h3 className="text-xl font-medium">Exports</h3>
</div>
<ExportGuide />
</div>
<div className="pr-9 py-8 w-full overflow-y-auto">
<div className="flex items-center py-3.5 border-b border-custom-border-100">
<h3 className="text-xl font-medium">Exports</h3>
</div>
<ExportGuide />
</div>
);
ExportsPage.getLayout = function getLayout(page: ReactElement) {

55
web/store/workspace/workspace-member.store.ts
View File

@ -208,29 +208,38 @@ export class WorkspaceMemberStore implements IWorkspaceMemberStore {
* @param data
*/
updateMember = async (workspaceSlug: string, memberId: string, data: Partial<IWorkspaceMember>) => {
const members = this.members?.[workspaceSlug];
members?.map((m) => (m.id === memberId ? { ...m, ...data } : m));
const originalMembers = [...this.members?.[workspaceSlug]]; // in case of error, we will revert back to original members
const members = [...this.members?.[workspaceSlug]];
const index = members.findIndex((m) => m.id === memberId);
members[index] = { ...members[index], ...data };
// optimistic update
runInAction(() => {
this.loader = true;
this.error = null;
this.members = {
...this.members,
[workspaceSlug]: members,
};
});
try {
runInAction(() => {
this.loader = true;
this.error = null;
});
await this.workspaceService.updateWorkspaceMember(workspaceSlug, memberId, data);
runInAction(() => {
this.loader = false;
this.error = null;
this.members = {
...this.members,
[workspaceSlug]: members,
};
});
} catch (error) {
runInAction(() => {
this.loader = false;
this.error = error;
this.members = {
...this.members,
[workspaceSlug]: originalMembers,
};
});
throw error;
@ -243,8 +252,20 @@ export class WorkspaceMemberStore implements IWorkspaceMemberStore {
* @param memberId
*/
removeMember = async (workspaceSlug: string, memberId: string) => {
const members = this.members?.[workspaceSlug];
members?.filter((m) => m.id !== memberId);
const members = [...this.members?.[workspaceSlug]];
const originalMembers = this.members?.[workspaceSlug]; // in case of error, we will revert back to original members
// removing member from the array
const index = members.findIndex((m) => m.id === memberId);
members.splice(index, 1);
// optimistic update
runInAction(() => {
this.members = {
...this.members,
[workspaceSlug]: members,
};
});
try {
runInAction(() => {
@ -257,15 +278,15 @@ export class WorkspaceMemberStore implements IWorkspaceMemberStore {
runInAction(() => {
this.loader = false;
this.error = null;
this.members = {
...this.members,
[workspaceSlug]: members,
};
});
} catch (error) {
runInAction(() => {
this.loader = false;
this.error = error;
this.members = {
...this.members,
[workspaceSlug]: originalMembers,
};
});
throw error;