(최겸) 세일즈포스 poc 개발

1 files changed, 78 insertions, 1 deletions

diff --git a/lib/dashboard/dashboard-client.tsx b/lib/dashboard/dashboard-client.tsx
index fef279e5..29660778 100644
--- a/lib/dashboard/dashboard-client.tsx
+++ b/lib/dashboard/dashboard-client.tsx
@@ -1,6 +1,16 @@
 "use client";
 
-import { useState, useTransition } from "react";
+import { useState, useTransition, useEffect } from "react";
+
+// Lightning 전역 객체 타입 선언
+declare global {
+  interface Window {
+    $Lightning: {
+      use: (appName: string, callback: () => void, salesforceUrl: string, accessToken: string) => void;
+      createComponent: (componentName: string, attributes: any, container: string, callback: (cmp: any) => void) => void;
+    };
+  }
+}
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Button } from "@/components/ui/button";
 import { RefreshCw } from "lucide-react";
@@ -20,6 +30,71 @@ export function DashboardClient({ initialData }: DashboardClientProps) {
   const [data, setData] = useState<DashboardData>(initialData);
   const [isPending, startTransition] = useTransition();
 
+  // AgentForce POC Chatbot 초기화
+  useEffect(() => {
+    // Lightning 스크립트 로드
+    const script = document.createElement('script');
+    script.src = 'https://connect-flow-8014--ps.sandbox.lightning.force.com/lightning/lightning.out.js';
+    script.onload = () => {
+      // 스크립트 로드 후 채팅봇 초기화
+      initializeChatbot();
+    };
+    document.head.appendChild(script);
+
+    return () => {
+      // 컴포넌트 언마운트 시 스크립트 제거
+      const existingScript = document.querySelector('script[src*="lightning.out.js"]');
+      if (existingScript) {
+        existingScript.remove();
+      }
+    };
+  }, []);
+
+  const initializeChatbot = async () => {
+    try {
+      const myApiUrl = 'https://pyheroku-d21d18e4f257.herokuapp.com/api/getToken';
+      const salesforceUrl = 'https://connect-flow-8014--ps.sandbox.lightning.force.com/';
+      const appName = 'c:zzChatBot_Aura';
+      const componentContainer = 'agentforceChatbotDivId';
+
+      const response = await fetch(myApiUrl, { method: 'POST' });
+      if (!response.ok) {
+        const errorData = await response.json();
+        throw new Error(`백엔드 API 에러 (Status: ${response.status}): ${JSON.stringify(errorData)}`);
+      }
+
+      const data = await response.json();
+      const accessToken = data.access_token;
+      if (!accessToken) {
+        throw new Error("응답 데이터에 access_token이 없습니다.");
+      }
+
+      console.log("백엔드를 통해 안전하게 토큰을 받았습니다:", accessToken);
+      
+      const lwcAttributes = {
+        isDarkMode: true,
+        chatbot_width: '500px',
+        chatbot_height: '700px'
+      };
+
+      window.$Lightning.use(appName,
+        () => {
+          window.$Lightning.createComponent(
+            "c:sj_Chatbot",
+            lwcAttributes,
+            componentContainer,
+            (cmp: any) => {
+              console.log('salesforce chatbot');
+            }
+          );
+        },
+        salesforceUrl,
+        accessToken  
+      );
+    } catch (error) {
+      console.error('전체 프로세스 호출 실패:', error);
+    }
+  };
 
   console.log(data)
 
@@ -64,6 +139,8 @@ export function DashboardClient({ initialData }: DashboardClientProps) {
 
   return (
     <div className="space-y-6">
+      {/* AgentForce POC Chatbot - 우측하단 고정 */}
+      <div id="agentforceChatbotDivId" className="fixed bottom-4 right-4 z-50"></div>
       {/* 헤더 */}
       <div className="flex items-center justify-between">
         <div>