diff options
Diffstat (limited to 'sdnr/wt/odlux/framework/src')
19 files changed, 347 insertions, 90 deletions
diff --git a/sdnr/wt/odlux/framework/src/actions/authentication.ts b/sdnr/wt/odlux/framework/src/actions/authentication.ts index b28100035..de8093573 100644 --- a/sdnr/wt/odlux/framework/src/actions/authentication.ts +++ b/sdnr/wt/odlux/framework/src/actions/authentication.ts @@ -16,11 +16,18 @@ * ============LICENSE_END========================================================================== */ import { Action } from '../flux/action'; -import { AuthToken } from '../models/authentication'; +import { AuthPolicy, User } from '../models/authentication'; -export class UpdateAuthentication extends Action { +export class UpdateUser extends Action { - constructor (public bearerToken: AuthToken | null) { + constructor (public user?: User) { + super(); + } +} + +export class UpdatePolicies extends Action { + + constructor (public authPolicies?: AuthPolicy[]) { super(); } }
\ No newline at end of file diff --git a/sdnr/wt/odlux/framework/src/actions/loginProvider.ts b/sdnr/wt/odlux/framework/src/actions/loginProvider.ts new file mode 100644 index 000000000..e6467111e --- /dev/null +++ b/sdnr/wt/odlux/framework/src/actions/loginProvider.ts @@ -0,0 +1,36 @@ +/** + * ============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 '../flux/action'; +import { Dispatch } from '../flux/store'; + +import { IApplicationStoreState } from '../store/applicationStore'; +import { ExternalLoginProvider } from '../models/externalLoginProvider'; + +import authenticationService from '../services/authenticationService'; + +export class SetExternalLoginProviderAction extends Action { + constructor(public externalLoginProvders: ExternalLoginProvider[] | null) { + super(); + } +} + +export const updateExternalLoginProviderAsyncActionCreator = () => async (dispatch: Dispatch, getState: () => IApplicationStoreState ) => { + const providers = await authenticationService.getAvaliableExteralProvider(); + dispatch(new SetExternalLoginProviderAction(providers || null)); +}
\ No newline at end of file diff --git a/sdnr/wt/odlux/framework/src/app.tsx b/sdnr/wt/odlux/framework/src/app.tsx index 6a24bfb2a..23ae2fbc9 100644 --- a/sdnr/wt/odlux/framework/src/app.tsx +++ b/sdnr/wt/odlux/framework/src/app.tsx @@ -23,7 +23,10 @@ import { MuiThemeProvider } from '@material-ui/core/styles'; import { Frame } from './views/frame';
+import { User } from './models/authentication';
+
import { AddErrorInfoAction } from './actions/errorActions';
+import { UpdateUser } from './actions/authentication';
import { applicationStoreCreator } from './store/applicationStore';
import { ApplicationStoreProvider } from './flux/connect';
@@ -31,12 +34,11 @@ import { ApplicationStoreProvider } from './flux/connect'; import { startHistoryListener } from './middleware/navigation';
import { startRestService } from './services/restService';
+import { startForceLogoutService } from './services/forceLogoutService';
+import { startNotificationService } from './services/notificationService';
import theme from './design/default';
import '!style-loader!css-loader!./app.css';
-import { ReplaceAction } from './actions/navigationActions';
-import { startForceLogoutService } from './services/forceLogoutService';
-import { startNotificationService } from './services/notificationService';
declare module '@material-ui/core/styles/createMuiTheme' {
@@ -57,9 +59,13 @@ declare module '@material-ui/core/styles/createMuiTheme' { }
}
+export { configureApplication } from "./handlers/applicationStateHandler";
+
export const transportPCEUrl = "transportPCEUrl";
export const runApplication = () => {
+
+ const initialToken = localStorage.getItem("userToken");
const applicationStore = applicationStoreCreator();
window.onerror = function (msg: string, url: string, line: number, col: number, error: Error) {
@@ -81,7 +87,6 @@ export const runApplication = () => { startHistoryListener(applicationStore);
startForceLogoutService(applicationStore);
startNotificationService(applicationStore);
- addTransportPCEUrl();
const App = (): JSX.Element => (
<ApplicationStoreProvider applicationStore={applicationStore} >
@@ -93,12 +98,19 @@ export const runApplication = () => { ReactDOM.render(<App />, document.getElementById('app'));
+ if (initialToken) {
+ applicationStore.dispatch(new UpdateUser(User.fromString(initialToken) || undefined));
+ }
+
};
-const addTransportPCEUrl = () =>{
- const url = window.localStorage.getItem(transportPCEUrl);
- if(url === null){
- window.localStorage.setItem(transportPCEUrl, "http://10.20.6.32:18082/");
- console.log("set transport url :D")
+if (process.env.NODE_ENV === "development") {
+ const addTransportPCEUrl = () =>{
+ const url = window.localStorage.getItem(transportPCEUrl);
+ if(url === null){
+ window.localStorage.setItem(transportPCEUrl, "http://10.20.6.32:18082/");
+ console.log("set transport url :D")
+ }
}
+ addTransportPCEUrl();
}
diff --git a/sdnr/wt/odlux/framework/src/assets/version.json b/sdnr/wt/odlux/framework/src/assets/version.json index 260aec4ea..6d4eb0cc6 100644 --- a/sdnr/wt/odlux/framework/src/assets/version.json +++ b/sdnr/wt/odlux/framework/src/assets/version.json @@ -1,4 +1,4 @@ { - "version":"88.1c38886(20/12/04)", - "build":"2020-12-04T06:06:24Z" + "version":"56.139cd6d(20/07/08)", + "build":"2020-07-16T06:06:24Z" }
\ No newline at end of file diff --git a/sdnr/wt/odlux/framework/src/components/titleBar.tsx b/sdnr/wt/odlux/framework/src/components/titleBar.tsx index 49c096691..62db1de40 100644 --- a/sdnr/wt/odlux/framework/src/components/titleBar.tsx +++ b/sdnr/wt/odlux/framework/src/components/titleBar.tsx @@ -35,7 +35,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faBan } from '@fortawesome/free-solid-svg-icons';
import { faDotCircle } from '@fortawesome/free-solid-svg-icons';
-import { UpdateAuthentication } from '../actions/authentication';
+import { UpdateUser } from '../actions/authentication';
import { ReplaceAction } from '../actions/navigationActions';
import connect, { Connect, IDispatcher } from '../flux/connect';
@@ -71,7 +71,7 @@ const styles = (theme: Theme) => createStyles({ const mapDispatch = (dispatcher: IDispatcher) => {
return {
logout: () => {
- dispatcher.dispatch(new UpdateAuthentication(null));
+ dispatcher.dispatch(new UpdateUser(undefined));
dispatcher.dispatch(new ReplaceAction("/login"));
},
toggleMainMenu: (value: boolean, value2: boolean) => {
diff --git a/sdnr/wt/odlux/framework/src/handlers/applicationStateHandler.ts b/sdnr/wt/odlux/framework/src/handlers/applicationStateHandler.ts index a93f96a82..b5c1ee7b1 100644 --- a/sdnr/wt/odlux/framework/src/handlers/applicationStateHandler.ts +++ b/sdnr/wt/odlux/framework/src/handlers/applicationStateHandler.ts @@ -16,16 +16,19 @@ * ============LICENSE_END========================================================================== */ import { IActionHandler } from '../flux/action'; -import { SetTitleAction } from '../actions/titleActions'; +import { SetTitleAction } from '../actions/titleActions'; +import { SetExternalLoginProviderAction } from '../actions/loginProvider'; import { AddSnackbarNotification, RemoveSnackbarNotification } from '../actions/snackbarActions'; import { AddErrorInfoAction, RemoveErrorInfoAction, ClearErrorInfoAction } from '../actions/errorActions'; import { MenuAction, MenuClosedByUser } from '../actions/menuAction' -import { IconType } from '../models/iconDefinition'; +import { SetWebsocketAction } from '../actions/websocketAction'; +import { IconType } from '../models/iconDefinition'; import { ErrorInfo } from '../models/errorInfo'; import { SnackbarItem } from '../models/snackbarItem'; -import { SetWebsocketAction } from '../actions/websocketAction'; +import { ExternalLoginProvider } from '../models/externalLoginProvider'; +import { ApplicationConfig } from '../models/applicationConfig'; export interface IApplicationState { title: string; @@ -36,9 +39,27 @@ export interface IApplicationState { errors: ErrorInfo[]; snackBars: SnackbarItem[]; isWebsocketAvailable: boolean | undefined; + externalLoginProviders: ExternalLoginProvider[] | null; + authentication: "basic"|"oauth", // basic + enablePolicy: boolean // false } -const applicationStateInit: IApplicationState = { title: "Loading ...", errors: [], snackBars: [], isMenuOpen: true, isMenuClosedByUser: false, isWebsocketAvailable: undefined }; +const applicationStateInit: IApplicationState = { + title: "Loading ...", + errors: [], + snackBars: [], + isMenuOpen: true, + isMenuClosedByUser: false, + isWebsocketAvailable: undefined, + externalLoginProviders: null, + authentication: "basic", + enablePolicy: false, +}; + +export const configureApplication = (config: ApplicationConfig) => { + applicationStateInit.authentication = config.authentication === "oauth" ? "oauth" : "basic"; + applicationStateInit.enablePolicy = config.authentication ? true : false; +} export const applicationStateHandler: IActionHandler<IApplicationState> = (state = applicationStateInit, action) => { if (action instanceof SetTitleAction) { @@ -46,14 +67,14 @@ export const applicationStateHandler: IActionHandler<IApplicationState> = (state ...state, title: action.title, icon: action.icon, - appId: action.appId + appId: action.appId, }; } else if (action instanceof AddErrorInfoAction) { state = { ...state, errors: [ ...state.errors, - action.errorInfo + action.errorInfo, ] }; } else if (action instanceof RemoveErrorInfoAction) { @@ -63,7 +84,7 @@ export const applicationStateHandler: IActionHandler<IApplicationState> = (state ...state, errors: [ ...state.errors.slice(0, index), - ...state.errors.slice(index + 1) + ...state.errors.slice(index + 1), ] }; } @@ -71,7 +92,7 @@ export const applicationStateHandler: IActionHandler<IApplicationState> = (state if (state.errors && state.errors.length) { state = { ...state, - errors: [] + errors: [], }; } } else if (action instanceof AddSnackbarNotification) { @@ -79,29 +100,34 @@ export const applicationStateHandler: IActionHandler<IApplicationState> = (state ...state, snackBars: [ ...state.snackBars, - action.notification + action.notification, ] }; } else if (action instanceof RemoveSnackbarNotification) { state = { ...state, - snackBars: state.snackBars.filter(s => s.key !== action.key) + snackBars: state.snackBars.filter(s => s.key !== action.key), }; } else if (action instanceof MenuAction) { state = { ...state, - isMenuOpen: action.isOpen + isMenuOpen: action.isOpen, } } else if (action instanceof MenuClosedByUser) { state = { ...state, - isMenuClosedByUser: action.isClosed + isMenuClosedByUser: action.isClosed, } } else if (action instanceof SetWebsocketAction) { state = { ...state, - isWebsocketAvailable: action.isConnected + isWebsocketAvailable: action.isConnected, + } + } else if (action instanceof SetExternalLoginProviderAction){ + state = { + ...state, + externalLoginProviders: action.externalLoginProvders, } } return state; diff --git a/sdnr/wt/odlux/framework/src/handlers/authenticationHandler.ts b/sdnr/wt/odlux/framework/src/handlers/authenticationHandler.ts index 82b228dc0..5217bd414 100644 --- a/sdnr/wt/odlux/framework/src/handlers/authenticationHandler.ts +++ b/sdnr/wt/odlux/framework/src/handlers/authenticationHandler.ts @@ -16,31 +16,26 @@ * ============LICENSE_END========================================================================== */ import { IActionHandler } from '../flux/action'; -import { UpdateAuthentication } from '../actions/authentication'; +import { UpdatePolicies, UpdateUser } from '../actions/authentication'; -import { User } from '../models/authentication'; +import { AuthPolicy, User } from '../models/authentication'; import { onLogin, onLogout } from '../services/applicationApi'; import { startWebsocketSession, endWebsocketSession } from '../services/notificationService'; export interface IAuthenticationState { user?: User; -} - -const initialToken = localStorage.getItem("userToken"); - -if (initialToken !== null) { - startWebsocketSession(); + policies?: AuthPolicy[]; } const authenticationStateInit: IAuthenticationState = { - user: initialToken && User.fromString(initialToken) || undefined + user: undefined }; export const authenticationStateHandler: IActionHandler<IAuthenticationState> = (state = authenticationStateInit, action) => { - if (action instanceof UpdateAuthentication) { - - const user = action.bearerToken && new User(action.bearerToken) || undefined; + if (action instanceof UpdateUser) { + const {user} = action; + if (user) { localStorage.setItem("userToken", user.toString()); startWebsocketSession(); @@ -53,9 +48,14 @@ export const authenticationStateHandler: IActionHandler<IAuthenticationState> = state = { ...state, - user + user, }; + } else if (action instanceof UpdatePolicies) { + state = { + ...state, + policies: action.authPolicies, + }; } - return state; }; + diff --git a/sdnr/wt/odlux/framework/src/index.html b/sdnr/wt/odlux/framework/src/index.html index d51c448a9..5cd2805c1 100644 --- a/sdnr/wt/odlux/framework/src/index.html +++ b/sdnr/wt/odlux/framework/src/index.html @@ -16,6 +16,7 @@ <script> // run the application require(["run"], function (run) { + run.configureApplication({ authentication:"oauth", enablePolicy: true,}); run.runApplication(); }); diff --git a/sdnr/wt/odlux/framework/src/middleware/navigation.ts b/sdnr/wt/odlux/framework/src/middleware/navigation.ts index d5cdcd44b..c5ab788f3 100644 --- a/sdnr/wt/odlux/framework/src/middleware/navigation.ts +++ b/sdnr/wt/odlux/framework/src/middleware/navigation.ts @@ -15,15 +15,19 @@ * the License. * ============LICENSE_END========================================================================== */ +import * as jwt from 'jsonwebtoken'; import { Location, History, createHashHistory } from "history"; -import { ApplicationStore } from "../store/applicationStore"; -import { Dispatch } from '../flux/store'; +import { User } from "../models/authentication"; import { LocationChanged, NavigateToApplication } from "../actions/navigationActions"; import { PushAction, ReplaceAction, GoAction, GoBackAction, GoForwardeAction } from '../actions/navigationActions'; import { applicationManager } from "../services/applicationManager"; +import { UpdateUser } from "../actions/authentication"; + +import { ApplicationStore } from "../store/applicationStore"; +import { Dispatch } from '../flux/store'; const routerMiddlewareCreator = (history: History) => () => (next: Dispatch): Dispatch => (action) => { @@ -49,7 +53,16 @@ const routerMiddlewareCreator = (history: History) => () => (next: Dispatch): Di history.goForward(); } else if (action instanceof LocationChanged) { // ensure user is logged in and token is valid - if (!action.pathname.startsWith("/login") && applicationStore && (!applicationStore.state.framework.authenticationState.user || !applicationStore.state.framework.authenticationState.user.isValid)) { + if (action.pathname.startsWith("/oauth") && (action.search.startsWith("?token="))){ + const ind = action.search.lastIndexOf("token="); + const tokenStr = ind > -1 ? action.search.substr(ind+6) : null; + const token = tokenStr && jwt.decode(tokenStr); + if (tokenStr && token) { + // @ts-ignore + const user = new User({ username: token["name"], access_token: tokenStr, token_type: "Bearer", expires: (new Date().valueOf()) + ( (+token['exp']) * 1000) }) || undefined; + return next(new UpdateUser(user)) as any; + } + } if (!action.pathname.startsWith("/login") && applicationStore && (!applicationStore.state.framework.authenticationState.user || !applicationStore.state.framework.authenticationState.user.isValid)) { history.replace(`/login?returnTo=${action.pathname}`); } else { return next(action); diff --git a/sdnr/wt/odlux/framework/src/middleware/policies.ts b/sdnr/wt/odlux/framework/src/middleware/policies.ts new file mode 100644 index 000000000..662ecddb3 --- /dev/null +++ b/sdnr/wt/odlux/framework/src/middleware/policies.ts @@ -0,0 +1,41 @@ +/** + * ============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 authenticationService from '../services/authenticationService'; + +import { UpdateUser, UpdatePolicies } from '../actions/authentication'; +import { Dispatch } from '../flux/store'; +import { MiddlewareApi } from '../store/applicationStore'; + +function updatePoliciesMiddleware() { + return ({ dispatch, getState }: MiddlewareApi) => + (next : Dispatch) : Dispatch => + action => { + const { framework: { applicationState: { enablePolicy } } } = getState() || { framework: { applicationState: { } } }; + if (enablePolicy && action instanceof UpdateUser) { + next(action); + authenticationService.getAccessPolicies().then((policies) => dispatch(new UpdatePolicies(policies||undefined))); + return action; + } + if (enablePolicy === false) next(new UpdatePolicies()); + return next(action); + }; +} + +export const updatePolicies = updatePoliciesMiddleware(); +export default updatePolicies;
\ No newline at end of file diff --git a/sdnr/wt/odlux/framework/src/models/applicationConfig.ts b/sdnr/wt/odlux/framework/src/models/applicationConfig.ts new file mode 100644 index 000000000..5224840eb --- /dev/null +++ b/sdnr/wt/odlux/framework/src/models/applicationConfig.ts @@ -0,0 +1,4 @@ +export type ApplicationConfig = { + authentication: "basic"|"oauth", // basic + enablePolicy: false // false +};
\ No newline at end of file diff --git a/sdnr/wt/odlux/framework/src/models/authentication.ts b/sdnr/wt/odlux/framework/src/models/authentication.ts index a50c5ded4..b6840a0ce 100644 --- a/sdnr/wt/odlux/framework/src/models/authentication.ts +++ b/sdnr/wt/odlux/framework/src/models/authentication.ts @@ -23,6 +23,16 @@ export type AuthToken = { expires: number; } +export type AuthPolicy = { + path: string; + methods: { + get?: boolean; + post?: boolean; + put?: boolean; + patch?: boolean; + delete?: boolean; + } +} export class User { diff --git a/sdnr/wt/odlux/framework/src/models/externalLoginProvider.ts b/sdnr/wt/odlux/framework/src/models/externalLoginProvider.ts new file mode 100644 index 000000000..357feed06 --- /dev/null +++ b/sdnr/wt/odlux/framework/src/models/externalLoginProvider.ts @@ -0,0 +1,23 @@ +/** + * ============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========================================================================== + */ + +export type ExternalLoginProvider = { + id: string; + title: string; + loginUrl: string; + }
\ No newline at end of file diff --git a/sdnr/wt/odlux/framework/src/run.ts b/sdnr/wt/odlux/framework/src/run.ts index 10692e8d6..991b7494e 100644 --- a/sdnr/wt/odlux/framework/src/run.ts +++ b/sdnr/wt/odlux/framework/src/run.ts @@ -15,4 +15,5 @@ * the License. * ============LICENSE_END========================================================================== */ +export { configureApplication } from './handlers/applicationStateHandler'; export { runApplication } from './app'; diff --git a/sdnr/wt/odlux/framework/src/services/authenticationService.ts b/sdnr/wt/odlux/framework/src/services/authenticationService.ts index 9b006fc16..4e7d109d9 100644 --- a/sdnr/wt/odlux/framework/src/services/authenticationService.ts +++ b/sdnr/wt/odlux/framework/src/services/authenticationService.ts @@ -15,19 +15,30 @@ * the License. * ============LICENSE_END========================================================================== */ +import { AuthPolicy, AuthToken } from "../models/authentication"; +import { ExternalLoginProvider } from "../models/externalLoginProvider"; + import { requestRest, formEncode } from "./restService"; -import { AuthToken } from "../models/authentication"; type AuthTokenResponse = { access_token: string; token_type: string; - expires_in: number; + expires_at: number; } - class AuthenticationService { + public async getAvaliableExteralProvider() { + const result = await requestRest<ExternalLoginProvider[]>(`oauth/providers`, { + method: "GET", + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + }, + }, false); + return result; + } + public async authenticateUserOAuth(email: string, password: string, scope: string): Promise<AuthToken | null> { - const result = await requestRest<string>(`oauth2/token`, { + const result = await requestRest<AuthTokenResponse>(`oauth/login`, { method: "POST", headers: { 'Content-Type': 'application/x-www-form-urlencoded' @@ -39,12 +50,11 @@ class AuthenticationService { scope: scope }) }, false); - const resultObj: AuthTokenResponse| null = result && JSON.parse(result); - return resultObj && { + return result && { username: email, - access_token: resultObj.access_token, - token_type: resultObj.token_type, - expires: (new Date().valueOf()) + (resultObj.expires_in * 1000) + access_token: result.access_token, + token_type: result.token_type, + expires: (result.expires_at * 1000) } || null; } @@ -65,6 +75,10 @@ class AuthenticationService { } return null; } + + public async getAccessPolicies(){ + return await requestRest<AuthPolicy[]>(`oauth/policies`, { method: "GET" }, true); + } } export const authenticationService = new AuthenticationService(); diff --git a/sdnr/wt/odlux/framework/src/services/forceLogoutService.ts b/sdnr/wt/odlux/framework/src/services/forceLogoutService.ts index 0c7c38dff..a57739025 100644 --- a/sdnr/wt/odlux/framework/src/services/forceLogoutService.ts +++ b/sdnr/wt/odlux/framework/src/services/forceLogoutService.ts @@ -17,7 +17,7 @@ */ import { ApplicationStore } from "../store/applicationStore"; -import { UpdateAuthentication } from "../actions/authentication"; +import { UpdateUser } from "../actions/authentication"; import { ReplaceAction } from "../actions/navigationActions"; const maxMinutesTillLogout = 15; @@ -45,7 +45,7 @@ const createForceLogoutInterval = () => { if (tickTimer === 0) { console.log("got logged out by timer") if (applicationStore) { - applicationStore.dispatch(new UpdateAuthentication(null)); + applicationStore.dispatch(new UpdateUser(undefined)); applicationStore.dispatch(new ReplaceAction("/login")); } } diff --git a/sdnr/wt/odlux/framework/src/store/applicationStore.ts b/sdnr/wt/odlux/framework/src/store/applicationStore.ts index 287eba31c..a4545eff9 100644 --- a/sdnr/wt/odlux/framework/src/store/applicationStore.ts +++ b/sdnr/wt/odlux/framework/src/store/applicationStore.ts @@ -32,6 +32,7 @@ import apiMiddleware from '../middleware/api'; import thunkMiddleware from '../middleware/thunk'; import loggerMiddleware from '../middleware/logger'; import routerMiddleware from '../middleware/navigation'; +import { updatePolicies } from '../middleware/policies'; export type MiddlewareApi = MiddlewareArg<IApplicationStoreState>; @@ -65,7 +66,7 @@ export const applicationStoreCreator = (): ApplicationStore => { return acc; }, { framework: frameworkHandlers } as any); - const applicationStore = new ApplicationStore(combineActionHandler(actionHandlers), chainMiddleware(loggerMiddleware, thunkMiddleware, routerMiddleware, apiMiddleware, ...middlewares)); + const applicationStore = new ApplicationStore(combineActionHandler(actionHandlers), chainMiddleware(loggerMiddleware, thunkMiddleware, routerMiddleware, apiMiddleware, updatePolicies, ...middlewares)); setApplicationStore(applicationStore); return applicationStore; } diff --git a/sdnr/wt/odlux/framework/src/views/frame.tsx b/sdnr/wt/odlux/framework/src/views/frame.tsx index c8e24fdb9..b4cc43e0b 100644 --- a/sdnr/wt/odlux/framework/src/views/frame.tsx +++ b/sdnr/wt/odlux/framework/src/views/frame.tsx @@ -80,32 +80,32 @@ class FrameComponent extends React.Component<FrameProps>{ }
<Switch>
<Route exact path="/" component={() => (
- <AppFrame title={"Home"} icon={faHome} >
- <Home />
- </AppFrame>
+ <AppFrame title={"Home"} icon={faHome} >
+ <Home />
+ </AppFrame>
)} />
<Route path="/about" component={() => (
- <AppFrame title={"About"} icon={faAddressBook} >
- <About />
- </AppFrame>
+ <AppFrame title={"About"} icon={faAddressBook} >
+ <About />
+ </AppFrame>
)} />
{process.env.NODE_ENV === "development" ? <Route path="/test" component={() => (
- <AppFrame title={"Test"} icon={faAddressBook} >
- <Test />
- </AppFrame>
+ <AppFrame title={"Test"} icon={faAddressBook} >
+ <Test />
+ </AppFrame>
)} /> : null}
<Route path="/login" component={() => (
- <AppFrame title={"Login"} icon={faSignInAlt} >
- <Login />
- </AppFrame>
- )} />
- {Object.keys(registrations).map(p => {
- const application = registrations[p];
- return (<Route key={application.name} path={application.path || `/${application.name}`} component={() => (
- <AppFrame title={application.title || (typeof application.menuEntry === 'string' && application.menuEntry) || application.name} icon={application.icon} appId={application.name} >
- <application.rootComponent />
- </AppFrame>
- )} />)
+ <AppFrame title={"Login"} icon={faSignInAlt} >
+ <Login />
+ </AppFrame>
+ )} />
+ { Object.keys(registrations).map(p => {
+ const application = registrations[p];
+ return (<Route key={application.name} path={application.path || `/${application.name}`} component={() => (
+ <AppFrame title={application.title || (typeof application.menuEntry === 'string' && application.menuEntry) || application.name} icon={application.icon} appId={application.name} >
+ <application.rootComponent />
+ </AppFrame>
+ )} />)
})}
<Redirect to="/" />
</Switch>
diff --git a/sdnr/wt/odlux/framework/src/views/login.tsx b/sdnr/wt/odlux/framework/src/views/login.tsx index b06cf7631..be1fb801f 100644 --- a/sdnr/wt/odlux/framework/src/views/login.tsx +++ b/sdnr/wt/odlux/framework/src/views/login.tsx @@ -32,10 +32,16 @@ import Paper from '@material-ui/core/Paper'; import Typography from '@material-ui/core/Typography'; import { withStyles, WithStyles, createStyles, Theme } from '@material-ui/core/styles'; -import connect, { Connect } from '../flux/connect'; +import connect, { Connect, IDispatcher } from '../flux/connect'; import authenticationService from '../services/authenticationService'; -import { UpdateAuthentication } from '../actions/authentication'; +import { updateExternalLoginProviderAsyncActionCreator } from '../actions/loginProvider'; +import { UpdatePolicies, UpdateUser } from '../actions/authentication'; + +import { IApplicationStoreState } from '../store/applicationStore'; +import { AuthPolicy, AuthToken, User } from '../models/authentication'; +import Menu from '@material-ui/core/Menu'; +import { MenuItem } from '@material-ui/core'; const styles = (theme: Theme) => createStyles({ layout: { @@ -69,14 +75,37 @@ const styles = (theme: Theme) => createStyles({ }, }); -type LoginProps = RouteComponentProps<{}> & WithStyles<typeof styles> & Connect; +const mapProps = (state: IApplicationStoreState) => ({ + search: state.framework.navigationState.search, + authentication: state.framework.applicationState.authentication, + externalLoginProviders: state.framework.applicationState.externalLoginProviders , +}); + +const mapDispatch = (dispatcher: IDispatcher) => ({ + updateExternalProviders: () => dispatcher.dispatch(updateExternalLoginProviderAsyncActionCreator()), + updateAuthentication: (token: AuthToken | null) => { + const user = token && new User(token) || undefined; + dispatcher.dispatch(new UpdateUser(user)); + }, + updatePolicies: (policies?: AuthPolicy[]) => { + return dispatcher.dispatch(new UpdatePolicies(policies)); + }, +}); + +type LoginProps = RouteComponentProps<{}> & WithStyles<typeof styles> & Connect<typeof mapProps, typeof mapDispatch>; interface ILoginState { + externalProviderAnchor: HTMLElement | null; busy: boolean; username: string; password: string; scope: string; message: string; + providers: { + id: string; + title: string; + loginUrl: string; + }[] | null; } @@ -87,14 +116,26 @@ class LoginComponent extends React.Component<LoginProps, ILoginState> { super(props); this.state = { + externalProviderAnchor: null, busy: false, username: '', password: '', scope: 'sdn', - message: '' + message: '', + providers: null, }; } + async componentDidMount(){ + if (this.props.authentication === "oauth" && (this.props.externalLoginProviders == null || this.props.externalLoginProviders.length === 0)){ + this.props.updateExternalProviders(); + } + } + + private setExternalProviderAnchor = (el: HTMLElement | null) => { + this.setState({externalProviderAnchor: el }) + } + render(): JSX.Element { const { classes } = this.props; return ( @@ -153,6 +194,33 @@ class LoginComponent extends React.Component<LoginProps, ILoginState> { > Sign in </Button> + { this.props.externalLoginProviders && this.props.externalLoginProviders.length > 0 + ? + [ + <Button + aria-controls="externalLogin" + aria-haspopup="true" + fullWidth + variant="contained" + color="primary" + className={classes.submit} onClick={(ev) => { this.setExternalProviderAnchor(ev.currentTarget); }}> + Use external Login + </Button>, + <Menu + anchorEl={this.state.externalProviderAnchor} + keepMounted + open={Boolean(this.state.externalProviderAnchor)} + onClose={() => { this.setExternalProviderAnchor(null); }} + > + { + this.props.externalLoginProviders.map((provider) => ( + <MenuItem key={provider.id} onClick={() => { window.location = provider.loginUrl as any; } }>{ provider.title} </MenuItem> + )) + } + </Menu> + ] + : null + } </form> {this.state.message && <Alert severity="error">{this.state.message}</Alert>} </Paper> @@ -165,16 +233,16 @@ class LoginComponent extends React.Component<LoginProps, ILoginState> { event.preventDefault(); this.setState({ busy: true }); - // const token = await authenticationService.authenticateUserOAuth(this.state.username, this.state.password, this.state.scope); - const token = await authenticationService.authenticateUserBasicAuth(this.state.username, this.state.password, this.state.scope); - this.props.dispatch(new UpdateAuthentication(token)); + + const token = this.props.authentication === "oauth" + ? await authenticationService.authenticateUserOAuth(this.state.username, this.state.password, this.state.scope) + : await authenticationService.authenticateUserBasicAuth(this.state.username, this.state.password, this.state.scope); + + this.props.updateAuthentication(token); this.setState({ busy: false }); if (token) { - const query = - this.props.state.framework.navigationState.search && - this.props.state.framework.navigationState.search.replace(/^\?/, "") - .split('&').map(e => e.split("=")); + const query = this.props.search && this.props.search.replace(/^\?/, "").split('&').map(e => e.split("=")); const returnTo = query && query.find(e => e[0] === "returnTo"); this.props.history.replace(returnTo && returnTo[1] || "/"); } @@ -187,5 +255,5 @@ class LoginComponent extends React.Component<LoginProps, ILoginState> { } } -export const Login = withStyles(styles)(withRouter(connect()(LoginComponent))); +export const Login = withStyles(styles)(withRouter(connect(mapProps, mapDispatch)(LoginComponent))); export default Login;
\ No newline at end of file |