binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-5139] fix: custom menu item link (#7959)

Browse source 
* fix: custom menu link action

* chore: code refactor

* chore: code refactor
This commit is contained in:
Anmol Singh Bhatia 2025-10-14 15:45:49 +05:30 • committed by GitHub
parent 56007e7d47
commit 9dc14d8d67
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 59 additions and 93 deletions
Download patch file Download diff file Expand all files Collapse all files

18
apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx
View file

@ -3,8 +3,7 @@
// ui // ui
import { FC } from "react"; import { FC } from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import Link from "next/link"; import { useParams, useRouter } from "next/navigation";
import { useParams } from "next/navigation";
import { ChevronDown, PanelRight } from "lucide-react"; import { ChevronDown, PanelRight } from "lucide-react";
import { PROFILE_VIEWER_TAB, PROFILE_ADMINS_TAB, EUserPermissions, EUserPermissionsLevel } from "@plane/constants"; import { PROFILE_VIEWER_TAB, PROFILE_ADMINS_TAB, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
import { useTranslation } from "@plane/i18n"; import { useTranslation } from "@plane/i18n";
@ -29,6 +28,7 @@ export const UserProfileHeader: FC<TUserProfileHeader> = observer((props) => {
const { userProjectsData, type = undefined, showProfileIssuesFilter } = props; const { userProjectsData, type = undefined, showProfileIssuesFilter } = props;
// router // router
const { workspaceSlug, userId } = useParams(); const { workspaceSlug, userId } = useParams();
const router = useRouter();
// store hooks // store hooks
const { toggleProfileSidebar, profileSidebarCollapsed } = useAppTheme(); const { toggleProfileSidebar, profileSidebarCollapsed } = useAppTheme();
const { data: currentUser } = useUser(); const { data: currentUser } = useUser();
@ -83,14 +83,12 @@ export const UserProfileHeader: FC<TUserProfileHeader> = observer((props) => {
> >
<></> <></>
{tabsList.map((tab) => ( {tabsList.map((tab) => (
<CustomMenu.MenuItem className="flex items-center gap-2" key={tab.route}> <CustomMenu.MenuItem
<Link className="flex items-center gap-2"
key={tab.route} key={tab.route}
href={`/${workspaceSlug}/profile/${userId}/${tab.route}`} onClick={() => router.push(`/${workspaceSlug}/profile/${userId}/${tab.route}`)}
className="w-full text-custom-text-300" >
> <span className="w-full text-custom-text-300">{t(tab.i18n_label)}</span>
{t(tab.i18n_label)}
</Link>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
))} ))}
</CustomMenu> </CustomMenu>

10
apps/web/core/components/issues/issue-detail/parent/sibling-item.tsx
View file

@ -2,7 +2,6 @@
import { FC } from "react"; import { FC } from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import Link from "next/link";
// ui // ui
import { CustomMenu } from "@plane/ui"; import { CustomMenu } from "@plane/ui";
// helpers // helpers
@ -42,8 +41,11 @@ export const IssueParentSiblingItem: FC<TIssueParentSiblingItem> = observer((pro
return ( return (
<> <>
<CustomMenu.MenuItem key={issueDetail.id}> <CustomMenu.MenuItem
<Link href={workItemLink} target="_blank" className="flex items-center gap-2 py-0.5"> key={issueDetail.id}
onClick={() => window.open(workItemLink, "_blank", "noopener,noreferrer")}
>
<div className="flex items-center gap-2 py-0.5">
{issueDetail.project_id && projectDetails?.identifier && ( {issueDetail.project_id && projectDetails?.identifier && (
<IssueIdentifier <IssueIdentifier
projectId={issueDetail.project_id} projectId={issueDetail.project_id}
@ -53,7 +55,7 @@ export const IssueParentSiblingItem: FC<TIssueParentSiblingItem> = observer((pro
textContainerClassName="text-xs" textContainerClassName="text-xs"
/> />
)} )}
</Link> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
</> </>
); );

34
apps/web/core/components/workspace/sidebar/help-menu.tsx
View file

@ -65,15 +65,13 @@ export const HelpMenu: React.FC<WorkspaceHelpSectionProps> = observer(() => {
maxHeight="lg" maxHeight="lg"
closeOnSelect closeOnSelect
> >
<CustomMenu.MenuItem> <CustomMenu.MenuItem
<a onClick={() => window.open("https://go.plane.so/p-docs", "_blank", "noopener,noreferrer")}
href="https://go.plane.so/p-docs" >
target="_blank" <div className="flex items-center gap-x-2 rounded text-xs hover:bg-custom-background-80">
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<PageIcon className="h-3.5 w-3.5 text-custom-text-200" height={14} width={14} /> <PageIcon className="h-3.5 w-3.5 text-custom-text-200" height={14} width={14} />
<span className="text-xs">{t("documentation")}</span> <span className="text-xs">{t("documentation")}</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
{config?.intercom_app_id && config?.is_intercom_enabled && ( {config?.intercom_app_id && config?.is_intercom_enabled && (
<CustomMenu.MenuItem> <CustomMenu.MenuItem>
@ -87,15 +85,11 @@ export const HelpMenu: React.FC<WorkspaceHelpSectionProps> = observer(() => {
</button> </button>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
)} )}
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => window.open("mailto:sales@plane.so", "_blank", "noopener,noreferrer")}>
<a <div className="flex items-center gap-x-2 rounded text-xs hover:bg-custom-background-80">
href="mailto:sales@plane.so"
target="_blank"
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<User className="h-3.5 w-3.5 text-custom-text-200" size={14} /> <User className="h-3.5 w-3.5 text-custom-text-200" size={14} />
<span className="text-xs">{t("contact_sales")}</span> <span className="text-xs">{t("contact_sales")}</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="my-1 border-t border-custom-border-200" /> <div className="my-1 border-t border-custom-border-200" />
<CustomMenu.MenuItem> <CustomMenu.MenuItem>
@ -116,14 +110,12 @@ export const HelpMenu: React.FC<WorkspaceHelpSectionProps> = observer(() => {
<span className="text-xs">{t("whats_new")}</span> <span className="text-xs">{t("whats_new")}</span>
</button> </button>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<CustomMenu.MenuItem> <CustomMenu.MenuItem
<a onClick={() => window.open("https://go.plane.so/p-discord", "_blank", "noopener,noreferrer")}
href="https://go.plane.so/p-discord" >
target="_blank" <div className="flex items-center gap-x-2 rounded text-xs hover:bg-custom-background-80">
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<span className="text-xs">Discord</span> <span className="text-xs">Discord</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="px-1 pt-2 mt-1 text-xs text-custom-text-200 border-t border-custom-border-200"> <div className="px-1 pt-2 mt-1 text-xs text-custom-text-200 border-t border-custom-border-200">
<PlaneVersionNumber /> <PlaneVersionNumber />

30
apps/web/core/components/workspace/sidebar/help-section.tsx
View file

@ -68,15 +68,11 @@ export const SidebarHelpSection: React.FC<WorkspaceHelpSectionProps> = observer(
maxHeight="lg" maxHeight="lg"
closeOnSelect closeOnSelect
> >
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => window.open("https://go.plane.so/p-docs", "_blank")}>
<a <div className="flex items-center gap-x-2 rounded text-xs">
href="https://go.plane.so/p-docs"
target="_blank"
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<PageIcon className="h-3.5 w-3.5 text-custom-text-200" height={14} width={14} /> <PageIcon className="h-3.5 w-3.5 text-custom-text-200" height={14} width={14} />
<span className="text-xs">{t("documentation")}</span> <span className="text-xs">{t("documentation")}</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
{config?.intercom_app_id && config?.is_intercom_enabled && ( {config?.intercom_app_id && config?.is_intercom_enabled && (
<CustomMenu.MenuItem> <CustomMenu.MenuItem>
@ -90,15 +86,11 @@ export const SidebarHelpSection: React.FC<WorkspaceHelpSectionProps> = observer(
</button> </button>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
)} )}
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => window.open("mailto:sales@plane.so", "_blank")}>
<a <div className="flex items-center gap-x-2 rounded text-xs">
href="mailto:sales@plane.so"
target="_blank"
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<User className="h-3.5 w-3.5 text-custom-text-200" size={14} /> <User className="h-3.5 w-3.5 text-custom-text-200" size={14} />
<span className="text-xs">{t("contact_sales")}</span> <span className="text-xs">{t("contact_sales")}</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="my-1 border-t border-custom-border-200" /> <div className="my-1 border-t border-custom-border-200" />
<CustomMenu.MenuItem> <CustomMenu.MenuItem>
@ -119,14 +111,10 @@ export const SidebarHelpSection: React.FC<WorkspaceHelpSectionProps> = observer(
<span className="text-xs">{t("whats_new")}</span> <span className="text-xs">{t("whats_new")}</span>
</button> </button>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => window.open("https://go.plane.so/p-discord", "_blank")}>
<a <div className="flex items-center gap-x-2 rounded text-xs">
href="https://go.plane.so/p-discord"
target="_blank"
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<span className="text-xs">Discord</span> <span className="text-xs">Discord</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="px-1 pt-2 mt-1 text-xs text-custom-text-200 border-t border-custom-border-200"> <div className="px-1 pt-2 mt-1 text-xs text-custom-text-200 border-t border-custom-border-200">
<PlaneVersionNumber /> <PlaneVersionNumber />

32
apps/web/core/components/workspace/sidebar/help-section/root.tsx
View file

@ -52,15 +52,11 @@ export const HelpMenuRoot = observer(() => {
maxHeight="lg" maxHeight="lg"
closeOnSelect closeOnSelect
> >
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => window.open("https://go.plane.so/p-docs", "_blank")}>
<a <div className="flex items-center gap-x-2 rounded text-xs">
href="https://go.plane.so/p-docs"
target="_blank"
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<PageIcon className="h-3.5 w-3.5 text-custom-text-200" height={14} width={14} /> <PageIcon className="h-3.5 w-3.5 text-custom-text-200" height={14} width={14} />
<span className="text-xs">{t("documentation")}</span> <span className="text-xs">{t("documentation")}</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
{config?.intercom_app_id && config?.is_intercom_enabled && ( {config?.intercom_app_id && config?.is_intercom_enabled && (
<CustomMenu.MenuItem> <CustomMenu.MenuItem>
@ -74,15 +70,11 @@ export const HelpMenuRoot = observer(() => {
</button> </button>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
)} )}
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => window.open("mailto:sales@plane.so", "_blank")}>
<a <div className="flex items-center gap-x-2 rounded text-xs">
href="mailto:sales@plane.so"
target="_blank"
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<User className="h-3.5 w-3.5 text-custom-text-200" size={14} /> <User className="h-3.5 w-3.5 text-custom-text-200" size={14} />
<span className="text-xs">{t("contact_sales")}</span> <span className="text-xs">{t("contact_sales")}</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="my-1 border-t border-custom-border-200" /> <div className="my-1 border-t border-custom-border-200" />
<CustomMenu.MenuItem> <CustomMenu.MenuItem>
@ -103,14 +95,12 @@ export const HelpMenuRoot = observer(() => {
<span className="text-xs">{t("whats_new")}</span> <span className="text-xs">{t("whats_new")}</span>
</button> </button>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<CustomMenu.MenuItem> <CustomMenu.MenuItem
<a onClick={() => window.open("https://go.plane.so/p-discord", "_blank", "noopener,noreferrer")}
href="https://go.plane.so/p-discord" >
target="_blank" <div className="flex items-center gap-x-2 rounded text-xs">
className="flex items-center justify- gap-x-2 rounded text-xs hover:bg-custom-background-80"
>
<span className="text-xs">Discord</span> <span className="text-xs">Discord</span>
</a> </div>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
<div className="px-1 pt-2 mt-1 text-xs text-custom-text-200 border-t border-custom-border-200"> <div className="px-1 pt-2 mt-1 text-xs text-custom-text-200 border-t border-custom-border-200">
<PlaneVersionNumber /> <PlaneVersionNumber />

28
apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx
View file

@ -1,7 +1,6 @@
import { FC, useState, useRef } from "react"; import { FC, useState, useRef } from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import Link from "next/link"; import { useParams, useRouter } from "next/navigation";
import { useParams } from "next/navigation";
import { MoreHorizontal, ArchiveIcon, ChevronRight, Settings } from "lucide-react"; import { MoreHorizontal, ArchiveIcon, ChevronRight, Settings } from "lucide-react";
import { Disclosure } from "@headlessui/react"; import { Disclosure } from "@headlessui/react";
// plane imports // plane imports
@ -27,6 +26,7 @@ export const SidebarWorkspaceMenuHeader: FC<SidebarWorkspaceMenuHeaderProps> = o
const actionSectionRef = useRef<HTMLDivElement | null>(null); const actionSectionRef = useRef<HTMLDivElement | null>(null);
// hooks // hooks
const { workspaceSlug } = useParams(); const { workspaceSlug } = useParams();
const router = useRouter();
const { allowPermissions } = useUserPermissions(); const { allowPermissions } = useUserPermissions();
const { t } = useTranslation(); const { t } = useTranslation();
@ -66,23 +66,19 @@ export const SidebarWorkspaceMenuHeader: FC<SidebarWorkspaceMenuHeaderProps> = o
customButtonClassName="grid place-items-center" customButtonClassName="grid place-items-center"
placement="bottom-start" placement="bottom-start"
> >
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => router.push(`/${workspaceSlug}/projects/archives`)}>
<Link href={`/${workspaceSlug}/projects/archives`}> <div className="flex items-center justify-start gap-2">
<div className="flex items-center justify-start gap-2"> <ArchiveIcon className="h-3.5 w-3.5 stroke-[1.5]" />
<ArchiveIcon className="h-3.5 w-3.5 stroke-[1.5]" /> <span>{t("archives")}</span>
<span>{t("archives")}</span> </div>
</div>
</Link>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
{isAdmin && ( {isAdmin && (
<CustomMenu.MenuItem> <CustomMenu.MenuItem onClick={() => router.push(`/${workspaceSlug}/settings`)}>
<Link href={`/${workspaceSlug}/settings`}> <div className="flex items-center justify-start gap-2">
<div className="flex items-center justify-start gap-2"> <Settings className="h-3.5 w-3.5 stroke-[1.5]" />
<Settings className="h-3.5 w-3.5 stroke-[1.5]" /> <span>{t("settings")}</span>
<span>{t("settings")}</span> </div>
</div>
</Link>
</CustomMenu.MenuItem> </CustomMenu.MenuItem>
)} )}
</CustomMenu> </CustomMenu>