client: ConfigStore: convert to an actual MobX store

client/config/env.js

@@ -1,7 +1,5 @@
 const path = require('path');
 
-const userConfig = require('../../config');
-
 // Make sure that including paths.js after env.js will read .env variables.
 delete require.cache[require.resolve('../../shared/config/paths')];
 
@@ -26,7 +24,6 @@ process.env.NODE_PATH = (process.env.NODE_PATH || '')
 function getClientEnvironment() {
   const raw = {
     NODE_ENV: process.env.NODE_ENV || 'development',
-    POLL_INTERVAL: userConfig.torrentClientPollInterval,
   };
   // Stringify all values so we can feed into Webpack DefinePlugin
   const stringified = {

client/src/javascript/actions/AuthActions.ts

@@ -14,7 +14,7 @@ import ConfigStore from '../stores/ConfigStore';
 import FloodActions from './FloodActions';
 import SettingActions from './SettingActions';
 
-const baseURI = ConfigStore.getBaseURI();
+const {baseURI} = ConfigStore;
 
 const AuthActions = {
   authenticate: (options: AuthAuthenticationOptions) =>

client/src/javascript/actions/ClientActions.ts

@@ -8,7 +8,7 @@ import ConfigStore from '../stores/ConfigStore';
 import SettingStore from '../stores/SettingStore';
 import AlertStore from '../stores/AlertStore';
 
-const baseURI = ConfigStore.getBaseURI();
+const {baseURI} = ConfigStore;
 
 const ClientActions = {
   fetchSettings: async (): Promise<void> =>

client/src/javascript/actions/FeedActions.ts

@@ -5,7 +5,7 @@ import type {AddFeedOptions, AddRuleOptions, ModifyFeedOptions} from '@shared/ty
 import ConfigStore from '../stores/ConfigStore';
 import FeedStore from '../stores/FeedStore';
 
-const baseURI = ConfigStore.getBaseURI();
+const {baseURI} = ConfigStore;
 
 const FeedActions = {
   addFeed: (options: AddFeedOptions) =>

client/src/javascript/actions/FloodActions.ts

@@ -17,7 +17,7 @@ interface ActivityStreamOptions {
   historySnapshot: HistorySnapshot;
 }
 
-const baseURI = ConfigStore.getBaseURI();
+const {baseURI} = ConfigStore;
 
 let activityStreamEventSource: EventSource | null = null;
 let lastActivityStreamOptions: ActivityStreamOptions;

client/src/javascript/actions/SettingActions.ts

@@ -7,7 +7,7 @@ import AlertStore from '../stores/AlertStore';
 import ConfigStore from '../stores/ConfigStore';
 import SettingStore from '../stores/SettingStore';
 
-const baseURI = ConfigStore.getBaseURI();
+const {baseURI} = ConfigStore;
 
 const SettingActions = {
   fetchSettings: async (): Promise<void> =>

client/src/javascript/actions/TorrentActions.ts

@@ -24,7 +24,7 @@ import AlertStore from '../stores/AlertStore';
 import ConfigStore from '../stores/ConfigStore';
 import UIStore from '../stores/UIStore';
 
-const baseURI = ConfigStore.getBaseURI();
+const {baseURI} = ConfigStore;
 
 const emitTorrentAddedAlert = (count: number) => {
   AlertStore.add({

client/src/javascript/components/AppWrapper.tsx

@@ -22,8 +22,7 @@ const AppWrapper: React.FC<AppWrapperProps> = (props: AppWrapperProps) => {
     overlay = <LoadingOverlay dependencies={UIStore.dependencies} />;
   }
 
-  // TODO: disableUsersAndAuth is server's config not user's
-  if (AuthStore.isAuthenticated && !ClientStatusStore.isConnected && !ConfigStore.getDisableAuth()) {
+  if (AuthStore.isAuthenticated && !ClientStatusStore.isConnected && !ConfigStore.disableAuth) {
     overlay = (
       <div className="application__loading-overlay">
         <div className="application__entry-barrier">

client/src/javascript/components/modals/settings-modal/SettingsModal.tsx

@@ -128,8 +128,7 @@ class SettingsModal extends React.Component<WrappedComponentProps, SettingsModal
           id: 'settings.tabs.resources',
         }),
       },
-      // TODO: disableUsersAndAuth is server's config not user's
-      ...(!ConfigStore.getDisableAuth()
+      ...(!ConfigStore.disableAuth
         ? {
             authentication: {
               content: AuthTab,

client/src/javascript/components/modals/torrent-details-modal/TorrentContents.tsx

@@ -24,7 +24,7 @@ class TorrentContents extends React.Component<WrappedComponentProps> {
     // TODO: itemsTree is not regenerated as that would override user's selection.
     // As a result, percentage of contents of an active torrent is not updated.
     // this.fetchTorrentContents();
-  }, ConfigStore.getPollInterval());
+  }, ConfigStore.pollInterval);
 
   constructor(props: WrappedComponentProps) {
     super(props);
@@ -53,7 +53,7 @@ class TorrentContents extends React.Component<WrappedComponentProps> {
 
   handleDownloadButtonClick = (hash: string, event: React.MouseEvent<HTMLButtonElement>): void => {
     event.preventDefault();
-    const baseURI = ConfigStore.getBaseURI();
+    const {baseURI} = ConfigStore;
     const link = document.createElement('a');
     const {name} = TorrentStore.torrents[hash] || {};
 

client/src/javascript/components/modals/torrent-details-modal/TorrentPeers.tsx

@@ -18,7 +18,7 @@ import UIStore from '../../../stores/UIStore';
 @observer
 class TorrentPeers extends React.Component<unknown> {
   peers = observable.array<TorrentPeer>([]);
-  polling = setInterval(() => this.fetchPeers(), ConfigStore.getPollInterval());
+  polling = setInterval(() => this.fetchPeers(), ConfigStore.pollInterval);
 
   constructor(props: unknown) {
     super(props);

client/src/javascript/components/sidebar/LogoutButton.tsx

@@ -7,7 +7,7 @@ import Logout from '../icons/Logout';
 import Tooltip from '../general/Tooltip';
 
 const LogoutButton = () => {
-  if (ConfigStore.getDisableAuth()) {
+  if (ConfigStore.disableAuth) {
     return null;
   }
 

client/src/javascript/components/torrent-list/TorrentListContextMenu.tsx

@@ -26,7 +26,7 @@ const handleDetailsClick = (torrent: TorrentProperties): void => {
 
 const handleTorrentDownload = (torrent: TorrentProperties, event: React.MouseEvent): void => {
   event.preventDefault();
-  const baseURI = ConfigStore.getBaseURI();
+  const {baseURI} = ConfigStore;
   const link = document.createElement('a');
   link.download = torrent.isMultiFile ? `${torrent.name}.tar` : torrent.name;
   link.href = `${baseURI}api/torrents/${torrent.hash}/contents/all/data`;

client/src/javascript/stores/ConfigStore.ts

@@ -1,22 +1,17 @@
-let disableUsersAndAuth = false;
+import {makeAutoObservable} from 'mobx';
 
 class ConfigStore {
-  static getBaseURI(): string {
-    const {pathname} = window.location;
-    return pathname.substr(0, pathname.lastIndexOf('/') + 1);
+  baseURI = window.location.pathname.substr(0, window.location.pathname.lastIndexOf('/') + 1);
+  disableAuth = false;
+  pollInterval = 2000;
+
+  constructor() {
+    makeAutoObservable(this);
   }
 
-  static getPollInterval(): number {
-    return Number(process.env.POLL_INTERVAL) || 5000;
-  }
-
-  static getDisableAuth(): boolean {
-    return disableUsersAndAuth;
-  }
-
-  static setDisableAuth(val: boolean): void {
-    disableUsersAndAuth = val;
+  setDisableAuth(val: boolean): void {
+    this.disableAuth = val;
   }
 }
 
-export default ConfigStore;
+export default new ConfigStore();

client/src/javascript/util/history.ts

@@ -3,6 +3,6 @@ import {createBrowserHistory} from 'history';
 import stringUtil from '@shared/util/stringUtil';
 import ConfigStore from '../stores/ConfigStore';
 
-const history = createBrowserHistory({basename: stringUtil.withoutTrailingSlash(ConfigStore.getBaseURI())});
+const history = createBrowserHistory({basename: stringUtil.withoutTrailingSlash(ConfigStore.baseURI)});
 
 export default history;