@nu-art/ts-focused-object-frontend 0.401.8 → 0.500.0

package/components/Component_FocusedEntityRef.d.ts

@@ -1,4 +1,4 @@
-import { ComponentSync } from '@nu-art/thunderstorm-frontend/index';
+import { ComponentSync } from '@nu-art/thunder-widgets';
 import { FocusData_Map, FocusedEntity } from '@nu-art/ts-focused-object-shared';
 import { UniqueId } from '@nu-art/ts-common';
 import { OnFocusedDataReceived } from '../modules/ModuleFE_FocusedObject.js';

package/components/Component_FocusedEntityRef.js

@@ -1,11 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ComponentSync, LL_H_C, Show } from '@nu-art/thunderstorm-frontend/index';
+import { ComponentSync, LL_H_C, Show } from '@nu-art/thunder-widgets';
 import { compare, filterDuplicates } from '@nu-art/ts-common';
-import { ModuleFE_FocusedObject } from '../modules/ModuleFE_FocusedObject.js';
+import { dispatch_onFocusedDataReceived, ModuleFE_FocusedObject } from '../modules/ModuleFE_FocusedObject.js';
 import { Component_AccountThumbnail, ModuleFE_Account } from '@nu-art/user-account-frontend/index';
 import './Component_FocusedEntityRef.scss';
 export class Component_FocusedEntityRef extends ComponentSync {
-    // ######################## Lifecycle ########################
     __onFocusedDataReceived(map) {
         this.reDeriveState();
     }
@@ -28,11 +27,12 @@ export class Component_FocusedEntityRef extends ComponentSync {
      * no matter how the component is rendered or recycled.
      */
     componentWillUnmount() {
+        dispatch_onFocusedDataReceived.removeListener(this);
         if (this.state.focusedEntities)
             ModuleFE_FocusedObject.unfocus(this.state.focusedEntities);
     }
     componentDidMount() {
-        //If mounted with focus entities, focus on them
+        dispatch_onFocusedDataReceived.addListener(this);
         if (this.state.focusedEntities)
             ModuleFE_FocusedObject.focus(this.state.focusedEntities);
     }
@@ -47,7 +47,6 @@ export class Component_FocusedEntityRef extends ComponentSync {
                 ModuleFE_FocusedObject.focus(prevState.focusedEntities);
         }
     }
-    // ######################## Render ########################
     render() {
         return _jsx(LL_H_C, { className: 'component--focused-object', children: this.state.accountIds.map(id => {
                 const account = ModuleFE_Account.cache.unique(id);

package/modules/ModuleFE_FocusedObject.d.ts

@@ -1,14 +1,17 @@
 import { Module, UniqueId } from '@nu-art/ts-common';
-import { ApiDefCaller } from '@nu-art/thunderstorm-shared';
-import { ThunderDispatcher } from '@nu-art/thunderstorm-frontend/index';
-import { ApiStruct_FocusedObject, FocusData_Map, FocusedEntity } from '@nu-art/ts-focused-object-shared';
+import { API_FocusedObject, FocusData_Map, FocusedEntity } from '@nu-art/ts-focused-object-shared';
 import { OnLoginStatusUpdated } from '@nu-art/user-account-frontend/index';
 export interface OnFocusedDataReceived {
     __onFocusedDataReceived: (map: FocusData_Map) => void;
 }
-export declare const dispatch_onFocusedDataReceived: ThunderDispatcher<OnFocusedDataReceived, "__onFocusedDataReceived", [map: FocusData_Map], void>;
+declare class FocusedDataDispatcher {
+    private readonly listeners;
+    addListener(l: OnFocusedDataReceived): void;
+    removeListener(l: OnFocusedDataReceived): void;
+    dispatchAll(map: FocusData_Map): void;
+}
+export declare const dispatch_onFocusedDataReceived: FocusedDataDispatcher;
 export declare class ModuleFE_FocusedObject_Class extends Module implements OnLoginStatusUpdated {
-    readonly _v1: ApiDefCaller<ApiStruct_FocusedObject>['_v1'];
     private focusFirebaseListener;
     private focusDataMap;
     private currentlyFocused;
@@ -19,6 +22,7 @@ export declare class ModuleFE_FocusedObject_Class extends Module implements OnLo
     __onLoginStatusUpdated(): void;
     constructor();
     init(): void;
+    update(body: API_FocusedObject['update']['Body']): Promise<API_FocusedObject['update']['Response']>;
     private initFirebaseListening;
     private initWindowFocusListeners;
     private initWindowCloseListeners;
@@ -55,3 +59,4 @@ export declare class ModuleFE_FocusedObject_Class extends Module implements OnLo
     private translateCurrentlyFocusedToFocusedEntities;
 }
 export declare const ModuleFE_FocusedObject: ModuleFE_FocusedObject_Class;
+export {};

package/modules/ModuleFE_FocusedObject.js

@@ -1,161 +1,205 @@
+var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
+    var useValue = arguments.length > 2;
+    for (var i = 0; i < initializers.length; i++) {
+        value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
+    }
+    return useValue ? value : void 0;
+};
+var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
+    function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
+    var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
+    var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
+    var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
+    var _, done = false;
+    for (var i = decorators.length - 1; i >= 0; i--) {
+        var context = {};
+        for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
+        for (var p in contextIn.access) context.access[p] = contextIn.access[p];
+        context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
+        var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
+        if (kind === "accessor") {
+            if (result === void 0) continue;
+            if (result === null || typeof result !== "object") throw new TypeError("Object expected");
+            if (_ = accept(result.get)) descriptor.get = _;
+            if (_ = accept(result.set)) descriptor.set = _;
+            if (_ = accept(result.init)) initializers.unshift(_);
+        }
+        else if (_ = accept(result)) {
+            if (kind === "field") initializers.unshift(_);
+            else descriptor[key] = _;
+        }
+    }
+    if (target) Object.defineProperty(target, contextIn.name, descriptor);
+    done = true;
+};
 import { _keys, debounce, filterDuplicates, Module, removeItemFromArray, Second } from '@nu-art/ts-common';
-import { apiWithBody, ThunderDispatcher } from '@nu-art/thunderstorm-frontend/index';
+import { ApiCaller } from '@nu-art/http-client';
 import { ModuleFE_FirebaseListener } from '@nu-art/firebase-frontend/ModuleFE_FirebaseListener/ModuleFE_FirebaseListener';
 import { ApiDef_FocusedObject, } from '@nu-art/ts-focused-object-shared';
 import { LoggedStatus, ModuleFE_Account } from '@nu-art/user-account-frontend/index';
 import { DefaultTTL_FocusedObject, getRelationalPath } from '@nu-art/ts-focused-object-shared/consts';
-export const dispatch_onFocusedDataReceived = new ThunderDispatcher('__onFocusedDataReceived');
-export class ModuleFE_FocusedObject_Class extends Module {
-    _v1;
-    focusFirebaseListener;
-    focusDataMap;
-    currentlyFocused = {};
-    apiDebounce;
-    windowIsFocused = true;
-    unfocusTimeout;
-    keepAliveTimeout;
-    __onLoginStatusUpdated() {
-        const status = ModuleFE_Account.getLoggedStatus();
-        if (status === LoggedStatus.LOGGED_OUT)
-            this.onUserLoggedOut();
-    }
-    constructor() {
-        super();
-        this.focusDataMap = {};
-        this._v1 = {
-            // updateFocusData: apiWithBody(ApiDef_FocusedObject._v1.updateFocusData),
-            // setFocusStatusByTabId: apiWithBody(ApiDef_FocusedObject._v1.setFocusStatusByTabId),
-            // releaseObject: apiWithBody(ApiDef_FocusedObject._v1.releaseObject),
-            // releaseByTabId: apiWithBody(ApiDef_FocusedObject._v1.releaseByTabId),
-            update: apiWithBody(ApiDef_FocusedObject._v1.update),
-        };
-        this.apiDebounce = debounce(this.updateRTDB, 2 * Second, 10 * Second);
-    }
-    init() {
-        this.initFirebaseListening();
-        this.initWindowFocusListeners();
-        this.initWindowCloseListeners();
+class FocusedDataDispatcher {
+    listeners = new Set();
+    addListener(l) {
+        this.listeners.add(l);
     }
-    // ######################## Init listeners ########################
-    initFirebaseListening = () => {
-        this.focusFirebaseListener = ModuleFE_FirebaseListener.createListener(getRelationalPath());
-        this.focusFirebaseListener.startListening(this.onRTDBChange);
-    };
-    initWindowFocusListeners() {
-        window.addEventListener('focus', this.onWindowFocus);
-        window.addEventListener('blur', this.onWindowBlur);
+    removeListener(l) {
+        this.listeners.delete(l);
     }
-    initWindowCloseListeners() {
-        window.addEventListener('beforeunload', async (event) => {
-            this._v1.update({ focusedEntities: [] }).execute();
-            // navigator.sendBeacon('/log', JSON.stringify({ type:'application/json' }));
-        });
+    dispatchAll(map) {
+        this.listeners.forEach(l => l.__onFocusedDataReceived(map));
     }
-    // ######################## Listener Callbacks ########################
-    onRTDBChange = (snapshot) => {
-        this.focusDataMap = snapshot.val() ?? {};
-        this.logDebug('Received firebase focus data', this.focusDataMap);
-        // Update all the FocusedEntityRef components
-        dispatch_onFocusedDataReceived.dispatchAll(this.focusDataMap);
-    };
-    /**
-     * Callback for when the current window is focused.
-     * we change the class property "windowIsFocused" to true so when the time comes to
-     * send a keepalive to BE, the request will be sent if the window is focused.
-     * Will also trigger keepalive timer if the time is not already set
-     */
-    onWindowFocus = () => {
-        this.windowIsFocused = true;
-        //If the keep alive counter still exists, no need to trigger any extra further logic
-        if (this.keepAliveTimeout)
-            return;
-        this.apiDebounce();
-    };
-    /**
-     * Callback for when the current window is un-focused.
-     * we change the class property "windowIsFocused" to false so when the time comes to
-     * send a keepalive to BE, the request will not be sent if the window is not focused
-     */
-    onWindowBlur = () => {
-        this.windowIsFocused = false;
-    };
-    onUserLoggedOut = () => {
-        this.currentlyFocused = {};
-    };
-    // ######################## Timer Interactions ########################
-    triggerKeepAlive = () => {
-        this.clearKeepAlive();
-        //No need to set keepalive timeout if currentlyFocused has no data
-        if (!_keys(this.currentlyFocused).length)
-            return;
-        this.keepAliveTimeout = setTimeout(() => {
-            //No need to keepalive if window is not focused
-            if (!this.windowIsFocused)
-                return this.clearKeepAlive();
+}
+export const dispatch_onFocusedDataReceived = new FocusedDataDispatcher();
+let ModuleFE_FocusedObject_Class = (() => {
+    let _classSuper = Module;
+    let _instanceExtraInitializers = [];
+    let _update_decorators;
+    return class ModuleFE_FocusedObject_Class extends _classSuper {
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _update_decorators = [ApiCaller(ApiDef_FocusedObject.update)];
+            __esDecorate(this, null, _update_decorators, { kind: "method", name: "update", static: false, private: false, access: { has: obj => "update" in obj, get: obj => obj.update }, metadata: _metadata }, null, _instanceExtraInitializers);
+            if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        focusFirebaseListener = __runInitializers(this, _instanceExtraInitializers);
+        focusDataMap;
+        currentlyFocused = {};
+        apiDebounce;
+        windowIsFocused = true;
+        unfocusTimeout;
+        keepAliveTimeout;
+        __onLoginStatusUpdated() {
+            const status = ModuleFE_Account.getLoggedStatus();
+            if (status === LoggedStatus.LOGGED_OUT)
+                this.onUserLoggedOut();
+        }
+        constructor() {
+            super();
+            this.focusDataMap = {};
+            this.apiDebounce = debounce(this.updateRTDB, 2 * Second, 10 * Second);
+        }
+        init() {
+            this.initFirebaseListening();
+            this.initWindowFocusListeners();
+            this.initWindowCloseListeners();
+        }
+        async update(body) {
+            return undefined;
+        }
+        initFirebaseListening = () => {
+            this.focusFirebaseListener = ModuleFE_FirebaseListener.createListener(getRelationalPath());
+            this.focusFirebaseListener.startListening(this.onRTDBChange);
+        };
+        initWindowFocusListeners() {
+            window.addEventListener('focus', this.onWindowFocus);
+            window.addEventListener('blur', this.onWindowBlur);
+        }
+        initWindowCloseListeners() {
+            window.addEventListener('beforeunload', () => {
+                void this.update({ focusedEntities: [] });
+            });
+        }
+        onRTDBChange = (snapshot) => {
+            this.focusDataMap = snapshot.val() ?? {};
+            this.logDebug('Received firebase focus data', this.focusDataMap);
+            // Update all the FocusedEntityRef components
+            dispatch_onFocusedDataReceived.dispatchAll(this.focusDataMap);
+        };
+        /**
+         * Callback for when the current window is focused.
+         * we change the class property "windowIsFocused" to true so when the time comes to
+         * send a keepalive to BE, the request will be sent if the window is focused.
+         * Will also trigger keepalive timer if the time is not already set
+         */
+        onWindowFocus = () => {
+            this.windowIsFocused = true;
+            //If the keep alive counter still exists, no need to trigger any extra further logic
+            if (this.keepAliveTimeout)
+                return;
             this.apiDebounce();
-        }, DefaultTTL_FocusedObject - 20 * Second);
-    };
-    triggerUnfocus = () => {
-        this.clearUnfocus();
-        this.unfocusTimeout = setTimeout(() => this.apiDebounce(), 20 * Second);
-    };
-    clearKeepAlive = () => {
-        clearTimeout(this.keepAliveTimeout);
-        delete this.keepAliveTimeout;
-    };
-    clearUnfocus = () => {
-        clearTimeout(this.unfocusTimeout);
-        delete this.unfocusTimeout;
-    };
-    // ######################## API Logic ########################
-    updateRTDB = () => {
-        //Call API
-        const focusedEntities = this.translateCurrentlyFocusedToFocusedEntities();
-        this._v1.update({ focusedEntities })
-            .executeSync()
-            .then()
-            .catch(e => {
-            this.logError('Update focused object failed', e);
-        })
-            .finally(() => {
-            this.clearUnfocus();
-            this.triggerKeepAlive();
-        });
-    };
-    // ######################## Logic ########################
-    focus = (entities) => {
-        entities.forEach(entity => {
-            if (!this.currentlyFocused[entity.dbKey])
-                this.currentlyFocused[entity.dbKey] = [];
-            this.currentlyFocused[entity.dbKey] = filterDuplicates([...this.currentlyFocused[entity.dbKey], entity.itemId]);
-        });
-        this.apiDebounce();
-    };
-    unfocus = (entities) => {
-        entities.forEach(entity => {
-            if (!this.currentlyFocused[entity.dbKey])
+        };
+        /**
+         * Callback for when the current window is un-focused.
+         * we change the class property "windowIsFocused" to false so when the time comes to
+         * send a keepalive to BE, the request will not be sent if the window is not focused
+         */
+        onWindowBlur = () => {
+            this.windowIsFocused = false;
+        };
+        onUserLoggedOut = () => {
+            this.currentlyFocused = {};
+        };
+        triggerKeepAlive = () => {
+            this.clearKeepAlive();
+            //No need to set keepalive timeout if currentlyFocused has no data
+            if (!_keys(this.currentlyFocused).length)
                 return;
-            this.currentlyFocused[entity.dbKey] = removeItemFromArray(this.currentlyFocused[entity.dbKey], entity.itemId);
-        });
-        this.triggerUnfocus();
-    };
-    getFocusData = (dbKey, itemId) => {
-        return this.focusDataMap[dbKey]?.[itemId];
-    };
-    getAccountIdsForFocusedItem = (dbKey, itemId, ignoreCurrentUser = true) => {
-        const data = this.getFocusData(dbKey, itemId);
-        const userIds = data ? _keys(data) : [];
-        const account = ModuleFE_Account.getCurrentlyLoggedAccount();
-        return ignoreCurrentUser ? userIds.filter(id => id !== account?._id) : userIds;
-    };
-    translateCurrentlyFocusedToFocusedEntities = () => {
-        const focusedEntities = [];
-        _keys(this.currentlyFocused).forEach(dbKey => {
-            this.currentlyFocused[dbKey].forEach(itemId => {
-                focusedEntities.push({ dbKey: dbKey, itemId });
+            this.keepAliveTimeout = setTimeout(() => {
+                //No need to keepalive if window is not focused
+                if (!this.windowIsFocused)
+                    return this.clearKeepAlive();
+                this.apiDebounce();
+            }, DefaultTTL_FocusedObject - 20 * Second);
+        };
+        triggerUnfocus = () => {
+            this.clearUnfocus();
+            this.unfocusTimeout = setTimeout(() => this.apiDebounce(), 20 * Second);
+        };
+        clearKeepAlive = () => {
+            clearTimeout(this.keepAliveTimeout);
+            delete this.keepAliveTimeout;
+        };
+        clearUnfocus = () => {
+            clearTimeout(this.unfocusTimeout);
+            delete this.unfocusTimeout;
+        };
+        updateRTDB = () => {
+            const focusedEntities = this.translateCurrentlyFocusedToFocusedEntities();
+            this.update({ focusedEntities })
+                .catch(e => {
+                this.logError('Update focused object failed', e);
+            })
+                .finally(() => {
+                this.clearUnfocus();
+                this.triggerKeepAlive();
             });
-        });
-        return focusedEntities;
+        };
+        focus = (entities) => {
+            entities.forEach(entity => {
+                if (!this.currentlyFocused[entity.dbKey])
+                    this.currentlyFocused[entity.dbKey] = [];
+                this.currentlyFocused[entity.dbKey] = filterDuplicates([...this.currentlyFocused[entity.dbKey], entity.itemId]);
+            });
+            this.apiDebounce();
+        };
+        unfocus = (entities) => {
+            entities.forEach(entity => {
+                if (!this.currentlyFocused[entity.dbKey])
+                    return;
+                this.currentlyFocused[entity.dbKey] = removeItemFromArray(this.currentlyFocused[entity.dbKey], entity.itemId);
+            });
+            this.triggerUnfocus();
+        };
+        getFocusData = (dbKey, itemId) => {
+            return this.focusDataMap[dbKey]?.[itemId];
+        };
+        getAccountIdsForFocusedItem = (dbKey, itemId, ignoreCurrentUser = true) => {
+            const data = this.getFocusData(dbKey, itemId);
+            const userIds = data ? _keys(data) : [];
+            const account = ModuleFE_Account.getCurrentlyLoggedAccount();
+            return ignoreCurrentUser ? userIds.filter(id => id !== account?._id) : userIds;
+        };
+        translateCurrentlyFocusedToFocusedEntities = () => {
+            const focusedEntities = [];
+            _keys(this.currentlyFocused).forEach(dbKey => {
+                this.currentlyFocused[dbKey].forEach(itemId => {
+                    focusedEntities.push({ dbKey: dbKey, itemId });
+                });
+            });
+            return focusedEntities;
+        };
     };
-}
+})();
+export { ModuleFE_FocusedObject_Class };
 export const ModuleFE_FocusedObject = new ModuleFE_FocusedObject_Class();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nu-art/ts-focused-object-frontend",
-  "version": "0.401.8",
+  "version": "0.500.0",
   "description": "ts-focused-object - Express & Typescript based backend framework Frontend",
   "keywords": [
     "TacB0sS",
@@ -31,18 +31,18 @@
     "build": "tsc"
   },
   "dependencies": {
-    "@nu-art/ts-focused-object-shared": "0.401.8",
-    "@nu-art/firebase-frontend": "0.401.8",
-    "@nu-art/firebase-shared": "0.401.8",
-    "@nu-art/thunderstorm-frontend": "0.401.8",
-    "@nu-art/thunderstorm-shared": "0.401.8",
-    "@nu-art/ts-common": "0.401.8",
-    "@nu-art/user-account-frontend": "0.401.8",
-    "@nu-art/user-account-shared": "0.401.8",
+    "@nu-art/ts-focused-object-shared": "0.500.0",
+    "@nu-art/firebase-frontend": "0.500.0",
+    "@nu-art/firebase-shared": "0.500.0",
+    "@nu-art/ts-common": "0.500.0",
+    "@nu-art/user-account-frontend": "0.500.0",
+    "@nu-art/user-account-shared": "0.500.0",
     "firebase": "^11.9.0",
     "firebase-admin": "13.4.0",
     "firebase-functions": "6.3.2",
-    "react": "^18.0.0"
+    "react": "^18.0.0",
+    "@nu-art/http-client": "{{THUNDERSTORM_VERSION}}",
+    "@nu-art/thunder-widgets": "{{THUNDERSTORM_VERSION}}"
   },
   "devDependencies": {
     "@types/react": "^18.0.0",