6 files changed, 118 insertions, 0 deletions
diff --git a/sdnr/wt/odlux/apps/apiDemo/src/actions/modulesSuccess.ts b/sdnr/wt/odlux/apps/apiDemo/src/actions/modulesSuccess.ts
new file mode 100644
index 000000000..206ce8ad3
--- /dev/null
+++ b/sdnr/wt/odlux/apps/apiDemo/src/actions/modulesSuccess.ts
@@ -0,0 +1,8 @@
+import { Action } from '../../../../framework/src/flux/action';
+import { ModuleResult } from '../models/module';
+export class ModulesRequestSuccess extends Action {
+  constructor(public result: ModuleResult) {
+    super();
+  }
+}
+// error will be handled by the framework
+\ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/apiDemo/src/handlers/apiDemoRootHandler.ts b/sdnr/wt/odlux/apps/apiDemo/src/handlers/apiDemoRootHandler.ts
new file mode 100644
index 000000000..ec4187659
--- /dev/null
+++ b/sdnr/wt/odlux/apps/apiDemo/src/handlers/apiDemoRootHandler.ts
@@ -0,0 +1,23 @@
+
+import { combineActionHandler } from '../../../../framework/src/flux/middleware';
+
+import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore';
+
+import { moduleHandler, IModules } from './modulesHandler';
+
+export interface IApiDemoStoreState {
+   modules: IModules
+}
+
+declare module '../../../../framework/src/store/applicationStore' {
+  interface IApplicationStoreState {
+    apiDemo: IApiDemoStoreState
+  }
+}
+
+const actionHandlers = {
+   modules: moduleHandler
+};
+
+export const apiDemoRootHandler = combineActionHandler<IApiDemoStoreState>(actionHandlers);
+export default apiDemoRootHandler;
diff --git a/sdnr/wt/odlux/apps/apiDemo/src/handlers/modulesHandler.ts b/sdnr/wt/odlux/apps/apiDemo/src/handlers/modulesHandler.ts
new file mode 100644
index 000000000..2b6c019cc
--- /dev/null
+++ b/sdnr/wt/odlux/apps/apiDemo/src/handlers/modulesHandler.ts
@@ -0,0 +1,16 @@
+import { IActionHandler } from '../../../../framework/src/flux/action';
+
+import { ModulesRequestSuccess } from '../actions/modulesSuccess';
+import { Module } from '../models/module';
+
+export type IModules = Module[]
+
+const modulesInit: IModules = [];
+
+export const moduleHandler: IActionHandler<IModules> = (state = modulesInit, action) => {
+  if (action instanceof ModulesRequestSuccess) {
+    return action.result.modules.module;
+  }
+
+  return state;
+};
diff --git a/sdnr/wt/odlux/apps/apiDemo/src/index.html b/sdnr/wt/odlux/apps/apiDemo/src/index.html
new file mode 100644
index 000000000..c01df6b13
--- /dev/null
+++ b/sdnr/wt/odlux/apps/apiDemo/src/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <!-- <link rel="stylesheet" href="./vendor.css" > -->
+  <title>API Demo App</title>
+</head>
+
+<body>
+  <div id="app"></div>
+  <script type="text/javascript" src="./require.js"></script>
+  <script type="text/javascript" src="./config.js"></script>
+  <script>
+    // run the application
+    require(["app","apiDemo"], function (app) {
+      app("./app.tsx")
+    });
+  </script>
+</body>
+
+</html>
+\ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/apiDemo/src/models/module.ts b/sdnr/wt/odlux/apps/apiDemo/src/models/module.ts
new file mode 100644
index 000000000..aab8db333
--- /dev/null
+++ b/sdnr/wt/odlux/apps/apiDemo/src/models/module.ts
@@ -0,0 +1,11 @@
+export type Module = {
+  name: string;
+  revision: string; 
+  namespace: string;
+}
+
+export type ModuleResult = {
+  modules: {
+    module: Module[]
+  }
+}
+\ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/apiDemo/src/plugin.tsx b/sdnr/wt/odlux/apps/apiDemo/src/plugin.tsx
new file mode 100644
index 000000000..8491760e6
--- /dev/null
+++ b/sdnr/wt/odlux/apps/apiDemo/src/plugin.tsx
@@ -0,0 +1,36 @@
+import * as React from "react";
+import { withRouter, RouteComponentProps, Route, Switch, Redirect } from 'react-router-dom';
+
+import { faNewspaper } from '@fortawesome/free-solid-svg-icons';
+
+import applicationManager from '../../../framework/src/services/applicationManager';
+import connect, { Connect } from '../../../framework/src/flux/connect';
+import { ApiAction } from '../../../framework/src/middleware/api'; // for RestConf
+
+import { apiDemoRootHandler } from './handlers/apiDemoRootHandler';
+import { ModulesRequestSuccess } from './actions/modulesSuccess';
+import { Module } from './models/module';
+
+type AppProps = RouteComponentProps & Connect & { modules: Module[], requestModules: () => void };
+
+const App = (props: AppProps ) => (
+  <>
+    <button onClick={ props.requestModules }>Load Modules</button>
+    <ul>{ props.modules.map((mod, ind) => (<li key={ ind }>{ mod.name }</li>)) }</ul>
+  </>
+);
+
+const FinalApp = withRouter(connect((state) => ({
+  modules: state.apiDemo.modules
+}), (dispatcher => ({
+  requestModules: () => { dispatcher.dispatch(new ApiAction('restconf/modules', ModulesRequestSuccess, true)) }
+})))(App));
+
+applicationManager.registerApplication({
+  name: "apiDemo",
+  icon: faNewspaper,
+  rootComponent: FinalApp,
+  rootActionHandler: apiDemoRootHandler,
+  menuEntry: "API Demo"
+});
+