snapshot of https://github.com/makeplane/plane.git @ d868349a55de79979eb8b98701bf1702c67ad634 (2026-09-15)

apps/space/components/issues/navbar/theme.tsx

@@ -0,0 +1,40 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useEffect, useState } from "react";
+import { observer } from "mobx-react";
+import { useTheme } from "next-themes";
+import { AppearanceOutline, MoonOutline } from "@makeplane/propel/icons";
+
+export const NavbarTheme = observer(function NavbarTheme() {
+  // states
+  const [appTheme, setAppTheme] = useState("light");
+  // theme
+  const { setTheme, theme } = useTheme();
+
+  const handleTheme = () => {
+    setTheme(theme === "light" ? "dark" : "light");
+  };
+
+  useEffect(() => {
+    if (!theme) return;
+    setAppTheme(theme);
+  }, [theme]);
+
+  return (
+    <button
+      type="button"
+      onClick={handleTheme}
+      className="relative grid size-7 place-items-center rounded-sm bg-layer-transparent text-primary hover:bg-layer-transparent-hover"
+    >
+      {appTheme === "light" ? (
+        <MoonOutline className="size-3.5 shrink-0" />
+      ) : (
+        <AppearanceOutline className="size-3.5 shrink-0" />
+      )}
+    </button>
+  );
+});