apphouse/dist/app/Settings.ts

Component library for React that uses observable state management and theme-able components.

import { makeAutoObservable } from 'mobx';
import { ApphouseTheme } from '../styles/defaults/themes.interface';
import AppTheme from '../styles/AppTheme';
import { ApphouseDarkTheme } from '../themes/presets/apphouseDark.theme';

/**
 * Settings stores the state for the app settings such as theme,
 * external hardwares or any other configuration you would like to
 * persist during the web app session
 */
export default class Settings {
  appVersion: string;
  appVersionDescription: string;
  platform: 'web' | 'mobile';

  theme: AppTheme;

  constructor() {
    this.theme = new AppTheme();
    this.appVersion = 'Beta';
    this.appVersionDescription = '';
    // currently only web is supported
    this.platform = 'web';
    makeAutoObservable(this);
  }

  get version() {
    return this.appVersion;
  }

  setAppVersion(version: string) {
    this.appVersion = version;
  }

  setAppVersionDescription(description: string) {
    this.appVersionDescription = description;
  }

  setThemeId(mode: string) {
    switch (mode) {
      case 'dark': {
        this.theme.setCustomTheme(ApphouseDarkTheme, 'dark');
        break;
      }

      case 'light': {
        this.theme.setCustomTheme(ApphouseDarkTheme, 'light');
        break;
      }
      default:
        break;
    }
  }

  setCustomTheme(theme: ApphouseTheme, id: string) {
    this.theme.setCustomTheme(theme, id);
  }
}