@useinsider/guido 1.0.3-beta.000af7d → 1.0.3-beta.001f60f

package/README.md

@@ -52,7 +52,6 @@ npm install @useinsider/guido
       ref="guidoEditor"
       :template-id="templateId"
       :user-id="userId"
-      :migration-date="migrationDate"
       :guido-config="guidoConfig"
       :html="initialHtml"
       :css="initialCss"
@@ -75,7 +74,6 @@ export default {
     return {
       templateId: 'template-123',
       userId: 'user-456',
-      migrationDate: 1699488000,
       initialHtml: '<p>Initial HTML content</p>',
       initialCss: 'p { color: #333; }',
       guidoConfig: {
@@ -147,7 +145,6 @@ export default {
 | `templateId` | `string` | ✅ | - | Unique identifier for the email template |
 | `userId` | `string` | ✅ | - | Unique identifier for the user |
 | `guidoConfig` | `GuidoConfig` | ✅ | - | Configuration object for the editor |
-| `migrationDate` | `number` | ✅ | - | Stripo migration date in Unix timestamp (seconds). Retrieved from backend `/partner-settings` endpoint as `migrationDate`. Used for onboarding process |
 | `partnerName` | `string` | ⚪ | From URL host | Partner identifier |
 | `productType` | `string` | ⚪ | From URL path | Product type identifier |
 | `username` | `string` | ⚪ | `'Guido User'` | Display name for the user |
@@ -164,7 +161,6 @@ export default {
 | `save:complete` | `Omit<Template, 'forceRecreate'>` | Fired when template is successfully saved |
 | `on-change` | void | It Fires once for managing leave modal etc. |
 | `ready` | void | Fired when the editor is ready and template is loaded |
-| `onboarding-finished` | void | Fired when the onboarding popup is dismissed or completed, allowing parent applications to track onboarding state |
 
 ### Guido Exposed Methods
 ```typescript

package/dist/components/Guido.vue.js

@@ -1,20 +1,18 @@
-import i from "./Guido.vue2.js";
+import o from "./Guido.vue2.js";
 /* empty css           */
-import a from "../_virtual/_plugin-vue2_normalizer.js";
+import i from "../_virtual/_plugin-vue2_normalizer.js";
 var t = function() {
-  var o = this, r = o._self._c, e = o._self._setupProxy;
-  return r("div", { staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper, { ref: "headerWrapperRef" }), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : o._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.FilterSelectionDrawer), r(e.SaveAsTemplateDrawer), e.isTestPartner() ? o._e() : r(e.OnboardingWrapper, { on: { "onboarding-finished": function(_) {
-    return e.emit("onboarding:finished");
-  } } }), r(e.UnsubscribeWrapper), r(e.LoadingWrapper)], 1);
-}, n = [], s = /* @__PURE__ */ a(
-  i,
+  var a = this, r = a._self._c, e = a._self._setupProxy;
+  return r("div", { staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper, { ref: "headerWrapperRef" }), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : a._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.FilterSelectionDrawer), r(e.SaveAsTemplateDrawer), e.isTestPartner() ? a._e() : r(e.OnboardingWrapper), r(e.UnsubscribeWrapper), r(e.LoadingWrapper)], 1);
+}, s = [], d = /* @__PURE__ */ i(
+  o,
   t,
-  n,
+  s,
   !1,
   null,
-  "3c910a93"
+  "5a4aa0bc"
 );
-const v = s.exports;
+const l = d.exports;
 export {
-  v as default
+  l as default
 };

package/dist/components/Guido.vue2.js

@@ -1,23 +1,23 @@
-import { defineComponent as R, defineAsyncComponent as I, ref as x, computed as U, watch as M, onMounted as z, onUnmounted as B } from "vue";
-import { provideGuidoActions as K } from "../composables/useGuidoActions.js";
-import { usePartner as O } from "../composables/usePartner.js";
-import { useStripo as j } from "../composables/useStripo.js";
+import { defineComponent as M, defineAsyncComponent as G, ref as R, computed as U, watch as z, onMounted as B, onUnmounted as K } from "vue";
+import { provideGuidoActions as O } from "../composables/useGuidoActions.js";
+import { usePartner as j } from "../composables/usePartner.js";
+import { useStripo as q } from "../composables/useStripo.js";
 import { migrate as W } from "../config/migrator/index.js";
-import { DefaultUsername as q, DefaultMessageType as J, DefaultGuidoConfig as Q } from "../enums/defaults.js";
-import V from "./organisms/base/Toaster.vue.js";
-import X from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
-import Y from "./organisms/header/HeaderWrapper.vue.js";
-import Z from "./organisms/LoadingWrapper.vue.js";
-import $ from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
-import ee from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
-import { useStripoApi as oe } from "../services/stripoApi.js";
-import { useConfigStore as te } from "../stores/config.js";
-import { useDynamicContentStore as ne } from "../stores/dynamic-content.js";
-import { useEditorStore as re } from "../stores/editor.js";
-import { usePreviewStore as ae } from "../stores/preview.js";
-import { useUnsubscribeStore as ie } from "../stores/unsubscribe.js";
-import se from "../node_modules/lodash-es/merge.js";
-const Ge = /* @__PURE__ */ R({
+import { DefaultMessageType as J, DefaultUsername as Q, DefaultGuidoConfig as V } from "../enums/defaults.js";
+import X from "./organisms/base/Toaster.vue.js";
+import Y from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
+import Z from "./organisms/header/HeaderWrapper.vue.js";
+import $ from "./organisms/LoadingWrapper.vue.js";
+import ee from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
+import oe from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
+import { useStripoApi as te } from "../services/stripoApi.js";
+import { useConfigStore as ne } from "../stores/config.js";
+import { useDynamicContentStore as re } from "../stores/dynamic-content.js";
+import { useEditorStore as ie } from "../stores/editor.js";
+import { usePreviewStore as se } from "../stores/preview.js";
+import { useUnsubscribeStore as ae } from "../stores/unsubscribe.js";
+import ce from "../node_modules/lodash-es/merge.js";
+const Pe = /* @__PURE__ */ M({
   __name: "Guido",
   props: {
     templateId: null,
@@ -29,49 +29,51 @@ const Ge = /* @__PURE__ */ R({
     html: null,
     css: null,
     guidoConfig: null,
-    templateConfig: null
+    templateConfig: null,
+    traceId: null
   },
-  emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready", "onboarding:finished"],
-  setup(_, { expose: L, emit: t }) {
-    const u = _, k = I(
+  emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready"],
+  setup(F, { expose: L, emit: t }) {
+    const p = F, k = G(
       () => import("./organisms/email-preview/PreviewContainer.vue.js")
-    ), A = I(
+    ), x = G(
       () => import("./organisms/onboarding/OnboardingWrapper.vue.js")
-    ), l = x(), a = ne(), p = ie(), g = te(), i = re(), N = ae(), n = U(() => i.hasChanges), { getPartnerName: f, getProductType: y, isTestPartner: F } = O(), v = () => {
+    ), g = R(), c = re(), f = ae(), y = ne(), d = ie(), A = se(), i = U(() => d.hasChanges), { getPartnerName: w, getProductType: v, isTestPartner: N } = j(), S = () => {
       var e;
-      return (e = l.value) == null ? void 0 : e.handleSave(!0);
+      return (e = g.value) == null ? void 0 : e.handleSave(!0);
     }, {
-      templateId: s,
-      userId: b,
+      templateId: n,
+      userId: s,
       guidoConfig: C,
       templateConfig: o,
-      html: r = "",
-      css: h = "",
-      partnerName: c = f(),
-      productType: d = y(),
-      messageType: S = J,
-      username: w = q
-    } = u, m = (o == null ? void 0 : o.preselectedDynamicContentList) || [];
-    i.templateId = s, window.GuidoConfig = se(Q, C), window.GuidoConfig.partner = {
-      partnerName: c,
-      productType: d,
-      messageType: S
-    }, g.templateConfig = o;
-    const { initPlugin: D } = j({
-      emailId: s,
-      userId: b,
-      username: w,
-      partnerName: c,
-      productType: d,
-      preselectedDynamicContentList: m,
+      html: a = "",
+      css: b = "",
+      partnerName: m = w(),
+      productType: u = v(),
+      messageType: h = J,
+      username: D = Q,
+      traceId: r
+    } = p, l = (o == null ? void 0 : o.preselectedDynamicContentList) || [];
+    d.templateId = n, window.GuidoConfig = ce(V, C), window.GuidoConfig.partner = {
+      partnerName: m,
+      productType: u,
+      messageType: h
+    }, r && (window.GuidoConfig.traceId = r), y.templateConfig = o;
+    const { initPlugin: I } = q({
+      emailId: n,
+      userId: s,
+      username: D,
+      partnerName: m,
+      productType: u,
+      preselectedDynamicContentList: l,
       onReady: () => {
         console.debug("guido:ready"), t("ready");
       }
-    }), { getDefaultTemplate: T } = oe(), H = U(() => {
+    }), { getDefaultTemplate: _ } = te(), H = U(() => {
       var e;
       return !((e = window.GuidoConfig) != null && e.useHeader);
     });
-    K({
+    O({
       onBack: () => {
         console.debug("guido:back"), t("back");
       },
@@ -83,31 +85,52 @@ const Ge = /* @__PURE__ */ R({
       }
     });
     const E = (e) => {
-      console.debug("dynamic-content:close", e), a.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
-    }, P = () => {
+      console.debug("dynamic-content:close", e), c.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
+    }, T = () => {
       console.debug("dynamic-content:close", "Without Data"), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: { text: "", value: "" } }));
     };
-    return M(() => n.value, () => {
-      t("on-change", n.value);
-    }), z(async () => {
+    return z(() => i.value, () => {
+      t("on-change", i.value);
+    }), B(async () => {
       console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow");
       try {
-        p.selectedUnsubscribePages = (o == null ? void 0 : o.selectedUnsubscribePages) || [];
+        f.selectedUnsubscribePages = (o == null ? void 0 : o.selectedUnsubscribePages) || [];
         let e = {
-          html: r && await W(r),
-          css: h,
+          html: a && await W(a),
+          css: b,
           forceRecreate: !0
           // TODO: It should be false for old templates. We will communicate with Stripo
         };
-        e.html || (e = await T(), e.html = await W(e.html)), await D(e), a.selectedDynamicContentList = m;
+        e.html || (e = await _(), e.html = await W(e.html)), await I(e), c.selectedDynamicContentList = l;
       } catch (e) {
-        console.error("Failed to initialize Stripo editor:", e);
+        console.error("Failed to initialize Stripo editor:", e), window.Sentry && window.Sentry.captureException(e, {
+          tags: {
+            component: "guido-component",
+            operation: "mount"
+          },
+          contexts: {
+            guido: {
+              templateId: n,
+              userId: s,
+              traceId: r
+            }
+          }
+        }), window.FS && window.FS("event", "guido_mount_error", {
+          // eslint-disable-next-line camelcase
+          errorMessage_str: e instanceof Error ? e.message : String(e),
+          // eslint-disable-next-line camelcase
+          templateId_str: n,
+          // eslint-disable-next-line camelcase
+          userId_str: s,
+          // eslint-disable-next-line camelcase
+          traceId_str: r || ""
+        });
       }
       document.addEventListener("dynamic-content:open", (e) => {
-        const G = e;
-        console.debug("dynamic-content:open", G.detail), t("dynamic-content:open", G.detail);
+        const P = e;
+        console.debug("dynamic-content:open", P.detail), t("dynamic-content:open", P.detail);
       });
-    }), B(() => {
+    }), K(() => {
       try {
         window.UIEditor.removeEditor();
       } catch {
@@ -116,13 +139,13 @@ const Ge = /* @__PURE__ */ R({
     }), L({
       dynamicContent: {
         insert: E,
-        close: P
+        close: T
       },
-      hasChanges: n,
-      saveSilent: v
-    }), { __sfc: !0, PreviewContainer: k, OnboardingWrapper: A, headerWrapperRef: l, dynamicContentStore: a, unsubscribeStore: p, props: u, configStore: g, editorStore: i, previewStore: N, hasChanges: n, getPartnerName: f, getProductType: y, isTestPartner: F, saveSilent: v, templateId: s, userId: b, guidoConfig: C, templateConfig: o, html: r, css: h, partnerName: c, productType: d, messageType: S, username: w, preselectedDynamicContentList: m, emit: t, initPlugin: D, getDefaultTemplate: T, noHeader: H, insertDynamicContent: E, closeDynamicContent: P, Toaster: V, FilterSelectionDrawer: X, HeaderWrapper: Y, LoadingWrapper: Z, SaveAsTemplateDrawer: $, UnsubscribeWrapper: ee };
+      hasChanges: i,
+      saveSilent: S
+    }), { __sfc: !0, PreviewContainer: k, OnboardingWrapper: x, headerWrapperRef: g, dynamicContentStore: c, unsubscribeStore: f, props: p, configStore: y, editorStore: d, previewStore: A, hasChanges: i, getPartnerName: w, getProductType: v, isTestPartner: N, saveSilent: S, templateId: n, userId: s, guidoConfig: C, templateConfig: o, html: a, css: b, partnerName: m, productType: u, messageType: h, username: D, traceId: r, preselectedDynamicContentList: l, emit: t, initPlugin: I, getDefaultTemplate: _, noHeader: H, insertDynamicContent: E, closeDynamicContent: T, Toaster: X, FilterSelectionDrawer: Y, HeaderWrapper: Z, LoadingWrapper: $, SaveAsTemplateDrawer: ee, UnsubscribeWrapper: oe };
   }
 });
 export {
-  Ge as default
+  Pe as default
 };

package/dist/components/organisms/onboarding/NewVersionPopup.vue.js

@@ -1,17 +1,17 @@
-import t from "./NewVersionPopup.vue2.js";
+import s from "./NewVersionPopup.vue2.js";
 import n from "../../../_virtual/_plugin-vue2_normalizer.js";
-var i = function() {
-  var e = this, s = e._self._c, o = e._self._setupProxy;
-  return o.isVisible ? s(o.WpModal, { attrs: { id: "guido__new-version-popup", size: "medium", "close-on-outside-click": !1, "footer-button-options": o.footerButtonOptions, title: o.popupTitle }, on: { close: o.handleClose, "primary-action": o.handleDiscoverNow, "secondary-action": o.handleRemindLater } }, [s("div", { staticClass: "d-f f-d-c" }, [s("img", { staticClass: "w-1 h-1 d-b p-e-n mb-5", attrs: { src: o.onboardingImageSvg } }), s("p", { staticClass: "f-s-2 f-w-400", domProps: { innerHTML: e._s(o.popupDescription) } })])]) : e._e();
-}, r = [], a = /* @__PURE__ */ n(
-  t,
-  i,
+var r = function() {
+  var e = this, t = e._self._c, o = e._self._setupProxy;
+  return o.isVisible ? t(o.WpModal, { attrs: { id: "guido__new-version-popup", "close-on-outside-click": !1, "footer-button-options": o.footerButtonOptions, title: o.trans("email-editor.onboarding-title") }, on: { close: o.handleClose, "primary-action": o.handleDiscoverNow, "secondary-action": o.handleRemindLater } }, [t("div", { staticClass: "d-f f-d-c" }, [t("img", { staticClass: "w-1 h-1 d-b p-e-n mb-5", attrs: { src: o.onboardingImageSvg } }), t("p", { staticClass: "f-s-2 f-w-400", domProps: { innerHTML: e._s(o.trans("email-editor.onboarding-description")) } })])]) : e._e();
+}, i = [], a = /* @__PURE__ */ n(
+  s,
   r,
+  i,
   !1,
   null,
   null
 );
-const _ = a.exports;
+const p = a.exports;
 export {
-  _ as default
+  p as default
 };

package/dist/components/organisms/onboarding/NewVersionPopup.vue2.js

@@ -1,43 +1,30 @@
-import { defineComponent as g, ref as b, computed as o } from "vue";
-import v from "../../wrappers/WpModal.vue.js";
-import { useConfig as D } from "../../../composables/useConfig.js";
-import { useTranslations as h } from "../../../composables/useTranslations.js";
-import { ACADEMY_LINK as l } from "../../../enums/onboarding.js";
-import y from "../../../static/assets/onboarding-img.svg.js";
-import { useOnboardingStore as _ } from "../../../stores/onboarding.js";
-import { isAfterDate as C, formatShortDate as L } from "../../../utils/dateUtil.js";
-const I = /* @__PURE__ */ g({
+import { defineComponent as s, ref as r } from "vue";
+import a from "../../wrappers/WpModal.vue.js";
+import { useTranslations as i } from "../../../composables/useTranslations.js";
+import l from "../../../static/assets/onboarding-img.svg.js";
+import { useOnboardingStore as m } from "../../../stores/onboarding.js";
+const w = /* @__PURE__ */ s({
   __name: "NewVersionPopup",
-  emits: ["onboarding-finished"],
-  setup(w, { emit: a }) {
-    const e = h(), t = _(), s = b(!0), { config: p } = D(), i = o(() => p.migrationDate), n = o(() => C(i.value || 0)), d = o(() => L(
-      i.value
-    )), m = o(() => n.value ? e("email-editor.onboarding-popup-sunsetted-title") : e("email-editor.onboarding-title")), c = o(() => n.value ? e("email-editor.onboarding-popup-sunsetted-description", {
-      sunsetDate: d.value,
-      academyLink: l
-    }) : e("email-editor.onboarding-description", {
-      academyLink: l
-    })), u = o(() => n.value ? e("products.cancel") : e("products.remind-me-later")), f = o(() => ({
+  setup(p) {
+    const n = i(), e = m(), o = r(!0), t = r({
       primaryButton: {
         type: "primary",
-        labelText: e("left-menu.discover-now")
+        labelText: n("left-menu.discover-now")
       },
       secondaryButton: {
         type: "subtle-primary",
-        labelText: u.value
+        labelText: n("products.remind-me-later")
       }
-    })), r = () => {
-      s.value = !1, a("onboarding-finished");
-    };
-    return { __sfc: !0, emit: a, trans: e, onboardingStore: t, isVisible: s, config: p, migrationDate: i, isAfterMigrationDate: n, formattedSunsetDate: d, popupTitle: m, popupDescription: c, secondaryButtonLabel: u, footerButtonOptions: f, closePopup: r, handleDiscoverNow: () => {
-      t.onDiscoverNowClicked(), r();
+    });
+    return { __sfc: !0, trans: n, onboardingStore: e, isVisible: o, footerButtonOptions: t, handleDiscoverNow: () => {
+      e.onDiscoverNowClicked(), o.value = !1;
     }, handleRemindLater: () => {
-      t.onRemindMeLater(), r();
+      e.onRemindMeLater(), o.value = !1;
     }, handleClose: () => {
-      t.onNewVersionPopupClose(), r();
-    }, WpModal: v, onboardingImageSvg: y };
+      e.onNewVersionPopupClose(), o.value = !1;
+    }, WpModal: a, onboardingImageSvg: l };
   }
 });
 export {
-  I as default
+  w as default
 };

package/dist/components/organisms/onboarding/OnboardingWrapper.vue.js

@@ -1,21 +1,19 @@
-import t from "./OnboardingWrapper.vue2.js";
-import i from "../../../_virtual/_plugin-vue2_normalizer.js";
+import o from "./OnboardingWrapper.vue2.js";
+import _ from "../../../_virtual/_plugin-vue2_normalizer.js";
 var s = function() {
-  var n = this, e = n._self._c, r = n._self._setupProxy;
-  return e("div", n._l(r.visibleOnboardings, function(o) {
-    return e(o.component, { key: o.type, tag: "component", on: { "onboarding-finished": function(p) {
-      return r.emit("onboarding-finished");
-    } } });
+  var n = this, e = n._self._c, t = n._self._setupProxy;
+  return e("div", n._l(t.visibleOnboardings, function(r) {
+    return e(r.component, { key: r.type, tag: "component" });
   }), 1);
-}, _ = [], a = /* @__PURE__ */ i(
-  t,
+}, a = [], p = /* @__PURE__ */ _(
+  o,
   s,
-  _,
+  a,
   !1,
   null,
   null
 );
-const d = a.exports;
+const m = p.exports;
 export {
-  d as default
+  m as default
 };

package/dist/components/organisms/onboarding/OnboardingWrapper.vue2.js

@@ -1,25 +1,24 @@
-import { defineComponent as b, computed as e, onMounted as O, watch as t } from "vue";
-import { usePartner as u } from "../../../composables/usePartner.js";
-import { useEditorStore as v } from "../../../stores/editor.js";
-import { useOnboardingStore as l } from "../../../stores/onboarding.js";
-import { usePreviewStore as y } from "../../../stores/preview.js";
-import S from "./AMPOnboarding.vue.js";
-import h from "./GenericOnboarding.vue.js";
+import { defineComponent as g, computed as e, onMounted as b, watch as t } from "vue";
+import { usePartner as O } from "../../../composables/usePartner.js";
+import { useEditorStore as u } from "../../../stores/editor.js";
+import { useOnboardingStore as v } from "../../../stores/onboarding.js";
+import { usePreviewStore as l } from "../../../stores/preview.js";
+import y from "./AMPOnboarding.vue.js";
+import S from "./GenericOnboarding.vue.js";
 import w from "./NewVersionPopup.vue.js";
 import P from "./TextBlockOnboarding.vue.js";
-import _ from "./VersionHistoryOnboarding.vue.js";
-const F = /* @__PURE__ */ b({
+import h from "./VersionHistoryOnboarding.vue.js";
+const E = /* @__PURE__ */ g({
   __name: "OnboardingWrapper",
-  emits: ["onboarding-finished"],
-  setup(A, { emit: f }) {
-    const o = l(), r = v(), s = y(), { isTestPartner: a } = u(), p = e(() => r.isStripoInitialized), d = e(() => a()), m = [
+  setup(_) {
+    const o = v(), r = u(), s = l(), { isTestPartner: a } = O(), p = e(() => r.isStripoInitialized), d = e(() => a()), m = [
       { type: "newVersionPopup", component: w },
-      { type: "genericOnboarding", component: h },
+      { type: "genericOnboarding", component: S },
       { type: "textBlockOnboarding", component: P },
-      { type: "versionHistoryOnboarding", component: _ },
-      { type: "ampOnboarding", component: S }
-    ], c = (n) => d.value || !p.value ? !1 : n === "newVersionPopup" ? o.shouldShowOnboarding(n) : o.isActive(n), g = e(() => m.filter((n) => c(n.type)));
-    return O(async () => {
+      { type: "versionHistoryOnboarding", component: h },
+      { type: "ampOnboarding", component: y }
+    ], c = (n) => d.value || !p.value ? !1 : n === "newVersionPopup" ? o.shouldShowOnboarding(n) : o.isActive(n), f = e(() => m.filter((n) => c(n.type)));
+    return b(async () => {
       await o.fetchUserModalState();
     }), t(
       () => r.isVersionHistoryOpen,
@@ -36,9 +35,9 @@ const F = /* @__PURE__ */ b({
       (n) => {
         !n && o.isActive("ampOnboarding") && o.close("ampOnboarding");
       }
-    ), { __sfc: !0, emit: f, onboardingStore: o, editorStore: r, previewStore: s, isTestPartner: a, isStripoReady: p, isTestPartnerActive: d, onboardingConfigs: m, shouldShow: c, visibleOnboardings: g };
+    ), { __sfc: !0, onboardingStore: o, editorStore: r, previewStore: s, isTestPartner: a, isStripoReady: p, isTestPartnerActive: d, onboardingConfigs: m, shouldShow: c, visibleOnboardings: f };
   }
 });
 export {
-  F as default
+  E as default
 };

package/dist/composables/useApiErrorTracking.js

@@ -0,0 +1,137 @@
+import { useErrorTracking as y } from "./useErrorTracking.js";
+import { useStripoErrorCategory as b } from "./useStripoErrorCategory.js";
+import { useStripoSlackNotifier as k } from "./useStripoSlackNotifier.js";
+const A = () => {
+  const { captureError: l, captureStripoError: w } = y(), { shouldCaptureSentry: h, shouldBubbleToConsumers: _ } = b(), { notifySlack: d } = k(), p = (s, o, t = {}) => {
+    const r = s.status || 0, e = t.context || `http_error_${r}`, c = t.isRecovered ?? !1;
+    let n = "http_error";
+    r === 401 ? n = "stale_token_refresh" : r === 404 && e === "asset_missing" && (n = "asset_missing");
+    const a = {
+      endpoint: o,
+      method: t.method,
+      statusCode: r,
+      statusText: s.statusText,
+      errorType: "http_error",
+      component: "api-client",
+      operation: `http_error_${r}`,
+      retryable: r >= 500,
+      // 5xx errors are retryable
+      ...t
+    }, u = new Error(
+      `HTTP ${r} ${s.statusText} - ${o}`
+    ), f = h(n), T = _(n, c), m = {
+      ...a,
+      flow: {
+        errorType: n,
+        statusCode: r,
+        isRecovered: c,
+        sentryLogged: f,
+        slackNotified: !0,
+        bubblesToConsumers: T,
+        suppressedReason: T ? null : "handled_internally_or_recovered",
+        timestamp: (/* @__PURE__ */ new Date()).toISOString()
+      }
+    };
+    return w(u, n, m, f), d(u.message, n, m), a.flow = m.flow, a;
+  }, i = (s, o, t = {}) => {
+    const r = s.message, e = r.toLowerCase().includes("timeout"), c = s.name === "AbortError";
+    let n;
+    e ? n = "network_timeout" : c ? n = "request_abort" : n = "network_error";
+    const a = {
+      endpoint: o,
+      errorType: "network_error",
+      component: "api-client",
+      operation: n,
+      retryable: !0,
+      ...t
+    }, u = new Error(
+      `Network Error (${String(a.operation)}) - ${String(o)}: ${r}`
+    );
+    return l(u, a), a;
+  }, g = (s, o, t, r = {}) => {
+    const e = s instanceof Error ? s.message : String(s), c = {
+      endpoint: o,
+      errorType: "parsing_error",
+      component: "api-client",
+      operation: "response_parsing_failed",
+      retryable: !1,
+      responsePreview: t instanceof Object ? JSON.stringify(t).slice(0, 200) : String(t).slice(0, 200),
+      ...r
+    }, n = new Error(
+      `Failed to parse API response from ${o}: ${e}`
+    );
+    return l(n, c), c;
+  }, E = (s, o, t = {}) => {
+    const r = {
+      endpoint: s,
+      errorType: "timeout",
+      component: "api-client",
+      operation: "request_timeout",
+      timeoutMs: o,
+      retryable: !0,
+      ...t
+    }, e = new Error(
+      `Request to ${s} timed out after ${o}ms`
+    );
+    return l(e, r), r;
+  };
+  return {
+    captureHttpError: p,
+    captureNetworkError: i,
+    captureParsingError: g,
+    captureTimeoutError: E,
+    withApiErrorTracking: async (s, o, t = "GET", r = {}) => {
+      try {
+        return await s();
+      } catch (e) {
+        if (e instanceof Error)
+          if (e.message === "Request timeout") {
+            const c = r.timeoutMs || 1e4;
+            E(o, c, {
+              method: t,
+              ...r
+            });
+          } else if (e.name === "AbortError" || e.message.includes("cancelled"))
+            i(e, o, {
+              method: t,
+              ...r
+            });
+          else if (e.message.includes("HTTP Error")) {
+            const c = e.message.match(/HTTP Error: (\d+)/), n = c ? parseInt(c[1]) : void 0, a = {
+              message: e.message,
+              status: n,
+              statusText: e.message
+            };
+            p(a, o, {
+              method: t,
+              ...r
+            });
+          } else
+            i(e, o, {
+              method: t,
+              ...r
+            });
+        else {
+          const c = new Error(String(e));
+          i(c, o, {
+            method: t,
+            ...r
+          });
+        }
+        throw e;
+      }
+    },
+    withParsingErrorTracking: (s, o, t, r = {}) => {
+      try {
+        return s();
+      } catch (e) {
+        throw g(e, o, t, {
+          ...r
+        }), e;
+      }
+    }
+  };
+};
+export {
+  A as useApiErrorTracking
+};