MobX enhanced logic for Snackbar notifications

store.ts

// - 1 -
import { just, Maybe, nothing } from 'maybeasy';
import { action, computed, observable } from 'mobx';
import { Alert } from './types';

class AlertsStore {
  // - 2 -
  @observable
  alerts: Alert[] = [];

  // - 3 -
  @computed
  get current(): Maybe<Alert> {
    return this.alerts.length === 0 ? nothing() : just(this.alerts[0]);
  }

  // - 4 -
  @action
  hide = () => {
    if (this.alerts.length > 0) {
      this.alerts[0].display = false;
    }
  };

  // - 5 -  
  @action
  process = () => {
    this.alerts = this.alerts.slice(1);
  };

  // - 6 -
  @action
  push = (alert: Alert) => {
    this.hide();
    this.alerts.push({ ...alert, display: true });
  };
}

// - 7 -
const alertsStore = new AlertsStore();
export default alertsStore;