챗봇 서비스 불가 안내 모달 추가

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>

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="[email protected]">
+              [email protected]
+            </a>
+          </p>
+        </div>
+      </Modal>
+    )
+  )
+}