summaryrefslogtreecommitdiffstats
path: root/sdnr/wt/odlux/apps/inventoryApp
diff options
context:
space:
mode:
authorsai-neetha <sai-neetha.phulmali@highstreet-technologies.com>2023-03-20 08:05:47 +0100
committerhighstreetherbert <herbert.eiselt@highstreet-technologies.com>2023-03-29 19:06:25 +0200
commit15e2d3a29b0d1a304965e34f114a911e5a7abdb3 (patch)
tree711ef5616aceb115a1081cccd152eeae0e87bc79 /sdnr/wt/odlux/apps/inventoryApp
parentac5e2dc8f1ee4d5549f7260374e8164d52b07f55 (diff)
Odlux Update
Add eslint and custom icons update Issue-ID: CCSDK-3871 Signed-off-by: sai-neetha <sai-neetha.phulmali@highstreet-technologies.com> Change-Id: If6b676128cc9cff0437a5dc54f85eaafd3b8c586 Signed-off-by: highstreetherbert <herbert.eiselt@highstreet-technologies.com>
Diffstat (limited to 'sdnr/wt/odlux/apps/inventoryApp')
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/pom.xml3
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryDeviceListActions.ts59
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryTreeActions.ts33
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/actions/panelActions.ts14
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/assets/icons/inventoryAppIcon.svg23
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/components/refreshInventoryDialog.tsx58
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/fakeData/index.ts5
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryAppRootHandler.ts18
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryDeviceListActionHandler.ts56
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryElementsHandler.ts4
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryTreeHandler.ts14
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/handlers/panelHandler.ts16
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts6
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/models/inventoryDeviceListType.ts (renamed from sdnr/wt/odlux/apps/inventoryApp/src/handlers/connectedNetworkElementsHandler.ts)23
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/models/networkElementConnection.ts6
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/models/panelId.ts2
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/pluginInventory.tsx49
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/services/inventoryService.ts74
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx139
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx15
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/src/views/treeview.tsx63
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/tsconfig.json2
-rw-r--r--sdnr/wt/odlux/apps/inventoryApp/webpack.config.js26
23 files changed, 414 insertions, 294 deletions
diff --git a/sdnr/wt/odlux/apps/inventoryApp/pom.xml b/sdnr/wt/odlux/apps/inventoryApp/pom.xml
index e39e26744..c6ec595c0 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/pom.xml
+++ b/sdnr/wt/odlux/apps/inventoryApp/pom.xml
@@ -19,6 +19,7 @@
~ ============LICENSE_END=======================================================
~
-->
+
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
@@ -139,7 +140,7 @@
<!-- optional: default phase is "generate-resources" -->
<phase>initialize</phase>
<configuration>
- <nodeVersion>v12.13.0</nodeVersion>
+ <nodeVersion>v12.22.0</nodeVersion>
<yarnVersion>v1.22.10</yarnVersion>
</configuration>
</execution>
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryDeviceListActions.ts b/sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryDeviceListActions.ts
new file mode 100644
index 000000000..710959a2a
--- /dev/null
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryDeviceListActions.ts
@@ -0,0 +1,59 @@
+/**
+ * ============LICENSE_START========================================================================
+ * ONAP : ccsdk feature sdnr wt odlux
+ * =================================================================================================
+ * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.
+ * =================================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing permissions and limitations under
+ * the License.
+ * ============LICENSE_END==========================================================================
+ */
+import { Action } from '../../../../framework/src/flux/action';
+import { Dispatch } from '../../../../framework/src/flux/store';
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore';
+
+import { InventoryDeviceListType } from '../models/inventoryDeviceListType';
+import { inventoryService } from '../services/inventoryService';
+
+/**
+ * Represents the base action.
+ */
+export class BaseAction extends Action { }
+
+/**
+ * Represents an action causing the store to load all nodes.
+ */
+export class LoadAllInventoryDeviceListAction extends BaseAction { }
+
+/**
+ * Represents an action causing the store to update all nodes.
+ */
+export class AllInventoryDeviceListLoadedAction extends BaseAction {
+ /**
+ * Initialize this instance.
+ *
+ * @param inventoryDeviceList All the distinct nodes from the Inventory database.
+ */
+ constructor(public inventoryDeviceList: InventoryDeviceListType[] | null, public error?: string) {
+ super();
+ }
+}
+
+/**
+ * Represents an asynchronous thunk action to load all nodes.
+ */
+export const loadAllInventoryDeviceListAsync = async (dispatch: Dispatch) => {
+ dispatch(new LoadAllInventoryDeviceListAction());
+ const inventoryDeviceList: InventoryDeviceListType[] = (await inventoryService.getInventoryDeviceList().then(ne =>
+ (ne))) || [];
+ return inventoryDeviceList && dispatch(new AllInventoryDeviceListLoadedAction(inventoryDeviceList));
+};
+
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryTreeActions.ts b/sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryTreeActions.ts
index c09b669a1..2c6a0ed65 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryTreeActions.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/actions/inventoryTreeActions.ts
@@ -16,14 +16,13 @@
* ============LICENSE_END==========================================================================
*/
+import { AddErrorInfoAction } from '../../../../framework/src/actions/errorActions';
+import { NavigateToApplication } from '../../../../framework/src/actions/navigationActions';
import { Action } from '../../../../framework/src/flux/action';
import { Dispatch } from '../../../../framework/src/flux/store';
-import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore';
-import { InventoryType, InventoryTreeNode, TreeDemoItem } from '../models/inventory';
+import { InventoryTreeNode, InventoryType, TreeDemoItem } from '../models/inventory';
import { inventoryService } from '../services/inventoryService';
-import { AddErrorInfoAction } from '../../../../framework/src/actions/errorActions';
-import { NavigateToApplication } from '../../../../framework/src/actions/navigationActions';
/**
* Represents the base action.
@@ -38,7 +37,7 @@ export class SetBusyAction extends BaseAction {
}
export class SetSearchTextAction extends BaseAction {
- constructor(public searchTerm: string = "") {
+ constructor(public searchTerm: string = '') {
super();
}
@@ -65,40 +64,38 @@ export class UpdateExpandedNodesAction extends BaseAction {
}
}
-export const setSearchTermAction = (searchTerm: string) => (dispatch: Dispatch, getState: () => IApplicationStoreState) =>{
+export const setSearchTermAction = (searchTerm: string) => (dispatch: Dispatch) =>{
dispatch(new SetSearchTextAction(searchTerm));
-}
+};
-export const updateInventoryTreeAsyncAction = (mountId: string, searchTerm?: string) => async (dispatch: Dispatch, getState: () => IApplicationStoreState) => {
+export const updateInventoryTreeAsyncAction = (mountId: string, searchTerm?: string) => async (dispatch: Dispatch) => {
dispatch(new SetBusyAction(true));
dispatch(new SetSearchTextAction(searchTerm));
try {
const result = await inventoryService.getInventoryTree(mountId, searchTerm);
if (!result) {
- dispatch(new AddErrorInfoAction({ title: "Error", message: `Could not load inventory tree for [${mountId}]. Please check you connection to the server and try later.` }));
- dispatch(new NavigateToApplication("inventory"));
+ dispatch(new AddErrorInfoAction({ title: 'Error', message: `Could not load inventory tree for [${mountId}]. Please check you connection to the server and try later.` }));
+ dispatch(new NavigateToApplication('inventory'));
} else {
dispatch(new UpdateInventoryTreeAction(result));
}
} catch (err) {
- throw new Error("Could not load inventory tree from server.");
- }
- finally {
+ throw new Error('Could not load inventory tree from server.');
+ } finally {
dispatch(new SetBusyAction(false));
}
};
-export const selectInventoryNodeAsyncAction = (nodeId: string) => async (dispatch: Dispatch, getState: () => IApplicationStoreState) => {
+export const selectInventoryNodeAsyncAction = (nodeId: string) => async (dispatch: Dispatch) => {
dispatch(new SetBusyAction(true));
try {
const result = await inventoryService.getInventoryEntry(nodeId);
- if (!result) throw new Error("Could not load inventory tree from server.");
+ if (!result) throw new Error('Could not load inventory tree from server.');
dispatch(new UpdateSelectedNodeAction(result));
} catch (err) {
- throw new Error("Could not load inventory tree from server.");
- }
- finally {
+ throw new Error('Could not load inventory tree from server.');
+ } finally {
dispatch(new SetBusyAction(false));
}
};
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/actions/panelActions.ts b/sdnr/wt/odlux/apps/inventoryApp/src/actions/panelActions.ts
index 10fde8c1d..d66608296 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/actions/panelActions.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/actions/panelActions.ts
@@ -16,16 +16,16 @@
* ============LICENSE_END==========================================================================
*/
-import { Action } from "../../../../framework/src/flux/action";
-import { PanelId } from "models/panelId";
+import { Action } from '../../../../framework/src/flux/action';
+import { PanelId } from '../models/panelId';
export class SetPanelAction extends Action {
- constructor(public panelId: PanelId) {
- super();
- }
+ constructor(public panelId: PanelId) {
+ super();
}
+}
export const setPanelAction = (panelId: PanelId) => {
- return new SetPanelAction(panelId);
- } \ No newline at end of file
+ return new SetPanelAction(panelId);
+}; \ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/assets/icons/inventoryAppIcon.svg b/sdnr/wt/odlux/apps/inventoryApp/src/assets/icons/inventoryAppIcon.svg
new file mode 100644
index 000000000..507a835ab
--- /dev/null
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/assets/icons/inventoryAppIcon.svg
@@ -0,0 +1,23 @@
+<!-- highstreet technologies GmbH colour scheme
+ Grey #565656
+ LBlue #36A9E1
+ DBlue #246DA2
+ Green #003F2C / #006C4B
+ Yellw #C8D400
+ Red #D81036
+-->
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-224 -202 882 882">
+
+<path fill="#565656" d="M 576 544 H -64 V -160 C -64 -177.673 -49.673 -192 -32 -192 H 544 C 561.673 -192 576 -177.673 576 -160 V 544 Z "/>
+
+<path fill="#ffffff" d="M 480 0 H 32 C 14.327 0 0 -14.327 0 -32 V -96 C 0 -113.673 14.327 -128 32 -128 H 480 C 497.673 -128 512 -113.673 512 -96 V -32 C 512 -14.327 497.673 0 480 0 Z M 432 -88 C 418.745 -88 408 -77.255 408 -64 S 418.745 -40 432 -40 S 456 -50.745 456 -64 S 445.255 -88 432 -88 Z M 368 -88 C 354.745 -88 344 -77.255 344 -64 S 354.745 -40 368 -40 S 392 -50.745 392 -64 S 381.255 -88 368 -88 Z "/>
+
+<path fill="#ffffff" d="M 480 160 H 32 C 14.327 160 0 145.673 0 128 V 64 C 0 46.327 14.327 32 32 32 H 480 C 497.673 32 512 46.327 512 64 V 128 C 512 145.673 497.673 160 480 160 Z M 432 72 C 418.745 72 408 82.745 408 96 S 418.745 120 432 120 S 456 109.255 456 96 S 445.255 72 432 72 Z M 368 72 C 354.745 72 344 82.745 344 96 S 354.745 120 368 120 S 392 109.255 392 96 S 381.255 72 368 72 Z "/>
+
+<path fill="#ffffff" d="M 480 320 H 32 C 14.327 320 0 305.673 0 288 V 224 C 0 206.327 14.327 192 32 192 H 480 C 497.673 192 512 206.327 512 224 V 288 C 512 305.673 497.673 320 480 320 Z M 432 232 C 418.745 232 408 242.745 408 256 S 418.745 280 432 280 S 456 269.255 456 256 S 445.255 232 432 232 Z M 368 232 C 354.745 232 344 242.745 344 256 S 354.745 280 368 280 S 392 269.255 392 256 S 381.255 232 368 232 Z "/>
+
+<path fill="#ffffff" d="M 480 480 H 32 C 14.327 480 0 465.673 0 448 V 384 C 0 366.327 14.327 352 32 352 H 480 C 497.673 352 512 366.327 512 384 V 448 C 512 465.673 497.673 480 480 480 Z M 432 392 C 418.745 392 408 402.745 408 416 S 418.745 440 432 440 S 456 429.255 456 416 S 445.255 392 432 392 Z M 368 392 C 354.745 392 344 402.745 344 416 S 354.745 440 368 440 S 392 429.255 392 416 S 381.255 392 368 392 Z"/>
+
+<path fill="#C8D400" d="M 480 670 H -96 C -155 670 -190 631 -192 574 H 576 C 575 622 543 670 480 670 Z"/>
+</svg>
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/components/refreshInventoryDialog.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/components/refreshInventoryDialog.tsx
index 04658a319..027622249 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/components/refreshInventoryDialog.tsx
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/components/refreshInventoryDialog.tsx
@@ -24,78 +24,74 @@ import DialogContent from '@mui/material/DialogContent';
import DialogContentText from '@mui/material/DialogContentText';
import DialogTitle from '@mui/material/DialogTitle';
+import { connect, Connect, IDispatcher } from '../../../../framework/src/flux/connect';
import { inventoryElementsReloadAction } from '../handlers/inventoryElementsHandler';
-import { IDispatcher, connect, Connect } from '../../../../framework/src/flux/connect';
import { InventoryType } from '../models/inventory';
export enum RefreshInventoryDialogMode {
- None = "none",
- RefreshInventoryTable = "RefreshInventoryTable",
+ None = 'none',
+ RefreshInventoryTable = 'RefreshInventoryTable',
}
const mapDispatch = (dispatcher: IDispatcher) => ({
- refreshInventory: () => dispatcher.dispatch(inventoryElementsReloadAction)
+ refreshInventory: () => dispatcher.dispatch(inventoryElementsReloadAction),
});
type DialogSettings = {
- dialogTitle: string,
- dialogDescription: string,
- applyButtonText: string,
- cancelButtonText: string,
- enableMountIdEditor: boolean,
- enableUsernameEditor: boolean,
- enableExtendedEditor: boolean,
-}
+ dialogTitle: string;
+ dialogDescription: string;
+ applyButtonText: string;
+ cancelButtonText: string;
+ enableMountIdEditor: boolean;
+ enableUsernameEditor: boolean;
+ enableExtendedEditor: boolean;
+};
const settings: { [key: string]: DialogSettings } = {
[RefreshInventoryDialogMode.None]: {
- dialogTitle: "",
- dialogDescription: "",
- applyButtonText: "",
- cancelButtonText: "",
+ dialogTitle: '',
+ dialogDescription: '',
+ applyButtonText: '',
+ cancelButtonText: '',
enableMountIdEditor: false,
enableUsernameEditor: false,
enableExtendedEditor: false,
},
[RefreshInventoryDialogMode.RefreshInventoryTable]: {
- dialogTitle: "Do you want to refresh the Inventory table?",
- dialogDescription: "",
- applyButtonText: "Yes",
- cancelButtonText: "Cancel",
+ dialogTitle: 'Do you want to refresh the Inventory table?',
+ dialogDescription: '',
+ applyButtonText: 'Yes',
+ cancelButtonText: 'Cancel',
enableMountIdEditor: true,
enableUsernameEditor: true,
enableExtendedEditor: true,
- }
-}
+ },
+};
type RefreshInventoryDialogComponentProps = Connect<undefined, typeof mapDispatch> & {
mode: RefreshInventoryDialogMode;
onClose: () => void;
};
-type RefreshInventoryDialogComponentState = InventoryType & { isNameValid: boolean, isHostSet: boolean };
+type RefreshInventoryDialogComponentState = InventoryType & { isNameValid: boolean; isHostSet: boolean };
class RefreshInventoryDialogComponent extends React.Component<RefreshInventoryDialogComponentProps, RefreshInventoryDialogComponentState> {
- constructor(props: RefreshInventoryDialogComponentProps) {
- super(props);
- }
-
render(): JSX.Element {
const setting = settings[this.props.mode];
return (
<Dialog open={this.props.mode !== RefreshInventoryDialogMode.None}>
- <DialogTitle id="form-dialog-title" aria-label={`${setting.dialogTitle.replace(/ /g, "-").toLowerCase()}-dialog`}>{setting.dialogTitle}</DialogTitle>
+ <DialogTitle id="form-dialog-title" aria-label={`${setting.dialogTitle.replace(/ /g, '-').toLowerCase()}-dialog`}>{setting.dialogTitle}</DialogTitle>
<DialogContent>
<DialogContentText>
{setting.dialogDescription}
</DialogContentText>
</DialogContent>
<DialogActions>
- <Button aria-label="dialog-confirm-button" onClick={(event) => {
+ <Button aria-label="dialog-confirm-button" onClick={() => {
this.onRefresh();
}} color="inherit" > {setting.applyButtonText} </Button>
- <Button aria-label="dialog-cancel-button" onClick={(event) => {
+ <Button aria-label="dialog-cancel-button" onClick={() => {
this.onCancel();
}} color="secondary"> {setting.cancelButtonText} </Button>
</DialogActions>
@@ -110,7 +106,7 @@ class RefreshInventoryDialogComponent extends React.Component<RefreshInventoryDi
private onCancel = () => {
this.props.onClose();
- }
+ };
}
export const RefreshInventoryDialog = connect(undefined, mapDispatch)(RefreshInventoryDialogComponent);
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/fakeData/index.ts b/sdnr/wt/odlux/apps/inventoryApp/src/fakeData/index.ts
index 46827e842..136b908dd 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/fakeData/index.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/fakeData/index.ts
@@ -16,11 +16,10 @@
* ============LICENSE_END==========================================================================
*/
-import { InventoryTreeNode, InventoryType } from "models/inventory";
import { convertPropertyNames, replaceHyphen } from "../../../../framework/src/utilities/yangHelper";
-// Tree mittels tree-level und parent UUID (incl)
-// einzelabfrage mit db-id
+import { InventoryTreeNode, InventoryType } from "../models/inventory";
+
const data = [
{ "manufacturer-identifier": "ONF-Wireless-Transport", "version": "a2.module-newest", "uuid": "a2.module-1.1.1.5", "part-type-id": "3FE25774AA01", "model-identifier": "VAUIAEYAAA", "tree-level": 2, "node-id": "robot_sim_2_equipment", "description": "WS/CORE-MAIN/a2.module#5", "type-name": "a2.module", "serial": "0003548168", "id": "robot_sim_2_equipment/a2.module-1.1.1.5", "parent-uuid": "CARD-1.1.1.0", "contained-holder": ["SUBRACK-1.15.0.0"], "date": "2005-11-09T00:00:00.0Z" },
{ "manufacturer-identifier": "SAN", "version": "234", "uuid": "CARD-1.1.6.0", "part-type-id": "part-number-12", "model-identifier": "model-id-12", "tree-level": 1, "node-id": "robot_sim_2_equipment", "description": "WS/p8.module", "type-name": "p8.module", "serial": "serial-number-124", "id": "robot_sim_2_equipment/CARD-1.1.6.0", "parent-uuid": "SHELF-1.1.0.0", "contained-holder": ["PORT-1.1.6.5", "PORT-1.1.6.8", "PORT-1.1.6.7", "PORT-1.1.6.6"], "date": "2013-11-23T00:00:00.0Z" },
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryAppRootHandler.ts b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryAppRootHandler.ts
index 0e857ffe9..b1a0c581f 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryAppRootHandler.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryAppRootHandler.ts
@@ -18,27 +18,23 @@
// main state handler
import { combineActionHandler } from '../../../../framework/src/flux/middleware';
-
// ** do not remove **
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore';
-import { IActionHandler } from '../../../../framework/src/flux/action';
-import { IInvenroryTree, inventoryTreeHandler } from './inventoryTreeHandler';
-import { IConnectedNetworkElementsState, connectedNetworkElementsActionHandler } from './connectedNetworkElementsHandler';
import { PanelId } from '../models/panelId';
+import { IInventoryDeviceListState, inventoryDeviceListActionHandler } from './inventoryDeviceListActionHandler';
+import { IInventoryElementsState, inventoryElementsActionHandler } from './inventoryElementsHandler';
+import { IInvenroryTree, inventoryTreeHandler } from './inventoryTreeHandler';
import { currentOpenPanelHandler } from './panelHandler';
-import { inventoryElementsActionHandler, IInventoryElementsState } from './inventoryElementsHandler';
export interface IInventoryAppStateState {
inventoryTree: IInvenroryTree;
- connectedNetworkElements: IConnectedNetworkElementsState; // used for ne selection
currentOpenPanel: PanelId;
inventoryElements: IInventoryElementsState;
+ inventoryDeviceList: IInventoryDeviceListState;
}
-
-
-
declare module '../../../../framework/src/store/applicationStore' {
interface IApplicationStoreState {
inventory: IInventoryAppStateState;
@@ -47,9 +43,9 @@ declare module '../../../../framework/src/store/applicationStore' {
const actionHandlers = {
inventoryTree: inventoryTreeHandler,
- connectedNetworkElements: connectedNetworkElementsActionHandler,
currentOpenPanel: currentOpenPanelHandler,
- inventoryElements: inventoryElementsActionHandler
+ inventoryElements: inventoryElementsActionHandler,
+ inventoryDeviceList: inventoryDeviceListActionHandler,
};
export const inventoryAppRootHandler = combineActionHandler<IInventoryAppStateState>(actionHandlers);
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryDeviceListActionHandler.ts b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryDeviceListActionHandler.ts
new file mode 100644
index 000000000..7c06cad99
--- /dev/null
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryDeviceListActionHandler.ts
@@ -0,0 +1,56 @@
+/**
+ * ============LICENSE_START========================================================================
+ * ONAP : ccsdk feature sdnr wt odlux
+ * =================================================================================================
+ * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.
+ * =================================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing permissions and limitations under
+ * the License.
+ * ============LICENSE_END==========================================================================
+ */
+import { IActionHandler } from '../../../../framework/src/flux/action';
+
+import { AllInventoryDeviceListLoadedAction, LoadAllInventoryDeviceListAction } from '../actions/inventoryDeviceListActions';
+import { InventoryDeviceListType } from '../models/inventoryDeviceListType';
+
+export interface IInventoryDeviceListState {
+ inventoryDeviceList: InventoryDeviceListType[];
+ busy: boolean;
+}
+
+const inventoryDeviceListListStateInit: IInventoryDeviceListState = {
+ inventoryDeviceList: [],
+ busy: false,
+};
+
+export const inventoryDeviceListActionHandler: IActionHandler<IInventoryDeviceListState> = (state = inventoryDeviceListListStateInit, action) => {
+ if (action instanceof LoadAllInventoryDeviceListAction) {
+
+ state = {
+ ...state,
+ busy: true,
+ };
+
+ } else if (action instanceof AllInventoryDeviceListLoadedAction) {
+ if (!action.error && action.inventoryDeviceList) {
+ state = {
+ ...state,
+ inventoryDeviceList: action.inventoryDeviceList,
+ busy: false,
+ };
+ } else {
+ state = {
+ ...state,
+ busy: false,
+ };
+ }
+ }
+ return state;
+}; \ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryElementsHandler.ts b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryElementsHandler.ts
index a65319efa..7bac8f632 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryElementsHandler.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryElementsHandler.ts
@@ -15,7 +15,7 @@
* the License.
* ============LICENSE_END==========================================================================
*/
-import { createExternal,IExternalTableState } from '../../../../framework/src/components/material-table/utilities';
+import { createExternal, IExternalTableState } from '../../../../framework/src/components/material-table/utilities';
import { createSearchDataHandler } from '../../../../framework/src/utilities/elasticSearch';
import { InventoryType } from '../models/inventory';
@@ -23,7 +23,7 @@ import { InventoryType } from '../models/inventory';
export interface IInventoryElementsState extends IExternalTableState<InventoryType> { }
// create eleactic search material data fetch handler
-const inventoryElementsSearchHandler = createSearchDataHandler<InventoryType>("inventory");
+const inventoryElementsSearchHandler = createSearchDataHandler<InventoryType>('inventory');
export const {
actionHandler: inventoryElementsActionHandler,
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryTreeHandler.ts b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryTreeHandler.ts
index 9029a6719..fe90d9820 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryTreeHandler.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/inventoryTreeHandler.ts
@@ -16,10 +16,10 @@
* ============LICENSE_END==========================================================================
*/
-import { IActionHandler } from "../../../../framework/src/flux/action";
+import { IActionHandler } from '../../../../framework/src/flux/action';
-import { SetBusyAction, UpdateInventoryTreeAction, UpdateSelectedNodeAction, SetSearchTextAction, UpdateExpandedNodesAction } from "../actions/inventoryTreeActions";
-import { InventoryTreeNode, InventoryType, TreeDemoItem } from "../models/inventory";
+import { SetBusyAction, SetSearchTextAction, UpdateExpandedNodesAction, UpdateInventoryTreeAction, UpdateSelectedNodeAction } from '../actions/inventoryTreeActions';
+import { InventoryTreeNode, InventoryType, TreeDemoItem } from '../models/inventory';
export interface IInvenroryTree {
@@ -33,10 +33,10 @@ export interface IInvenroryTree {
const initialState: IInvenroryTree = {
isBusy: false,
rootNodes: [],
- searchTerm: "",
+ searchTerm: '',
selectedNode: undefined,
expandedItems: [],
-}
+};
const getTreeDataFromInvetoryTreeNode = (node: InventoryTreeNode): TreeDemoItem[] => Object.keys(node).reduce<TreeDemoItem[]>((acc, key) => {
@@ -61,8 +61,8 @@ export const inventoryTreeHandler: IActionHandler<IInvenroryTree> = (state = ini
} else if (action instanceof UpdateSelectedNodeAction) {
state = { ...state, selectedNode: action.selectedNode };
} else if (action instanceof UpdateExpandedNodesAction) {
- state = { ...state, expandedItems: action.expandedNodes || []}
+ state = { ...state, expandedItems: action.expandedNodes || [] };
}
return state;
-} \ No newline at end of file
+}; \ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/panelHandler.ts b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/panelHandler.ts
index 761253112..7912d0ea5 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/panelHandler.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/handlers/panelHandler.ts
@@ -1,11 +1,11 @@
-import { PanelId } from "../models/panelId";
-import { IActionHandler } from "../../../../framework/src/flux/action";
-import { SetPanelAction } from "../actions/panelActions";
+import { IActionHandler } from '../../../../framework/src/flux/action';
+import { SetPanelAction } from '../actions/panelActions';
+import { PanelId } from '../models/panelId';
export const currentOpenPanelHandler: IActionHandler<PanelId> = (state = null, action) => {
- if (action instanceof SetPanelAction) {
- state = action.panelId;
- }
- return state;
- } \ No newline at end of file
+ if (action instanceof SetPanelAction) {
+ state = action.panelId;
+ }
+ return state;
+}; \ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts b/sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts
index a6c990529..a09fd7e41 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/models/inventory.ts
@@ -35,7 +35,7 @@ export type InventoryType = {
partTypeId: string;
modelIdentifier: string;
typeName: string;
-}
+};
export type InventoryTreeNode = {
[key: string]: {
@@ -44,7 +44,7 @@ export type InventoryTreeNode = {
isMatch?: boolean;
ownSeverity?: string;
childrenSeveritySummary?: string;
- }
-}
+ };
+};
export type TreeDemoItem = ExternalTreeItem<string>; \ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/connectedNetworkElementsHandler.ts b/sdnr/wt/odlux/apps/inventoryApp/src/models/inventoryDeviceListType.ts
index e6138cc38..ab2411401 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/handlers/connectedNetworkElementsHandler.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/models/inventoryDeviceListType.ts
@@ -16,21 +16,10 @@
* ============LICENSE_END==========================================================================
*/
-import { createExternal, IExternalTableState } from '../../../../framework/src/components/material-table/utilities';
-import { createSearchDataHandler } from '../../../../framework/src/utilities/elasticSearch';
-
-import { NetworkElementConnection } from '../models/networkElementConnection';
-
-export interface IConnectedNetworkElementsState extends IExternalTableState<NetworkElementConnection> { }
-
-// create eleactic search material data fetch handler
-const connectedNetworkElementsSearchHandler = createSearchDataHandler<NetworkElementConnection>('network-element-connection', false, { status: "Connected" });
-
-export const {
- actionHandler: connectedNetworkElementsActionHandler,
- createActions: createConnectedNetworkElementsActions,
- createProperties: createConnectedNetworkElementsProperties,
- reloadAction: connectedNetworkElementsReloadAction,
+/**
+ * Represents all the distinct devices from the inventory history data.
+ */
- // set value action, to change a value
-} = createExternal<NetworkElementConnection>(connectedNetworkElementsSearchHandler, appState => appState.inventory.connectedNetworkElements);
+export type InventoryDeviceListType = {
+ nodeId: string;
+};
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/models/networkElementConnection.ts b/sdnr/wt/odlux/apps/inventoryApp/src/models/networkElementConnection.ts
index 88f70181c..e1ef1ea2d 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/models/networkElementConnection.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/models/networkElementConnection.ts
@@ -24,7 +24,7 @@ export type NetworkElementConnection = {
username?: string;
password?: string;
isRequired?: boolean;
- status?: "connected" | "mounted" | "unmounted" | "connecting" | "disconnected" | "idle";
+ status?: 'connected' | 'mounted' | 'unmounted' | 'connecting' | 'disconnected' | 'idle';
coreModelCapability?: string;
deviceType?: string;
nodeDetails?: {
@@ -33,5 +33,5 @@ export type NetworkElementConnection = {
failureReason: string;
capability: string;
}[];
- }
-}
+ };
+};
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/models/panelId.ts b/sdnr/wt/odlux/apps/inventoryApp/src/models/panelId.ts
index b05c1db64..8f8224c8c 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/models/panelId.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/models/panelId.ts
@@ -16,4 +16,4 @@
* ============LICENSE_END==========================================================================
*/
-export type PanelId = null | "InventoryElementsTable" | "TreeviewTable"; \ No newline at end of file
+export type PanelId = null | 'Equipment' | 'TreeView'; \ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/pluginInventory.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/pluginInventory.tsx
index 50339c0ab..819859919 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/pluginInventory.tsx
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/pluginInventory.tsx
@@ -16,38 +16,33 @@
* ============LICENSE_END==========================================================================
*/
// app configuration and main entry point for the app
+import React from 'react';
+import { Redirect, Route, RouteComponentProps, Switch, withRouter } from 'react-router-dom';
-import * as React from "react";
-import { withRouter, RouteComponentProps, Route, Switch, Redirect } from 'react-router-dom';
-import { faShoppingBag } from '@fortawesome/free-solid-svg-icons'; // select app icon
+import { connect, Connect, IDispatcher } from '../../../framework/src/flux/connect';
import applicationManager from '../../../framework/src/services/applicationManager';
-import connect, { Connect, IDispatcher } from '../../../framework/src/flux/connect';
-import { IApplicationStoreState } from "../../../framework/src/store/applicationStore";
-
-import { InventoryTreeView } from './views/treeview';
+import { IApplicationStoreState } from '../../../framework/src/store/applicationStore';
+import { SetPanelAction } from './actions/panelActions';
+import inventoryAppRootHandler from './handlers/inventoryAppRootHandler';
+import { createInventoryElementsActions, createInventoryElementsProperties } from './handlers/inventoryElementsHandler';
+import { PanelId } from './models/panelId';
import Dashboard from './views/dashboard';
+import { InventoryTreeView } from './views/treeview';
-import { PanelId } from "./models/panelId";
-import { SetPanelAction } from "./actions/panelActions";
-
-import inventoryAppRootHandler from './handlers/inventoryAppRootHandler';
-import { createInventoryElementsActions, createInventoryElementsProperties } from "./handlers/inventoryElementsHandler";
-import { createConnectedNetworkElementsProperties, createConnectedNetworkElementsActions } from "./handlers/connectedNetworkElementsHandler";
+const appIcon = require('./assets/icons/inventoryAppIcon.svg'); // select app icon
let currentMountId: string | undefined = undefined;
const mapProps = (state: IApplicationStoreState) => ({
inventoryProperties: createInventoryElementsProperties(state),
panelId: state.inventory.currentOpenPanel,
- connectedNetworkElementsProperties: createConnectedNetworkElementsProperties(state),
});
-const mapDisp = (dispatcher: IDispatcher) => ({
+const mapDispatch = (dispatcher: IDispatcher) => ({
inventoryActions: createInventoryElementsActions(dispatcher.dispatch, true),
- connectedNetworkElementsActions: createConnectedNetworkElementsActions(dispatcher.dispatch, true),
setCurrentPanel: (panelId: PanelId) => dispatcher.dispatch(new SetPanelAction(panelId)),
});
-const InventoryTableApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComponentProps<{ mountId?: string }> & Connect<typeof mapProps, typeof mapDisp>) => {
+const InventoryTableApplicationRouteAdapter = connect(mapProps, mapDispatch)((props: RouteComponentProps<{ mountId?: string }> & Connect<typeof mapProps, typeof mapDispatch>) => {
if (currentMountId !== props.match.params.mountId) {
// route parameter has changed
currentMountId = props.match.params.mountId || undefined;
@@ -56,26 +51,20 @@ const InventoryTableApplicationRouteAdapter = connect(mapProps, mapDisp)((props:
if (currentMountId) {
if (props.panelId) {
props.setCurrentPanel(props.panelId);
+ } else {
+ props.setCurrentPanel('Equipment');
}
- else {
- props.setCurrentPanel("InventoryElementsTable");
- }
- props.inventoryActions.onFilterChanged("nodeId", currentMountId);
- props.connectedNetworkElementsActions.onFilterChanged("nodeId", currentMountId);
+ props.inventoryActions.onFilterChanged('nodeId', currentMountId);
if (!props.inventoryProperties.showFilter) {
props.inventoryActions.onToggleFilter(false);
}
- if (!props.connectedNetworkElementsProperties.showFilter) {
- props.connectedNetworkElementsActions.onToggleFilter(false);
- }
props.inventoryActions.onRefresh();
- props.connectedNetworkElementsActions.onRefresh();
}
});
}
return (
<Dashboard />
- )
+ );
});
const App = withRouter((props: RouteComponentProps) => (
@@ -89,11 +78,11 @@ const App = withRouter((props: RouteComponentProps) => (
export function register() {
applicationManager.registerApplication({
- name: "inventory",
- icon: faShoppingBag,
+ name: 'inventory',
+ icon: appIcon,
rootActionHandler: inventoryAppRootHandler,
rootComponent: App,
- menuEntry: "Inventory"
+ menuEntry: 'Inventory',
});
}
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/services/inventoryService.ts b/sdnr/wt/odlux/apps/inventoryApp/src/services/inventoryService.ts
index cb70bf522..4014fcf6d 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/services/inventoryService.ts
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/services/inventoryService.ts
@@ -15,54 +15,76 @@
* the License.
* ============LICENSE_END==========================================================================
*/
+import { Result } from '../../../../framework/src/models/elasticSearch';
import { requestRest } from '../../../../framework/src/services/restService';
-import { convertPropertyNames, replaceHyphen } from '../../../../framework/src/utilities/yangHelper';
import { InventoryTreeNode, InventoryType } from '../models/inventory';
-import { getTree, getElement } from '../fakeData';
+import { InventoryDeviceListType } from '../models/inventoryDeviceListType';
/**
* Represents a web api accessor service for all maintenence entries related actions.
*/
class InventoryService {
- public async getInventoryTree(mountId: string, searchTerm: string = ""): Promise<InventoryTreeNode | null> {
+ public async getInventoryTree(mountId: string, searchTerm: string = ''): Promise<InventoryTreeNode | null> {
//return await getTree(searchTerm);
const path = `/tree/read-inventoryequipment-tree/${mountId}`;
const body = {
- "query": searchTerm
+ 'query': searchTerm,
};
- const inventoryTree = await requestRest<InventoryTreeNode>(path, { method: "POST" , body: JSON.stringify(body)});
+ const inventoryTree = await requestRest<InventoryTreeNode>(path, { method: 'POST', body: JSON.stringify(body) });
return inventoryTree && inventoryTree || null;
}
public async getInventoryEntry(id: string): Promise<InventoryType | undefined> {
- const path = `/rests/operations/data-provider:read-inventory-list`;
+ const path = '/rests/operations/data-provider:read-inventory-list';
const body = {
- "data-provider:input": {
- "filter": [
- { property: "id", filtervalue: id },
+ 'data-provider:input': {
+ 'filter': [
+ { property: 'id', filtervalue: id },
],
- "sortorder": [],
- "pagination": {
- "size": 1,
- "page": 1
- }
- }
+ 'sortorder': [],
+ 'pagination': {
+ 'size': 1,
+ 'page': 1,
+ },
+ },
};
const inventoryTreeElement = await requestRest<{
- "data-provider:output": {
- "pagination": {
- "size": number,
- "page": number,
- "total": number
+ 'data-provider:output': {
+ 'pagination': {
+ 'size': number;
+ 'page': number;
+ 'total': number;
+ };
+ 'data': InventoryType[];
+ };
+ }>(path, { method: 'POST', body: JSON.stringify(body) });
+
+ return inventoryTreeElement && inventoryTreeElement['data-provider:output'] && inventoryTreeElement['data-provider:output'].pagination && inventoryTreeElement['data-provider:output'].pagination.total >= 1 &&
+ inventoryTreeElement['data-provider:output'].data && inventoryTreeElement['data-provider:output'].data[0] || undefined;
+ // return await getElement(id);
+ }
+
+ /**
+ * Gets all nodes from the inventory device list.
+ */
+ public async getInventoryDeviceList(): Promise<(InventoryDeviceListType)[] | null> {
+ const path = '/rests/operations/data-provider:read-inventory-device-list';
+ const query = {
+ 'data-provider:input': {
+ 'filter': [],
+ 'sortorder': [],
+ 'pagination': {
+ 'size': 20,
+ 'page': 1,
},
- "data": InventoryType[]
- }
- }>(path, { method: "POST", body: JSON.stringify(body) });
+ },
+ };
- return inventoryTreeElement && inventoryTreeElement["data-provider:output"] && inventoryTreeElement["data-provider:output"].pagination && inventoryTreeElement["data-provider:output"].pagination.total >= 1 &&
- inventoryTreeElement["data-provider:output"].data && inventoryTreeElement["data-provider:output"].data[0] || undefined;
- // return await getElement(id);
+ const result = await requestRest<Result<any>>(path, { method: 'POST', body: JSON.stringify(query) });
+ return result && result['data-provider:output'] && result['data-provider:output'].data && result['data-provider:output'].data.map(ne => ({
+ nodeId: ne,
+ })) || null;
}
}
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx
index 284f70239..acd2c6216 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/views/dashboard.tsx
@@ -16,99 +16,93 @@
* ============LICENSE_END==========================================================================
*/
-import * as React from 'react';
+import React from 'react';
import { RouteComponentProps, withRouter } from 'react-router-dom';
-import connect, { IDispatcher, Connect } from "../../../../framework/src/flux/connect";
-import { IApplicationStoreState } from "../../../../framework/src/store/applicationStore";
-import { MaterialTable, MaterialTableCtorType, ColumnType } from "../../../../framework/src/components/material-table";
-import { AppBar, Tabs, Tab, MenuItem, Typography } from "@mui/material";
import Refresh from '@mui/icons-material/Refresh';
-import { PanelId } from "../models/panelId";
-import { setPanelAction } from "../actions/panelActions";
+import { AppBar, MenuItem, Tab, Tabs, Typography } from '@mui/material';
-
-import { createConnectedNetworkElementsProperties, createConnectedNetworkElementsActions } from "../handlers/connectedNetworkElementsHandler";
-
-import { NetworkElementConnection } from "../models/networkElementConnection";
-
-import { InventoryType } from '../models/inventory';
-
-import { createInventoryElementsProperties, createInventoryElementsActions } from "../handlers/inventoryElementsHandler";
import { NavigateToApplication } from '../../../../framework/src/actions/navigationActions';
+import { ColumnType, MaterialTable, MaterialTableCtorType } from '../../../../framework/src/components/material-table';
+import { connect, Connect, IDispatcher } from '../../../../framework/src/flux/connect';
+import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore';
+
+import { loadAllInventoryDeviceListAsync } from '../actions/inventoryDeviceListActions';
import { updateInventoryTreeAsyncAction } from '../actions/inventoryTreeActions';
+import { setPanelAction } from '../actions/panelActions';
import RefreshInventoryDialog, { RefreshInventoryDialogMode } from '../components/refreshInventoryDialog';
+import { createInventoryElementsActions, createInventoryElementsProperties } from '../handlers/inventoryElementsHandler';
+import { InventoryType } from '../models/inventory';
+import { InventoryDeviceListType } from '../models/inventoryDeviceListType';
+import { PanelId } from '../models/panelId';
const InventoryTable = MaterialTable as MaterialTableCtorType<InventoryType & { _id: string }>;
const mapProps = (state: IApplicationStoreState) => ({
- connectedNetworkElementsProperties: createConnectedNetworkElementsProperties(state),
panelId: state.inventory.currentOpenPanel,
inventoryElementsProperties: createInventoryElementsProperties(state),
- inventoryElements: state.inventory.inventoryElements
+ inventoryElements: state.inventory.inventoryElements,
+ inventoryDeviceList: state.inventory.inventoryDeviceList.inventoryDeviceList,
});
const mapDispatch = (dispatcher: IDispatcher) => ({
- connectedNetworkElementsActions: createConnectedNetworkElementsActions(dispatcher.dispatch),
switchActivePanel: (panelId: PanelId) => {
dispatcher.dispatch(setPanelAction(panelId));
},
inventoryElementsActions: createInventoryElementsActions(dispatcher.dispatch),
navigateToApplication: (applicationName: string, path?: string) => dispatcher.dispatch(new NavigateToApplication(applicationName, path)),
updateInventoryTree: (mountId: string, searchTerm?: string) => dispatcher.dispatch(updateInventoryTreeAsyncAction(mountId, searchTerm)),
+ getAllInventoryDeviceList: async () => {
+ await dispatcher.dispatch(loadAllInventoryDeviceListAsync);
+ },
});
let treeViewInitialSorted = false;
let inventoryInitialSorted = false;
-const ConnectedElementTable = MaterialTable as MaterialTableCtorType<NetworkElementConnection>;
+const InventoryDeviceListTable = MaterialTable as MaterialTableCtorType<InventoryDeviceListType>;
type DashboardComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDispatch>;
type DashboardComponentState = {
- refreshInventoryEditorMode: RefreshInventoryDialogMode
-}
+ refreshInventoryEditorMode: RefreshInventoryDialogMode;
+};
class DashboardSelectorComponent extends React.Component<DashboardComponentProps, DashboardComponentState> {
constructor(props: DashboardComponentProps) {
super(props);
this.state = {
- refreshInventoryEditorMode: RefreshInventoryDialogMode.None
+ refreshInventoryEditorMode: RefreshInventoryDialogMode.None,
};
}
private onHandleTabChange = (event: React.SyntheticEvent, newValue: PanelId) => {
this.onTogglePanel(newValue);
- }
+ };
private onTogglePanel = (panelId: PanelId) => {
const nextActivePanel = panelId;
this.props.switchActivePanel(nextActivePanel);
switch (nextActivePanel) {
- case 'InventoryElementsTable':
+ case 'Equipment':
if (!inventoryInitialSorted) {
- this.props.inventoryElementsActions.onHandleExplicitRequestSort("nodeId", "asc");
+ this.props.inventoryElementsActions.onHandleExplicitRequestSort('nodeId', 'asc');
inventoryInitialSorted = true;
} else {
this.props.inventoryElementsActions.onRefresh();
}
break;
- case 'TreeviewTable':
- if (!treeViewInitialSorted) {
- this.props.connectedNetworkElementsActions.onHandleExplicitRequestSort("nodeId", "asc");
- treeViewInitialSorted = true;
- } else {
- this.props.connectedNetworkElementsActions.onRefresh();
- }
+ case 'TreeView':
+ this.props.getAllInventoryDeviceList();
break;
case null:
// do nothing if all panels are closed
break;
default:
- console.warn("Unknown nextActivePanel [" + nextActivePanel + "] in connectView");
+ console.warn('Unknown nextActivePanel [' + nextActivePanel + '] in connectView');
break;
}
@@ -116,47 +110,47 @@ class DashboardSelectorComponent extends React.Component<DashboardComponentProps
getContextMenu = (rowData: InventoryType) => {
return [
- <MenuItem aria-label={"inventory-button"} onClick={event => { this.props.updateInventoryTree(rowData.nodeId, rowData.uuid); this.props.navigateToApplication("inventory", rowData.nodeId) }}><Typography>View in Treeview</Typography></MenuItem>,
+ <MenuItem aria-label={'inventory-button'} onClick={() => { this.props.updateInventoryTree(rowData.nodeId, rowData.uuid); this.props.navigateToApplication('inventory', rowData.nodeId); }}><Typography>View in Treeview</Typography></MenuItem>,
];
- }
+ };
render() {
const refreshInventoryAction = {
icon: Refresh, tooltip: 'Refresh Inventory', ariaLabel: 'refresh', onClick: () => {
this.setState({
- refreshInventoryEditorMode: RefreshInventoryDialogMode.RefreshInventoryTable
+ refreshInventoryEditorMode: RefreshInventoryDialogMode.RefreshInventoryTable,
});
- }
+ },
};
const { panelId: activePanelId } = this.props;
return (
<>
<AppBar enableColorOnDark position="static">
<Tabs indicatorColor="secondary" textColor="inherit" value={activePanelId} onChange={this.onHandleTabChange} aria-label="inventory-app-tabs">
- <Tab label="Table View" value="InventoryElementsTable" aria-label="table-tab" />
- <Tab label="Tree view" value="TreeviewTable" aria-label="treeview-tab" />
+ <Tab label="Equipment" value="Equipment" aria-label="equipment-tab" />
+ <Tab label="Tree View" value="TreeView" aria-label="treeview-tab" />
</Tabs>
</AppBar>
{
- activePanelId === "InventoryElementsTable" &&
+ activePanelId === 'Equipment' &&
<>
- <InventoryTable stickyHeader title="Inventory" idProperty="_id" tableId="inventory-table" customActionButtons={[refreshInventoryAction]} columns={[
- { property: "nodeId", title: "Node Name" },
- { property: "manufacturerIdentifier", title: "Manufacturer" },
- { property: "parentUuid", title: "Parent" },
- { property: "uuid", title: "Name" },
- { property: "serial", title: "Serial" },
- { property: "version", title: "Version" },
- { property: "date", title: "Date" },
- { property: "description", title: "Description" },
- { property: "partTypeId", title: "Part Type Id" },
- { property: "modelIdentifier", title: "Model Identifier" },
- { property: "typeName", title: "Type" },
- { property: "treeLevel", title: "Containment Level" },
+ <InventoryTable stickyHeader idProperty="_id" tableId="inventory-table" customActionButtons={[refreshInventoryAction]} columns={[
+ { property: 'nodeId', title: 'Node Name' },
+ { property: 'manufacturerIdentifier', title: 'Manufacturer' },
+ { property: 'parentUuid', title: 'Parent' },
+ { property: 'uuid', title: 'Name' },
+ { property: 'serial', title: 'Serial' },
+ { property: 'version', title: 'Version' },
+ { property: 'date', title: 'Date' },
+ { property: 'description', title: 'Description' },
+ { property: 'partTypeId', title: 'Part Type Id' },
+ { property: 'modelIdentifier', title: 'Model Identifier' },
+ { property: 'typeName', title: 'Type' },
+ { property: 'treeLevel', title: 'Containment Level' },
]} {...this.props.inventoryElementsActions} {...this.props.inventoryElementsProperties}
createContextMenu={rowData => {
@@ -171,22 +165,20 @@ class DashboardSelectorComponent extends React.Component<DashboardComponentProps
}
{
- activePanelId === "TreeviewTable" &&
-
- <ConnectedElementTable stickyHeader tableId="treeview-networkelement-selection-table"
- onHandleClick={(e, row) => {
- this.props.navigateToApplication("inventory", row.nodeId);
- this.props.updateInventoryTree(row.nodeId, '*');
- }}
- columns={[
- { property: "nodeId", title: "Node Name", type: ColumnType.text },
- { property: "isRequired", title: "Required", type: ColumnType.boolean },
- { property: "host", title: "Host", type: ColumnType.text },
- { property: "port", title: "Port", type: ColumnType.numeric },
- { property: "coreModelCapability", title: "Core Model", type: ColumnType.text },
- { property: "deviceType", title: "Type", type: ColumnType.text },
- ]} idProperty="id" {...this.props.connectedNetworkElementsActions} {...this.props.connectedNetworkElementsProperties} asynchronus >
- </ConnectedElementTable>
+ activePanelId === 'TreeView' &&
+ <>
+ <InventoryDeviceListTable stickyHeader tableId="treeview-networkelement-selection-table"
+ defaultSortColumn={'nodeId'} defaultSortOrder="asc"
+ onHandleClick={(e, row) => {
+ this.props.navigateToApplication('inventory', row.nodeId);
+ this.props.updateInventoryTree(row.nodeId, '*');
+ }}
+ rows={this.props.inventoryDeviceList} asynchronus
+ columns={[
+ { property: 'nodeId', title: 'Node Name', type: ColumnType.text },
+ ]} idProperty="nodeId" >
+ </InventoryDeviceListTable>
+ </>
}
</>
);
@@ -194,15 +186,14 @@ class DashboardSelectorComponent extends React.Component<DashboardComponentProps
private onCloseRefreshInventoryDialog = () => {
this.setState({
- refreshInventoryEditorMode: RefreshInventoryDialogMode.None
+ refreshInventoryEditorMode: RefreshInventoryDialogMode.None,
});
- }
- componentDidMount() {
+ };
+ componentDidMount() {
if (this.props.panelId === null) { //set default tab if none is set
- this.onTogglePanel("InventoryElementsTable");
+ this.onTogglePanel('Equipment');
}
-
}
}
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx
index 252663935..8d47ec3d9 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/views/detail.tsx
@@ -15,20 +15,19 @@
* the License.
* ============LICENSE_END==========================================================================
*/
-import * as React from "react";
-import { withRouter, RouteComponentProps } from 'react-router-dom';
+import React from 'react';
+import { RouteComponentProps, withRouter } from 'react-router-dom';
import Button from '@mui/material/Button';
import { Theme } from '@mui/material/styles'; // infra for styling
-
import { WithStyles } from '@mui/styles';
-import withStyles from '@mui/styles/withStyles';
import createStyles from '@mui/styles/createStyles';
+import withStyles from '@mui/styles/withStyles';
const styles = (theme: Theme) => createStyles({
warnButton: {
- backgroundColor: theme.palette.primary.dark
- }
+ backgroundColor: theme.palette.primary.dark,
+ },
});
type DetailProps = RouteComponentProps<{ id: string }> & WithStyles<typeof styles>;
@@ -37,8 +36,8 @@ export const Detail = withStyles( styles )( withRouter( (props: DetailProps) =>
<div>
<h1>Detail {props.match.params.id}</h1>
<p>This are the information about {props.staticContext}.</p>
- <Button color={"secondary"} variant={"contained"}>Start</Button>
- <Button color="inherit" className={ props.classes.warnButton } variant={"contained"}>Stop</Button>
+ <Button color={'secondary'} variant={'contained'}>Start</Button>
+ <Button color="inherit" className={ props.classes.warnButton } variant={'contained'}>Stop</Button>
</div>
)));
diff --git a/sdnr/wt/odlux/apps/inventoryApp/src/views/treeview.tsx b/sdnr/wt/odlux/apps/inventoryApp/src/views/treeview.tsx
index b0e962daa..954c074c1 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/src/views/treeview.tsx
+++ b/sdnr/wt/odlux/apps/inventoryApp/src/views/treeview.tsx
@@ -15,42 +15,38 @@
* the License.
* ============LICENSE_END==========================================================================
*/
-import * as React from "react";
-import { Theme } from '@mui/material/styles';
+import React from 'react';
+import Breadcrumbs from '@mui/material/Breadcrumbs';
+import Link from '@mui/material/Link';
+import { Theme } from '@mui/material/styles';
import { WithStyles } from '@mui/styles';
-import withStyles from '@mui/styles/withStyles';
import createStyles from '@mui/styles/createStyles';
-
+import withStyles from '@mui/styles/withStyles';
+import { RouteComponentProps } from 'react-router-dom';
+import { SearchMode, TreeView, TreeViewCtorType } from '../../../../framework/src/components/material-ui/treeView';
import { renderObject } from '../../../../framework/src/components/objectDump';
import { Connect, connect, IDispatcher } from '../../../../framework/src/flux/connect';
-import { TreeView, TreeViewCtorType, SearchMode } from '../../../../framework/src/components/material-ui/treeView';
+import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore';
-import { IApplicationStoreState } from "../../../../framework/src/store/applicationStore";
-
-import Breadcrumbs from '@mui/material/Breadcrumbs';
-import Link from '@mui/material/Link';
-
-import { updateInventoryTreeAsyncAction, selectInventoryNodeAsyncAction, UpdateSelectedNodeAction, UpdateExpandedNodesAction, setSearchTermAction } from "../actions/inventoryTreeActions";
-import { TreeDemoItem } from "../models/inventory";
-
-import { RouteComponentProps } from 'react-router-dom';
+import { selectInventoryNodeAsyncAction, setSearchTermAction, UpdateExpandedNodesAction, updateInventoryTreeAsyncAction, UpdateSelectedNodeAction } from '../actions/inventoryTreeActions';
+import { TreeDemoItem } from '../models/inventory';
const styles = (theme: Theme) => createStyles({
root: {
- flex: "1 0 0%",
- display: "flex",
- flexDirection: "row",
+ flex: '1 0 0%',
+ display: 'flex',
+ flexDirection: 'row',
},
tree: {
- flex: "1 0 0%",
- minWidth: "250px",
- padding: `0px ${theme.spacing(1)}`
+ wordWrap: 'break-word',
+ minWidth: '250px',
+ padding: `0px ${theme.spacing(1)}`,
},
details: {
- flex: "5 0 0%",
- padding: `0px ${theme.spacing(1)}`
- }
+ flex: '5 0 0%',
+ padding: `0px ${theme.spacing(1)}`,
+ },
});
const mapProps = (state: IApplicationStoreState) => ({
@@ -68,19 +64,19 @@ const mapDispatch = (dispatcher: IDispatcher) => ({
setSearchTerm: (searchTerm: string) => dispatcher.dispatch(setSearchTermAction(searchTerm)),
});
-const propsChache = Symbol("PropsCache");
+const propsChache = Symbol('PropsCache');
const InventoryTree = TreeView as any as TreeViewCtorType<string>;
-type TreeviewComponentProps = RouteComponentProps<{ mountId: string }> & WithStyles<typeof styles> & Connect<typeof mapProps, typeof mapDispatch>
+type TreeviewComponentProps = RouteComponentProps<{ mountId: string }> & WithStyles<typeof styles> & Connect<typeof mapProps, typeof mapDispatch>;
type TreeviewComponentState = {
[propsChache]: {
rootNodes?: TreeDemoItem[];
};
rootNodes: TreeDemoItem[];
-}
+};
class DashboardComponent extends React.Component<TreeviewComponentProps, TreeviewComponentState> {
@@ -96,14 +92,15 @@ class DashboardComponent extends React.Component<TreeviewComponentProps, Treevie
static getDerivedStateFromProps(props: TreeviewComponentProps, state: TreeviewComponentState) {
if (state[propsChache].rootNodes != props.rootNodes) {
- state = { ...state, rootNodes: props.rootNodes }
+ // eslint-disable-next-line no-param-reassign
+ state = { ...state, rootNodes: props.rootNodes };
}
return state;
}
render() {
const { classes, updateInventoryTree, updateExpendedNodes, expendedItems, selectedNode, selectTreeNode, searchTerm, match: { params: { mountId } } } = this.props;
- const scrollbar = { overflow: "auto", paddingRight: "20px" }
+ const scrollbar = { overflow: 'auto', paddingRight: '20px' };
let filteredDashboardPath = `/inventory/dashboard/${this.props.match.params.mountId}`;
let basePath = `/inventory/${this.props.match.params.mountId}`;
@@ -128,6 +125,7 @@ class DashboardComponent extends React.Component<TreeviewComponentProps, Treevie
<br />
<div style={scrollbar} className={classes.root}>
<InventoryTree className={classes.tree} items={this.state.rootNodes} enableSearchBar initialSearchTerm={searchTerm} searchMode={SearchMode.OnEnter} searchTerm={searchTerm}
+ // eslint-disable-next-line @typescript-eslint/no-shadow
onSearch={(searchTerm) => updateInventoryTree(mountId, searchTerm)} expandedItems={expendedItems} onFolderClick={(item) => {
const indexOfItemToToggle = expendedItems.indexOf(item);
if (indexOfItemToToggle === -1) {
@@ -141,20 +139,15 @@ class DashboardComponent extends React.Component<TreeviewComponentProps, Treevie
}}
onItemClick={(elm) => selectTreeNode(elm.value)} />
<div className={classes.details}>{
- selectedNode && renderObject(selectedNode, "tree-view") || null
+ selectedNode && renderObject(selectedNode, 'tree-view') || null
}</div>
</div>
</div>
);
}
- componentDidMount() {
- const { updateInventoryTree, searchTerm, match: { params: { mountId } } } = this.props;
- updateInventoryTree(mountId, searchTerm);
- }
-
componentWillUnmount() {
- this.props.setSearchTerm("*");
+ this.props.setSearchTerm('*');
}
}
diff --git a/sdnr/wt/odlux/apps/inventoryApp/tsconfig.json b/sdnr/wt/odlux/apps/inventoryApp/tsconfig.json
index a66b5d828..ca65092e0 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/tsconfig.json
+++ b/sdnr/wt/odlux/apps/inventoryApp/tsconfig.json
@@ -4,7 +4,7 @@
"outDir": "./dist",
"sourceMap": true,
"forceConsistentCasingInFileNames": true,
- "allowSyntheticDefaultImports": false,
+ "allowSyntheticDefaultImports": true,
"allowUnreachableCode": false,
"allowUnusedLabels": false,
"noFallthroughCasesInSwitch": true,
diff --git a/sdnr/wt/odlux/apps/inventoryApp/webpack.config.js b/sdnr/wt/odlux/apps/inventoryApp/webpack.config.js
index 403cc53f5..6a780560d 100644
--- a/sdnr/wt/odlux/apps/inventoryApp/webpack.config.js
+++ b/sdnr/wt/odlux/apps/inventoryApp/webpack.config.js
@@ -57,6 +57,16 @@ module.exports = (env) => {
use: [{
loader: "babel-loader"
}]
+ },{
+ //don't minify images
+ test: /\.(png|gif|jpg|svg)$/,
+ use: [{
+ loader: 'url-loader',
+ options: {
+ limit: 10,
+ name: './images/[name].[ext]'
+ }
+ }]
}]
},
@@ -127,37 +137,37 @@ module.exports = (env) => {
},
proxy: {
"/oauth2/": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
secure: false
},
"/database/": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
secure: false
},
"/restconf/": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
secure: false
},
"/rests/": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
secure: false
},
"/help/": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
secure: false
},
"/tree/": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
secure: false
},
"/websocket": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
ws: true,
changeOrigin: true,
secure: false
},
"/yang-schema": {
- target: "http://localhost:8181",
+ target: "http://sdnc-web:8080",
ws: true,
changeOrigin: true,
secure: false