fix: pages access (#754)

* fix: dashboard workspace activity mutation

* fix: page access operation
This commit is contained in:
Aaryan Khandelwal 2023-04-11 12:10:22 +05:30 committed by GitHub
parent f2c5bb5c03
commit 7aa0ace555
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 78 additions and 68 deletions

View File

@ -2,10 +2,11 @@ import React from "react";
import Link from "next/link";
import { useRouter } from "next/router";
import dynamic from "next/dynamic";
// hooks
import useUser from "hooks/use-user";
// ui
import { CustomMenu, Loader, Tooltip } from "components/ui";
import { CustomMenu, Tooltip } from "components/ui";
// icons
import {
LockClosedIcon,
@ -29,15 +30,6 @@ type TSingleStatProps = {
partialUpdatePage: (page: IPage, formData: Partial<IPage>) => void;
};
const RemirrorRichTextEditor = dynamic(() => import("components/rich-text-editor"), {
ssr: false,
loading: () => (
<Loader className="p-4">
<Loader.Item height="100px" width="100%" />
</Loader>
),
});
export const SinglePageDetailedItem: React.FC<TSingleStatProps> = ({
page,
handleEditPage,
@ -49,6 +41,8 @@ export const SinglePageDetailedItem: React.FC<TSingleStatProps> = ({
const router = useRouter();
const { workspaceSlug, projectId } = router.query;
const { user } = useUser();
return (
<div className="relative first:rounded-t last:rounded-b border">
<Link href={`/${workspaceSlug}/projects/${projectId}/pages/${page.id}`}>
@ -106,29 +100,31 @@ export const SinglePageDetailedItem: React.FC<TSingleStatProps> = ({
<StarIcon className="h-4 w-4 " color="#858E96" />
</button>
)}
<Tooltip
tooltipContent={`${
page.access
? "This page is only visible to you."
: "This page can be viewed by anyone in the project."
}`}
theme="dark"
>
<button
type="button"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
partialUpdatePage(page, { access: page.access ? 0 : 1 });
}}
{page.created_by === user?.id && (
<Tooltip
tooltipContent={`${
page.access
? "This page is only visible to you."
: "This page can be viewed by anyone in the project."
}`}
theme="dark"
>
{page.access ? (
<LockClosedIcon className="h-4 w-4" color="#858e96" />
) : (
<LockOpenIcon className="h-4 w-4" color="#858e96" />
)}
</button>
</Tooltip>
<button
type="button"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
partialUpdatePage(page, { access: page.access ? 0 : 1 });
}}
>
{page.access ? (
<LockClosedIcon className="h-4 w-4" color="#858e96" />
) : (
<LockOpenIcon className="h-4 w-4" color="#858e96" />
)}
</button>
</Tooltip>
)}
<CustomMenu verticalEllipsis>
<CustomMenu.MenuItem
onClick={(e: any) => {

View File

@ -3,6 +3,8 @@ import React from "react";
import Link from "next/link";
import { useRouter } from "next/router";
// hooks
import useUser from "hooks/use-user";
// ui
import { CustomMenu, Tooltip } from "components/ui";
// icons
@ -40,6 +42,8 @@ export const SinglePageListItem: React.FC<TSingleStatProps> = ({
const router = useRouter();
const { workspaceSlug, projectId } = router.query;
const { user } = useUser();
return (
<li>
<Link href={`/${workspaceSlug}/projects/${projectId}/pages/${page.id}`}>
@ -103,29 +107,32 @@ export const SinglePageListItem: React.FC<TSingleStatProps> = ({
<StarIcon className="h-4 w-4 " color="#858e96" />
</button>
)}
<Tooltip
tooltipContent={`${
page.access
? "This page is only visible to you."
: "This page can be viewed by anyone in the project."
}`}
theme="dark"
>
<button
type="button"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
partialUpdatePage(page, { access: page.access ? 0 : 1 });
}}
{page.created_by === user?.id && (
<Tooltip
tooltipContent={`${
page.access
? "This page is only visible to you."
: "This page can be viewed by anyone in the project."
}`}
theme="dark"
>
{page.access ? (
<LockClosedIcon className="h-4 w-4" color="#858e96" />
) : (
<LockOpenIcon className="h-4 w-4" color="#858e96" />
)}
</button>
</Tooltip>
<button
type="button"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
partialUpdatePage(page, { access: page.access ? 0 : 1 });
}}
>
{page.access ? (
<LockClosedIcon className="h-4 w-4" color="#858e96" />
) : (
<LockOpenIcon className="h-4 w-4" color="#858e96" />
)}
</button>
</Tooltip>
)}
<CustomMenu width="auto" verticalEllipsis>
<CustomMenu.MenuItem
onClick={(e: any) => {

View File

@ -77,8 +77,8 @@ export const WorkspaceSidebarDropdown = () => {
})
)
.finally(() => {
mutateUser();
router.push("/signin");
mutateUser();
});
};

View File

@ -19,6 +19,7 @@ import pagesService from "services/pages.service";
import issuesService from "services/issues.service";
// hooks
import useToast from "hooks/use-toast";
import useUser from "hooks/use-user";
// layouts
import { ProjectAuthorizationWrapper } from "layouts/auth-layout";
// components
@ -61,6 +62,8 @@ const SinglePage: NextPage = () => {
const { setToastAlert } = useToast();
const { user } = useUser();
const { handleSubmit, reset, watch, setValue } = useForm<IPage>({
defaultValues: { name: "" },
});
@ -411,18 +414,22 @@ const SinglePage: NextPage = () => {
)}
</Popover>
</div>
{pageDetails.access ? (
<button onClick={() => partialUpdatePage({ access: 0 })} className="z-10">
<LockClosedIcon className="h-4 w-4" />
</button>
) : (
<button
onClick={() => partialUpdatePage({ access: 1 })}
type="button"
className="z-10"
>
<LockOpenIcon className="h-4 w-4" />
</button>
{pageDetails.created_by === user?.id && (
<>
{pageDetails.access ? (
<button onClick={() => partialUpdatePage({ access: 0 })} className="z-10">
<LockClosedIcon className="h-4 w-4" />
</button>
) : (
<button
onClick={() => partialUpdatePage({ access: 1 })}
type="button"
className="z-10"
>
<LockOpenIcon className="h-4 w-4" />
</button>
)}
</>
)}
{pageDetails.is_favorite ? (
<button onClick={handleRemoveFromFavorites} className="z-10">