@thefittingroom/shop-ui 0.0.14 → 0.0.16

package/README.md

@@ -27,7 +27,7 @@ const hooks: TfrHooks = {
   onLoading: () => {},
   onLoadingComplete: () => {},
   onVtoReady: (frames: string[]) => {},
-  onError: () => {},
+  onError: (error: string) => {},
   onLogin: () => {},
   onLogout: () => {},
 }
@@ -39,8 +39,14 @@ const modalDivId: string = 'tfr-modal'
 const tfr = await initFittingRoom(shopId, modalDivId, hooks)
 
 // on page nav to new product
+// * Required for VTO
 tfr.setSku(sku)
 
+// on user login to brand site
+// * Required for VTO
+// e.g. uuid, email address, username, internal database Id
+tft.setBrandUserId(brandUserId)
+
 // close the modal
 tfr.close()
 ```

package/dist/esm/components/locale.d.ts

@@ -1,6 +1,7 @@
 declare var L: {
     AssociatedEmail: string;
     BackToSignIn: string;
+    BrandUserIdNotSet: string;
     CreateAvatarSc: string;
     DontHaveAcc: string;
     DontHaveAvatar: string;

package/dist/esm/index.js

@@ -1,9 +1,9 @@
 /*!
-* thefittingroom v0.0.14 (2023-07-31T17:58:33.095Z)
+* thefittingroom v0.0.16 (2023-09-05T16:47:56.281Z)
 * Copyright 2022-present, TheFittingRoom, Inc. All rights reserved.
 */
 /*!
-* thefittingroom v0.0.9 (2023-07-26T23:07:17.052Z)
+* thefittingroom v0.0.11 (2023-09-04T22:52:56.755Z)
 * Copyright 2022-present, TheFittingRoom, Inc. All rights reserved.
 */
 /**
@@ -22772,6 +22772,12 @@ class RecommendedAvailableSizesError extends Error {
         this.available_sizes = available_sizes;
     }
 }
+class BrandUserIdNotSetError extends Error {
+    constructor() {
+        super('brand user id not set');
+        this.name = 'BrandUserIdNotSetError';
+    }
+}
 // Backend responses
 const AvatarNotCreated = 'avatar not created';
 
@@ -22784,12 +22790,14 @@ var errors = /*#__PURE__*/Object.freeze({
     NoColorwaySizeAssetsFoundError: NoColorwaySizeAssetsFoundError,
     NoStylesFoundError: NoStylesFoundError,
     RecommendedAvailableSizesError: RecommendedAvailableSizesError,
+    BrandUserIdNotSetError: BrandUserIdNotSetError,
     AvatarNotCreated: AvatarNotCreated
 });
 
 class FirebaseUser {
     constructor(firestore, app) {
         this.firestore = firestore;
+        this.brandUserId = null;
         this.auth = getAuth(app);
         this.auth.setPersistence(browserLocalPersistence);
     }
@@ -22809,6 +22817,9 @@ class FirebaseUser {
     setUser(user) {
         this.user = user;
     }
+    setBrandUserId(brandUserId) {
+        this.brandUserId = brandUserId;
+    }
     async getToken() {
         var _a;
         if (!((_a = this.user) === null || _a === void 0 ? void 0 : _a.uid))
@@ -22828,8 +22839,8 @@ class FirebaseUser {
         const q = sl(Ta(this.firestore, 'users'), rl(Eh(), '==', this.id));
         const cancel = setTimeout(() => unsub(), timeout);
         return new Promise((resolve) => {
-            unsub = jl(q, (snapshot) => {
-                if (!predicate(snapshot))
+            unsub = jl(q, async (snapshot) => {
+                if (!(await predicate(snapshot)))
                     return;
                 clearTimeout(cancel);
                 unsub();
@@ -22945,7 +22956,7 @@ class Fetcher {
     }
 }
 
-const TestImage = (url) => {
+const testImage = (url) => {
     const img = new Image();
     img.src = url;
     return new Promise((resolve) => {
@@ -23045,7 +23056,13 @@ class TfrShop {
         var _a, _b, _c, _d;
         if (!this.isLoggedIn)
             throw new UserNotLoggedInError();
-        const predicate = (data) => { var _a, _b, _c; return Boolean((_c = (_b = (_a = data.docs[0].data()) === null || _a === void 0 ? void 0 : _a.vto) === null || _b === void 0 ? void 0 : _b[this.brandId]) === null || _c === void 0 ? void 0 : _c[colorwaySizeAssetSKU]); };
+        const predicate = async (data) => {
+            var _a, _b, _c, _d;
+            const frames = (_d = (_c = (_b = (_a = data.docs[0].data()) === null || _a === void 0 ? void 0 : _a.vto) === null || _b === void 0 ? void 0 : _b[this.brandId]) === null || _c === void 0 ? void 0 : _c[colorwaySizeAssetSKU]) === null || _d === void 0 ? void 0 : _d.frames;
+            if (!(frames === null || frames === void 0 ? void 0 : frames.length))
+                return false;
+            return testImage(frames[0]);
+        };
         const userProfile = (await this.user.watchUserProfileForChanges(predicate, TfrShop.vtoTimeout));
         if (!((_d = (_c = (_b = (_a = userProfile === null || userProfile === void 0 ? void 0 : userProfile.vto) === null || _a === void 0 ? void 0 : _a[this.brandId]) === null || _b === void 0 ? void 0 : _b[colorwaySizeAssetSKU]) === null || _c === void 0 ? void 0 : _c.frames) === null || _d === void 0 ? void 0 : _d.length))
             throw new NoFramesFoundError();
@@ -23106,7 +23123,11 @@ class TfrShop {
     async requestColorwaySizeAssetFrames(colorwaySizeAssetId) {
         if (!this.isLoggedIn)
             throw new UserNotLoggedInError();
-        await Fetcher.Post(this.user, `/colorway-size-assets/${colorwaySizeAssetId}/frames`);
+        if (!this.user.brandUserId)
+            throw new BrandUserIdNotSetError();
+        await Fetcher.Post(this.user, `/colorway-size-assets/${colorwaySizeAssetId}/frames`, {
+            brand_user_id: String(this.user.brandUserId),
+        });
     }
     async getColorwaySizeAssetFrames(colorwaySizeAssetSKU) {
         var _a, _b, _c;
@@ -23114,7 +23135,7 @@ class TfrShop {
         const frames = ((_c = (_b = (_a = userProfile === null || userProfile === void 0 ? void 0 : userProfile.vto) === null || _a === void 0 ? void 0 : _a[this.brandId]) === null || _b === void 0 ? void 0 : _b[colorwaySizeAssetSKU]) === null || _c === void 0 ? void 0 : _c.frames) || [];
         if (!frames.length)
             throw new NoFramesFoundError();
-        const testedImage = await TestImage(frames[0]);
+        const testedImage = await testImage(frames[0]);
         if (!testedImage)
             throw new NoFramesFoundError();
         return frames;
@@ -23185,6 +23206,7 @@ const InitImageSlider = (sliderID, onChange) => {
 var L = {
     AssociatedEmail: 'If there is an account associated with that email, We have sent a link to reset your password.',
     BackToSignIn: 'Back to sign in',
+    BrandUserIdNotSet: 'User not logged in to brand site.',
     CreateAvatarSc: 'Scan the QR code/click link to download our app and create an avatar:',
     DontHaveAcc: "Don't have an account?",
     DontHaveAvatar: "Whoops! Looks like you don't have an avatar yet.",
@@ -36275,6 +36297,9 @@ class FittingRoom {
             this.nav.onError(L.SomethingWentWrong);
         }
     }
+    setBrandUserId(brandUserId) {
+        this.tfrShop.user.setBrandUserId(brandUserId);
+    }
     async submitTel(tel) {
         try {
             await this.tfrShop.submitTelephoneNumber(tel);
@@ -36302,6 +36327,8 @@ class FittingRoom {
         return `${trySizes}. ${L.WeRecommendSize} ${recommendedSizeLabel}.`;
     }
     async tryOn() {
+        if (!this.shop.isLoggedIn)
+            return this.nav.toScan();
         try {
             if (this.hooks.onLoading)
                 this.hooks.onLoading();
@@ -36311,12 +36338,17 @@ class FittingRoom {
                 this.hooks.onVtoReady(frames);
         }
         catch (error) {
+            if (error instanceof errors.BrandUserIdNotSetError)
+                return this.nav.onError(L.BrandUserIdNotSet);
             if (error instanceof errors.AvatarNotCreatedError)
                 return this.nav.onError(L.DontHaveAvatar);
             if (error instanceof errors.RecommendedAvailableSizesError)
                 return this.nav.onSizeError(error.recommended_size, error.available_sizes);
-            if (error instanceof errors.UserNotLoggedInError)
+            if (error instanceof errors.UserNotLoggedInError) {
+                if (this.hooks.onLoadingComplete)
+                    this.hooks.onLoadingComplete();
                 return this.nav.toScan();
+            }
             console.error(error.message);
             this.nav.onError(L.SomethingWentWrong);
         }