@lilaquadrat/design-core 0.2.1 → 0.3.0

package/src/functions/stripe.provider.ts

@@ -5,177 +5,189 @@ import StudioSDK from '@lilaquadrat/sdk';
 
 export default class StripePaymentProvider implements PaymentProvider {
 
-  async getCart (attributes: Record<string, string>): Promise<{ id: string; attributes: Record<string, string> }> {
+    async getCart(attributes: Record<string, string>): Promise<{ id: string; attributes: Record<string, string> }> {
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
 
-    console.log('StripePaymentProvider.getCart', attributes);
+        console.log('StripePaymentProvider.getCart', attributes);
 
-    const cart = await sdk.public.carts.create({attributes});
+        const cart = await sdk.public.carts.create({attributes});
 
-    return { id: cart.data._id, attributes: attributes || {} };
+        return { id: cart.data._id, attributes: attributes || {} };
 
-  }
+    }
 
-  async updateCartAttributes (cartId: string, attributes?: Record<string, string>): Promise<any> {
+    async updateCartAttributes(cartId: string, attributes?: Record<string, string>, customer?: { prename?: string, name?: string }): Promise<any> {
     
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
-    const { products } = useCartStore();
-    const updateCart: {items?: {_id: string, quantity: number}[], attributes: Record<string, string>} = {
-      items     : [],
-      attributes: {}
-    };
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
+        const { products } = useCartStore();
+        const updateCart: {items?: {_id: string, quantity: number}[], attributes: Record<string, string>, prename?: string, name?: string} = {
+            items: [],
+            attributes: {}
+        };
+
+        products.forEach((item: any) => {
+
+            updateCart.items?.push({_id: item._id, quantity: item.quantity});
+
+        });
+
+        if(attributes) {
 
-    products.forEach((item: any) => {
+            Object.keys(attributes).forEach((attribute) => {
 
-      updateCart.items?.push({_id: item._id, quantity: item.quantity});
+                updateCart.attributes[attribute] = attributes[attribute];
+            
+            })
 
-    });
+        }
 
-    if(attributes) {
+        if(customer?.prename) updateCart.prename = customer.prename;
+        if(customer?.name) updateCart.name = customer.name;
 
-      Object.keys(attributes).forEach((attribute) => {
-        updateCart.attributes[attribute] = attributes[attribute];
-      })
+        const updatedCart = await sdk.public.carts.update(cartId, updateCart);
+
+        console.log('StripePaymentProvider.updateCartAttributes', updateCart);
+        return Promise.resolve(updatedCart);
 
     }
 
-    const updatedCart = await sdk.public.carts.update(cartId, updateCart);
+    async getCartWithProducts(cartId: string) {
 
-    console.log('StripePaymentProvider.updateCartAttributes', updateCart);
-    return Promise.resolve(updatedCart);
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
 
-  }
+        console.log('StripePaymentProvider.getCartWithProducts');
 
-  async getCartWithProducts (cartId: string) {
+        const cart = await sdk.public.carts.getById(cartId);
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
+        if(!cart.data) throw new Error('NO_CART_FOUND');
 
-    console.log('StripePaymentProvider.getCartWithProducts');
+        return cart.data;
+    
+    }
 
-    const cart = await sdk.public.carts.getById(cartId);
+    async getProduct(productId: string): Promise<any> {
 
-    if(!cart.data) throw new Error('NO_CART_FOUND');
+        console.log('StripePaymentProvider.getProduct', productId);
 
-    return cart.data.items || [];
-  }
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
+        const product = await sdk.public.carts.getProduct(productId);
 
-  async getProduct (productId: string): Promise<any> {
+        return product.data;
+    
+    }
 
-    console.log('StripePaymentProvider.getProduct', productId);
+    async addToCart(cartId: string, product: any, amount: number): Promise<any> {
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
-    const product = await sdk.public.carts.getProduct(productId);
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
+        const { products } = useCartStore();
+        const updateCart: {items?: {_id: string, quantity: number}[]} = {
+            items: [],
+        };
 
-    return product.data;
-  }
+        console.log('StripePaymentProvider.addToCart', cartId, product, amount);
 
-  async addToCart (cartId: string, product: any, amount: number): Promise<any> {
+        const itemInCart = products.find((item: any) => item._id === product._id);
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
-    const { products } = useCartStore();
-    const updateCart: {items?: {_id: string, quantity: number}[]} = {
-      items: [],
-    };
+        if(itemInCart) {
 
-    console.log('StripePaymentProvider.addToCart', cartId, product, amount);
+            itemInCart.quantity = itemInCart.quantity + amount;
 
-    const itemInCart = products.find((item: any) => item._id === product._id);
+        } else {
 
-    if(itemInCart) {
+            updateCart.items?.push({
+                _id: product._id,
+                quantity: amount
+            });
 
-      itemInCart.quantity = itemInCart.quantity + amount;
+        }
 
-    } else {
+        products.forEach((item: any) => {
 
-      updateCart.items?.push({
-        _id     : product._id,
-        quantity: amount
-      });
+            updateCart.items?.push({_id: item._id, quantity: item.quantity});
 
-    }
+        });
 
-    products.forEach((item: any) => {
+        const updatedCart = await sdk.public.carts.update(cartId, updateCart);
+        const addedItem = updatedCart.data.items.find((item: any) => item.id === product.id);
 
-      updateCart.items?.push({_id: item._id, quantity: item.quantity});
+        return addedItem
 
-    });
+    }
 
-    const updatedCart = await sdk.public.carts.update(cartId, updateCart);
-    const addedItem = updatedCart.data.items.find((item: any) => item.id === product.id);
+    async removeFromCart(cartId: string, product: any): Promise<any> {
 
-    return addedItem
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
+        const { products } = useCartStore();
+        const updateCart: {items?: {_id: string, quantity: number}[]} = {
+            items: []
+        };
 
-  }
+        products.forEach((item) => {
 
-  async removeFromCart (cartId: string, product: any): Promise<any> {
+            if(item._id === product._id) return;
+            updateCart.items?.push({_id: item._id, quantity: item.quantity});
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
-    const { products } = useCartStore();
-    const updateCart: {items?: {_id: string, quantity: number}[]} = {
-      items: []
-    };
+        });
 
-    products.forEach((item) => {
+        if(updateCart.items?.length === 0) {
 
-      if(item._id === product._id) return;
-      updateCart.items?.push({_id: item._id, quantity: item.quantity});
+            delete updateCart.items;
+        
+        }
 
-    });
+        await sdk.public.carts.update(cartId, updateCart);
 
-    if(updateCart.items?.length === 0) {
-      delete updateCart.items;
     }
 
-    await sdk.public.carts.update(cartId, updateCart);
-
-  }
+    async updateQuantity(cartId: string, cartProduct: any, amount: number): Promise<any> {
 
-  async updateQuantity (cartId: string, cartProduct: any, amount: number): Promise<any> {
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
+        const { products } = useCartStore();
+        const updateCart: {items?: {_id: string, quantity: number}[]} = {
+            items: []
+        };
+        const itemInCart = products.find((item) => item._id === cartProduct._id);
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
-    const { products } = useCartStore();
-    const updateCart: {items?: {_id: string, quantity: number}[]} = {
-      items: []
-    };
-    const itemInCart = products.find((item) => item._id === cartProduct._id);
+        itemInCart.quantity = amount;
 
-    itemInCart.quantity = amount;
+        products.forEach((item) => {
 
-    products.forEach((item) => {
-      updateCart.items?.push({_id: item._id, quantity: item.quantity});
-    });
+            updateCart.items?.push({_id: item._id, quantity: item.quantity});
+        
+        });
 
-    await sdk.public.carts.update(cartId, updateCart);
+        await sdk.public.carts.update(cartId, updateCart);
 
-  }
+    }
 
-  async finalize (cartId: string): Promise<{checkoutUrl: string}> {
+    async finalize(cartId: string): Promise<{checkoutUrl: string}> {
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
-    const repsonse = await sdk.public.carts.finalize(cartId);
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
+        const repsonse = await sdk.public.carts.finalize(cartId);
 
-    return repsonse.data;
-  }
+        return repsonse.data;
+    
+    }
 
-  async getFinishedCart (cartId: string): Promise<any> {
+    async getFinishedCart(cartId: string): Promise<any> {
 
-    const { apiConfig } = useMainStore();
-    const sdk = new StudioSDK(apiConfig)
-    const cart = await sdk.public.carts.getFinishedById(cartId);
+        const { apiConfig } = useMainStore();
+        const sdk = new StudioSDK(apiConfig)
+        const cart = await sdk.public.carts.getFinishedById(cartId);
 
-    if(!cart.data) throw new Error('NO_CART_FOUND');
+        if(!cart.data) throw new Error('NO_CART_FOUND');
 
-    return cart.data;
+        return cart.data;
 
-  }
+    }
 
 }

package/src/globals.d.ts

@@ -1,5 +1,5 @@
 import type { StateTree } from 'pinia';
-import type FrontendConfigInterface from './interfaces/FrontendConfig.interface';
+import type CoreFrontendConfig from './interfaces/FrontendConfig.interface';
 
 declare global {
 
@@ -8,7 +8,6 @@ declare global {
     __INITIAL_STATE__?: Record<string, StateTree>
   }
 
-  const __FRONTEND_CONFIG__: FrontendConfigInterface;
   const __TARGET__: string;
   /**
    * true only in the shareable static gallery build (yarn build:preview)

package/src/index.ts

@@ -27,21 +27,23 @@ export { smartScrollBehavior } from './mixins/scroll';
 
 // component registries
 export {
-  loadViaGlob,
-  loadViaDeclaration,
-  loadViaDeclarationSync,
-  getAvailableModules,
-  createModulesArray,
+    loadViaGlob,
+    loadViaDeclaration,
+    loadViaDeclarationSync,
+    getAvailableModules,
+    createModulesArray,
 } from './mixins/loadComponents';
 
 // i18n
 export { default as i18n, t, addMessages } from './plugins/translations';
 
 // framework contracts
-export type { default as FrontendConfig } from './interfaces/FrontendConfig.interface';
+export type { default as CoreFrontendConfig, default as FrontendConfig } from './interfaces/FrontendConfig.interface';
 export type { default as ModuleBaseProps } from './interfaces/ModuleBaseProps.interface';
 export type { default as IconsPartial } from './interfaces/IconsPartial';
-export type { default as EditorConfiguration } from './interfaces/EditorConfiguration.interface';
 export type { default as PaymentProvider } from './interfaces/PaymentProvider.interface';
+export type { default as AuthConfig } from './interfaces/AuthConfig.interface';
+export type { default as AuthProvider } from './interfaces/AuthProvider.interface';
+export type { default as AuthCallbackResult } from './interfaces/AuthCallbackResult.interface';
 
 export { default as logger } from './mixins/logger';

package/src/interfaces/AuthCallbackResult.interface.ts

@@ -0,0 +1,5 @@
+import type AppState from './AppState.interface';
+
+export default interface AuthCallbackResult {
+    appState?: AppState
+}

package/src/interfaces/AuthConfig.interface.ts

@@ -0,0 +1,13 @@
+import type { Auth0ClientOptions } from '@auth0/auth0-spa-js';
+import type { EnvironmentAuthKeycloak } from '@lilaquadrat/interfaces';
+
+export type AuthConfig = {
+    type: 'auth0'
+    options: Auth0ClientOptions
+} | (EnvironmentAuthKeycloak & {
+    redirectUri?: string
+    silentCheckSsoRedirectUri?: string
+    scope?: string
+});
+
+export type { AuthConfig as default };

package/src/interfaces/AuthProvider.interface.ts

@@ -0,0 +1,15 @@
+import type AppState from './AppState.interface';
+import type AuthCallbackResult from './AuthCallbackResult.interface';
+import type IdTokenExtended from './IdTokenExtended.interface';
+
+export default interface AuthProvider {
+    init(): Promise<void>
+    isAuthenticated(): Promise<boolean>
+    getToken(): Promise<string | undefined>
+    refreshToken(): Promise<string | undefined>
+    getTokenContent(): Promise<IdTokenExtended | undefined>
+    triggerLogin(appState: AppState): Promise<void>
+    triggerSignup(appState: AppState): Promise<void>
+    triggerLogout(): Promise<void>
+    handleCallback(): Promise<AuthCallbackResult>
+}

package/src/interfaces/FrontendConfig.interface.ts

@@ -1,42 +1,13 @@
+import type { Environment, Project } from '@lilaquadrat/interfaces';
 import type { Auth0ClientOptions } from '@auth0/auth0-spa-js';
-import type StudioSDK from '@lilaquadrat/sdk';
-
-export default interface FrontendConfig {
-
+import type AuthConfig from './AuthConfig.interface';
+
+/**
+ * the frontend runtime configuration: the project record merged with the
+ * environment it is rendered in.
+ */
+export default interface CoreFrontendConfig extends Project, Omit<Environment, 'id' | 'auth'> {
+    auth?: AuthConfig
+    /** Existing rendered applications may still supply Auth0 client options. */
     auth0Options?: Auth0ClientOptions
-
-    /**
-     * for identification at the backend
-     */
-    name: string
-
-    company: string
-    project: string
-
-    api: {
-        mode: StudioSDK['mode']
-        customEndpoints?: StudioSDK['customEndpoints']
-    }
-
-    cdn: {
-        public: string
-        secure: string
-    }
-
-    payment?: {
-        type?: 'internal' | 'shopify' | 'stripe',
-        options?: Record<string, string>
-    }
-
-    /**
-     * base path for loading files
-     */
-    base?: string
-
-    /**
-     * indicates that this project is dynamic. e.g. an app or an website with at least one dynamic part.
-     * only an explicit `true` enables dynamic mode - `false` and `undefined` fall back to static
-     */
-    dynamic?: boolean
-
-}
+}

package/src/interfaces/GenericEvents.interface.ts

@@ -1,6 +1,6 @@
 import type { Ref } from 'vue';
 
 export default interface GenericEvents {
-    // eslint-disable-next-line no-unused-vars
+     
     [key: string]: (additionalData: string | undefined, mouseEvent: MouseEvent, traceId: Ref) => void;
 }

package/src/interfaces/IdTokenExtended.interface.ts

@@ -1,7 +1,16 @@
-import type { IdToken } from '@auth0/auth0-spa-js';
-
-export default interface IdTokenExtended extends IdToken {
+export default interface IdTokenExtended {
+    [claim: string]: unknown
+    sub?: string
+    email?: string
+    email_verified?: boolean
+    name?: string
+    given_name?: string
+    family_name?: string
+    picture?: string
+    iss?: string
+    aud?: string | string[]
+    exp?: number
+    iat?: number
     lilaquadrat_configuration?: boolean
     lilaquadrat_firstLogin?: boolean
 }
-

package/src/interfaces/PaymentProvider.interface.ts

@@ -1,8 +1,8 @@
 export default interface PaymentProvider {
 
     getCart(attributes?: Record<string, string>): Promise<{id: string, checkourUrl?: string}>;
-    updateCartAttributes(cartId: string, attributes?: Record<string, string>): Promise<{id: string, checkourUrl?: string}>;
-    getCartWithProducts(cartId: string): Promise<any[]>;
+    updateCartAttributes(cartId: string, attributes?: Record<string, string>, customer?: { prename?: string, name?: string }): Promise<{id: string, checkourUrl?: string}>;
+    getCartWithProducts(cartId: string): Promise<any>;
     getProduct(productId: string): Promise<any>;
     addToCart(cartId: string, product: any, amount: number): Promise<any>;
     removeFromCart(cartId: string, product: any): Promise<any>;

package/src/interfaces/RenderOptions.interface.ts

@@ -0,0 +1,12 @@
+import type { RenderContext } from '@lilaquadrat/interfaces';
+import type { RouteRecordRaw } from 'vue-router';
+import type { AppComponents } from '../main';
+
+export default interface RenderOptions {
+    url: string
+    context: RenderContext
+    manifest: Record<string, string[]>
+    cdnUrl: string
+    components: AppComponents
+    routes?: readonly RouteRecordRaw[]
+}