feat: review

demo/signal/index.ts

@@ -15,9 +15,12 @@ document.getElementById('requestButton')?.addEventListener('click', async () =>
 
 document.getElementById('requestButton2')?.addEventListener('click', async () => {
   console.info('1. request with 1');
-  const value1 = buttonEventTrigger.dispatch({id: 2});
+  buttonEventTrigger.dispatch({id: 2});
+  const value1 = buttonEventTrigger.getLastDetail();
   console.info('3. 2x request with 2,3');
-  const value2p = buttonEventTrigger.dispatch({id: 2});
-  const value3p = buttonEventTrigger.dispatch({id: 3});
-  console.info('4. new signal value', {value1, value2: await value2p, value3: await value3p});
+  buttonEventTrigger.dispatch({id: 2});
+  const value2p = buttonEventTrigger.getLastDetail();
+  buttonEventTrigger.dispatch({id: 3});
+  const value3p = buttonEventTrigger.getLastDetail();
+  console.info('4. new signal value', {value1, value2p, value3p});
 });

ui/demo-pwa/src/alwatr-pwa.ts

@@ -22,7 +22,7 @@ declare global {
 @customElement('alwatr-pwa')
 class AlwatrPwa extends AlwatrPwaElement {
   protected override _routes: RoutesConfig = {
-    routeId: (route) => route.sectionList[0]?.toString(),
+    routeId: super._routes.routeId,
     templates: {
       _404: super._routes.templates._404,
       home: () => html`<alwatr-page-chat></alwatr-page-chat>`,

ui/element/src/mixins/direction.ts

@@ -1,4 +1,4 @@
-import {l10nResourceConsumer, localeConsumer} from '@alwatr/i18n';
+import {localeConsumer} from '@alwatr/i18n';
 
 import type {LoggerMixinInterface} from './logging.js';
 import type {Constructor} from '@alwatr/type';
@@ -19,11 +19,7 @@ export function DirectionMixin<T extends Constructor<LoggerMixinInterface>>(
 
     override connectedCallback(): void {
       super.connectedCallback();
-      this._signalListenerList.push(
-          l10nResourceConsumer.subscribe(() => {
-            this._localeChanged();
-          }),
-      );
+      this._signalListenerList.push(localeConsumer.subscribe(this._localeChanged.bind(this)));
     }
 
     /**

ui/element/src/pwa-element.ts

@@ -1,4 +1,4 @@
-import {setLocale} from '@alwatr/i18n';
+import {localeConsumer, setLocale} from '@alwatr/i18n';
 import {routerOutlet, type RoutesConfig} from '@alwatr/router';
 import {html, css, type CSSResultGroup, type PropertyValues} from 'lit';
 import {cache} from 'lit/directives/cache.js';
@@ -43,13 +43,19 @@ export class AlwatrPwaElement extends AlwatrSmartElement {
   constructor() {
     super();
     this._initLocale();
+    localeConsumer.subscribe(this._routeChanged.bind(this));
   }
 
   protected _initLocale(): void {
     this._logger.logMethod('_initLocale');
     setLocale('fa');
   }
 
+  protected _routeChanged(): void {
+    this._logger.logMethod('routeChanged');
+    this.requestUpdate();
+  }
+
   override render(): unknown {
     super.render();
     return html`<div class="page-container">${cache(routerOutlet(this._routes))}</div>`;

ui/ui-kit/src/chat/chat-footer.ts

@@ -1,6 +1,7 @@
 import {AlwatrDummyElement, css, customElement, html} from '@alwatr/element';
 import './chat-text-input.js';
 import '../button/icon-button.js';
+import {setLocale, localeConsumer} from '@alwatr/i18n';
 
 declare global {
   interface HTMLElementTagNameMap {
@@ -33,8 +34,12 @@ export class AlwatrChatFooter extends AlwatrDummyElement {
 
   override render(): unknown {
     return html`
-      <alwatr-icon-button .icon=${'happy-outline'}></alwatr-icon-button>
+      <alwatr-icon-button .icon=${'happy-outline'} @click=${this._changeLocale}></alwatr-icon-button>
       <alwatr-chat-text-input></alwatr-chat-text-input>
     `;
   }
+
+  protected _changeLocale(): void {
+    setLocale(localeConsumer.getValue()?.language !== 'fa' ? 'fa' : 'en');
+  }
 }

uniquely/flight-finder-pwa/src/alwatr-pwa.ts

@@ -1,6 +1,6 @@
-import {customElement, css, html} from '@alwatr/element';
+import {customElement, html} from '@alwatr/element';
 import {AlwatrPwaElement} from '@alwatr/element/pwa-element.js';
-import {type RoutesConfig, routerOutlet} from '@alwatr/router';
+import {type RoutesConfig} from '@alwatr/router';
 
 import ionNormalize from './style/ionic.normalize.js';
 import ionTheming from './style/ionic.theming.js';
@@ -19,31 +19,15 @@ declare global {
  */
 @customElement('alwatr-pwa')
 export class AlwatrPWA extends AlwatrPwaElement {
-  static override styles = [
-    ionNormalize,
-    ionTheming,
-    css`
-      .page-container {
-        position: relative;
-        flex-grow: 1;
-        flex-shrink: 1;
-        flex-basis: 0%;
-        contain: size layout style;
-      }
-    `,
-  ];
+  static override styles = [ionNormalize, ionTheming];
 
   protected _activePage = 'home';
 
   protected override _routes: RoutesConfig = {
-    routeId: (route) => route.sectionList[0]?.toString(),
+    routeId: super._routes.routeId,
     templates: {
       home: () => html`<page-flight-finder class="ion-page"></page-flight-finder>`,
       _404: super._routes.templates._404,
     },
   };
-
-  override render(): unknown {
-    return html` <main class="page-container">${routerOutlet(this._routes)}</main>`;
-  }
 }

uniquely/flight-finder-pwa/src/component/job-add-form.ts

@@ -48,7 +48,8 @@ export class JobAddForm extends AlwatrSmartElement {
     `,
   ];
 
-  static jobAddSignal = eventTrigger.bind('job-add');
+  static jobAddEventTrigger = eventTrigger.bind('job-add');
+
   static cityListTemplate = Object.keys(cityList).map(
       (city) => html`<ion-select-option value=${city}>${city} - ${cityList[city]}</ion-select-option>`,
   );
@@ -184,7 +185,7 @@ export class JobAddForm extends AlwatrSmartElement {
       year: 'numeric',
     });
 
-    JobAddForm.jobAddSignal.dispatch({
+    JobAddForm.jobAddEventTrigger.dispatch({
       detail: {
         destination: this.__newJob.destination as string,
         origin: this.__newJob.origin as string,

uniquely/flight-finder-pwa/src/component/job-item.ts

@@ -96,7 +96,7 @@ export class JobItem extends AlwatrSmartElement {
   @property({attribute: false, type: Object}) job?: Job;
   @query('ion-item-sliding') private __ionItemSliding?: HTMLElement;
 
-  static jobDeleteSignal = eventTrigger.bind('job-delete');
+  static jobDeleteEventTrigger = eventTrigger.bind('job-delete');
 
   override render(): unknown {
     if (this.job == null || this.job.detail == null) return nothing;
@@ -179,7 +179,7 @@ export class JobItem extends AlwatrSmartElement {
       return;
     }
 
-    JobItem.jobDeleteSignal.dispatch(this.job.id);
+    JobItem.jobDeleteEventTrigger.dispatch(this.job.id);
   }
   private async __openSliding(): Promise<void> {
     if (this.__ionItemSliding == null) return;

uniquely/flight-finder-pwa/src/component/page-flight-finder.ts

@@ -54,7 +54,6 @@ export class PageFlightFinder extends AlwatrSmartElement {
 
   static jobDocumentStorageContextConsumer =
     requestableContextConsumer.bind<AlwatrDocumentStorage<Job>, null>('job-document-storage');
-  // static jobAddEventTrigger = eventTrigger.bind<Job>('job-add');
 
   private __jobList?: Array<Job>;
   private __lastUpdate = 0;

uniquely/flight-finder-pwa/src/director/job-document-storage.ts

@@ -35,4 +35,4 @@ requestableContextProvider.setProvider<AlwatrDocumentStorage<Job>, null>('job-do
 
 requestJobStorage('cache_only').then(() => requestJobStorage('network_first'));
 
-setInterval(() => requestableContextConsumer.request<null>('job-document-storage', null), 60_000);
+setInterval(() => requestableContextConsumer.request('job-document-storage', null), 60_000);