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

   1 /**
   2  * ============LICENSE_START========================================================================
   3  * ONAP : ccsdk feature sdnr wt odlux
   4  * =================================================================================================
   5  * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.
   6  * =================================================================================================
   7  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
   8  * in compliance with the License. You may obtain a copy of the License at
   9  *
  10  * http://www.apache.org/licenses/LICENSE-2.0
  11  *
  12  * Unless required by applicable law or agreed to in writing, software distributed under the License
  13  * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
  14  * or implied. See the License for the specific language governing permissions and limitations under
  15  * the License.
  16  * ============LICENSE_END==========================================================================
  17  */
  18
  19 import * as React from "react";
  20 import { withRouter, RouteComponentProps, Route, Switch, Redirect } from 'react-router-dom';
  21
  22 import { faAdjust } from '@fortawesome/free-solid-svg-icons';  // select app icon
  23
  24 import connect, { Connect, IDispatcher } from '../../../framework/src/flux/connect';
  25 import applicationManager from '../../../framework/src/services/applicationManager';
  26 import { IApplicationStoreState } from "../../../framework/src/store/applicationStore";
  27 import { configurationAppRootHandler } from "./handlers/configurationAppRootHandler";
  28 import { NetworkElementSelector } from "./views/networkElementSelector";
  29
  30 import ConfigurationApplication from "./views/configurationApplication";
  31 import { updateNodeIdAsyncActionCreator, updateViewActionAsyncCreator } from "./actions/deviceActions";
  32
  33 let currentNodeId: string | null | undefined = undefined;
  34 let currentVirtualPath: string | null | undefined = undefined;
  35 let lastUrl: string | undefined = undefined;
  36
  37 const mapProps = (state: IApplicationStoreState) => ({
  38   // currentProblemsProperties: createCurrentProblemsProperties(state),
  39 });
  40
  41 const mapDisp = (dispatcher: IDispatcher) => ({
  42   updateNodeId: (nodeId: string) => dispatcher.dispatch(updateNodeIdAsyncActionCreator(nodeId)),
  43   updateView: (vPath: string) => dispatcher.dispatch(updateViewActionAsyncCreator(vPath)),
  44 });
  45
  46 const ConfigurationApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComponentProps<{ nodeId?: string, 0: string }> & Connect<typeof mapProps, typeof mapDisp>) => {
  47   React.useEffect(() => {
  48     return () => {
  49       lastUrl = undefined;
  50       currentNodeId = undefined;
  51       currentVirtualPath = undefined;
  52     }
  53   }, []);
  54   if (props.location.pathname !== lastUrl) {
  55     // ensure the asynchronus update will only be called once per path
  56     lastUrl = props.location.pathname;
  57     window.setTimeout(async () => {
  58
  59       // check if the nodeId has changed
  60       if (currentNodeId !== props.match.params.nodeId) {
  61         currentNodeId = props.match.params.nodeId || undefined;
  62         currentVirtualPath = null;
  63         currentNodeId && await props.updateNodeId(currentNodeId);
  64       }
  65
  66       if (currentVirtualPath !== props.match.params[0]) {
  67         currentVirtualPath = props.match.params[0];
  68         await props.updateView(currentVirtualPath);
  69       }
  70
  71     });
  72   }
  73   return (
  74     <ConfigurationApplication />
  75   );
  76 });
  77
  78 const App = withRouter((props: RouteComponentProps) => (
  79   <Switch>
  80     <Route path={`${props.match.url}/:nodeId/*`} component={ConfigurationApplicationRouteAdapter} />
  81     <Route path={`${props.match.url}/:nodeId`} component={ConfigurationApplicationRouteAdapter} />
  82     <Route path={`${props.match.url}`} component={NetworkElementSelector} />
  83     <Redirect to={`${props.match.url}`} />
  84   </Switch>
  85 ));
  86
  87 export function register() {
  88   applicationManager.registerApplication({
  89     name: "configuration",
  90     icon: faAdjust,
  91     rootComponent: App,
  92     rootActionHandler: configurationAppRootHandler,
  93     menuEntry: "Configuration"
  94   });
  95 }