[WEB-1559] chore: add page prop to the quick actions dropdown (#4782)

* chore: add pageLink prop to the quick actions dropdown

* chore: accept page store as a prop
This commit is contained in:
Aaryan Khandelwal 2024-06-13 12:45:00 +05:30 committed by GitHub
parent ec955e064b
commit d81a476e0b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 15 additions and 11 deletions

View File

@ -8,18 +8,17 @@ import { ArchiveIcon, ContextMenu, CustomMenu, TContextMenuItem, TOAST_TYPE, set
import { DeletePageModal } from "@/components/pages"; import { DeletePageModal } from "@/components/pages";
// helpers // helpers
import { copyUrlToClipboard } from "@/helpers/string.helper"; import { copyUrlToClipboard } from "@/helpers/string.helper";
// hooks // store
import { usePage } from "@/hooks/store"; import { IPageStore } from "@/store/pages/page.store";
type Props = { type Props = {
pageId: string; page: IPageStore;
pageLink: string;
parentRef: React.RefObject<HTMLElement>; parentRef: React.RefObject<HTMLElement>;
projectId: string;
workspaceSlug: string;
}; };
export const PageQuickActions: React.FC<Props> = observer((props) => { export const PageQuickActions: React.FC<Props> = observer((props) => {
const { pageId, parentRef, projectId, workspaceSlug } = props; const { page, pageLink, parentRef } = props;
// states // states
const [deletePageModal, setDeletePageModal] = useState(false); const [deletePageModal, setDeletePageModal] = useState(false);
// store hooks // store hooks
@ -33,9 +32,8 @@ export const PageQuickActions: React.FC<Props> = observer((props) => {
canCurrentUserArchivePage, canCurrentUserArchivePage,
canCurrentUserChangeAccess, canCurrentUserChangeAccess,
canCurrentUserDeletePage, canCurrentUserDeletePage,
} = usePage(pageId); } = page;
const pageLink = `${workspaceSlug}/projects/${projectId}/pages/${pageId}`;
const handleCopyText = () => const handleCopyText = () =>
copyUrlToClipboard(pageLink).then(() => { copyUrlToClipboard(pageLink).then(() => {
setToast({ setToast({
@ -87,7 +85,7 @@ export const PageQuickActions: React.FC<Props> = observer((props) => {
return ( return (
<> <>
<DeletePageModal isOpen={deletePageModal} onClose={() => setDeletePageModal(false)} pageId={pageId} /> <DeletePageModal isOpen={deletePageModal} onClose={() => setDeletePageModal(false)} pageId={page.id ?? ""} />
<ContextMenu parentRef={parentRef} items={MENU_ITEMS} /> <ContextMenu parentRef={parentRef} items={MENU_ITEMS} />
<CustomMenu placement="bottom-end" ellipsis closeOnSelect> <CustomMenu placement="bottom-end" ellipsis closeOnSelect>
{MENU_ITEMS.map((item) => { {MENU_ITEMS.map((item) => {

View File

@ -24,8 +24,10 @@ export const BlockItemAction: FC<Props> = observer((props) => {
const { workspaceSlug, projectId, pageId, parentRef } = props; const { workspaceSlug, projectId, pageId, parentRef } = props;
// store hooks // store hooks
const { access, created_at, is_favorite, owned_by, addToFavorites, removeFromFavorites } = usePage(pageId); const page = usePage(pageId);
const { getUserDetails } = useMember(); const { getUserDetails } = useMember();
// derived values
const { access, created_at, is_favorite, owned_by, addToFavorites, removeFromFavorites } = page;
// derived values // derived values
const ownerDetails = owned_by ? getUserDetails(owned_by) : undefined; const ownerDetails = owned_by ? getUserDetails(owned_by) : undefined;
@ -83,7 +85,11 @@ export const BlockItemAction: FC<Props> = observer((props) => {
/> />
{/* quick actions dropdown */} {/* quick actions dropdown */}
<PageQuickActions parentRef={parentRef} pageId={pageId} projectId={projectId} workspaceSlug={workspaceSlug} /> <PageQuickActions
parentRef={parentRef}
page={page}
pageLink={`${workspaceSlug}/projects/${projectId}/pages/${pageId}`}
/>
</> </>
); );
}); });