sdnr/wt/odlux/apps/configurationApp/src/plugin.tsx

   1 // app configuration and main entry point for the app
   2
   3 import * as React from "react";
   4 import { withRouter, RouteComponentProps, Route, Switch, Redirect } from 'react-router-dom';
   5
   6 import { faAdjust } from '@fortawesome/free-solid-svg-icons';  // select app icon
   7
   8 import connect, { Connect, IDispatcher } from '../../../framework/src/flux/connect';
   9 import applicationManager from '../../../framework/src/services/applicationManager';
  10 import { IApplicationStoreState } from "../../../framework/src/store/applicationStore";
  11
  12 import { configurationAppRootHandler } from './handlers/configurationAppRootHandler';
  13 import configurationService from "./services/configurationService";
  14
  15 import ConfigurationApplication from "./views/configurationApplication";
  16 import { updateMountIdAsyncActionCreator, updateLpIdAsyncActionCreator, updateViewDataAsyncActionCreator } from "./actions/configurationActions";
  17
  18 let currentMountId: string | null | undefined = undefined;
  19 let currentLpId: string | null |undefined = undefined;
  20 let currentViewId: string | null | undefined = undefined;
  21 let currentIndex: string | null | undefined = undefined;
  22 let lastUrl: string | undefined = undefined;
  23
  24 const mapProps = (state: IApplicationStoreState) => ({
  25   // currentProblemsProperties: createCurrentProblemsProperties(state),
  26 });
  27
  28 const mapDisp = (dispatcher: IDispatcher) => ({
  29   updateMountId: (mountId: string | undefined) => dispatcher.dispatch(updateMountIdAsyncActionCreator(mountId)),
  30   updateLpId: (lpId: string | undefined) => dispatcher.dispatch(updateLpIdAsyncActionCreator(lpId)),
  31   updateViewData: (viewPath: string, indexValues: string[]) => dispatcher.dispatch(updateViewDataAsyncActionCreator(viewPath, indexValues)),
  32 });
  33
  34 const ConfigurationApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComponentProps<{ mountId?: string, lpId?: string, viewId?: string, "0"?: string }> & Connect<typeof mapProps, typeof mapDisp>) => {
  35   if (props.location.pathname !== lastUrl) {
  36     // ensure the asynchronus update will only be called once per path
  37     lastUrl = props.location.pathname;
  38     window.setTimeout(async () => {
  39
  40       // check if the mountId has changed
  41       if (currentMountId !== props.match.params.mountId) {
  42         currentMountId = props.match.params.mountId || undefined;
  43         currentLpId = null;
  44         currentViewId = null;
  45         currentIndex = null;
  46         await props.updateMountId(currentMountId);
  47       }
  48
  49       // check if the lpId has changed
  50       if (currentLpId !== props.match.params.lpId) {
  51         currentLpId = props.match.params.lpId || undefined;
  52         currentViewId = null;
  53         currentIndex = null;
  54         currentLpId && await props.updateLpId(currentLpId);
  55       }
  56
  57       // check if the viewId or the indices has changed
  58       if (currentViewId !== props.match.params.viewId || currentIndex !== props.match.params[0]) {
  59         currentViewId = props.match.params.viewId || undefined;
  60         currentIndex = props.match.params[0] || undefined;
  61         currentViewId && await props.updateViewData(currentViewId || '', currentIndex && currentIndex.split("/") || [] );
  62       }
  63
  64     });
  65   }
  66   return (
  67     <ConfigurationApplication />
  68   );
  69 });
  70
  71 const App = withRouter((props: RouteComponentProps) => (
  72   <Switch>
  73     <Route path={`${props.match.path}/:mountId/:lpId/:viewId/*`} component={ConfigurationApplicationRouteAdapter} />
  74     <Route path={`${props.match.path}/:mountId/:lpId/:viewId`} component={ConfigurationApplicationRouteAdapter} />
  75     <Route path={`${props.match.path}/:mountId/:lpId`} component={ConfigurationApplicationRouteAdapter} />
  76     <Route path={`${props.match.path}/:mountId`} component={ConfigurationApplicationRouteAdapter} />
  77     <Route path={`${props.match.path}`} component={ConfigurationApplicationRouteAdapter} />
  78     <Redirect to={`${props.match.path}`} />
  79   </Switch>
  80 ));
  81
  82 export function register() {
  83   applicationManager.registerApplication({
  84     name: "configuration",
  85     icon: faAdjust,
  86     rootComponent: App,
  87     rootActionHandler: configurationAppRootHandler,
  88     menuEntry: "Configuration"
  89   });
  90 }