@everymatrix/bonus-powerups-ingame-list 0.0.32 → 0.0.34

package/dist/collection/components/bonus-powerups-ingame-list/bonus-powerups-ingame-list.js

@@ -13,6 +13,7 @@ import moment from "moment";
 export class BonusPowerupsIngameList {
     constructor() {
         this.mbSource = undefined;
+        this.gameId = undefined;
         this.clientStyling = undefined;
         this.clientStylingUrl = undefined;
         this.translationUrl = undefined;
@@ -20,6 +21,7 @@ export class BonusPowerupsIngameList {
         this.endpoint = undefined;
         this.session = undefined;
         this.limit = 30;
+        this.showFullList = false;
         this.isLoading = false;
         this.isActivating = false;
         this.powerups = [];
@@ -27,9 +29,13 @@ export class BonusPowerupsIngameList {
         this.isPowering = false;
         this.showConfirmModal = false;
         this.currentPowerup = undefined;
+        this.validPowerIds = [];
         this.debouncedReload = debounce(this.reloadPowerups, 100);
     }
-    reloadPowerupsHandler() {
+    reloadPowerupsHandler(e) {
+        var _a, _b;
+        this.showFullList = ((_a = e.detail) === null || _a === void 0 ? void 0 : _a.showFullList) || false;
+        this.validPowerIds = ((_b = e.detail) === null || _b === void 0 ? void 0 : _b.validPowerIds) || [];
         this.reloadPowerups();
     }
     activePowerupHandler(e) {
@@ -72,6 +78,9 @@ export class BonusPowerupsIngameList {
                 method: 'GET',
                 signal: this.abortController.signal
             };
+            if (!this.showFullList) {
+                url.searchParams.append('filter', `gameId=${this.gameId}`);
+            }
             Object.entries(powerUpWithoutGamesSearchConditions).forEach(([key, value]) => {
                 url.searchParams.append(key, value);
             });
@@ -83,9 +92,14 @@ export class BonusPowerupsIngameList {
             }
             const { data, total } = await response.json();
             this.powerups = [...this.powerups, ...data];
-            this.total = total;
             this.isPowering = this.powerups.filter(e => e.status === PowerUpStatus.ACTIVATED).length > 0;
-            this.powerupsLoadEvent.emit({ powerups: this.powerups, total });
+            this.powerups.forEach(powerUp => {
+                powerUp.isValidForCurrentGame = !this.isPowering || this.validPowerIds.indexOf(powerUp.powerUpID) > -1;
+            });
+            this.total = total;
+            if (!this.showFullList) {
+                this.powerupsLoadEvent.emit({ powerups: this.powerups, total });
+            }
         }
         catch (error) {
             if (error.name !== 'AbortError') {
@@ -149,8 +163,11 @@ export class BonusPowerupsIngameList {
                 this.powerups[activedIdx] = Object.assign({}, powerUp);
                 this.powerups = [...this.powerups];
                 this.isPowering = true;
-                this.reloadPowerups();
             }
+            else {
+                console.error(res.errorMessage);
+            }
+            this.reloadPowerups();
         }
         catch (e) {
             console.error(e);
@@ -161,14 +178,17 @@ export class BonusPowerupsIngameList {
             }
         }
     }
+    //Close Current List
     onClose() {
+        this.showFullList = false;
         this.closePowerupsEvent.emit({ powerups: this.powerups });
     }
-    showDetail(id) {
-        this.showDetailsEvent.emit({ id });
+    showDetail(powerup) {
+        powerup.isValidForCurrentGame = !this.isPowering && this.validPowerIds.indexOf(powerup.powerUpID) > -1;
+        this.showDetailsEvent.emit({ id: powerup.id, powerup });
     }
     onActiveBtnClick(powerup) {
-        if (this.isPowering || this.isActivating) {
+        if (this.isPowering || this.isActivating || !powerup.isValidForCurrentGame) {
             return;
         }
         this.currentPowerup = powerup;
@@ -181,18 +201,20 @@ export class BonusPowerupsIngameList {
     }
     render() {
         var _a;
-        return (h("div", { key: '755e95625116000407991e3349c2f896335515a0', class: 'IngamePowerUpsContainer', ref: (el) => (this.stylingContainer = el) }, h("div", { key: 'c0bf175b4af979d505014ef1d92ff6f9c2bf7b3f', class: `TopBar ${this.showConfirmModal ? 'Hidden' : ''}` }, h("span", { key: 'e46b6e4f52170d857bedf55837b60fb471b61e0d', class: 'BarTitle' }, translate('powerups', this.language)), h("div", { key: 'c69769c036192c91410363a14c70648625cabbe8', class: 'IconBtn CircleLinearBorder', onClick: this.onClose.bind(this), innerHTML: CloseSvg })), this.isLoading && this.powerups.length === 0
+        return (h("div", { key: 'd0879d4b0b824e936e2844a0ad5ad47fcb5fcf2f', class: 'IngamePowerUpsContainer', ref: (el) => (this.stylingContainer = el) }, h("div", { key: '5d6468c19f4b05ded25e90db61cb388e48b28bd6', class: `TopBar ${this.showConfirmModal ? 'Hidden' : ''}` }, h("span", { key: 'abbf48114af53a3a322ea2d28aa06c075f94ca22', class: 'BarTitle' }, translate('powerups', this.language)), h("div", { key: '03da4df138bf94d8b1867808a5ab2f38c7862eee', class: 'IconBtn CircleLinearBorder', onClick: this.onClose.bind(this), innerHTML: CloseSvg })), this.isLoading && this.powerups.length === 0
             ? h("smart-loader", null)
             : h("div", { class: `Cards  ${this.showConfirmModal ? 'Hidden' : ''}` }, this.isPowering &&
                 h("div", { class: 'Card PoweringDesc' }, h("div", { class: 'FlexRow' }, h("div", { class: 'Icon', innerHTML: InfoSvg }), h("div", { class: 'Text' }, translate('poweringTooltip', this.language)))), this.powerups.map((powerup, index) => {
                 const isLastItem = index === this.powerups.length - 1;
-                return (h("div", { class: `Card ${powerup.status === PowerUpStatus.ACTIVATED ? 'Actived' : ''}`, ref: isLastItem ? (el) => (this.lastItemElement = el) : null }, h("div", { class: 'PowerupTitle FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'EnergyIcon', innerHTML: EnergySvg }), h("div", { class: 'Name' }, powerup.powerUpName)), h("div", { class: 'DetailIcon', onClick: this.showDetail.bind(this, powerup.id) }, h("div", { class: 'IconBtn CircleLinearBorder', innerHTML: DetailArrow }))), h("div", { class: `ExpireTime Status CircleLinearBorder` }, powerup.status === PowerUpStatus.ACTIVATED
+                return (h("div", { class: `Card ${powerup.status === PowerUpStatus.ACTIVATED ? 'Actived' : ''}`, ref: isLastItem ? (el) => (this.lastItemElement = el) : null }, h("div", { class: 'PowerupTitle FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'EnergyIcon', innerHTML: EnergySvg }), h("div", { class: 'Name' }, powerup.powerUpName)), h("div", { class: 'DetailIcon', onClick: this.showDetail.bind(this, powerup) }, h("div", { class: 'IconBtn CircleLinearBorder', innerHTML: DetailArrow }))), h("div", { class: `ExpireTime Status CircleLinearBorder` }, powerup.status === PowerUpStatus.ACTIVATED
                     ?
                         h("time-count", { "in-progress": true, mode: powerup.boostingPeriod.mode, "left-rounds": (powerup.boostingPeriod.numberOfRounds || 0) - (powerup.usedNumberOfRounds || 0), language: this.language, "expire-time": getActivedExpireTime(powerup) })
                     :
-                        h("time-count", { language: this.language, mode: powerup.boostingPeriod.mode, "expire-time": powerup.expireTime })), h("div", { class: 'MultiplierInfo FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'MultiplierIcon', innerHTML: FireSvg }), h("div", { class: 'MultiplierValue' }, powerup.multiplier.coefficient, "x "), h("div", { class: 'MultiplierMode' }, powerup.multiplier.mode === MultiplierMode.COINS ? translate('coins', this.language) : translate('xp', this.language)), h("div", { class: 'MultiplierIcon', innerHTML: ClockSvg }), h("div", { class: 'MultiplierValue' }, powerup.boostingPeriod[powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS ? 'numberOfRounds' : 'minutes']), h("div", { class: 'MultiplierMode' }, powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS ? translate('rounds', this.language) : translate('minutes', this.language))), (powerup.status === PowerUpStatus.ACTIVE || powerup.status === PowerUpStatus.ACTIVATING) &&
-                    h("div", { class: `ActiveBtn CircleLinearBorder ${this.isPowering ? 'Disabled' : ''} ${this.isActivating ? 'Activating' : ''}`, onClick: () => this.onActiveBtnClick(powerup) }, h("div", { class: 'content' }, " ", translate('activate', this.language))))));
-            }), this.isLoading && this.powerups.length > 0 && h("smart-loader", null)), h("active-confirm-modal", { key: '4c94dfcd5865ee4fb41791a4e69b33dfc1dd7be0', "is-open": this.showConfirmModal, "powerup-id": (_a = this.currentPowerup) === null || _a === void 0 ? void 0 : _a.id, language: this.language })));
+                        h("time-count", { language: this.language, mode: powerup.boostingPeriod.mode, "expire-time": powerup.expireTime })), h("div", { class: 'MultiplierInfo FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'MultiplierIcon', innerHTML: FireSvg }), h("div", { class: 'MultiplierValue' }, powerup.multiplier.coefficient, "x "), h("div", { class: 'MultiplierMode' }, powerup.multiplier.mode === MultiplierMode.COINS ? translate('coins', this.language) : translate('xp', this.language)), h("div", { class: 'MultiplierIcon', innerHTML: ClockSvg }), h("div", { class: 'MultiplierValue' }, powerup.boostingPeriod[powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS ? 'numberOfRounds' : 'minutes']), h("div", { class: 'MultiplierMode' }, powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS
+                    ? translate(powerup.boostingPeriod.numberOfRounds > 1 ? 'rounds' : 'round', this.language)
+                    : translate('minutes', this.language))), (powerup.status === PowerUpStatus.ACTIVE || powerup.status === PowerUpStatus.ACTIVATING) &&
+                    h("div", { class: `ActiveBtn CircleLinearBorder ${this.isPowering || !powerup.isValidForCurrentGame ? 'Disabled' : ''} ${this.isActivating ? 'Activating' : ''}`, onClick: () => this.onActiveBtnClick(powerup) }, h("div", { class: 'content' }, " ", translate('activate', this.language))))));
+            }), this.isLoading && this.powerups.length > 0 && h("smart-loader", null)), h("active-confirm-modal", { key: '3e58eceec850abeeb700e0beed48d9167e1a9485', "is-open": this.showConfirmModal, pid: (_a = this.currentPowerup) === null || _a === void 0 ? void 0 : _a.id, language: this.language })));
     }
     handleClientStylingChange(newValue, oldValue) {
         if (newValue != oldValue) {
@@ -269,6 +291,23 @@ export class BonusPowerupsIngameList {
                 "attribute": "mb-source",
                 "reflect": true
             },
+            "gameId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "game-id",
+                "reflect": true
+            },
             "clientStyling": {
                 "type": "string",
                 "mutable": false,
@@ -389,6 +428,24 @@ export class BonusPowerupsIngameList {
                 "attribute": "limit",
                 "reflect": true,
                 "defaultValue": "30"
+            },
+            "showFullList": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "show-full-list",
+                "reflect": true,
+                "defaultValue": "false"
             }
         };
     }
@@ -400,7 +457,8 @@ export class BonusPowerupsIngameList {
             "total": {},
             "isPowering": {},
             "showConfirmModal": {},
-            "currentPowerup": {}
+            "currentPowerup": {},
+            "validPowerIds": {}
         };
     }
     static get events() {
@@ -464,6 +522,9 @@ export class BonusPowerupsIngameList {
             }, {
                 "propName": "language",
                 "methodName": "handleConfigChange"
+            }, {
+                "propName": "showFullList",
+                "methodName": "loadData"
             }, {
                 "propName": "clientStyling",
                 "methodName": "handleClientStylingChange"

package/dist/collection/components/time-count/time-count.js

@@ -61,7 +61,7 @@ export class TimeCount {
             this.displayTime = `${Math.floor(duration.asDays())} ${translate('days', this.language)}`;
         }
         else if (hours >= 24) {
-            this.displayTime = '1 day';
+            this.displayTime = `1 ${translate('day', this.language)}`;
         }
         else {
             const h = hours;
@@ -73,11 +73,10 @@ export class TimeCount {
     render() {
         return [
             this.inProgress &&
-                h("div", { key: '28ad398a10a6d917d62178b308660228a8e6909c', class: 'InprogressLabel' }, h("span", { key: 'b1717807c6ab470e9aaa9ae820179aed18821c56', class: 'Icon' }), translate('inProgress', this.language)),
-            this.isExpireInDay1 &&
-                h("span", { key: '8113731d28d1ab0df026f61557b1e35f0ea96f53', class: 'Label' }, translate(this.inProgress ? 'endsIn' : 'expiresIn', this.language), " "),
+                h("div", { key: '353e5035808ab07ab05947089117cda17cc00865', class: 'InprogressLabel' }, h("span", { key: 'b199da400374669838bcfec1e83952494ffcfdbd', class: 'Icon' }), translate('inProgress', this.language)),
+            h("span", { key: 'fad67125de31a5e9f0394afcc693a206b98bbd8b', class: 'Label' }, translate(this.inProgress ? 'endsIn' : 'expiresIn', this.language), " "),
             this.inProgress && this.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS
-                ? h("span", { class: 'TimeCountDown' }, this.leftRounds, " ", translate('rounds', this.language))
+                ? h("span", { class: 'TimeCountDown' }, this.leftRounds, " ", translate(this.leftRounds > 1 ? 'rounds' : 'round', this.language))
                 : h("span", { class: 'TimeCountDown' }, this.displayTime)
         ];
     }

package/dist/collection/utils/locale.utils.js

@@ -11,6 +11,8 @@ const TRANSLATIONS = {
         minutes: 'min',
         rounds: 'Rounds',
         days: 'Days',
+        round: 'Round',
+        day: 'Day',
         nothingHere: 'Nothing here -- yet!',
         noPowerUps: 'No power-ups have been used at the moment.',
         poweringTooltip: 'Power-ups are currently unavailable as you have already activated one power-up. Only one power-up can be active at a time.',

package/dist/esm/active-confirm-modal_3.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h } from './index-e015b33d.js';
-import { t as translate, C as CloseSvg, a as BoostingPeriodMode, h as hooks } from './bonus-powerups-ingame-list-01fff0bc.js';
-export { B as bonus_powerups_ingame_list } from './bonus-powerups-ingame-list-01fff0bc.js';
+import { t as translate, C as CloseSvg, a as BoostingPeriodMode, h as hooks } from './bonus-powerups-ingame-list-9d11db33.js';
+export { B as bonus_powerups_ingame_list } from './bonus-powerups-ingame-list-9d11db33.js';
 
 const activeConfirmModalCss = ".ModalContainer{position:absolute;top:calc(50% - 200px);left:0;width:calc(100% - 120px);margin:40px;max-width:400px;height:260px;text-align:center;padding:20px;display:flex;gap:30px;flex-direction:column;border:1px solid var(--emw--ingame-color-white10, rgba(255, 255, 255, 0.0784313725));transition:opacity 200ms ease-in-out;opacity:1;background:var(--emw--ingame-color-black40, rgba(9, 9, 9, 0.5019607843));border-radius:20px;backdrop-filter:blur(22.9411773682px);justify-content:flex-start}.ModalContainer.Hidden{opacity:0 !important}.ModalContainer.Shown .TopBar{justify-content:flex-end;padding:0px}.ModalContainer .Title{font-weight:bold;font-size:1.2rem}.ModalContainer .Btns{display:flex;justify-content:space-evenly}.ModalContainer .PowupBtn{background:linear-gradient(49deg, var(--emw--ingame-color-white10, rgba(255, 255, 255, 0.1019607843)) 33.61%, var(--emw--ingame-color-white50, rgba(255, 255, 255, 0.1019607843)) 89.19%);border:1px solid rgba(70, 69, 69, 0.5);border-radius:10px;padding:5px 15px;color:var(--emw--color-powup-light-green, #00FA5A);font-weight:bold;cursor:pointer}.ModalContainer .PowupBtn.Active{background:var(--emw--color-powup-light-green, #00FA5A);box-shadow:0px 0px 6px 10px var(--emw--ingame-color-white10, rgba(255, 255, 255, 0.1019607843));color:#0A0A17}";
 const ActiveConfirmModalStyle0 = activeConfirmModalCss;
@@ -9,19 +9,19 @@ const ActiveConfirmModal = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.activePowerupEvent = createEvent(this, "activePowerupEvent", 7);
-        this.powerupId = undefined;
+        this.pid = undefined;
         this.language = 'en';
         this.isOpen = undefined;
     }
     activeNow() {
-        this.closeModal(this.powerupId);
+        this.closeModal(this.pid);
     }
     closeModal(id) {
         this.isOpen = false;
         this.activePowerupEvent.emit({ id });
     }
     render() {
-        return h("div", { key: '68efb916139aa66bb559ece109864e2241f096c5', class: `ModalContainer ${this.isOpen ? 'Shown' : 'Hidden'}` }, h("div", { key: '55f46fa812d04c10cb35807aeaa9dd6701b9b6d9', class: 'TopBar' }, h("div", { key: '7daafa1b57f421052aecc6c64cadc8b4d439646a', class: 'IconBtn CircleLinearBorder', onClick: () => this.closeModal(), innerHTML: CloseSvg })), h("div", { key: 'cbb64eff123333949155bccf6856e674b93f412e', class: 'Title' }, translate('activeTitle', this.language)), h("div", { key: '69b64ab2f9809d0ca222e29d4157f76bd11cb9f4', class: 'ActivePowerupContent' }, translate("activeContent", this.language)), h("div", { key: 'fb2b80ab2ffbf16446de273744094e0e3c38ba69', class: 'Btns' }, h("div", { key: '6f421ad422d76ef2a6a8ec3b8096c32f001ace44', class: 'LaterBtn PowupBtn', onClick: () => this.closeModal() }, " ", translate('later', this.language), " "), h("div", { key: '22ac06fefcc50356616b5c16817833e2973ab3bb', class: 'Active PowupBtn', onClick: () => this.activeNow() }, " ", translate('activateNow', this.language), " ")));
+        return h("div", { key: '25543e4f879bca50c5e718b30111c6787126179e', class: `ModalContainer ${this.isOpen ? 'Shown' : 'Hidden'}` }, h("div", { key: 'f12ee04cdeca841d85e96ad9dd9dbd485401849f', class: 'TopBar' }, h("div", { key: '94d650f1068fce10dad3a03d66d12c1c649b4595', class: 'IconBtn CircleLinearBorder', onClick: () => this.closeModal(), innerHTML: CloseSvg })), h("div", { key: '4fc473ba99f996a08885666ea72c838c3bde9a5a', class: 'Title' }, translate('activeTitle', this.language)), h("div", { key: 'bc2c939de2a4caaa0a6042788d2bff0d93e142b9', class: 'ActivePowerupContent' }, translate("activeContent", this.language)), h("div", { key: '5cd6df02b0fe15fbc3c3e95e66c7f4936c21dce3', class: 'Btns' }, h("div", { key: '6e756a744fe6c60ef822b1629e4d586511f6136a', class: 'LaterBtn PowupBtn', onClick: () => this.closeModal() }, " ", translate('later', this.language), " "), h("div", { key: 'daa8c4e16befdd53551fb4760d8b5af4ad66b833', class: 'Active PowupBtn', onClick: () => this.activeNow() }, " ", translate('activateNow', this.language), " ")));
     }
 };
 ActiveConfirmModal.style = ActiveConfirmModalStyle0;
@@ -87,7 +87,7 @@ const TimeCount = class {
             this.displayTime = `${Math.floor(duration.asDays())} ${translate('days', this.language)}`;
         }
         else if (hours >= 24) {
-            this.displayTime = '1 day';
+            this.displayTime = `1 ${translate('day', this.language)}`;
         }
         else {
             const h = hours;
@@ -99,11 +99,10 @@ const TimeCount = class {
     render() {
         return [
             this.inProgress &&
-                h("div", { key: '28ad398a10a6d917d62178b308660228a8e6909c', class: 'InprogressLabel' }, h("span", { key: 'b1717807c6ab470e9aaa9ae820179aed18821c56', class: 'Icon' }), translate('inProgress', this.language)),
-            this.isExpireInDay1 &&
-                h("span", { key: '8113731d28d1ab0df026f61557b1e35f0ea96f53', class: 'Label' }, translate(this.inProgress ? 'endsIn' : 'expiresIn', this.language), " "),
+                h("div", { key: '353e5035808ab07ab05947089117cda17cc00865', class: 'InprogressLabel' }, h("span", { key: 'b199da400374669838bcfec1e83952494ffcfdbd', class: 'Icon' }), translate('inProgress', this.language)),
+            h("span", { key: 'fad67125de31a5e9f0394afcc693a206b98bbd8b', class: 'Label' }, translate(this.inProgress ? 'endsIn' : 'expiresIn', this.language), " "),
             this.inProgress && this.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS
-                ? h("span", { class: 'TimeCountDown' }, this.leftRounds, " ", translate('rounds', this.language))
+                ? h("span", { class: 'TimeCountDown' }, this.leftRounds, " ", translate(this.leftRounds > 1 ? 'rounds' : 'round', this.language))
                 : h("span", { class: 'TimeCountDown' }, this.displayTime)
         ];
     }

package/dist/esm/{bonus-powerups-ingame-list-01fff0bc.js → bonus-powerups-ingame-list-9d11db33.js}

@@ -131,6 +131,8 @@ const TRANSLATIONS = {
         minutes: 'min',
         rounds: 'Rounds',
         days: 'Days',
+        round: 'Round',
+        day: 'Day',
         nothingHere: 'Nothing here -- yet!',
         noPowerUps: 'No power-ups have been used at the moment.',
         poweringTooltip: 'Power-ups are currently unavailable as you have already activated one power-up. Only one power-up can be active at a time.',
@@ -5940,6 +5942,7 @@ const BonusPowerupsIngameList = class {
         this.powerupsLoadEvent = createEvent(this, "powerupsLoad", 7);
         this.closePowerupsEvent = createEvent(this, "closePowerupsList", 7);
         this.mbSource = undefined;
+        this.gameId = undefined;
         this.clientStyling = undefined;
         this.clientStylingUrl = undefined;
         this.translationUrl = undefined;
@@ -5947,6 +5950,7 @@ const BonusPowerupsIngameList = class {
         this.endpoint = undefined;
         this.session = undefined;
         this.limit = 30;
+        this.showFullList = false;
         this.isLoading = false;
         this.isActivating = false;
         this.powerups = [];
@@ -5954,9 +5958,13 @@ const BonusPowerupsIngameList = class {
         this.isPowering = false;
         this.showConfirmModal = false;
         this.currentPowerup = undefined;
+        this.validPowerIds = [];
         this.debouncedReload = debounce(this.reloadPowerups, 100);
     }
-    reloadPowerupsHandler() {
+    reloadPowerupsHandler(e) {
+        var _a, _b;
+        this.showFullList = ((_a = e.detail) === null || _a === void 0 ? void 0 : _a.showFullList) || false;
+        this.validPowerIds = ((_b = e.detail) === null || _b === void 0 ? void 0 : _b.validPowerIds) || [];
         this.reloadPowerups();
     }
     activePowerupHandler(e) {
@@ -5999,6 +6007,9 @@ const BonusPowerupsIngameList = class {
                 method: 'GET',
                 signal: this.abortController.signal
             };
+            if (!this.showFullList) {
+                url.searchParams.append('filter', `gameId=${this.gameId}`);
+            }
             Object.entries(powerUpWithoutGamesSearchConditions).forEach(([key, value]) => {
                 url.searchParams.append(key, value);
             });
@@ -6010,9 +6021,14 @@ const BonusPowerupsIngameList = class {
             }
             const { data, total } = await response.json();
             this.powerups = [...this.powerups, ...data];
-            this.total = total;
             this.isPowering = this.powerups.filter(e => e.status === PowerUpStatus.ACTIVATED).length > 0;
-            this.powerupsLoadEvent.emit({ powerups: this.powerups, total });
+            this.powerups.forEach(powerUp => {
+                powerUp.isValidForCurrentGame = !this.isPowering || this.validPowerIds.indexOf(powerUp.powerUpID) > -1;
+            });
+            this.total = total;
+            if (!this.showFullList) {
+                this.powerupsLoadEvent.emit({ powerups: this.powerups, total });
+            }
         }
         catch (error) {
             if (error.name !== 'AbortError') {
@@ -6076,8 +6092,11 @@ const BonusPowerupsIngameList = class {
                 this.powerups[activedIdx] = Object.assign({}, powerUp);
                 this.powerups = [...this.powerups];
                 this.isPowering = true;
-                this.reloadPowerups();
             }
+            else {
+                console.error(res.errorMessage);
+            }
+            this.reloadPowerups();
         }
         catch (e) {
             console.error(e);
@@ -6088,14 +6107,17 @@ const BonusPowerupsIngameList = class {
             }
         }
     }
+    //Close Current List
     onClose() {
+        this.showFullList = false;
         this.closePowerupsEvent.emit({ powerups: this.powerups });
     }
-    showDetail(id) {
-        this.showDetailsEvent.emit({ id });
+    showDetail(powerup) {
+        powerup.isValidForCurrentGame = !this.isPowering && this.validPowerIds.indexOf(powerup.powerUpID) > -1;
+        this.showDetailsEvent.emit({ id: powerup.id, powerup });
     }
     onActiveBtnClick(powerup) {
-        if (this.isPowering || this.isActivating) {
+        if (this.isPowering || this.isActivating || !powerup.isValidForCurrentGame) {
             return;
         }
         this.currentPowerup = powerup;
@@ -6108,18 +6130,20 @@ const BonusPowerupsIngameList = class {
     }
     render() {
         var _a;
-        return (h("div", { key: '755e95625116000407991e3349c2f896335515a0', class: 'IngamePowerUpsContainer', ref: (el) => (this.stylingContainer = el) }, h("div", { key: 'c0bf175b4af979d505014ef1d92ff6f9c2bf7b3f', class: `TopBar ${this.showConfirmModal ? 'Hidden' : ''}` }, h("span", { key: 'e46b6e4f52170d857bedf55837b60fb471b61e0d', class: 'BarTitle' }, translate('powerups', this.language)), h("div", { key: 'c69769c036192c91410363a14c70648625cabbe8', class: 'IconBtn CircleLinearBorder', onClick: this.onClose.bind(this), innerHTML: CloseSvg })), this.isLoading && this.powerups.length === 0
+        return (h("div", { key: 'd0879d4b0b824e936e2844a0ad5ad47fcb5fcf2f', class: 'IngamePowerUpsContainer', ref: (el) => (this.stylingContainer = el) }, h("div", { key: '5d6468c19f4b05ded25e90db61cb388e48b28bd6', class: `TopBar ${this.showConfirmModal ? 'Hidden' : ''}` }, h("span", { key: 'abbf48114af53a3a322ea2d28aa06c075f94ca22', class: 'BarTitle' }, translate('powerups', this.language)), h("div", { key: '03da4df138bf94d8b1867808a5ab2f38c7862eee', class: 'IconBtn CircleLinearBorder', onClick: this.onClose.bind(this), innerHTML: CloseSvg })), this.isLoading && this.powerups.length === 0
             ? h("smart-loader", null)
             : h("div", { class: `Cards  ${this.showConfirmModal ? 'Hidden' : ''}` }, this.isPowering &&
                 h("div", { class: 'Card PoweringDesc' }, h("div", { class: 'FlexRow' }, h("div", { class: 'Icon', innerHTML: InfoSvg }), h("div", { class: 'Text' }, translate('poweringTooltip', this.language)))), this.powerups.map((powerup, index) => {
                 const isLastItem = index === this.powerups.length - 1;
-                return (h("div", { class: `Card ${powerup.status === PowerUpStatus.ACTIVATED ? 'Actived' : ''}`, ref: isLastItem ? (el) => (this.lastItemElement = el) : null }, h("div", { class: 'PowerupTitle FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'EnergyIcon', innerHTML: EnergySvg }), h("div", { class: 'Name' }, powerup.powerUpName)), h("div", { class: 'DetailIcon', onClick: this.showDetail.bind(this, powerup.id) }, h("div", { class: 'IconBtn CircleLinearBorder', innerHTML: DetailArrow }))), h("div", { class: `ExpireTime Status CircleLinearBorder` }, powerup.status === PowerUpStatus.ACTIVATED
+                return (h("div", { class: `Card ${powerup.status === PowerUpStatus.ACTIVATED ? 'Actived' : ''}`, ref: isLastItem ? (el) => (this.lastItemElement = el) : null }, h("div", { class: 'PowerupTitle FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'EnergyIcon', innerHTML: EnergySvg }), h("div", { class: 'Name' }, powerup.powerUpName)), h("div", { class: 'DetailIcon', onClick: this.showDetail.bind(this, powerup) }, h("div", { class: 'IconBtn CircleLinearBorder', innerHTML: DetailArrow }))), h("div", { class: `ExpireTime Status CircleLinearBorder` }, powerup.status === PowerUpStatus.ACTIVATED
                     ?
                         h("time-count", { "in-progress": true, mode: powerup.boostingPeriod.mode, "left-rounds": (powerup.boostingPeriod.numberOfRounds || 0) - (powerup.usedNumberOfRounds || 0), language: this.language, "expire-time": getActivedExpireTime(powerup) })
                     :
-                        h("time-count", { language: this.language, mode: powerup.boostingPeriod.mode, "expire-time": powerup.expireTime })), h("div", { class: 'MultiplierInfo FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'MultiplierIcon', innerHTML: FireSvg }), h("div", { class: 'MultiplierValue' }, powerup.multiplier.coefficient, "x "), h("div", { class: 'MultiplierMode' }, powerup.multiplier.mode === MultiplierMode.COINS ? translate('coins', this.language) : translate('xp', this.language)), h("div", { class: 'MultiplierIcon', innerHTML: ClockSvg }), h("div", { class: 'MultiplierValue' }, powerup.boostingPeriod[powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS ? 'numberOfRounds' : 'minutes']), h("div", { class: 'MultiplierMode' }, powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS ? translate('rounds', this.language) : translate('minutes', this.language))), (powerup.status === PowerUpStatus.ACTIVE || powerup.status === PowerUpStatus.ACTIVATING) &&
-                    h("div", { class: `ActiveBtn CircleLinearBorder ${this.isPowering ? 'Disabled' : ''} ${this.isActivating ? 'Activating' : ''}`, onClick: () => this.onActiveBtnClick(powerup) }, h("div", { class: 'content' }, " ", translate('activate', this.language))))));
-            }), this.isLoading && this.powerups.length > 0 && h("smart-loader", null)), h("active-confirm-modal", { key: '4c94dfcd5865ee4fb41791a4e69b33dfc1dd7be0', "is-open": this.showConfirmModal, "powerup-id": (_a = this.currentPowerup) === null || _a === void 0 ? void 0 : _a.id, language: this.language })));
+                        h("time-count", { language: this.language, mode: powerup.boostingPeriod.mode, "expire-time": powerup.expireTime })), h("div", { class: 'MultiplierInfo FlexRow' }, h("div", { class: 'LeftOfRow' }, h("div", { class: 'MultiplierIcon', innerHTML: FireSvg }), h("div", { class: 'MultiplierValue' }, powerup.multiplier.coefficient, "x "), h("div", { class: 'MultiplierMode' }, powerup.multiplier.mode === MultiplierMode.COINS ? translate('coins', this.language) : translate('xp', this.language)), h("div", { class: 'MultiplierIcon', innerHTML: ClockSvg }), h("div", { class: 'MultiplierValue' }, powerup.boostingPeriod[powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS ? 'numberOfRounds' : 'minutes']), h("div", { class: 'MultiplierMode' }, powerup.boostingPeriod.mode === BoostingPeriodMode.NUMBER_OF_ROUNDS
+                    ? translate(powerup.boostingPeriod.numberOfRounds > 1 ? 'rounds' : 'round', this.language)
+                    : translate('minutes', this.language))), (powerup.status === PowerUpStatus.ACTIVE || powerup.status === PowerUpStatus.ACTIVATING) &&
+                    h("div", { class: `ActiveBtn CircleLinearBorder ${this.isPowering || !powerup.isValidForCurrentGame ? 'Disabled' : ''} ${this.isActivating ? 'Activating' : ''}`, onClick: () => this.onActiveBtnClick(powerup) }, h("div", { class: 'content' }, " ", translate('activate', this.language))))));
+            }), this.isLoading && this.powerups.length > 0 && h("smart-loader", null)), h("active-confirm-modal", { key: '3e58eceec850abeeb700e0beed48d9167e1a9485', "is-open": this.showConfirmModal, pid: (_a = this.currentPowerup) === null || _a === void 0 ? void 0 : _a.id, language: this.language })));
     }
     handleClientStylingChange(newValue, oldValue) {
         if (newValue != oldValue) {
@@ -6170,6 +6194,7 @@ const BonusPowerupsIngameList = class {
         "endpoint": ["handleConfigChange"],
         "limit": ["handleConfigChange"],
         "language": ["handleConfigChange"],
+        "showFullList": ["loadData"],
         "clientStyling": ["handleClientStylingChange"],
         "clientStylingUrl": ["handleClientStylingUrlChange"],
         "mbSource": ["handleMbSourceChange"],

package/dist/esm/bonus-powerups-ingame-list.js

@@ -16,5 +16,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["active-confirm-modal_3",[[1,"bonus-powerups-ingame-list",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"limit":[514],"isLoading":[32],"isActivating":[32],"powerups":[32],"total":[32],"isPowering":[32],"showConfirmModal":[32],"currentPowerup":[32]},[[16,"reloadPowerups","reloadPowerupsHandler"],[16,"activePowerupEvent","activePowerupHandler"],[0,"powerupTimeCountDown","powerupTimeCountDownHandler"]],{"session":["handleConfigChange"],"endpoint":["handleConfigChange"],"limit":["handleConfigChange"],"language":["handleConfigChange"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[0,"active-confirm-modal",{"powerupId":[1538,"powerup-id"],"language":[1537],"isOpen":[1540,"is-open"]}],[0,"time-count",{"expireTime":[513,"expire-time"],"language":[513],"mode":[513],"inProgress":[516,"in-progress"],"leftRounds":[514,"left-rounds"],"displayTime":[32],"isExpireInDay1":[32],"timeLeft":[32]},null,{"timeLeft":["timeLeftChanged"],"expireTime":["startTimeChanged"]}]]]], options);
+  return bootstrapLazy([["active-confirm-modal_3",[[1,"bonus-powerups-ingame-list",{"mbSource":[513,"mb-source"],"gameId":[513,"game-id"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"limit":[514],"showFullList":[1540,"show-full-list"],"isLoading":[32],"isActivating":[32],"powerups":[32],"total":[32],"isPowering":[32],"showConfirmModal":[32],"currentPowerup":[32],"validPowerIds":[32]},[[16,"reloadPowerups","reloadPowerupsHandler"],[16,"activePowerupEvent","activePowerupHandler"],[0,"powerupTimeCountDown","powerupTimeCountDownHandler"]],{"session":["handleConfigChange"],"endpoint":["handleConfigChange"],"limit":["handleConfigChange"],"language":["handleConfigChange"],"showFullList":["loadData"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[0,"active-confirm-modal",{"pid":[1538],"language":[1537],"isOpen":[1540,"is-open"]}],[0,"time-count",{"expireTime":[513,"expire-time"],"language":[513],"mode":[513],"inProgress":[516,"in-progress"],"leftRounds":[514,"left-rounds"],"displayTime":[32],"isExpireInDay1":[32],"timeLeft":[32]},null,{"timeLeft":["timeLeftChanged"],"expireTime":["startTimeChanged"]}]]]], options);
 });

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export { B as BonusPowerupsIngameList } from './bonus-powerups-ingame-list-01fff0bc.js';
+export { B as BonusPowerupsIngameList } from './bonus-powerups-ingame-list-9d11db33.js';
 import './index-e015b33d.js';

package/dist/esm/loader.js

@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["active-confirm-modal_3",[[1,"bonus-powerups-ingame-list",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"limit":[514],"isLoading":[32],"isActivating":[32],"powerups":[32],"total":[32],"isPowering":[32],"showConfirmModal":[32],"currentPowerup":[32]},[[16,"reloadPowerups","reloadPowerupsHandler"],[16,"activePowerupEvent","activePowerupHandler"],[0,"powerupTimeCountDown","powerupTimeCountDownHandler"]],{"session":["handleConfigChange"],"endpoint":["handleConfigChange"],"limit":["handleConfigChange"],"language":["handleConfigChange"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[0,"active-confirm-modal",{"powerupId":[1538,"powerup-id"],"language":[1537],"isOpen":[1540,"is-open"]}],[0,"time-count",{"expireTime":[513,"expire-time"],"language":[513],"mode":[513],"inProgress":[516,"in-progress"],"leftRounds":[514,"left-rounds"],"displayTime":[32],"isExpireInDay1":[32],"timeLeft":[32]},null,{"timeLeft":["timeLeftChanged"],"expireTime":["startTimeChanged"]}]]]], options);
+  return bootstrapLazy([["active-confirm-modal_3",[[1,"bonus-powerups-ingame-list",{"mbSource":[513,"mb-source"],"gameId":[513,"game-id"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"limit":[514],"showFullList":[1540,"show-full-list"],"isLoading":[32],"isActivating":[32],"powerups":[32],"total":[32],"isPowering":[32],"showConfirmModal":[32],"currentPowerup":[32],"validPowerIds":[32]},[[16,"reloadPowerups","reloadPowerupsHandler"],[16,"activePowerupEvent","activePowerupHandler"],[0,"powerupTimeCountDown","powerupTimeCountDownHandler"]],{"session":["handleConfigChange"],"endpoint":["handleConfigChange"],"limit":["handleConfigChange"],"language":["handleConfigChange"],"showFullList":["loadData"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[0,"active-confirm-modal",{"pid":[1538],"language":[1537],"isOpen":[1540,"is-open"]}],[0,"time-count",{"expireTime":[513,"expire-time"],"language":[513],"mode":[513],"inProgress":[516,"in-progress"],"leftRounds":[514,"left-rounds"],"displayTime":[32],"isExpireInDay1":[32],"timeLeft":[32]},null,{"timeLeft":["timeLeftChanged"],"expireTime":["startTimeChanged"]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/types/builds/emfe-widgets/widgets-monorepo/packages/stencil/bonus-powerups-ingame-list/.stencil/libs/common/src/types/casino/powerups.d.ts

@@ -29,7 +29,7 @@ export interface PowerUpTriggerMethod {
     reward?: {};
 }
 export interface PowerUp {
-    id: string;
+    id: number;
     version: number;
     domainID: number;
     status: PowerUpStatus | number;
@@ -44,7 +44,7 @@ export interface PowerUp {
     modified: string;
     universalID: string;
     ins?: string;
-    powerUpID?: number;
+    powerUpID?: string;
     powerUpName?: string;
     currentTime?: string;
     expireTime?: string;
@@ -53,6 +53,7 @@ export interface PowerUp {
     termsUrl: string;
     games: PowerUpGames;
     usedNumberOfRounds?: number;
+    isValidForCurrentGame?: boolean;
 }
 export type PowerUpGames = {
     total: number;

package/dist/types/components/active-confirm-modal/active-confirm-modal.component.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 export declare class ActiveConfirmModal {
-    powerupId: number;
+    pid: number;
     language: string;
     isOpen: boolean;
     activePowerupEvent: EventEmitter;

package/dist/types/components/bonus-powerups-ingame-list/bonus-powerups-ingame-list.d.ts

@@ -2,6 +2,7 @@ import { EventEmitter } from '../../stencil-public-runtime';
 import { PowerUp } from "../../../../../../libs/common/src/types/casino/powerups";
 export declare class BonusPowerupsIngameList {
     mbSource: string;
+    gameId: string;
     clientStyling: string;
     clientStylingUrl: string;
     translationUrl: string;
@@ -9,6 +10,7 @@ export declare class BonusPowerupsIngameList {
     endpoint: string;
     session: string;
     limit: number;
+    showFullList: boolean;
     isLoading: boolean;
     isActivating: boolean;
     powerups: PowerUp[];
@@ -16,6 +18,7 @@ export declare class BonusPowerupsIngameList {
     isPowering: boolean;
     showConfirmModal: boolean;
     currentPowerup: PowerUp;
+    validPowerIds: string[];
     showDetailsEvent: EventEmitter;
     powerupsLoadEvent: EventEmitter;
     closePowerupsEvent: EventEmitter;
@@ -26,7 +29,7 @@ export declare class BonusPowerupsIngameList {
     private lastItemElement;
     private debouncedReload;
     constructor();
-    reloadPowerupsHandler(): void;
+    reloadPowerupsHandler(e: any): void;
     activePowerupHandler(e: any): void;
     powerupTimeCountDownHandler(e: any): void;
     private reloadPowerups;

package/dist/types/components.d.ts

@@ -9,16 +9,18 @@ export namespace Components {
     interface ActiveConfirmModal {
         "isOpen": boolean;
         "language": string;
-        "powerupId": number;
+        "pid": number;
     }
     interface BonusPowerupsIngameList {
         "clientStyling": string;
         "clientStylingUrl": string;
         "endpoint": string;
+        "gameId": string;
         "language": string;
         "limit": number;
         "mbSource": string;
         "session": string;
+        "showFullList": boolean;
         "translationUrl": string;
     }
     interface TimeCount {
@@ -106,12 +108,13 @@ declare namespace LocalJSX {
         "isOpen"?: boolean;
         "language"?: string;
         "onActivePowerupEvent"?: (event: ActiveConfirmModalCustomEvent<any>) => void;
-        "powerupId"?: number;
+        "pid": number;
     }
     interface BonusPowerupsIngameList {
         "clientStyling"?: string;
         "clientStylingUrl"?: string;
         "endpoint": string;
+        "gameId"?: string;
         "language"?: string;
         "limit"?: number;
         "mbSource"?: string;
@@ -119,6 +122,7 @@ declare namespace LocalJSX {
         "onPowerupsLoad"?: (event: BonusPowerupsIngameListCustomEvent<any>) => void;
         "onShowPowerupDetails"?: (event: BonusPowerupsIngameListCustomEvent<any>) => void;
         "session": string;
+        "showFullList"?: boolean;
         "translationUrl"?: string;
     }
     interface TimeCount {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/bonus-powerups-ingame-list",
-  "version": "0.0.32",
+  "version": "0.0.34",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",