@everymatrix/casino-wagering-bonuses-controller 1.30.0 → 1.31.0

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@everymatrix/casino-wagering-bonuses-controller",
-  "version": "1.30.0",
+  "version": "1.31.0",
   "main": "dist/casino-wagering-bonuses-controller.js",
   "svelte": "src/index.ts",
   "scripts": {
     "start": "sirv public",
     "build": "cross-env NODE_ENV=production rollup -c",
+    "build:watch": "cross-env NODE_ENV=production rollup -c -w",
     "dev": "cross-env NODE_ENV=\"development\" rollup -c -w",
     "validate": "svelte-check",
     "test": "echo"
@@ -35,5 +36,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b9795b320e7d96e10963f25cdea2d9300029d8d7"
+  "gitHead": "2cd63cac8a1345eb832337233e848d196c3d9a7b"
 }

package/src/CasinoWageringBonusesController.svelte

@@ -13,13 +13,15 @@
   } from '@everymatrix/casino-wagering-bonus/src/message'
   import type { TEventSource } from '@everymatrix/casino-wagering-bonus/src/message'
   import { Bonus, BonusStatus, BonusStatusFilterType, Lang } from '@everymatrix/casino-wagering-bonus/src/types'
-  import { setTranslations } from '@everymatrix/casino-wagering-bonus/src/svelte.i18n';
+  import { addNewMessages, setTranslations } from '@everymatrix/casino-wagering-bonus/src/svelte.i18n';
   import { TRANSLATIONS } from '@everymatrix/casino-wagering-bonus/src/translations';
   import { onMount } from 'svelte';
   import { classWithPart } from '@everymatrix/casino-wagering-bonus/src/util';
   import { infoParts } from '@everymatrix/casino-wagering-bonus/src/private.exportparts';
 
   import { _, setLocale } from '@everymatrix/casino-wagering-bonus/src/svelte.i18n';
+  import { findMaxIdSubset } from '@everymatrix/casino-wagering-bonus/src/api.apdater.util';
+  import { setClientStyling, setClientStylingURL, setTranslationUrl } from '@everymatrix/casino-wagering-bonus/src/util.custom';
 
   export let endpoint = ''
   export let lang = Lang.en
@@ -27,7 +29,18 @@
   export let currency: string = 'EUR';
   export let filter: BonusStatusFilterType = BonusStatusFilterType.claimable
   export let limit: string = ''
+  export let sortorder: string = 'desc'
 
+  export let clientstyling: string = ''
+  export let clientstylingurl: string = ''
+  export let translationurl: string = ''
+
+  let customStylingContainer: HTMLElement;
+
+  $: customStylingContainer && clientstyling && setClientStyling(customStylingContainer, clientstyling);
+  $: customStylingContainer && clientstylingurl && setClientStylingURL(customStylingContainer, clientstylingurl);
+  $: translationurl && setTranslationUrl(translationurl, addNewMessages);
+  
   let isMounted = false
   $: isMounted && init()
   onMount(() => {
@@ -39,6 +52,7 @@
 
   let bonuses: any[] = []
   let eventSource: TEventSource
+  let bonusesProgress: any = {}
   let isLoading: boolean = true;
   let errorMessage: string = ''
   let abortController: AbortController
@@ -48,11 +62,14 @@
   const eventSourceHandler = composeEventSourceMessageHandler({
     "WageringProgressUpdate": (data: any) => {
       bonuses = bonuses.map(bonus => {
-        let item = data?.items[bonus.bonusWalletID]
+        let progresses = data?.items[bonus.bonusWalletID]
 
-        if(!item) return bonus
+        if(!progresses) return bonus
+
+        const { maxIdObj, maxId } = findMaxIdSubset(progresses)
+        let { status: _status, level, levelIncrement, gap } = maxIdObj
+        bonusesProgress[bonus.id] = maxId
 
-        let { status: _status, level, levelIncrement, gap } = item
         let _bonus: any = {...bonus}
 
         _bonus = { ..._bonus, wageringProgress: { 
@@ -84,6 +101,7 @@
       lang,
       status: filter === 'claimable' ? 'claimable' : getRequestStatusByStatusFilter(filter), 
       limit,
+      sortOrder: sortorder || 'desc',
     })
 
     if(!response.success) {
@@ -93,10 +111,18 @@
 
       clearEventSource(eventSource, eventSourceHandler)
       if(filter === BonusStatusFilterType.active){
-        eventSource = setWageringEventSource(endpoint, session, bonuses, eventSourceHandler)
+        updateEventSource()
       }
     }
   }
+
+  const updateEventSource = () => {
+    clearEventSource(eventSource, eventSourceHandler)
+    eventSource = setWageringEventSource(endpoint, session, bonuses, eventSourceHandler, bonusesProgress)
+    eventSource.onerror = () => {
+      updateEventSource()
+    }
+  }
   
   const init = async () => {
     if(!isMounted || !filter || !lang || !session || !endpoint) return;
@@ -115,6 +141,7 @@
   $: endpoint && init()
   $: lang && init()
   $: session && init()
+  $: sortorder && init()
 
   let innerWidth
   $: isMobileView = innerWidth <= 648
@@ -125,7 +152,7 @@
   $: locale = (key, values = {}) => $_('wageringBonuses.' + key, {values})
 </script>
 
-<div bind:clientWidth={innerWidth} {...classWithPartMatchMobile(`Root`)}>
+<div bind:this={customStylingContainer} bind:clientWidth={innerWidth} {...classWithPartMatchMobile(`Root`)}>
   <section {...classWithPartMatchMobile(`WageringTabs`)}>
     {#each Object.values(BonusStatusFilterType) as statusFilter}
     <div
@@ -177,7 +204,6 @@
 
 <style lang="scss">
 
-
   *,
   *::before,
   *::after {
@@ -193,6 +219,12 @@
     margin-bottom: 30px;
   }
 
+  .Root {
+    background: var(--emfe-w-color-white, #FFFFFF);
+    padding: 20px;
+    color: var(--emfe-w-color-black, #000000);
+  }
+
   .Bonuses {
     display: flex;
     flex-wrap: wrap;