@super_studio/ecforce-ai-agent-react 0.5.0 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,6 +6,12 @@ export type ChatbotFrameProps = {
6
6
  mcps?: MCP[];
7
7
  /** アプリ名のメタデータ */
8
8
  appName?: string;
9
+ /** セッションを取得するための関数 */
10
+ getSession?: () => Promise<{
11
+ sessionId: string;
12
+ token: string;
13
+ expiresAt: string;
14
+ }>;
9
15
  /**
10
16
  * trueになるまで、初期化されません。
11
17
  * 初期化せれたあとはもう使われません。
@@ -21,5 +27,14 @@ export type ChatbotFrameProps = {
21
27
  url?: string;
22
28
  className?: string;
23
29
  };
24
- export declare function ChatbotFrame({ agentId, appName, mcps, enabled, url, className, }: ChatbotFrameProps): import("react/jsx-runtime").JSX.Element;
30
+ export declare function ChatbotFrame({ agentId, appName, mcps, getSession, enabled, url, className, }: ChatbotFrameProps): import("react/jsx-runtime").JSX.Element;
31
+ export type SessionData = {
32
+ sessionId: string;
33
+ token: string;
34
+ expiresAt: string;
35
+ };
36
+ export type UseSessionProps = {
37
+ getSession?: () => Promise<SessionData>;
38
+ };
39
+ export declare function useSession({ getSession }: UseSessionProps): string | undefined;
25
40
  //# sourceMappingURL=chatbot-frame.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"chatbot-frame.d.ts","sourceRoot":"","sources":["../../src/components/chatbot-frame.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,sCAAsC,CAAC;AAEhE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,qBAAqB;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,wBAAwB;IACxB,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,iBAAiB;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,OAAO,EACP,IAAI,EACJ,OAAc,EACd,GAAG,EACH,SAAS,GACV,EAAE,iBAAiB,2CAkDnB"}
1
+ {"version":3,"file":"chatbot-frame.d.ts","sourceRoot":"","sources":["../../src/components/chatbot-frame.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,sCAAsC,CAAC;AAEhE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,qBAAqB;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,wBAAwB;IACxB,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,iBAAiB;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sBAAsB;IACtB,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;QACzB,SAAS,EAAE,MAAM,CAAC;QAClB,KAAK,EAAE,MAAM,CAAC;QACd,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC,CAAC;IACH;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;;OAKG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,OAAO,EACP,IAAI,EACJ,UAAU,EACV,OAAc,EACd,GAAG,EACH,SAAS,GACV,EAAE,iBAAiB,2CA4EnB;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC,WAAW,CAAC,CAAC;CACzC,CAAC;AAEF,wBAAgB,UAAU,CAAC,EAAE,UAAU,EAAE,EAAE,eAAe,sBAuCzD"}
@@ -17,6 +17,8 @@ type ChatbotContextType = {
17
17
  setMcps: (mcps: MCP[]) => void;
18
18
  /** アプリ名を設定 */
19
19
  setAppName: (appName: string) => void;
20
+ /** セッショントークンを設定 */
21
+ setSessionToken: (sessionToken: string) => void;
20
22
  /** チャットボットが準備できたか */
21
23
  isReady: boolean;
22
24
  /** チャットボットが初期化されたか */
@@ -1 +1 @@
1
- {"version":3,"file":"chatbot-proivder.d.ts","sourceRoot":"","sources":["../../../src/components/provider/chatbot-proivder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,GAAG,EACT,MAAM,6BAA6B,CAAC;AAGrC,KAAK,kBAAkB,GAAG;IACxB,gCAAgC;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,iBAAiB;IACjB,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,sBAAsB;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,mBAAmB;IACnB,aAAa,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,kBAAkB;IAClB,IAAI,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACjC,aAAa;IACb,OAAO,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;IAC/B,cAAc;IACd,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,qBAAqB;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,sBAAsB;IACtB,aAAa,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,WAAW,EAAE,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3D,CAAC;AAMF,wBAAgB,UAAU,uBAMzB;AAED,KAAK,oBAAoB,GAAG;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,oBAAoB,2CA0BjE"}
1
+ {"version":3,"file":"chatbot-proivder.d.ts","sourceRoot":"","sources":["../../../src/components/provider/chatbot-proivder.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,GAAG,EACT,MAAM,6BAA6B,CAAC;AAGrC,KAAK,kBAAkB,GAAG;IACxB,gCAAgC;IAChC,SAAS,EAAE,OAAO,CAAC;IACnB,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,iBAAiB;IACjB,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,sBAAsB;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,mBAAmB;IACnB,aAAa,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,kBAAkB;IAClB,IAAI,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACjC,aAAa;IACb,OAAO,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;IAC/B,cAAc;IACd,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,mBAAmB;IACnB,eAAe,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,qBAAqB;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,sBAAsB;IACtB,aAAa,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,WAAW,EAAE,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3D,CAAC;AAMF,wBAAgB,UAAU,uBAMzB;AAED,KAAK,oBAAoB,GAAG;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAAE,QAAQ,EAAE,EAAE,oBAAoB,2CAkCjE"}
@@ -18,6 +18,7 @@ export type MCP = {
18
18
  export type InitProps = {
19
19
  mcps?: MCP[];
20
20
  appName?: string;
21
+ sessionToken?: string;
21
22
  };
22
23
  export type ParentMessage = {
23
24
  type: "mcps";
@@ -25,10 +26,14 @@ export type ParentMessage = {
25
26
  } | {
26
27
  type: "appName";
27
28
  appName: string;
29
+ } | {
30
+ type: "sessionToken";
31
+ sessionToken: string;
28
32
  } | {
29
33
  type: "init";
30
34
  mcps?: MCP[];
31
35
  appName?: string;
36
+ sessionToken?: string;
32
37
  };
33
38
  export declare function useChatbotFrameHandler({ setOpen, setIsExpanded, }: {
34
39
  setOpen: (open: boolean) => void;
@@ -37,6 +42,7 @@ export declare function useChatbotFrameHandler({ setOpen, setIsExpanded, }: {
37
42
  init: (props: InitProps) => void;
38
43
  setMcps: (mcps: MCP[]) => void;
39
44
  setAppName: (appName: string) => void;
45
+ setSessionToken: (sessionToken: string) => void;
40
46
  setIframeEl: React.Dispatch<React.SetStateAction<HTMLIFrameElement | null>>;
41
47
  isReady: boolean;
42
48
  isInitialized: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"use-chatbot-frame-handler.d.ts","sourceRoot":"","sources":["../../../src/components/provider/use-chatbot-frame-handler.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,aAAa,GACrB;IAAE,IAAI,EAAE,eAAe,CAAA;CAAE,GACzB;IAAE,IAAI,EAAE,qBAAqB,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,eAAe,CAAA;CAAE,GACzB;IAAE,IAAI,EAAE,gBAAgB,CAAA;CAAE,GAC1B;IAAE,IAAI,EAAE,gBAAgB,CAAA;CAAE,CAAC;AAE/B,MAAM,MAAM,GAAG,GAAG;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,aAAa,GACrB;IACE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,GAAG,EAAE,CAAC;CACb,GACD;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;CACjB,GACD;IACE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEN,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,aAAa,GACd,EAAE;IACD,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,aAAa,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C;kBAqBW,SAAS;oBAUV,GAAG,EAAE;0BAOF,MAAM;;;;EAkDnB"}
1
+ {"version":3,"file":"use-chatbot-frame-handler.d.ts","sourceRoot":"","sources":["../../../src/components/provider/use-chatbot-frame-handler.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,aAAa,GACrB;IAAE,IAAI,EAAE,eAAe,CAAA;CAAE,GACzB;IAAE,IAAI,EAAE,qBAAqB,CAAA;CAAE,GAC/B;IAAE,IAAI,EAAE,eAAe,CAAA;CAAE,GACzB;IAAE,IAAI,EAAE,gBAAgB,CAAA;CAAE,GAC1B;IAAE,IAAI,EAAE,gBAAgB,CAAA;CAAE,CAAC;AAE/B,MAAM,MAAM,GAAG,GAAG;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,aAAa,GACrB;IACE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,GAAG,EAAE,CAAC;CACb,GACD;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;CACjB,GACD;IACE,IAAI,EAAE,cAAc,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;CACtB,GACD;IACE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEN,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,aAAa,GACd,EAAE;IACD,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,aAAa,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C;kBAqBW,SAAS;oBAUV,GAAG,EAAE;0BAOF,MAAM;oCAOD,MAAM;;;;EA0DxB"}
package/dist/index.js CHANGED
@@ -76,6 +76,12 @@ function useChatbotFrameHandler({
76
76
  },
77
77
  [postMessage]
78
78
  );
79
+ const setSessionToken = React5.default.useCallback(
80
+ (sessionToken) => {
81
+ postMessage({ type: "sessionToken", sessionToken });
82
+ },
83
+ [postMessage]
84
+ );
79
85
  React5.default.useEffect(() => {
80
86
  const iframe = iframeEl;
81
87
  if (!iframe) {
@@ -113,7 +119,15 @@ function useChatbotFrameHandler({
113
119
  iframe.removeEventListener("load", handleIframeLoad);
114
120
  };
115
121
  }, [iframeEl]);
116
- return { init, setMcps, setAppName, setIframeEl, isReady, isInitialized };
122
+ return {
123
+ init,
124
+ setMcps,
125
+ setAppName,
126
+ setSessionToken,
127
+ setIframeEl,
128
+ isReady,
129
+ isInitialized
130
+ };
117
131
  }
118
132
 
119
133
  // src/components/provider/use-chatbot-window-states.tsx
@@ -144,7 +158,15 @@ function useChatbot() {
144
158
  }
145
159
  function ChatbotProvider({ children }) {
146
160
  const { hasOpened, open, isExpanded, setOpen, setIsExpanded } = useChatbotWindowStates();
147
- const { setMcps, setAppName, init, isReady, isInitialized, setIframeEl } = useChatbotFrameHandler({
161
+ const {
162
+ setMcps,
163
+ setAppName,
164
+ setSessionToken,
165
+ init,
166
+ isReady,
167
+ isInitialized,
168
+ setIframeEl
169
+ } = useChatbotFrameHandler({
148
170
  setOpen,
149
171
  setIsExpanded
150
172
  });
@@ -154,6 +176,7 @@ function ChatbotProvider({ children }) {
154
176
  setOpen,
155
177
  isExpanded,
156
178
  setIsExpanded,
179
+ setSessionToken,
157
180
  init,
158
181
  setMcps,
159
182
  setAppName,
@@ -176,6 +199,7 @@ function ChatbotFrame({
176
199
  agentId,
177
200
  appName,
178
201
  mcps,
202
+ getSession,
179
203
  enabled = true,
180
204
  url,
181
205
  className
@@ -183,18 +207,27 @@ function ChatbotFrame({
183
207
  var _a;
184
208
  const chatbotUrl = (_a = url != null ? url : process.env.CHATBOT_URL) != null ? _a : PROD_CHATBOT_URL;
185
209
  const { setIframeEl } = useChatbot();
186
- const { init, setMcps, setAppName, isReady } = useChatbot();
210
+ const { init, setMcps, setAppName, setSessionToken, isReady } = useChatbot();
187
211
  const sentInitRef = React5.default.useRef(false);
188
212
  const [currentMcps, setCurrentMcps] = React5.default.useState();
189
213
  const [currentAppName, setCurrentAppName] = React5.default.useState();
214
+ const [currentSessionToken, setCurrentSessionToken] = React5.default.useState();
215
+ const sessionToken = useSession({ getSession });
216
+ const shouldInit = enabled && isReady && // getSessionが定義されていれば、currentSessionが設定されるまで待つ
217
+ !!(sessionToken || getSession === void 0);
190
218
  React5.default.useEffect(() => {
191
- if (enabled && isReady && !sentInitRef.current) {
192
- init({ mcps, appName });
219
+ if (shouldInit && !sentInitRef.current) {
220
+ init({
221
+ mcps,
222
+ appName,
223
+ sessionToken
224
+ });
193
225
  sentInitRef.current = true;
194
226
  setCurrentMcps(mcps);
195
227
  setCurrentAppName(appName);
228
+ setCurrentSessionToken(sessionToken);
196
229
  }
197
- }, [enabled, init, mcps, appName, isReady]);
230
+ }, [enabled, init, mcps, appName, isReady, sessionToken]);
198
231
  React5.default.useEffect(() => {
199
232
  if (sentInitRef.current && mcps && JSON.stringify(currentMcps) !== JSON.stringify(mcps)) {
200
233
  setMcps(mcps);
@@ -207,6 +240,12 @@ function ChatbotFrame({
207
240
  setAppName(appName);
208
241
  }
209
242
  }, [appName]);
243
+ React5.default.useEffect(() => {
244
+ if (sentInitRef.current && sessionToken && currentSessionToken !== sessionToken) {
245
+ setCurrentSessionToken(sessionToken);
246
+ setSessionToken(sessionToken);
247
+ }
248
+ }, [sessionToken]);
210
249
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
211
250
  "iframe",
212
251
  {
@@ -221,6 +260,36 @@ function ChatbotFrame({
221
260
  }
222
261
  );
223
262
  }
263
+ function useSession({ getSession }) {
264
+ const { setSessionToken } = useChatbot();
265
+ const [session, setSession] = React5.default.useState();
266
+ const isFetchingSessionRef = React5.default.useRef(false);
267
+ React5.default.useEffect(() => {
268
+ if (!getSession) return;
269
+ let intervalId;
270
+ const fetchSession = async () => {
271
+ if (isFetchingSessionRef.current) return;
272
+ try {
273
+ isFetchingSessionRef.current = true;
274
+ const session2 = await getSession();
275
+ setSession(session2);
276
+ setSessionToken(session2.token);
277
+ } catch (error) {
278
+ console.error("Failed to get session:", error);
279
+ } finally {
280
+ isFetchingSessionRef.current = false;
281
+ }
282
+ };
283
+ fetchSession();
284
+ intervalId = setInterval(fetchSession, 15 * 60 * 1e3);
285
+ return () => {
286
+ if (intervalId) {
287
+ clearInterval(intervalId);
288
+ }
289
+ };
290
+ }, [getSession, setSessionToken]);
291
+ return session == null ? void 0 : session.token;
292
+ }
224
293
 
225
294
  // src/components/chatbot-sheet.tsx
226
295
 
@@ -461,4 +530,5 @@ function EcforceAiIcon() {
461
530
 
462
531
 
463
532
 
464
- exports.ChatbotFrame = ChatbotFrame; exports.ChatbotProvider = ChatbotProvider; exports.ChatbotSheet = ChatbotSheet; exports.Sheet = Sheet; exports.SheetClose = SheetClose; exports.SheetContent = SheetContent; exports.SheetDescription = SheetDescription; exports.SheetFooter = SheetFooter; exports.SheetHeader = SheetHeader; exports.SheetTitle = SheetTitle; exports.SheetTrigger = SheetTrigger; exports.Tooltip = Tooltip; exports.useChatbot = useChatbot;
533
+
534
+ exports.ChatbotFrame = ChatbotFrame; exports.ChatbotProvider = ChatbotProvider; exports.ChatbotSheet = ChatbotSheet; exports.Sheet = Sheet; exports.SheetClose = SheetClose; exports.SheetContent = SheetContent; exports.SheetDescription = SheetDescription; exports.SheetFooter = SheetFooter; exports.SheetHeader = SheetHeader; exports.SheetTitle = SheetTitle; exports.SheetTrigger = SheetTrigger; exports.Tooltip = Tooltip; exports.useChatbot = useChatbot; exports.useSession = useSession;
package/dist/index.mjs CHANGED
@@ -76,6 +76,12 @@ function useChatbotFrameHandler({
76
76
  },
77
77
  [postMessage]
78
78
  );
79
+ const setSessionToken = React.useCallback(
80
+ (sessionToken) => {
81
+ postMessage({ type: "sessionToken", sessionToken });
82
+ },
83
+ [postMessage]
84
+ );
79
85
  React.useEffect(() => {
80
86
  const iframe = iframeEl;
81
87
  if (!iframe) {
@@ -113,7 +119,15 @@ function useChatbotFrameHandler({
113
119
  iframe.removeEventListener("load", handleIframeLoad);
114
120
  };
115
121
  }, [iframeEl]);
116
- return { init, setMcps, setAppName, setIframeEl, isReady, isInitialized };
122
+ return {
123
+ init,
124
+ setMcps,
125
+ setAppName,
126
+ setSessionToken,
127
+ setIframeEl,
128
+ isReady,
129
+ isInitialized
130
+ };
117
131
  }
118
132
 
119
133
  // src/components/provider/use-chatbot-window-states.tsx
@@ -144,7 +158,15 @@ function useChatbot() {
144
158
  }
145
159
  function ChatbotProvider({ children }) {
146
160
  const { hasOpened, open, isExpanded, setOpen, setIsExpanded } = useChatbotWindowStates();
147
- const { setMcps, setAppName, init, isReady, isInitialized, setIframeEl } = useChatbotFrameHandler({
161
+ const {
162
+ setMcps,
163
+ setAppName,
164
+ setSessionToken,
165
+ init,
166
+ isReady,
167
+ isInitialized,
168
+ setIframeEl
169
+ } = useChatbotFrameHandler({
148
170
  setOpen,
149
171
  setIsExpanded
150
172
  });
@@ -154,6 +176,7 @@ function ChatbotProvider({ children }) {
154
176
  setOpen,
155
177
  isExpanded,
156
178
  setIsExpanded,
179
+ setSessionToken,
157
180
  init,
158
181
  setMcps,
159
182
  setAppName,
@@ -176,6 +199,7 @@ function ChatbotFrame({
176
199
  agentId,
177
200
  appName,
178
201
  mcps,
202
+ getSession,
179
203
  enabled = true,
180
204
  url,
181
205
  className
@@ -183,18 +207,27 @@ function ChatbotFrame({
183
207
  var _a;
184
208
  const chatbotUrl = (_a = url != null ? url : process.env.CHATBOT_URL) != null ? _a : PROD_CHATBOT_URL;
185
209
  const { setIframeEl } = useChatbot();
186
- const { init, setMcps, setAppName, isReady } = useChatbot();
210
+ const { init, setMcps, setAppName, setSessionToken, isReady } = useChatbot();
187
211
  const sentInitRef = React4.useRef(false);
188
212
  const [currentMcps, setCurrentMcps] = React4.useState();
189
213
  const [currentAppName, setCurrentAppName] = React4.useState();
214
+ const [currentSessionToken, setCurrentSessionToken] = React4.useState();
215
+ const sessionToken = useSession({ getSession });
216
+ const shouldInit = enabled && isReady && // getSessionが定義されていれば、currentSessionが設定されるまで待つ
217
+ !!(sessionToken || getSession === void 0);
190
218
  React4.useEffect(() => {
191
- if (enabled && isReady && !sentInitRef.current) {
192
- init({ mcps, appName });
219
+ if (shouldInit && !sentInitRef.current) {
220
+ init({
221
+ mcps,
222
+ appName,
223
+ sessionToken
224
+ });
193
225
  sentInitRef.current = true;
194
226
  setCurrentMcps(mcps);
195
227
  setCurrentAppName(appName);
228
+ setCurrentSessionToken(sessionToken);
196
229
  }
197
- }, [enabled, init, mcps, appName, isReady]);
230
+ }, [enabled, init, mcps, appName, isReady, sessionToken]);
198
231
  React4.useEffect(() => {
199
232
  if (sentInitRef.current && mcps && JSON.stringify(currentMcps) !== JSON.stringify(mcps)) {
200
233
  setMcps(mcps);
@@ -207,6 +240,12 @@ function ChatbotFrame({
207
240
  setAppName(appName);
208
241
  }
209
242
  }, [appName]);
243
+ React4.useEffect(() => {
244
+ if (sentInitRef.current && sessionToken && currentSessionToken !== sessionToken) {
245
+ setCurrentSessionToken(sessionToken);
246
+ setSessionToken(sessionToken);
247
+ }
248
+ }, [sessionToken]);
210
249
  return /* @__PURE__ */ jsx2(
211
250
  "iframe",
212
251
  {
@@ -221,6 +260,36 @@ function ChatbotFrame({
221
260
  }
222
261
  );
223
262
  }
263
+ function useSession({ getSession }) {
264
+ const { setSessionToken } = useChatbot();
265
+ const [session, setSession] = React4.useState();
266
+ const isFetchingSessionRef = React4.useRef(false);
267
+ React4.useEffect(() => {
268
+ if (!getSession) return;
269
+ let intervalId;
270
+ const fetchSession = async () => {
271
+ if (isFetchingSessionRef.current) return;
272
+ try {
273
+ isFetchingSessionRef.current = true;
274
+ const session2 = await getSession();
275
+ setSession(session2);
276
+ setSessionToken(session2.token);
277
+ } catch (error) {
278
+ console.error("Failed to get session:", error);
279
+ } finally {
280
+ isFetchingSessionRef.current = false;
281
+ }
282
+ };
283
+ fetchSession();
284
+ intervalId = setInterval(fetchSession, 15 * 60 * 1e3);
285
+ return () => {
286
+ if (intervalId) {
287
+ clearInterval(intervalId);
288
+ }
289
+ };
290
+ }, [getSession, setSessionToken]);
291
+ return session == null ? void 0 : session.token;
292
+ }
224
293
 
225
294
  // src/components/chatbot-sheet.tsx
226
295
  import "react";
@@ -460,5 +529,6 @@ export {
460
529
  SheetTitle,
461
530
  SheetTrigger,
462
531
  Tooltip,
463
- useChatbot
532
+ useChatbot,
533
+ useSession
464
534
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@super_studio/ecforce-ai-agent-react",
3
- "version": "0.5.0",
3
+ "version": "0.5.1",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",
@@ -10,6 +10,12 @@ export type ChatbotFrameProps = {
10
10
  mcps?: MCP[];
11
11
  /** アプリ名のメタデータ */
12
12
  appName?: string;
13
+ /** セッションを取得するための関数 */
14
+ getSession?: () => Promise<{
15
+ sessionId: string;
16
+ token: string;
17
+ expiresAt: string;
18
+ }>;
13
19
  /**
14
20
  * trueになるまで、初期化されません。
15
21
  * 初期化せれたあとはもう使われません。
@@ -30,26 +36,41 @@ export function ChatbotFrame({
30
36
  agentId,
31
37
  appName,
32
38
  mcps,
39
+ getSession,
33
40
  enabled = true,
34
41
  url,
35
42
  className,
36
43
  }: ChatbotFrameProps) {
37
44
  const chatbotUrl = url ?? process.env.CHATBOT_URL ?? PROD_CHATBOT_URL;
38
45
  const { setIframeEl } = useChatbot();
39
- const { init, setMcps, setAppName, isReady } = useChatbot();
46
+ const { init, setMcps, setAppName, setSessionToken, isReady } = useChatbot();
40
47
  const sentInitRef = React.useRef(false);
41
48
  const [currentMcps, setCurrentMcps] = React.useState<MCP[]>();
42
49
  const [currentAppName, setCurrentAppName] = React.useState<string>();
50
+ const [currentSessionToken, setCurrentSessionToken] =
51
+ React.useState<string>();
52
+ const sessionToken = useSession({ getSession });
53
+
54
+ const shouldInit =
55
+ enabled &&
56
+ isReady &&
57
+ // getSessionが定義されていれば、currentSessionが設定されるまで待つ
58
+ !!(sessionToken || getSession === undefined);
43
59
 
44
60
  // 初期化の仕組み
45
61
  React.useEffect(() => {
46
- if (enabled && isReady && !sentInitRef.current) {
47
- init({ mcps, appName });
62
+ if (shouldInit && !sentInitRef.current) {
63
+ init({
64
+ mcps,
65
+ appName,
66
+ sessionToken,
67
+ });
48
68
  sentInitRef.current = true;
49
69
  setCurrentMcps(mcps);
50
70
  setCurrentAppName(appName);
71
+ setCurrentSessionToken(sessionToken);
51
72
  }
52
- }, [enabled, init, mcps, appName, isReady]);
73
+ }, [enabled, init, mcps, appName, isReady, sessionToken]);
53
74
 
54
75
  // mcpsの更新の仕組み
55
76
  React.useEffect(() => {
@@ -71,6 +92,18 @@ export function ChatbotFrame({
71
92
  }
72
93
  }, [appName]);
73
94
 
95
+ // sessionTokenの更新の仕組み
96
+ React.useEffect(() => {
97
+ if (
98
+ sentInitRef.current &&
99
+ sessionToken &&
100
+ currentSessionToken !== sessionToken
101
+ ) {
102
+ setCurrentSessionToken(sessionToken);
103
+ setSessionToken(sessionToken);
104
+ }
105
+ }, [sessionToken]);
106
+
74
107
  return (
75
108
  <iframe
76
109
  ref={setIframeEl}
@@ -84,3 +117,54 @@ export function ChatbotFrame({
84
117
  />
85
118
  );
86
119
  }
120
+
121
+ export type SessionData = {
122
+ sessionId: string;
123
+ token: string;
124
+ expiresAt: string;
125
+ };
126
+
127
+ export type UseSessionProps = {
128
+ getSession?: () => Promise<SessionData>;
129
+ };
130
+
131
+ export function useSession({ getSession }: UseSessionProps) {
132
+ const { setSessionToken } = useChatbot();
133
+ const [session, setSession] = React.useState<SessionData>();
134
+ const isFetchingSessionRef = React.useRef(false);
135
+
136
+ // セッションの取得と定期更新
137
+ React.useEffect(() => {
138
+ if (!getSession) return;
139
+
140
+ let intervalId: NodeJS.Timeout;
141
+
142
+ const fetchSession = async () => {
143
+ if (isFetchingSessionRef.current) return;
144
+ try {
145
+ isFetchingSessionRef.current = true;
146
+ const session = await getSession();
147
+ setSession(session);
148
+ setSessionToken(session.token);
149
+ } catch (error) {
150
+ console.error("Failed to get session:", error);
151
+ } finally {
152
+ isFetchingSessionRef.current = false;
153
+ }
154
+ };
155
+
156
+ // 初回実行
157
+ fetchSession();
158
+
159
+ // 15分ごとに実行
160
+ intervalId = setInterval(fetchSession, 15 * 60 * 1000);
161
+
162
+ return () => {
163
+ if (intervalId) {
164
+ clearInterval(intervalId);
165
+ }
166
+ };
167
+ }, [getSession, setSessionToken]);
168
+
169
+ return session?.token;
170
+ }
@@ -23,6 +23,8 @@ type ChatbotContextType = {
23
23
  setMcps: (mcps: MCP[]) => void;
24
24
  /** アプリ名を設定 */
25
25
  setAppName: (appName: string) => void;
26
+ /** セッショントークンを設定 */
27
+ setSessionToken: (sessionToken: string) => void;
26
28
  /** チャットボットが準備できたか */
27
29
  isReady: boolean;
28
30
  /** チャットボットが初期化されたか */
@@ -53,11 +55,18 @@ type ChatbotProviderProps = {
53
55
  export function ChatbotProvider({ children }: ChatbotProviderProps) {
54
56
  const { hasOpened, open, isExpanded, setOpen, setIsExpanded } =
55
57
  useChatbotWindowStates();
56
- const { setMcps, setAppName, init, isReady, isInitialized, setIframeEl } =
57
- useChatbotFrameHandler({
58
- setOpen,
59
- setIsExpanded,
60
- });
58
+ const {
59
+ setMcps,
60
+ setAppName,
61
+ setSessionToken,
62
+ init,
63
+ isReady,
64
+ isInitialized,
65
+ setIframeEl,
66
+ } = useChatbotFrameHandler({
67
+ setOpen,
68
+ setIsExpanded,
69
+ });
61
70
 
62
71
  const value = {
63
72
  hasOpened,
@@ -65,6 +74,7 @@ export function ChatbotProvider({ children }: ChatbotProviderProps) {
65
74
  setOpen,
66
75
  isExpanded,
67
76
  setIsExpanded,
77
+ setSessionToken,
68
78
  init,
69
79
  setMcps,
70
80
  setAppName,
@@ -16,6 +16,7 @@ export type MCP = {
16
16
  export type InitProps = {
17
17
  mcps?: MCP[];
18
18
  appName?: string;
19
+ sessionToken?: string;
19
20
  };
20
21
 
21
22
  export type ParentMessage =
@@ -27,10 +28,15 @@ export type ParentMessage =
27
28
  type: "appName";
28
29
  appName: string;
29
30
  }
31
+ | {
32
+ type: "sessionToken";
33
+ sessionToken: string;
34
+ }
30
35
  | {
31
36
  type: "init";
32
37
  mcps?: MCP[];
33
38
  appName?: string;
39
+ sessionToken?: string;
34
40
  };
35
41
 
36
42
  export function useChatbotFrameHandler({
@@ -83,6 +89,13 @@ export function useChatbotFrameHandler({
83
89
  [postMessage],
84
90
  );
85
91
 
92
+ const setSessionToken = React.useCallback(
93
+ (sessionToken: string) => {
94
+ postMessage({ type: "sessionToken", sessionToken });
95
+ },
96
+ [postMessage],
97
+ );
98
+
86
99
  // Initialize and setup listeners
87
100
  React.useEffect(() => {
88
101
  const iframe = iframeEl;
@@ -126,5 +139,13 @@ export function useChatbotFrameHandler({
126
139
  };
127
140
  }, [iframeEl]); // Run when iframe gets mounted
128
141
 
129
- return { init, setMcps, setAppName, setIframeEl, isReady, isInitialized };
142
+ return {
143
+ init,
144
+ setMcps,
145
+ setAppName,
146
+ setSessionToken,
147
+ setIframeEl,
148
+ isReady,
149
+ isInitialized,
150
+ };
130
151
  }