diff options
Diffstat (limited to 'sdnr/wt/odlux/apps/helpApp')
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/package.json | 28 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/pom.xml | 56 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/components/helpStatus.tsx | 4 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/components/subMenuEntry.tsx | 54 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/components/tocEntry.tsx | 82 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/handlers/helpAppRootHandler.ts | 4 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/index.html | 18 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/plugin.tsx | 11 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/services/helpService.ts | 8 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/views/helpApplication.tsx | 2 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/src/views/helpTocApp.tsx | 55 | ||||
-rw-r--r-- | sdnr/wt/odlux/apps/helpApp/webpack.config.js | 10 |
12 files changed, 206 insertions, 126 deletions
diff --git a/sdnr/wt/odlux/apps/helpApp/package.json b/sdnr/wt/odlux/apps/helpApp/package.json index 0445046a8..1f106ab65 100644 --- a/sdnr/wt/odlux/apps/helpApp/package.json +++ b/sdnr/wt/odlux/apps/helpApp/package.json @@ -20,26 +20,26 @@ ], "author": "Matthias Fischer", "license": "Apache-2.0", - "dependencies": { - "@odlux/framework": "*", - "marked" : "0.6.0", - "@types/marked": "0.6.0", - "highlight.js" : "9.13.1", - "@types/highlight.js": "9.12.3", - "github-markdown-css": "2.10.0" - }, + "dependencies": { + "@odlux/framework": "*", + "marked": "0.6.0", + "@types/marked": "0.6.0", + "highlight.js": "9.13.1", + "@types/highlight.js": "9.12.3", + "github-markdown-css": "2.10.0" + }, "peerDependencies": { - "@types/react": "16.4.14", - "@types/react-dom": "16.0.8", + "@types/react": "16.9.11", + "@types/react-dom": "16.9.4", "@types/react-router-dom": "4.3.1", - "@material-ui/core": "3.8.3", - "@material-ui/icons": "3.0.2", + "@material-ui/core": "4.6.1", + "@material-ui/icons": "4.5.1", "@types/classnames": "2.2.6", "@types/flux": "3.1.8", "@types/jquery": "3.3.10", "jquery": "3.3.1", - "react": "16.5.2", - "react-dom": "16.5.2", + "react": "16.11.0", + "react-dom": "16.11.0", "react-router-dom": "4.3.1" } }
\ No newline at end of file diff --git a/sdnr/wt/odlux/apps/helpApp/pom.xml b/sdnr/wt/odlux/apps/helpApp/pom.xml index b88c233c3..8f8b59a9a 100644 --- a/sdnr/wt/odlux/apps/helpApp/pom.xml +++ b/sdnr/wt/odlux/apps/helpApp/pom.xml @@ -1,5 +1,6 @@ <?xml version="1.0" encoding="UTF-8"?> <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> <parent> <groupId>org.onap.ccsdk.parent</groupId> @@ -7,18 +8,20 @@ <version>1.5.1-SNAPSHOT</version> <relativePath/> </parent> - <modelVersion>4.0.0</modelVersion> + <groupId>org.onap.ccsdk.features.sdnr.wt</groupId> <artifactId>sdnr-wt-odlux-app-helpApp</artifactId> <version>0.7.0-SNAPSHOT</version> <packaging>bundle</packaging> - <name>sdnr-wt-odlux-app-helpApp</name> + + <name>ccsdk-features :: ${project.artifactId}</name> <licenses> <license> <name>Apache License, Version 2.0</name> <url>http://www.apache.org/licenses/LICENSE-2.0</url> </license> </licenses> + <dependencies> <dependency> <groupId>${project.groupId}</groupId> @@ -37,8 +40,21 @@ <scope>test</scope> </dependency> </dependencies> + <build> <sourceDirectory>src2/main/java</sourceDirectory> + <resources> + <resource> + <directory>dist</directory> + <targetPath>odlux</targetPath> + </resource> + <resource> + <directory>src2/main/resources</directory> + </resource> + <resource> + <directory>src2/test/resources</directory> + </resource> + </resources> <plugins> <plugin> <artifactId>maven-clean-plugin</artifactId> @@ -61,10 +77,10 @@ <followSymlinks>false</followSymlinks> </fileset> <!-- eclipse bug build bin folder in basedir --> - <fileset> - <directory>bin</directory> - <followSymlinks>false</followSymlinks> - </fileset> + <fileset> + <directory>bin</directory> + <followSymlinks>false</followSymlinks> + </fileset> </filesets> </configuration> </plugin> @@ -87,7 +103,7 @@ </executions> </plugin> <plugin> - <groupId>de.jacksitlab</groupId> + <groupId>de.jacks-it-lab</groupId> <artifactId>frontend-maven-plugin</artifactId> <version>1.7.1</version> <executions> @@ -99,8 +115,8 @@ <!-- optional: default phase is "generate-resources" --> <phase>initialize</phase> <configuration> - <nodeVersion>v8.10.0</nodeVersion> - <yarnVersion>v1.12.3</yarnVersion> + <nodeVersion>v10.16.3</nodeVersion> + <yarnVersion>v1.19.0</yarnVersion> </configuration> </execution> <execution> @@ -130,27 +146,5 @@ </configuration> </plugin> </plugins> - <resources> - <resource> - <directory>dist</directory> - <targetPath>odlux</targetPath> - </resource> - <resource> - <directory>src2/main/resources</directory> - </resource> - <resource> - <directory>src2/test/resources</directory> - </resource> - </resources> </build> - <pluginRepositories> - <pluginRepository> - <id>highstreet repo</id> - <url>https://cloud-highstreet-technologies.com/mvn/</url> - <snapshots> - <enabled>true</enabled> - <updatePolicy>always</updatePolicy> - </snapshots> - </pluginRepository> - </pluginRepositories> </project> diff --git a/sdnr/wt/odlux/apps/helpApp/src/components/helpStatus.tsx b/sdnr/wt/odlux/apps/helpApp/src/components/helpStatus.tsx index c4a531837..140935715 100644 --- a/sdnr/wt/odlux/apps/helpApp/src/components/helpStatus.tsx +++ b/sdnr/wt/odlux/apps/helpApp/src/components/helpStatus.tsx @@ -57,7 +57,7 @@ class HelpStatusComponent extends React.Component<HelpStatusComponentProps> { const { classes, history, toc, appId } = this.props; const rootNode = toc && toc.find(t => t.id === "sdnr"); const helpNode = appId - ? rootNode && rootNode.nodes && rootNode.nodes.find(n => n.id === appId || n.id === appId+"App") + ? rootNode && rootNode.nodes && rootNode.nodes.find(n => n.id === appId || n.id === appId + "App") : rootNode; return helpNode ? ( @@ -76,5 +76,5 @@ class HelpStatusComponent extends React.Component<HelpStatusComponentProps> { } -export const HelpStatus = withRouter(withStyles(styles)(connect(mapProps)(HelpStatusComponent))); +export const HelpStatus = withRouter(withStyles(styles)(connect(mapProps)(HelpStatusComponent) as any) as any); export default HelpStatus;
\ No newline at end of file diff --git a/sdnr/wt/odlux/apps/helpApp/src/components/subMenuEntry.tsx b/sdnr/wt/odlux/apps/helpApp/src/components/subMenuEntry.tsx deleted file mode 100644 index e4e37290c..000000000 --- a/sdnr/wt/odlux/apps/helpApp/src/components/subMenuEntry.tsx +++ /dev/null @@ -1,54 +0,0 @@ -/** - * ============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 * as React from 'react'; - -import { IApplicationStoreState } from "../../../../framework/src/store/applicationStore"; -import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; -import { TreeView, TreeViewCtorType } from '../../../../framework/src/components/material-ui/treeView'; - -import { ListItemText } from '@material-ui/core'; - -import { NavigateToApplication } from '../../../../framework/src/actions/navigationActions'; - -import { TocTreeNode } from '../models/tocNode'; - -const TocTree = TreeView as any as TreeViewCtorType<TocTreeNode>; - -const mapProps = (state: IApplicationStoreState) => ({ - helpToc: state.help.toc, - helpBusy: state.help.busy -}); - -const mapDisp = (dispatcher: IDispatcher) => ({ - requestDocument: (node: TocTreeNode) => dispatcher.dispatch(new NavigateToApplication("help", node.uri)) -}); - -const SubMenuEntryComponent: React.SFC<Connect<typeof mapProps, typeof mapDisp>> = (props) => { - return props.helpToc - ? ( - <TocTree items={ props.helpToc } contentProperty={ "label" } childrenProperty={ "nodes" } depthOffset={ 1 } - useFolderIcons={ false } enableSearchBar={ false } onItemClick={ props.requestDocument } /> - ) - : ( - <ListItemText >Loading ...</ListItemText> - ) -}; - -export const SubMenuEntry = connect(mapProps, mapDisp)(SubMenuEntryComponent); -export default SubMenuEntry; - diff --git a/sdnr/wt/odlux/apps/helpApp/src/components/tocEntry.tsx b/sdnr/wt/odlux/apps/helpApp/src/components/tocEntry.tsx new file mode 100644 index 000000000..fc7b8dff5 --- /dev/null +++ b/sdnr/wt/odlux/apps/helpApp/src/components/tocEntry.tsx @@ -0,0 +1,82 @@ +/** + * ============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 * as React from "react" +import { TocTreeNode } from "../models/tocNode" +import { Typography, Link, makeStyles, Theme, createStyles } from "@material-ui/core" + +const useStyles = makeStyles((theme: Theme) => + createStyles({ + link: { + color: "blue", + }, + sublink: { + margin: theme.spacing(1), + color: "blue", + }, + container: { + display: "flex", + flexDirection: "row", + flexWrap: "wrap", + } + }), +); + +type tocEntryProps = { + label: string, + overviewUri: string, + nodes?: TocTreeNode[], + loadDocument(uri: string): any +} + +const TocEntry: React.FunctionComponent<tocEntryProps> = (props) => { + const classes = useStyles(); + const areNodesEmpty = !props.nodes || props.nodes.length === 0 + + const navigate = (event: React.SyntheticEvent, uri: string) => { + event.preventDefault(); + event.stopPropagation(); + props.loadDocument(uri); + } + + return (<div> + { + areNodesEmpty ? <Typography variant="h6"> + <Link onClick={(event: any) => navigate(event, props.overviewUri)} className={classes.link}> {props.label}</Link> + </Typography> : + <> + <Typography variant="h6"> + {props.label} + </Typography> + <div className={classes.container}> + <Typography variant="body1"> + <Link onClick={(event: any) => navigate(event, props.overviewUri)} className={classes.sublink}>Overview</Link> + </Typography> + {props.nodes !== undefined && props.nodes.map((item, index) => + <Typography variant="body1" key={index + 'x' + item.id}> + <Link onClick={(event: any) => navigate(event, item.uri)} className={classes.sublink}>{item.label}</Link> + </Typography> + )} + </div> + </> + } + </div >) +} + + +export default TocEntry;
\ No newline at end of file diff --git a/sdnr/wt/odlux/apps/helpApp/src/handlers/helpAppRootHandler.ts b/sdnr/wt/odlux/apps/helpApp/src/handlers/helpAppRootHandler.ts index 9c58238f8..cc6a98488 100644 --- a/sdnr/wt/odlux/apps/helpApp/src/handlers/helpAppRootHandler.ts +++ b/sdnr/wt/odlux/apps/helpApp/src/handlers/helpAppRootHandler.ts @@ -35,14 +35,14 @@ declare module '../../../../framework/src/store/applicationStore' { } } -const helpAppStoreStateInit: IHelpAppStoreState = { +const helpAppStoreStatcurrentPatheInit: IHelpAppStoreState = { busy: false, toc: undefined, content: undefined, currentPath: undefined }; -export const helpAppRootHandler: IActionHandler<IHelpAppStoreState> = (state = helpAppStoreStateInit, action) => { +export const helpAppRootHandler: IActionHandler<IHelpAppStoreState> = (state = helpAppStoreStatcurrentPatheInit, action) => { if (action instanceof LoadTocAction) { state = { ...state, diff --git a/sdnr/wt/odlux/apps/helpApp/src/index.html b/sdnr/wt/odlux/apps/helpApp/src/index.html index e76109fd8..2344708c8 100644 --- a/sdnr/wt/odlux/apps/helpApp/src/index.html +++ b/sdnr/wt/odlux/apps/helpApp/src/index.html @@ -14,15 +14,15 @@ <script type="text/javascript" src="./require.js"></script> <script type="text/javascript" src="./config.js"></script> <script> - // run the application - require(["app", "connectApp", "faultApp", "maintenanceApp", "configurationApp", "helpApp"], function (app, connectApp, faultApp, maintenanceApp, configurationApp, helpApp) { - connectApp.register(); - faultApp.register(); - configurationApp.register(); - maintenanceApp.register(); - helpApp.register(); - app("./app.tsx").runApplication(); - }); + // run the application + require(["app", "helpApp"], function (app, helpApp) { + //connectApp.register(); + //faultApp.register(); + //configurationApp.register(); + //maintenanceApp.register(); + helpApp.register(); + app("./app.tsx").runApplication(); + }); </script> </body> diff --git a/sdnr/wt/odlux/apps/helpApp/src/plugin.tsx b/sdnr/wt/odlux/apps/helpApp/src/plugin.tsx index 77c2992c4..50a264b15 100644 --- a/sdnr/wt/odlux/apps/helpApp/src/plugin.tsx +++ b/sdnr/wt/odlux/apps/helpApp/src/plugin.tsx @@ -30,10 +30,10 @@ import { requestTocAsyncAction, requestDocumentAsyncActionCreator } from "./acti import { helpAppRootHandler } from './handlers/helpAppRootHandler'; import { HelpApplication } from './views/helpApplication'; -import { SubMenuEntry } from "./components/subMenuEntry"; import { HelpStatus } from "./components/helpStatus"; import '!style-loader!css-loader!highlight.js/styles/default.css'; +import HelpTocApp from "./views/helpTocApp"; const mapProps = (state: IApplicationStoreState) => ({ @@ -48,6 +48,7 @@ const mapDisp = (dispatcher: IDispatcher) => ({ let currentHelpPath: string | undefined = undefined; const HelpApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComponentProps<{ '0'?: string }> & Connect<typeof mapProps, typeof mapDisp>) => { + if (currentHelpPath !== props.match.params["0"]) { // route parameter has changed currentHelpPath = props.match.params["0"] || undefined; @@ -58,6 +59,7 @@ const HelpApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComp } }); } + return ( <HelpApplication /> ) @@ -65,8 +67,9 @@ const HelpApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComp const App = withRouter((props: RouteComponentProps) => ( <Switch> - <Route path={ `${ props.match.path }/*` } component={ HelpApplicationRouteAdapter } /> - <Redirect to={ `${ props.match.path }` } /> + <Route exact path={`${props.match.path}/`} component={HelpTocApp} /> + <Route path={`${props.match.path}/*`} component={HelpApplicationRouteAdapter} /> + <Route path={`${props.match.path}`} component={HelpTocApp} /> </Switch> )); @@ -78,7 +81,7 @@ export async function register() { rootActionHandler: helpAppRootHandler, statusBarElement: HelpStatus, menuEntry: "Help", - subMenuEntry: SubMenuEntry + //subMenuEntry: SubMenuEntry }); // start the initial toc request after the application store is initalized diff --git a/sdnr/wt/odlux/apps/helpApp/src/services/helpService.ts b/sdnr/wt/odlux/apps/helpApp/src/services/helpService.ts index 43c483fe8..c8b247832 100644 --- a/sdnr/wt/odlux/apps/helpApp/src/services/helpService.ts +++ b/sdnr/wt/odlux/apps/helpApp/src/services/helpService.ts @@ -28,7 +28,7 @@ class HelpService { if (this.documents[path]) return Promise.resolve(this.documents[path]); // request the document - const result = await requestRest<string>(`/help/${ path }`.replace(/\/{2,}/i, '/')); + const result = await requestRest<string>(`/help/${path}`.replace(/\/{2,}/i, '/')); if (result) { this.documents[path] = result; } @@ -41,9 +41,9 @@ class HelpService { // request the table of contents const result = await requestRest<TocNodeCollection>('/help/?meta', undefined, false); - if (result !== false) { + if (result !== null) { const mapNodesCollection = (col: TocNodeCollection): TocTreeNode[] => { - return Object.keys(col).reduce <TocTreeNode[]>((acc, key) => { + return Object.keys(col).reduce<TocTreeNode[]>((acc, key) => { const current = col[key]; acc.push({ id: key, @@ -57,7 +57,7 @@ class HelpService { this.tocNodeCollection = result && mapNodesCollection(result); } - return this.tocNodeCollection || null; + return this.tocNodeCollection || null; } } diff --git a/sdnr/wt/odlux/apps/helpApp/src/views/helpApplication.tsx b/sdnr/wt/odlux/apps/helpApp/src/views/helpApplication.tsx index 6cc89fb85..b4de26d50 100644 --- a/sdnr/wt/odlux/apps/helpApp/src/views/helpApplication.tsx +++ b/sdnr/wt/odlux/apps/helpApp/src/views/helpApplication.tsx @@ -39,7 +39,7 @@ class HelpApplicationComponent extends React.Component<HelpApplicationComponentP /** * Initializes a new instance. */ - constructor (props: HelpApplicationComponentProps) { + constructor(props: HelpApplicationComponentProps) { super(props); this.renderer = new marked.Renderer(); diff --git a/sdnr/wt/odlux/apps/helpApp/src/views/helpTocApp.tsx b/sdnr/wt/odlux/apps/helpApp/src/views/helpTocApp.tsx new file mode 100644 index 000000000..65d4609e2 --- /dev/null +++ b/sdnr/wt/odlux/apps/helpApp/src/views/helpTocApp.tsx @@ -0,0 +1,55 @@ +/** + * ============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 connect, { Connect, IDispatcher } from "../../../../framework/src/flux/connect"; + +import { NavigateToApplication } from "../../../../framework/src/actions/navigationActions"; +import * as React from 'react' +import { FunctionComponent } from "react"; +import { IApplicationStoreState } from "../../../../framework/src/store/applicationStore"; +import TocEntry from "../components/tocEntry"; +import { Typography } from "@material-ui/core"; + +const mapProps = (state: IApplicationStoreState) => ({ + helpToc: state.help.toc, +}) + +const mapDisp = (dispatcher: IDispatcher) => ({ + requestDocument: (uri: string) => dispatcher.dispatch(new NavigateToApplication("help", uri)) +}); + +const HelpTocComponent: FunctionComponent<Connect<typeof mapProps, typeof mapDisp>> = (props) => { + + return ( + <div> + <Typography style={{ marginBottom: '30px' }} variant="h5"> + Help & FAQ + </Typography> + <Typography style={{ marginBottom: '30px' }} variant="body1"> + On our Help site, you can find general information about SDN-R, detailed information about our applications, frequently asked questions and a list of used abbreviations. + </Typography> + { + props.helpToc && props.helpToc.map((item, index) => <TocEntry key={index} overviewUri={item.uri} nodes={item.nodes} label={item.label} loadDocument={props.requestDocument} />) + } + </div> + ) +} + +export const HelpTocApp = connect(mapProps, mapDisp)(HelpTocComponent) + +export default HelpTocApp;
\ No newline at end of file diff --git a/sdnr/wt/odlux/apps/helpApp/webpack.config.js b/sdnr/wt/odlux/apps/helpApp/webpack.config.js index 3a56d8bea..14ab528a7 100644 --- a/sdnr/wt/odlux/apps/helpApp/webpack.config.js +++ b/sdnr/wt/odlux/apps/helpApp/webpack.config.js @@ -143,23 +143,23 @@ module.exports = (env) => { }, proxy: { "/oauth2/": { - target: "http://localhost:3000", + target: "http://10.20.6.29:48181", secure: false }, "/database/": { - target: "http://localhost:3000", + target: "http://10.20.6.29:48181", secure: false }, "/restconf/": { - target: "http://localhost:3000", + target: "http://10.20.6.29:48181", secure: false }, "/help/": { - target: "http://localhost:3000", + target: "http://10.20.6.29:48181", secure: false }, "/websocket/": { - target: "http://localhost:3000", + target: "http://10.20.6.29:48181", ws: true, changeOrigin: true, secure: false |