diff --git a/src/DialogComp/Notification.tsx b/src/DialogComp/Notification.tsx
index 6f0501f..bd981ec 100644
--- a/src/DialogComp/Notification.tsx
+++ b/src/DialogComp/Notification.tsx
@@ -5,9 +5,9 @@ function Notification({ children, mode }) {
return (
{children}
diff --git a/src/DialogComp/styles.css b/src/DialogComp/styles.css
index f5b30c5..fd5876f 100644
--- a/src/DialogComp/styles.css
+++ b/src/DialogComp/styles.css
@@ -233,6 +233,18 @@ button[disabled] {
border-radius: 4px;
}
+.notification-content-screen {
+ width: max-content;
+ position: absolute;
+ bottom: -2.4rem;
+ left: 15.3rem;
+ font-size: 0.8rem;
+ background-color: #292929;
+ color: #fff;
+ padding: 0.5rem 1rem;
+ border-radius: 4px;
+}
+
@keyframes overlayShow {
from {
opacity: 0;
diff --git a/src/MenuBar/TopMenuBar.tsx b/src/MenuBar/TopMenuBar.tsx
index 60fa6cf..9e972ce 100644
--- a/src/MenuBar/TopMenuBar.tsx
+++ b/src/MenuBar/TopMenuBar.tsx
@@ -2,6 +2,7 @@
import React, { useState } from "react";
import { useSetSaveOnServer } from "../store/store";
import Button from "../ui/Button";
+import Notification from "@/DialogComp/Notification";
import "./Header.css";
import config from "../utils/config";
@@ -18,6 +19,7 @@ export default function TopMenuBar() {
const uuid = useUuid();
const interData = useIntermediateData();
const projectID = useProjectID();
+ const [showNotification, setShowNotification] = useState(false);
const apiUrl = config.apiUrl;
@@ -35,6 +37,10 @@ export default function TopMenuBar() {
setCopied(false);
}, 3000);
+ setTimeout(() => {
+ setShowNotification(false);
+ }, 8000);
+
return (
@@ -50,9 +56,26 @@ export default function TopMenuBar() {
>
-
downloadFile(uuid, templateURL)}>
-
-
+ {showNotification && (
+
+ Project is not selected.
+
+
+ )}
+ {projectID ? (
+
downloadFile(uuid, templateURL)}>
+
+
+ ) : (
+
setShowNotification(true)}>
+
+
+ )}
{uuid && (