From 8e950ed4272a8343175f0b7fcb1c516581132b86 Mon Sep 17 00:00:00 2001
From: Robert <robertsolovev39@gmail.com>
Date: Fri, 8 Mar 2024 23:05:57 +0700
Subject: [PATCH] refactored into chain editor

---
 src/routes/$namespace/$chainId.tsx            | 19 +------
 src/widgets/chain-buttons/index.ts            |  1 -
 src/widgets/chain-buttons/ui/ChainButtons.tsx | 16 ------
 src/widgets/chain-editor/index.ts             |  1 +
 src/widgets/chain-editor/ui/ChainEditor.tsx   | 52 +++++++++++++++++++
 5 files changed, 55 insertions(+), 34 deletions(-)
 delete mode 100644 src/widgets/chain-buttons/index.ts
 delete mode 100644 src/widgets/chain-buttons/ui/ChainButtons.tsx
 create mode 100644 src/widgets/chain-editor/index.ts
 create mode 100644 src/widgets/chain-editor/ui/ChainEditor.tsx

diff --git a/src/routes/$namespace/$chainId.tsx b/src/routes/$namespace/$chainId.tsx
index 1c17f8a..b8f33e3 100644
--- a/src/routes/$namespace/$chainId.tsx
+++ b/src/routes/$namespace/$chainId.tsx
@@ -2,28 +2,13 @@ import { redirect } from "@tanstack/react-router";
 import { requireChains } from "@/entities/chain/lib";
 import { createFileRoute } from "@tanstack/react-router";
 
+import { ChainEditor } from "@/widgets/chain-editor";
 import { useChainState } from "@/entities/chain/model";
-import { Typography } from "@mui/material";
-import { ChainButtons } from "@/widgets/chain-buttons";
 
 function ChainPage() {
   const { chain } = Route.useLoaderData();
 
-  return (
-    <>
-      <div key={chain._id} className="flex items-center justify-between">
-        <Typography
-          variant="h4"
-          sx={{ color: "#4C4E64DE" }}
-          className="select-none"
-        >
-          {chain.name}
-        </Typography>
-
-        <ChainButtons chain={chain} />
-      </div>
-    </>
-  );
+  return <ChainEditor chain={chain} />;
 }
 
 export const Route = createFileRoute("/$namespace/$chainId")({
diff --git a/src/widgets/chain-buttons/index.ts b/src/widgets/chain-buttons/index.ts
deleted file mode 100644
index 3b4d9f1..0000000
--- a/src/widgets/chain-buttons/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default as ChainButtons } from "./ui/ChainButtons";
diff --git a/src/widgets/chain-buttons/ui/ChainButtons.tsx b/src/widgets/chain-buttons/ui/ChainButtons.tsx
deleted file mode 100644
index 5bff773..0000000
--- a/src/widgets/chain-buttons/ui/ChainButtons.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import type { Chain } from "@/entities/chain/schema";
-import { RenameChainButton } from "@/features/rename-chain";
-import { DeleteChainButton } from "@/features/delete-chain";
-
-interface ChainButtonsProps {
-  chain: Chain;
-}
-
-export default function ChainButtons({ chain }: ChainButtonsProps) {
-  return (
-    <div className="flex items-center gap-x-5">
-      <RenameChainButton chain={chain} />
-      <DeleteChainButton chain={chain} />
-    </div>
-  );
-}
diff --git a/src/widgets/chain-editor/index.ts b/src/widgets/chain-editor/index.ts
new file mode 100644
index 0000000..72316ba
--- /dev/null
+++ b/src/widgets/chain-editor/index.ts
@@ -0,0 +1 @@
+export { default as ChainEditor } from "./ui/ChainEditor";
diff --git a/src/widgets/chain-editor/ui/ChainEditor.tsx b/src/widgets/chain-editor/ui/ChainEditor.tsx
new file mode 100644
index 0000000..520639d
--- /dev/null
+++ b/src/widgets/chain-editor/ui/ChainEditor.tsx
@@ -0,0 +1,52 @@
+import type { Chain } from "@/entities/chain/schema";
+
+import { RenameChainButton } from "@/features/rename-chain";
+import { DeleteChainButton } from "@/features/delete-chain";
+
+import { Typography } from "@mui/material";
+import Breadcrumbs from "@mui/material/Breadcrumbs";
+
+interface ChainEditorProps {
+  chain: Chain;
+}
+
+export default function ChainEditor({ chain }: ChainEditorProps) {
+  if (!chain.actions || chain.actions.length === 0)
+    return (
+      <>
+        <Breadcrumbs sx={{ fontSize: "24px" }}>
+          <Typography
+            variant="h5"
+            sx={{ color: "#4C4E64DE", opacity: "60%" }}
+            className="select-none"
+          >
+            {chain.name}
+          </Typography>
+          <Typography
+            variant="h5"
+            sx={{ color: "#4C4E64DE", opacity: "87%" }}
+            className="select-none"
+          >
+            Новый пост
+          </Typography>
+        </Breadcrumbs>
+      </>
+    );
+
+  return (
+    <div key={chain._id} className="flex items-center justify-between">
+      <Typography
+        variant="h5"
+        sx={{ color: "#4C4E64DE", opacity: "87%" }}
+        className="select-none"
+      >
+        {chain.name}
+      </Typography>
+
+      <div className="flex items-center gap-x-5">
+        <RenameChainButton chain={chain} />
+        <DeleteChainButton chain={chain} />
+      </div>
+    </div>
+  );
+}