✨[Feat] 채팅 기능 구현 #245

package.json

@@ -29,16 +29,19 @@
     "@headlessui/react": "^2.2.0",
     "@hookform/resolvers": "^3.9.1",
     "@lukemorales/query-key-factory": "^1.3.4",
+    "@stomp/stompjs": "^7.0.0",
     "@tanstack/react-query": "^5.61.3",
     "@tanstack/react-query-devtools": "^5.61.3",
     "@types/react-datepicker": "^6.2.0",
+    "@types/sockjs-client": "^1.5.4",
     "axios": "^1.7.8",
     "next": "15.0.3",
     "react": "^18.3.1",
     "react-datepicker": "^7.5.0",
     "react-dom": "^18.3.1",
     "react-hook-form": "^7.53.2",
     "react-toastify": "^11.0.2",
+    "sockjs-client": "^1.6.1",
     "tailwind-merge": "^2.5.5",
     "zod": "^3.23.8",
     "zustand": "^5.0.1"

public/icons/GoBackIcon.tsx

@@ -0,0 +1,24 @@
+function GoBackIcon({
+  width = 14,
+  height = 14,
+  strokeColor = '#B4B5B6',
+  ...props
+}) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 40 40"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className="cursor-pointer"
+      role="button"
+      aria-label="뒤로 가기"
+      {...props}
+    >
+      <path d="M25 30L10 15L25 0" stroke={strokeColor} strokeWidth="2" />
+    </svg>
+  );
+}
+
+export default GoBackIcon;

public/icons/HamburgerMenuIcon.tsx

@@ -0,0 +1,30 @@
+function HamburgerMenuIcon({
+  width = 18,
+  height = 14,
+  strokeColor = '#B4B5B6',
+  ...props
+}) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 18 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className="cursor-pointer"
+      role="button"
+      aria-label="메뉴 열기"
+      {...props}
+    >
+      <path
+        d="M1 13H17M1 7H17M1 1H17"
+        stroke={strokeColor}
+        strokeWidth="2"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+
+export default HamburgerMenuIcon;