diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
index 938b45854..27ef0ad42 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
@@ -1,28 +1,22 @@
"use client";
import { observer } from "mobx-react";
-import Image from "next/image";
-import { useTheme } from "next-themes";
import { Home, Shapes } from "lucide-react";
-// images
-import githubBlackImage from "/public/logos/github-black.png";
-import githubWhiteImage from "/public/logos/github-white.png";
-// ui
-import { GITHUB_REDIRECTED_TRACKER_EVENT, HEADER_GITHUB_ICON } from "@plane/constants";
+// plane imports
import { useTranslation } from "@plane/i18n";
import { Breadcrumbs, Button, Header } from "@plane/ui";
// components
import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
-// constants
// hooks
-import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
import { useHome } from "@/hooks/store/use-home";
+// local imports
+import { StarUsOnGitHubLink } from "./star-us-link";
export const WorkspaceDashboardHeader = observer(() => {
- // hooks
- const { resolvedTheme } = useTheme();
- const { toggleWidgetSettings } = useHome();
+ // plane hooks
const { t } = useTranslation();
+ // hooks
+ const { toggleWidgetSettings } = useHome();
return (
<>
@@ -48,31 +42,7 @@ export const WorkspaceDashboardHeader = observer(() => {
{t("home.manage_widgets")}
-
- captureElementAndEvent({
- element: {
- elementName: HEADER_GITHUB_ICON,
- },
- event: {
- eventName: GITHUB_REDIRECTED_TRACKER_EVENT,
- state: "SUCCESS",
- },
- })
- }
- className="flex flex-shrink-0 items-center gap-1.5 rounded bg-custom-background-80 px-3 py-1.5"
- href="https://github.com/makeplane/plane"
- target="_blank"
- rel="noopener noreferrer"
- >
-
- {t("home.star_us_on_github")}
-
+
>
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/star-us-link.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/star-us-link.tsx
new file mode 100644
index 000000000..1573e7529
--- /dev/null
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/star-us-link.tsx
@@ -0,0 +1,44 @@
+"use client";
+
+import Image from "next/image";
+import { useTheme } from "next-themes";
+// plane imports
+import { HEADER_GITHUB_ICON, GITHUB_REDIRECTED_TRACKER_EVENT } from "@plane/constants";
+import { useTranslation } from "@plane/i18n";
+// helpers
+import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
+// public imports
+import githubBlackImage from "@/public/logos/github-black.png";
+import githubWhiteImage from "@/public/logos/github-white.png";
+
+export const StarUsOnGitHubLink = () => {
+ // plane hooks
+ const { t } = useTranslation();
+ // hooks
+ const { resolvedTheme } = useTheme();
+ const imageSrc = resolvedTheme === "dark" ? githubWhiteImage : githubBlackImage;
+
+ return (
+
+ captureElementAndEvent({
+ element: {
+ elementName: HEADER_GITHUB_ICON,
+ },
+ event: {
+ eventName: GITHUB_REDIRECTED_TRACKER_EVENT,
+ state: "SUCCESS",
+ },
+ })
+ }
+ className="flex flex-shrink-0 items-center gap-1.5 rounded bg-custom-background-80 px-3 py-1.5"
+ href="https://github.com/makeplane/plane"
+ target="_blank"
+ rel="noopener noreferrer"
+ >
+
+ {t("home.star_us_on_github")}
+
+ );
+};