New Directory Setup (#2065)

* chore: moved app & space from apps to root * chore: modified workspace configuration * chore: modified dockerfiles for space and web * chore: modified icons for space * feat: updated files for new svg icons supported by next-images * chore: added /spaces base path for next * chore: added compose config for space * chore: updated husky configuration * chore: updated workflows for new configuration * chore: changed app name to web * fix: resolved build errors with web * chore: reset file tracing root for both projects * chore: added nginx config for deploy * fix: eslint and tsconfig settings for space app * husky setup fixes based on new dir * eslint fixes * prettier formatting --------- Co-authored-by: Henit Chobisa <chobisa.henit@gmail.com>
2023-09-03 18:50:30 +05:30 · 2023-09-03 18:50:30 +05:30 · 1e152c666c
commit 1e152c666c
parent 20e36194b4
1022 changed files with 1475 additions and 1240 deletions
--- a/space/components/issues/navbar/index.tsx
+++ b/space/components/issues/navbar/index.tsx
@ -0,0 +1,117 @@
+import { useEffect } from "react";
+
+import Link from "next/link";
+import Image from "next/image";
+import { useRouter } from "next/router";
+
+// mobx
+import { observer } from "mobx-react-lite";
+// components
+import { NavbarSearch } from "./search";
+import { NavbarIssueBoardView } from "./issue-board-view";
+import { NavbarTheme } from "./theme";
+// ui
+import { PrimaryButton } from "components/ui";
+// lib
+import { useMobxStore } from "lib/mobx/store-provider";
+// store
+import { RootStore } from "store/root";
+
+const renderEmoji = (emoji: string | { name: string; color: string }) => {
+  if (!emoji) return;
+
+  if (typeof emoji === "object")
+    return (
+      <span style={{ color: emoji.color }} className="material-symbols-rounded text-lg">
+        {emoji.name}
+      </span>
+    );
+  else return isNaN(parseInt(emoji)) ? emoji : String.fromCodePoint(parseInt(emoji));
+};
+
+const IssueNavbar = observer(() => {
+  const { project: projectStore, user: userStore }: RootStore = useMobxStore();
+  // router
+  const router = useRouter();
+  const { workspace_slug, project_slug, board } = router.query;
+
+  const user = userStore?.currentUser;
+
+  useEffect(() => {
+    if (workspace_slug && project_slug) {
+      projectStore.fetchProjectSettings(workspace_slug.toString(), project_slug.toString());
+    }
+  }, [projectStore, workspace_slug, project_slug]);
+
+  useEffect(() => {
+    if (workspace_slug && projectStore) {
+      if (board) {
+        projectStore.setActiveBoard(board.toString());
+      } else {
+        router.push(`/${workspace_slug}/${project_slug}?board=list`);
+        projectStore.setActiveBoard("list");
+      }
+    }
+  }, [board, router, projectStore, workspace_slug, project_slug]);
+
+  return (
+    <div className="px-5 relative w-full flex items-center gap-4">
+      {/* project detail */}
+      <div className="flex-shrink-0 flex items-center gap-2">
+        <div className="w-4 h-4 flex justify-center items-center">
+          {projectStore?.project && projectStore?.project?.emoji ? (
+            renderEmoji(projectStore?.project?.emoji)
+          ) : (
+            <Image src="/plane-logo.webp" alt="plane logo" className="w-[24px] h-[24px]" height="24" width="24" />
+          )}
+        </div>
+        <div className="font-medium text-lg max-w-[300px] line-clamp-1 overflow-hidden">
+          {projectStore?.project?.name || `...`}
+        </div>
+      </div>
+
+      {/* issue search bar */}
+      <div className="w-full">
+        <NavbarSearch />
+      </div>
+
+      {/* issue views */}
+      <div className="flex-shrink-0 relative flex items-center gap-1 transition-all ease-in-out delay-150">
+        <NavbarIssueBoardView />
+      </div>
+
+      {/* theming */}
+      <div className="flex-shrink-0 relative">
+        <NavbarTheme />
+      </div>
+
+      {user ? (
+        <div className="border border-custom-border-200 rounded flex items-center gap-2 p-2">
+          {user.avatar && user.avatar !== "" ? (
+            <div className="h-5 w-5 rounded-full">
+              {/* eslint-disable-next-line @next/next/no-img-element */}
+              <img src={user.avatar} alt={user.display_name ?? ""} className="rounded-full" />
+            </div>
+          ) : (
+            <div className="bg-custom-background-80 h-5 w-5 rounded-full grid place-items-center text-[10px] capitalize">
+              {(user.display_name ?? "A")[0]}
+            </div>
+          )}
+          <h6 className="text-xs font-medium">{user.display_name}</h6>
+        </div>
+      ) : (
+        <div className="flex-shrink-0">
+          <Link href={`/?next_path=${router.asPath}`}>
+            <a>
+              <PrimaryButton className="flex-shrink-0" outline>
+                Sign in
+              </PrimaryButton>
+            </a>
+          </Link>
+        </div>
+      )}
+    </div>
+  );
+});
+
+export default IssueNavbar;