Merge pull request #82 from nuxxapp/feat/title

Update document title
3 years ago · df0b46ce59
parent c2a0a1dffd 89f030a420
commit df0b46ce59
4 changed files with 17 additions and 1 deletions
--- a/services/frontend/public/index.html
+++ b/services/frontend/public/index.html
@ -24,7 +24,7 @@
      work correctly both with client-side routing and a non-root public URL.
      Learn how to configure a non-root public URL by running `npm run build`.
    -->
-    <title>React App</title>
+    <title>Container Toolkit</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
--- a/services/frontend/src/components/Project/index.tsx
+++ b/services/frontend/src/components/Project/index.tsx
@ -39,6 +39,7 @@ import ModalNetwork from "../Modal/network";
 import CreateVolumeModal from "../Modal/volume/CreateVolumeModal";
 import EditVolumeModal from "../Modal/volume/EditVolumeModal";
 import CodeEditor from "../CodeEditor";
+import { useTitle } from "../../hooks";

 export default function Project() {
  const { uuid } = useParams<{ uuid: string }>();
@ -96,6 +97,13 @@ export default function Project() {
    }
  );

+  useTitle(
+    [
+      isFetching ? "" : data ? data.name : "New project",
+      "Container Toolkit"
+    ].join(" | ")
+  );
+
  stateNodesRef.current = nodes;
  stateConnectionsRef.current = connections;
  stateNetworksRef.current = networks;
--- a/services/frontend/src/hooks/index.ts
+++ b/services/frontend/src/hooks/index.ts
@ -0,0 +1 @@
+export * from "./useTitle";
--- a/services/frontend/src/hooks/useTitle.ts
+++ b/services/frontend/src/hooks/useTitle.ts
@ -0,0 +1,7 @@
+import { useEffect } from "react";
+
+export const useTitle = (title: string) => {
+  useEffect(() => {
+    document.title = title;
+  }, [title]);
+};