obi-sdk 0.6.8 → 0.7.1

package/dist/loader.d.ts

@@ -14,6 +14,7 @@ interface ObiWidgetConfig {
     } | null;
     isActive?: boolean;
     linkOnlyAccess?: boolean;
+    showMenu?: boolean;
     primaryColor?: string;
 }
 declare class ObiWidgetLoader {

package/dist/modular/chunks/index-6deeede6.js

@@ -0,0 +1,6 @@
+import { O } from "./obi-widget-7e9394b1.js";
+import "./types-e0297e7b.js";
+export {
+  O as ObiWidget
+};
+//# sourceMappingURL=index-6deeede6.js.map

package/dist/modular/chunks/index-6deeede6.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-6deeede6.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/modular/chunks/{obi-widget-46e82ee8.js → obi-widget-7e9394b1.js}

@@ -15815,13 +15815,11 @@ function getDefaultIntegrations(_options) {
   ];
 }
 function createSentryScope() {
-  const integrations = getDefaultIntegrations().filter(
-    (defaultIntegration) => {
-      return !["BrowserApiErrors", "Breadcrumbs", "GlobalHandlers", "HttpContext"].includes(
-        defaultIntegration.name
-      );
-    }
-  );
+  const integrations = getDefaultIntegrations().filter((defaultIntegration) => {
+    return !["BrowserApiErrors", "Breadcrumbs", "GlobalHandlers", "HttpContext"].includes(
+      defaultIntegration.name
+    );
+  });
   const client = new BrowserClient({
     dsn: "https://ac54bd10eac67be2dafbc346e704e4d4@o4507251798835200.ingest.us.sentry.io/4509409566392320",
     environment: "production",
@@ -16593,13 +16591,20 @@ class CourseModal extends i$1 {
           composed: true
         })
       );
-      this.onClose?.();
     }
   }
   async fetchCourses() {
     try {
       this.loading = true;
-      const raw_response = await fetch(`${this.apiBaseUrl}/sessions?token=${this.apiKey}`);
+      console.log("[CourseModal] Fetching sessions from API", {
+        apiKey: this.apiKey ? "present" : "missing"
+      });
+      const raw_response = await fetch(`${this.apiBaseUrl}/sessions?token=${this.apiKey}`, {
+        cache: "no-cache"
+      });
+      if (!raw_response.ok) {
+        throw new Error(`HTTP ${raw_response.status}: ${raw_response.statusText}`);
+      }
       const response = await raw_response.json();
       let agentName = "";
       const mappedCourses = response.sessions?.map((session) => {
@@ -16616,10 +16621,15 @@ class CourseModal extends i$1 {
       const filteredCourses = mappedCourses.filter((course) => !!course.name);
       this.agentName = agentName || "Obi";
       this.courses = [...filteredCourses];
+      this.error = "";
+      console.log("[CourseModal] Sessions fetched successfully", {
+        sessionCount: filteredCourses.length,
+        sessions: filteredCourses.map((c2) => ({ id: c2.id, name: c2.name }))
+      });
       this.requestUpdate();
     } catch (err) {
-      console.error("Fetch error:", err);
-      this.error = "Failed to fetch courses";
+      console.error("[CourseModal] Fetch error:", err);
+      this.error = `Failed to fetch courses: ${err instanceof Error ? err.message : "Unknown error"}`;
     } finally {
       this.loading = false;
       this.requestUpdate();
@@ -17423,12 +17433,144 @@ var __decorateClass$1 = (decorators, target, key, kind) => {
   return result;
 };
 class SessionStartModal extends i$1 {
-  handleStart() {
-    if (this.onStart && this.session) {
+  constructor() {
+    super(...arguments);
+    this.isLoading = false;
+    this.error = null;
+    this.startAttempts = 0;
+  }
+  async handleStart() {
+    console.log("[SessionStartModal] Start button clicked", {
+      sessionId: this.session?.id,
+      hasOnStartCallback: !!this.onStart,
+      hasSession: !!this.session,
+      isLoading: this.isLoading,
+      startAttempts: this.startAttempts,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString()
+    });
+    trackEvent(
+      "session_start_modal_continue_clicked",
+      {
+        sessionId: this.session?.id,
+        sessionName: this.session?.name
+      },
+      "SessionStartModal"
+    );
+    if (this.isLoading) {
+      console.warn("[SessionStartModal] Start already in progress, ignoring click");
+      return;
+    }
+    if (!this.session) {
+      const error = "Session data is missing.";
+      console.error("[SessionStartModal] Validation failed:", error);
+      this.showError(error);
+      return;
+    }
+    if (!this.session.id) {
+      const error = "Session ID is missing.";
+      console.error("[SessionStartModal] Validation failed:", error, { session: this.session });
+      this.showError(error);
+      return;
+    }
+    if (!this.onStart) {
+      const error = "Start callback is not defined.";
+      console.error("[SessionStartModal] Validation failed:", error);
+      captureException(error, {
+        componentName: "SessionStartModal",
+        handlerName: "handleStart",
+        sessionData: this.session,
+        hasOnStart: !!this.onStart
+      });
+      this.showError(error);
+      return;
+    }
+    this.startAttempts++;
+    console.log("[SessionStartModal] Starting session attempt", {
+      attempt: this.startAttempts,
+      sessionId: this.session.id
+    });
+    this.error = null;
+    this.isLoading = true;
+    try {
+      console.log("[SessionStartModal] Calling onStart callback", {
+        sessionId: this.session.id,
+        attempt: this.startAttempts
+      });
+      trackEvent(
+        "session_start_modal_calling_onStart",
+        {
+          sessionId: this.session.id
+        },
+        "SessionStartModal"
+      );
       this.onStart(this.session.id);
+      console.log("[SessionStartModal] Session start completed successfully", {
+        sessionId: this.session.id,
+        attempt: this.startAttempts
+      });
+      trackEvent(
+        "session_start_modal_onStart_called",
+        {
+          sessionId: this.session.id
+        },
+        "SessionStartModal"
+      );
+      setTimeout(() => {
+        if (this.isConnected) {
+          captureException(
+            new Error("Session start modal did not close after Continue was clicked"),
+            {
+              componentName: "SessionStartModal",
+              handlerName: "handleStart_timeout",
+              sessionId: this.session?.id,
+              modalStillVisible: true
+            }
+          );
+        }
+      }, 2e3);
+    } catch (error) {
+      console.error("[SessionStartModal] Session start failed", {
+        sessionId: this.session.id,
+        attempt: this.startAttempts,
+        error: error instanceof Error ? error.message : String(error),
+        errorStack: error instanceof Error ? error.stack : void 0
+      });
+      captureException(error, {
+        componentName: "SessionStartModal",
+        handlerName: "handleStart",
+        sessionId: this.session?.id
+      });
+      this.isLoading = false;
+      if (error instanceof Error) {
+        if (error.message.includes("network") || error.message.includes("fetch")) {
+          this.showError(
+            "Network connection failed. Please check your internet connection, refresh the page, and try again."
+          );
+        } else if (error.message.includes("unauthorized") || error.message.includes("403")) {
+          this.showError("Session access denied.");
+        } else if (error.message.includes("session") && error.message.includes("not found")) {
+          this.showError("Session not found.");
+        } else {
+          this.showError(`Failed to start session: ${error.message}.`);
+        }
+      } else {
+        this.showError("An unexpected error occurred while starting the session.");
+      }
     }
   }
+  showError(message) {
+    this.error = message;
+    console.error("[SessionStartModal] Displaying error to user:", message);
+  }
   handleClose() {
+    console.log("[SessionStartModal] Close button clicked", {
+      sessionId: this.session?.id,
+      isLoading: this.isLoading,
+      startAttempts: this.startAttempts
+    });
+    if (this.isLoading) {
+      console.warn("[SessionStartModal] Attempted to close while loading");
+    }
     if (this.onClose) {
       this.onClose();
     }
@@ -17441,17 +17583,33 @@ class SessionStartModal extends i$1 {
           class="close-button"
           aria-label="Close session start modal"
           @click=${this.handleClose}
+          ?disabled=${this.isLoading}
         >
           ×
         </button>
 
         <div class="header">
           <div class="logo">${obiIcon}</div>
-          <h1>${this.session.name}</h1>
-          <p class="subtitle">${this.session.description}</p>
+          <h1>${this.session?.name || "Session"}</h1>
+          <p class="subtitle">${this.session?.description || "Starting your session..."}</p>
         </div>
 
-        <button class="button button-primary" @click=${this.handleStart}>Continue</button>
+        <button
+          class="button button-primary"
+          @click=${this.handleStart}
+          ?disabled=${this.isLoading}
+          aria-label=${this.isLoading ? "Starting session..." : "Start session"}
+        >
+          ${this.isLoading ? x`<div class="loading-spinner"></div>
+                <span class="button-text">Starting...</span>` : x`<span class="button-text">Continue</span>`}
+        </button>
+
+        ${this.error ? x`
+              <div class="error-message">
+                <div>${this.error}</div>
+                <div>Please refresh the page and try again.</div>
+              </div>
+            ` : ""}
       </div>
     `;
   }
@@ -17583,12 +17741,80 @@ SessionStartModal.styles = i$4`
       background: #18181b;
       color: white;
       margin-top: 32px;
+      position: relative;
+      overflow: hidden;
     }
 
-    .button-primary:hover {
+    .button-primary:hover:not(:disabled) {
       background: color-mix(in srgb, #18181b 90%, white);
     }
 
+    .button-primary:disabled {
+      background: #6b7280;
+      cursor: not-allowed;
+    }
+
+    .button-primary:disabled .button-text {
+      opacity: 0.7;
+    }
+
+    .loading-spinner {
+      width: 16px;
+      height: 16px;
+      border: 2px solid transparent;
+      border-top: 2px solid white;
+      border-radius: 50%;
+      animation: spin 1s linear infinite;
+      margin-right: 8px;
+    }
+
+    @keyframes spin {
+      0% {
+        transform: rotate(0deg);
+      }
+      100% {
+        transform: rotate(360deg);
+      }
+    }
+
+    .error-message {
+      margin-top: 16px;
+      padding: 12px 16px;
+      background: #fef2f2;
+      border: 1px solid #fecaca;
+      border-radius: 6px;
+      color: #dc2626;
+      font-size: 14px;
+      line-height: 1.4;
+      text-align: center;
+      max-width: 100%;
+      word-wrap: break-word;
+    }
+
+    .error-actions {
+      margin-top: 12px;
+      display: flex;
+      gap: 8px;
+      justify-content: center;
+      flex-wrap: wrap;
+    }
+
+    .error-action-button {
+      padding: 6px 12px;
+      background: white;
+      border: 1px solid #dc2626;
+      color: #dc2626;
+      border-radius: 4px;
+      font-size: 12px;
+      cursor: pointer;
+      transition: all 0.2s ease;
+    }
+
+    .error-action-button:hover {
+      background: #dc2626;
+      color: white;
+    }
+
     .close-button {
       position: absolute;
       top: 12px;
@@ -17605,6 +17831,11 @@ SessionStartModal.styles = i$4`
       align-items: center;
       justify-content: center;
     }
+
+    .close-button:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
   `;
 __decorateClass$1([
   n$2({ type: Object })
@@ -17615,6 +17846,15 @@ __decorateClass$1([
 __decorateClass$1([
   n$2({ type: Function })
 ], SessionStartModal.prototype, "onClose", 2);
+__decorateClass$1([
+  r$1()
+], SessionStartModal.prototype, "isLoading", 2);
+__decorateClass$1([
+  r$1()
+], SessionStartModal.prototype, "error", 2);
+__decorateClass$1([
+  r$1()
+], SessionStartModal.prototype, "startAttempts", 2);
 if (!customElements.get("obi-session-start-modal")) {
   customElements.define("obi-session-start-modal", SessionStartModal);
 }
@@ -17741,6 +17981,11 @@ class ObiWidget extends i$1 {
       "connectObi",
       "ObiWidget"
     );
+    this.handleCloseModals = () => {
+      this.state = SDKState.READY;
+      this.showCourseModal = false;
+      this.showSessionStartModal = false;
+    };
     this.handleCourseSelectEvent = (event) => {
       const customEvent = event;
       this.selectedCourse = customEvent.detail;
@@ -17812,8 +18057,13 @@ class ObiWidget extends i$1 {
         trackEvent("session_start_requested", { sessionToken }, "ObiWidget");
         if (this.activeSession) {
           trackEvent("session_start_blocked", { sessionToken }, "ObiWidget");
-          console.log("Connection already in progress or active session exists");
-          return;
+          captureException(new Error("Session start blocked"), {
+            componentName: "ObiWidget",
+            handlerName: "handleSessionStart",
+            sessionToken
+          });
+          this.activeSession.disconnect();
+          this.activeSession = null;
         }
         this.showSessionStartModal = false;
         this.state = SDKState.LOADING;
@@ -17931,6 +18181,11 @@ class ObiWidget extends i$1 {
       if (window.obiWidgetConfig.linkOnlyAccess !== void 0) {
         this.linkOnlyAccess = window.obiWidgetConfig.linkOnlyAccess;
       }
+      if (window.obiWidgetConfig.showMenu === true) {
+        this.state = SDKState.LOADING;
+        this.showCourseModal = true;
+        window.obiWidgetConfig.showMenu = false;
+      }
       const primaryColor = window.obiWidgetConfig?.primaryColor || OBI_PRIMARY_COLOR;
       this.style.setProperty("--obi-primary", primaryColor);
       this.generateColorVariables(primaryColor);
@@ -18218,7 +18473,7 @@ class ObiWidget extends i$1 {
             ` : E}
       </div>
       ${this.showCourseModal ? x`<obi-course-modal
-            .onClose=${() => this.showCourseModal = false}
+            .onClose=${this.handleCloseModals.bind(this)}
             .apiKey=${this.apiKey}
             @course-select=${this.handleCourseSelectEvent}
           ></obi-course-modal>` : E}
@@ -18226,9 +18481,8 @@ class ObiWidget extends i$1 {
             .session=${this.selectedCourse}
             .onStart=${this.handleSessionStart.bind(this)}
             .onClose=${() => {
-      this.showSessionStartModal = false;
+      this.handleCloseModals();
       this.selectedCourse = null;
-      this.state = SDKState.READY;
       this.removeSessionUrlParams();
     }}
           ></obi-session-start-modal>` : E}
@@ -18457,4 +18711,4 @@ export {
   withSentryAsyncHandler as w,
   x
 };
-//# sourceMappingURL=obi-widget-46e82ee8.js.map
+//# sourceMappingURL=obi-widget-7e9394b1.js.map