fix: home quick start widget validation (#6626)

* fix: Handled workspace switcher closing on click

* fix: home quickstart widget
This commit is contained in:
Akshita Goyal 2025-02-18 12:37:00 +05:30 committed by GitHub
parent ffe87cc3b4
commit cba27c348d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -12,7 +12,14 @@ import { useTranslation } from "@plane/i18n";
import { cn } from "@plane/utils"; import { cn } from "@plane/utils";
import { getFileURL } from "@/helpers/file.helper"; import { getFileURL } from "@/helpers/file.helper";
// hooks // hooks
import { useCommandPalette, useEventTracker, useProject, useUser, useUserPermissions } from "@/hooks/store"; import {
useCommandPalette,
useEventTracker,
useProject,
useUser,
useUserPermissions,
useWorkspace,
} from "@/hooks/store";
// plane web constants // plane web constants
export const NoProjectsEmptyState = observer(() => { export const NoProjectsEmptyState = observer(() => {
@ -24,6 +31,7 @@ export const NoProjectsEmptyState = observer(() => {
const { setTrackElement } = useEventTracker(); const { setTrackElement } = useEventTracker();
const { data: currentUser } = useUser(); const { data: currentUser } = useUser();
const { joinedProjectIds } = useProject(); const { joinedProjectIds } = useProject();
const { currentWorkspace: activeWorkspace } = useWorkspace();
// local storage // local storage
const { storedValue, setValue } = useLocalStorage(`quickstart-guide-${workspaceSlug}`, { const { storedValue, setValue } = useLocalStorage(`quickstart-guide-${workspaceSlug}`, {
hide: false, hide: false,
@ -37,6 +45,7 @@ export const NoProjectsEmptyState = observer(() => {
[EUserPermissions.ADMIN, EUserPermissions.MEMBER], [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
EUserPermissionsLevel.WORKSPACE EUserPermissionsLevel.WORKSPACE
); );
const isWorkspaceAdmin = allowPermissions([EUserPermissions.ADMIN], EUserPermissionsLevel.WORKSPACE);
const EMPTY_STATE_DATA = [ const EMPTY_STATE_DATA = [
{ {
@ -54,6 +63,7 @@ export const NoProjectsEmptyState = observer(() => {
setTrackElement("Sidebar"); setTrackElement("Sidebar");
toggleCreateProjectModal(true); toggleCreateProjectModal(true);
}, },
disabled: !canCreateProject,
}, },
}, },
{ {
@ -65,6 +75,7 @@ export const NoProjectsEmptyState = observer(() => {
cta: { cta: {
text: "home.empty.invite_team.cta", text: "home.empty.invite_team.cta",
link: `/${workspaceSlug}/settings/members`, link: `/${workspaceSlug}/settings/members`,
disabled: !isWorkspaceAdmin,
}, },
}, },
{ {
@ -76,6 +87,7 @@ export const NoProjectsEmptyState = observer(() => {
cta: { cta: {
text: "home.empty.configure_workspace.cta", text: "home.empty.configure_workspace.cta",
link: "settings", link: "settings",
disabled: !isWorkspaceAdmin,
}, },
}, },
{ {
@ -104,6 +116,7 @@ export const NoProjectsEmptyState = observer(() => {
cta: { cta: {
text: "home.empty.personalize_account.cta", text: "home.empty.personalize_account.cta",
link: "/profile", link: "/profile",
disabled: false,
}, },
}, },
]; ];
@ -112,7 +125,7 @@ export const NoProjectsEmptyState = observer(() => {
case "projects": case "projects":
return joinedProjectIds?.length > 0; return joinedProjectIds?.length > 0;
case "visited_members": case "visited_members":
return storedValue?.visited_members; return (activeWorkspace?.total_members || 0) >= 2;
case "visited_workspace": case "visited_workspace":
return storedValue?.visited_workspace; return storedValue?.visited_workspace;
case "visited_profile": case "visited_profile":
@ -120,7 +133,7 @@ export const NoProjectsEmptyState = observer(() => {
} }
}; };
if (storedValue?.hide) return null; if (storedValue?.hide || (joinedProjectIds?.length > 0 && (activeWorkspace?.total_members || 0) >= 2)) return null;
return ( return (
<div> <div>
@ -161,28 +174,35 @@ export const NoProjectsEmptyState = observer(() => {
<div className="flex items-center gap-2 bg-[#17a34a] rounded-full p-1"> <div className="flex items-center gap-2 bg-[#17a34a] rounded-full p-1">
<Check className="size-3 text-custom-primary-100 text-white" /> <Check className="size-3 text-custom-primary-100 text-white" />
</div> </div>
) : item.cta.link ? (
<Link
href={item.cta.link}
onClick={() => {
if (!storedValue) return;
setValue({
...storedValue,
[item.flag]: true,
});
}}
className="text-custom-primary-100 hover:text-custom-primary-200 text-sm font-medium"
>
{t(item.cta.text)}
</Link>
) : ( ) : (
<button !item.cta.disabled &&
type="button" (item.cta.link ? (
className="text-custom-primary-100 hover:text-custom-primary-200 text-sm font-medium" <Link
onClick={item.cta.onClick} href={item.cta.link}
> onClick={(e) => {
{t(item.cta.text)} if (!storedValue) {
</button> e.stopPropagation();
e.preventDefault();
return;
}
setValue({
...storedValue,
[item.flag]: true,
});
}}
className={cn("text-custom-primary-100 hover:text-custom-primary-200 text-sm font-medium", {})}
>
{t(item.cta.text)}
</Link>
) : (
<button
type="button"
className="text-custom-primary-100 hover:text-custom-primary-200 text-sm font-medium"
onClick={item.cta.onClick}
>
{t(item.cta.text)}
</button>
))
)} )}
</div> </div>
); );