import React , { FunctionComponent } from "react" ; import { NotificationProperty } from "./index" ; import { action , observable , IObservableArray , makeObservable } from "mobx" ; export const NotificationStoreContext = React . createContext < NotificationStore | null > ( null ) ; export const NotificationStoreProvider = ( { children } ) => ( < NotificationStoreContext . Provider value = { new NotificationStore ( ) } > { children } < /NotificationStoreContext.Provider>); export const useNotificationStore = ( ) => { const store = React . useContext ( NotificationStoreContext ) ; if ( ! store ) { throw new Error ( "You have forgot to use StoreProvider" ) ; } return store ; } ; export class NotificationStore { @ observable public topLeftProperties : NotificationProperty [ ] = [ ] ; @ observable public topCenterProperties : NotificationProperty [ ] = [ ] ; @ observable public topRightProperties : NotificationProperty [ ] = [ ] ; constructor ( ) { makeObservable ( this ) ; } @ action setTopLeftProperties ( properties ) { this . topLeftProperties = properties ; } @ action setTopCenterProperties ( properties ) { this . topCenterProperties = properties ; } @ action setTopRightProperties ( properties ) { this . topRightProperties = properties ; } @ action pushTopLeftProperty ( property ) { this . topLeftProperties . push ( property ) ; } @ action pushTopCenterProperty ( property ) { this . topCenterProperties . push ( property ) ; } @ action pushTopRightProperty ( property ) { this . topRightProperties . push ( property ) ; } @ action removeTopLeftProperty ( id ) { const target = this . topLeftProperties . find ( ( property ) => { return property . id === id ; } ) ; if ( target ) { ( this . topLeftProperties as IObservableArray ) . remove ( target ) ; } } @ action removeTopCenterProperty ( id ) { const target = this . topCenterProperties . find ( ( property ) => { return property . id === id ; } ) ; if ( target ) { ( this . topCenterProperties as IObservableArray ) . remove ( target ) ; } } @ action removeTopRightProperty ( id ) { const target = this . topRightProperties . find ( ( property ) => { return property . id === id ; } ) ; if ( target ) { ( this . topRightProperties as IObservableArray ) . remove ( target ) ; } } }