From e5f83752e69f271bc06195af7583ef7473fdecc6 Mon Sep 17 00:00:00 2001
From: jagaldol <yoy06056@pusan.ac.kr>
Date: Mon, 11 Mar 2024 17:47:33 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EC=B1=97=EB=B4=87=20=EC=84=9C=EB=B9=84?=
 =?UTF-8?q?=EC=8A=A4=20=EB=B6=88=EA=B0=80=20=EC=95=88=EB=82=B4=20=EB=AA=A8?=
 =?UTF-8?q?=EB=8B=AC=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/app/chat/layout.tsx               |  2 ++
 client/src/containers/home/announceModal.tsx | 25 ++++++++++++++++++++
 2 files changed, 27 insertions(+)
 create mode 100644 client/src/containers/home/announceModal.tsx

diff --git a/client/src/app/chat/layout.tsx b/client/src/app/chat/layout.tsx
index 93b4b7c..34f4498 100644
--- a/client/src/app/chat/layout.tsx
+++ b/client/src/app/chat/layout.tsx
@@ -4,6 +4,7 @@ import Footer from "@/containers/home/footer"
 import Navigator from "@/containers/home/navigator"
 import AuthProvider from "@/contexts/authContextProvider"
 import ChatroomProvider from "@/contexts/chatroomContextProvider"
+import AnnounceModal from "@/containers/home/announceModal"
 
 export default function ChatLayout({ children }: { children: ReactNode }) {
   return (
@@ -13,6 +14,7 @@ export default function ChatLayout({ children }: { children: ReactNode }) {
         <main className="flex grow flex-col">
           <Header />
           <section className="grow">{children}</section>
+          <AnnounceModal />
           <Footer />
         </main>
       </ChatroomProvider>
diff --git a/client/src/containers/home/announceModal.tsx b/client/src/containers/home/announceModal.tsx
new file mode 100644
index 0000000..f995b06
--- /dev/null
+++ b/client/src/containers/home/announceModal.tsx
@@ -0,0 +1,25 @@
+"use client"
+
+import { useState } from "react"
+import Modal from "@/components/modal"
+
+export default function AnnounceModal() {
+  const [isOpen, setIsOpen] = useState(true)
+  return (
+    isOpen && (
+      <Modal onClickClose={() => setIsOpen(false)} description="">
+        <div className="px-8 py-32 max-md:py-24 max-md:text-sm flex flex-col gap-3">
+          <p className="">현재 foodie AI server는 비용 상의 문제로 운영되고 있지 않습니다.</p>
+
+          <p>AI foodie와의 대화를 나누고 싶다면 개발자 이메일로 문의 부탁드립니다. 일정시간 foodie를 깨워드립니다!</p>
+          <p>
+            문의하기:{" "}
+            <a className="text-blue-600 hover:text-blue-800" href="jagaldol.dev@gmail.com">
+              jagaldol.dev@gmail.com
+            </a>
+          </p>
+        </div>
+      </Modal>
+    )
+  )
+}