import { Component , Vue } from 'vue-property-decorator' ; import { AsyncLazy } from '@/infrastructure/Threading/AsyncLazy' ; import { IApplicationContext , IApplicationContextChangedEvent } from '@/application/Context/IApplicationContext' ; import { buildContext } from '@/application/Context/ApplicationContextFactory' ; import { IReadOnlyCategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState' ; import { EventSubscriptionCollection } from '@/infrastructure/Events/EventSubscriptionCollection' ; @ Component export abstract class StatefulVue extends Vue { private static readonly instance = new AsyncLazy < IApplicationContext > ( ( ) => buildContext ( ) ) ; protected readonly events = new EventSubscriptionCollection ( ) ; private readonly ownEvents = new EventSubscriptionCollection ( ) ; public async mounted ( ) { const context = await this . getCurrentContext ( ) ; this . ownEvents . register ( context . contextChanged . on ( ( event ) => this . handleStateChangedEvent ( event ) ) ) ; this . handleCollectionState ( context . state , undefined ) ; } protected abstract handleCollectionState ( newState , oldState ) ; protected getCurrentContext ( ) { return StatefulVue . instance . getValue ( ) ; } private handleStateChangedEvent ( event ) { this . handleCollectionState ( event . newState , event . oldState ) ; } }