merged with main

.github/workflows/release-next-react-sdk.yml

@@ -4,7 +4,6 @@ on:
   push:
     branches:
       - main
-      - fix/react-sdk-next
 
 env:
   NODE_VERSION: 18.10.0
@@ -49,7 +48,8 @@ jobs:
       - name: Check if should run
         id: 'check'
         run: |
-          if $(npx nx show projects --affected --plain | grep -q "react-sdk"); then
+          # Check if the affected projects include "react-sdk" or "web-component" since the last commit
+          if $(npx nx show projects --affected --base HEAD~1 --head HEAD | grep -q "react-sdk\|web-component"); then
             echo "run=true" >> $GITHUB_OUTPUT
           else
             echo "run=false" >> $GITHUB_OUTPUT

packages/libs/sdk-mixins/CHANGELOG.md

@@ -2,6 +2,20 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.6.0](https://github.com/descope/descope-js/compare/sdk-mixins-0.5.2...sdk-mixins-0.6.0) (2024-12-24)
+
+
+### Features
+
+* Content from base url ([#871](https://github.com/descope/descope-js/issues/871)) RELEASE ([f3e437e](https://github.com/descope/descope-js/commit/f3e437e0793507627b157317063fe39174600c80))
+
+## [0.5.2](https://github.com/descope/descope-js/compare/sdk-mixins-0.5.1...sdk-mixins-0.5.2) (2024-12-22)
+
+
+### Bug Fixes
+
+* support react-19 ([#860](https://github.com/descope/descope-js/issues/860)) RELEASE ([efd6833](https://github.com/descope/descope-js/commit/efd6833dfefc854b7f461606084234603f2444e0))
+
 ## [0.5.1](https://github.com/descope/descope-js/compare/sdk-mixins-0.5.0...sdk-mixins-0.5.1) (2024-12-18)
 
 ## [0.5.0](https://github.com/descope/descope-js/compare/sdk-mixins-0.4.0...sdk-mixins-0.5.0) (2024-12-04)

packages/libs/sdk-mixins/jest.config.cjs

@@ -9,10 +9,10 @@ module.exports = {
   collectCoverageFrom: ['src/**/*.{js,jsx,ts,tsx}'],
   coverageThreshold: {
     global: {
-      branches: 80,
-      functions: 93.5,
-      lines: 93.5,
-      statements: 93.5,
+      branches: 12,
+      functions: 17,
+      lines: 36,
+      statements: 36,
     },
   },
   // A set of global variables that need to be available in all test environments

packages/libs/sdk-mixins/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/sdk-mixins",
-  "version": "0.5.1",
+  "version": "0.6.0",
   "author": "Descope Team <[email protected]>",
   "homepage": "https://github.com/descope/sdk-mixins",
   "bugs": {
@@ -21,7 +21,7 @@
         "default": "./dist/cjs/index.js"
       }
     },
-    "./themeMixin": {
+    "./theme-mixin": {
       "import": {
         "types": "./dist/index.d.ts",
         "default": "./dist/esm/mixins/themeMixin/index.js"
@@ -30,13 +30,23 @@
         "types": "./dist/index.d.ts",
         "default": "./dist/cjs/mixins/themeMixin/index.js"
       }
+    },
+    "./static-resources-mixin": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/esm/mixins/staticResourcesMixin/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/cjs/mixins/staticResourcesMixin/index.js"
+      }
     }
   },
   "type": "module",
   "description": "Descope JavaScript SDK mixins",
   "scripts": {
     "build": "rimraf dist && rollup -c",
-    "test": "echo no tests yet",
+    "test": "jest",
     "lint": "eslint '+(src|test|examples)/**/*.ts'"
   },
   "license": "MIT",

packages/libs/sdk-mixins/rollup.config.mjs

@@ -10,7 +10,11 @@ import noEmit from 'rollup-plugin-no-emit';
 
 import packageJson from './package.json' assert { type: 'json' };
 
-const input = ['./src/index.ts', './src/mixins/themeMixin/index.ts'];
+const input = [
+  './src/index.ts',
+  './src/mixins/themeMixin/index.ts',
+  './src/mixins/staticResourcesMixin/index.ts',
+];
 const external = (id) =>
   !id.startsWith('\0') && !id.startsWith('.') && !id.startsWith('/');
 

packages/libs/sdk-mixins/src/mixins/createValidateAttributesMixin/createValidateAttributesMixin.ts

@@ -33,12 +33,11 @@ const createValidateAttributesMixin =
       }
 
       async init() {
-        await super.init?.();
-
         // check attributes initial values
         mappingsNames.forEach((attr) =>
           this.#handleError(attr, this.getAttribute(attr)),
         );
+        await super.init?.();
       }
     };
   };

packages/libs/sdk-mixins/src/mixins/loggerMixin/loggerMixin.ts

@@ -21,8 +21,8 @@ export const loggerMixin = createSingletonMixin(
         }, {}) as Logger;
       }
 
-      set logger(logger: Partial<Logger>) {
-        this.#logger = this.#wrapLogger(logger);
+      set logger(logger: Partial<Logger> | undefined) {
+        this.#logger = this.#wrapLogger(logger || console);
       }
 
       get logger(): Logger {

packages/libs/sdk-mixins/src/mixins/staticResourcesMixin/fetchWithFallbacks.ts

@@ -0,0 +1,40 @@
+import { Logger } from '../loggerMixin';
+
+type FetchParams = Parameters<typeof fetch>;
+const notLastMsgSuffix = 'Trying the next fallback URL...';
+
+export const fetchWithFallbacks = async (
+  fallbacks: FetchParams['0'] | FetchParams['0'][],
+  init: FetchParams['1'],
+  {
+    logger,
+    onSuccess,
+  }: { logger?: Logger; onSuccess?: (urlIndex: number) => void },
+): ReturnType<typeof fetch> => {
+  const fallbacksArr = Array.isArray(fallbacks) ? fallbacks : [fallbacks];
+
+  for (let index = 0; index < fallbacksArr.length; index++) {
+    const url = fallbacksArr[index];
+    const isLast = index === fallbacksArr.length - 1;
+
+    try {
+      const res = await fetch(url.toString(), init);
+      if (res.ok) {
+        onSuccess?.(index);
+        return res;
+      }
+
+      const errMsg = `Error fetching URL ${url} [${res.status}]`;
+
+      if (isLast) throw new Error(errMsg);
+
+      logger?.debug(`${errMsg}. ${notLastMsgSuffix}`);
+    } catch (e) {
+      const errMsg = `Error fetching URL ${url} [${e.message}]`;
+
+      if (isLast) throw new Error(errMsg);
+
+      logger?.debug(`${errMsg}. ${notLastMsgSuffix}`);
+    }
+  }
+};

packages/libs/sdk-mixins/src/mixins/staticResourcesMixin/staticResourcesMixin.ts

@@ -7,24 +7,29 @@ import {
 } from './constants';
 import { projectIdMixin } from '../projectIdMixin';
 import { baseUrlMixin } from '../baseUrlMixin';
+import { fetchWithFallbacks } from './fetchWithFallbacks';
 
 type Format = 'text' | 'json';
 
+type CustomUrl = URL & { baseUrl: string };
+
 export function getResourceUrl({
   projectId,
   filename,
   assetsFolder = ASSETS_FOLDER,
-  baseUrl,
+  baseUrl = BASE_CONTENT_URL,
 }: {
   projectId: string;
   filename: string;
   assetsFolder?: string;
   baseUrl?: string;
 }) {
-  const url = new URL(OVERRIDE_CONTENT_URL || baseUrl || BASE_CONTENT_URL);
+  const url: CustomUrl = new URL(baseUrl) as any;
   url.pathname = pathJoin(url.pathname, projectId, assetsFolder, filename);
+  // we want to keep the baseUrl so we can use it later
+  url.baseUrl = baseUrl;
 
-  return url.toString();
+  return url;
 }
 
 export const staticResourcesMixin = createSingletonMixin(
@@ -35,30 +40,90 @@ export const staticResourcesMixin = createSingletonMixin(
       baseUrlMixin,
     )(superclass);
 
+    // the logic should be as following:
+    // if there is a local storage override, use it
+    // otherwise, if there is a base-static-url attribute, use it
+    // otherwise, try to use base-url, and check if it's working
+    // if it's working, use it
+    // if not, use the default content url
     return class StaticResourcesMixinClass extends BaseClass {
+      #lastBaseUrl?: string;
+      #workingBaseUrl?: string;
+
+      #getResourceUrls(filename: string): CustomUrl[] | CustomUrl {
+        const overrideUrl = OVERRIDE_CONTENT_URL || this.baseStaticUrl;
+
+        if (overrideUrl) {
+          return getResourceUrl({
+            projectId: this.projectId,
+            filename,
+            baseUrl: overrideUrl,
+          });
+        }
+
+        const isBaseUrlUpdated = this.#lastBaseUrl !== this.baseUrl;
+        const shouldFallbackFetch = isBaseUrlUpdated && !!this.baseUrl;
+
+        // if the base url has changed, reset the working base url
+        if (isBaseUrlUpdated) {
+          this.#lastBaseUrl = this.baseUrl;
+          this.#workingBaseUrl = undefined;
+        }
+
+        const resourceUrl = getResourceUrl({
+          projectId: this.projectId,
+          filename,
+          baseUrl: this.#workingBaseUrl,
+        });
+
+        // if there is no reason to check the baseUrl, generate the resource url according to the priority
+        if (!shouldFallbackFetch) {
+          return resourceUrl;
+        }
+
+        const resourceUrlFromBaseUrl = getResourceUrl({
+          projectId: this.projectId,
+          filename,
+          baseUrl: this.baseUrl + '/pages',
+        });
+
+        return [resourceUrlFromBaseUrl, resourceUrl];
+      }
+
       async fetchStaticResource<F extends Format>(
         filename: string,
         format: F,
       ): Promise<{
         body: F extends 'json' ? Record<string, any> : string;
         headers: Record<string, string>;
       }> {
-        const resourceUrl = getResourceUrl({
-          projectId: this.projectId,
-          filename,
-          baseUrl: this.baseStaticUrl,
-        });
-        const res = await fetch(resourceUrl, { cache: 'default' });
-        if (!res.ok) {
-          this.logger.error(
-            `Error fetching URL ${resourceUrl} [${res.status}]`,
+        const resourceUrls = this.#getResourceUrls(filename);
+
+        // if there are multiple resource urls, it means that there are fallbacks,
+        // if one of the options (which is not the last) is working, we want to keep using it by updating the workingBaseUrl
+        const onSuccess = !Array.isArray(resourceUrls)
+          ? null
+          : (index: number) => {
+              if (index !== resourceUrls.length - 1) {
+                const { baseUrl } = resourceUrls[index];
+                this.#workingBaseUrl = baseUrl;
+              }
+            };
+
+        try {
+          const res = await fetchWithFallbacks(
+            resourceUrls,
+            { cache: 'default' },
+            { logger: this.logger, onSuccess },
           );
-        }
 
-        return {
-          body: await res[format](),
-          headers: Object.fromEntries(res.headers.entries()),
-        };
+          return {
+            body: await res[format](),
+            headers: Object.fromEntries(res.headers.entries()),
+          };
+        } catch (e) {
+          this.logger.error(e.message);
+        }
       }
 
       get baseStaticUrl() {