Merge with develop branch

scm-ui/ui-webapp/src/containers/App.tsx

@@ -27,7 +27,15 @@ import { connect } from "react-redux";
 import { compose } from "redux";
 import { WithTranslation, withTranslation } from "react-i18next";
 import { withRouter } from "react-router-dom";
-import { fetchMe, getFetchMeFailure, getMe, isAuthenticated, isFetchMePending } from "../modules/auth";
+import {
+  fetchMe,
+  getFetchMeFailure,
+  getMe,
+  isAuthenticated,
+  isFetchMePending,
+  isLoginPending,
+  isLogoutPending
+} from "../modules/auth";
 import { ErrorPage, Footer, Header, Loading, PrimaryNavigation } from "@scm-manager/ui-components";
 import { Links, Me } from "@scm-manager/ui-types";
 import {
@@ -37,6 +45,7 @@ import {
   getMeLink,
   isFetchIndexResourcesPending
 } from "../modules/indexResource";
+import Login from "./Login";
 
 type Props = WithTranslation & {
   me: Me;
@@ -64,12 +73,14 @@ class App extends Component<Props> {
     let content;
     const navigation = authenticated ? <PrimaryNavigation links={links} /> : "";
 
-    if (loading) {
+    if (!authenticated && !loading) {
+      content = <Login />;
+    } else if (loading) {
       content = <Loading />;
     } else if (error) {
       content = <ErrorPage title={t("app.error.title")} subtitle={t("app.error.subtitle")} error={error} />;
     } else {
-      content = <Main authenticated={authenticated} links={links} />;
+      content = <Main authenticated={authenticated} links={links} me={me} />;
     }
     return (
       <div className="App">
@@ -88,9 +99,9 @@ const mapDispatchToProps = (dispatch: any) => {
 };
 
 const mapStateToProps = (state: any) => {
-  const authenticated = isAuthenticated(state);
+  const authenticated = isAuthenticated(state) && !isLogoutPending(state);
   const me = getMe(state);
-  const loading = isFetchMePending(state) || isFetchIndexResourcesPending(state);
+  const loading = isFetchMePending(state) || isFetchIndexResourcesPending(state) || isLoginPending(state);
   const error = getFetchMeFailure(state) || getFetchIndexResourcesFailure(state);
   const links = getLinks(state);
   const meLink = getMeLink(state);

scm-ui/ui-webapp/src/containers/Login.tsx

@@ -23,15 +23,17 @@
  */
 import React from "react";
 import { connect } from "react-redux";
-import { Redirect, withRouter } from "react-router-dom";
+import { Redirect, RouteComponentProps, withRouter } from "react-router-dom";
 import { compose } from "redux";
 import styled from "styled-components";
-import { getLoginFailure, isAuthenticated, isLoginPending, login } from "../modules/auth";
+import { getLoginFailure, getMe, isAnonymous, isLoginPending, login } from "../modules/auth";
 import { getLoginInfoLink, getLoginLink } from "../modules/indexResource";
 import LoginInfo from "../components/LoginInfo";
+import { Me } from "@scm-manager/ui-types";
 
-type Props = {
+type Props = RouteComponentProps & {
   authenticated: boolean;
+  me: Me;
   loading: boolean;
   error?: Error;
   link: string;
@@ -39,10 +41,6 @@ type Props = {
 
   // dispatcher props
   login: (link: string, username: string, password: string) => void;
-
-  // context props
-  from: any;
-  location: any;
 };
 
 const HeroSection = styled.section`
@@ -65,9 +63,9 @@ class Login extends React.Component<Props> {
   };
 
   render() {
-    const { authenticated, ...restProps } = this.props;
+    const { authenticated, me, ...restProps } = this.props;
 
-    if (authenticated) {
+    if (authenticated && !!me) {
       return this.renderRedirect();
     }
 
@@ -86,13 +84,15 @@ class Login extends React.Component<Props> {
 }
 
 const mapStateToProps = (state: any) => {
-  const authenticated = isAuthenticated(state);
+  const authenticated = state?.auth?.me && !isAnonymous(state.auth.me);
+  const me = getMe(state);
   const loading = isLoginPending(state);
   const error = getLoginFailure(state);
   const link = getLoginLink(state);
   const loginInfoLink = getLoginInfoLink(state);
   return {
     authenticated,
+    me,
     loading,
     error,
     link,

scm-ui/ui-webapp/src/containers/Logout.tsx

@@ -22,52 +22,45 @@
  * SOFTWARE.
  */
 import React from "react";
-import { connect } from "react-redux";
-import { WithTranslation, withTranslation } from "react-i18next";
-import { Redirect } from "react-router-dom";
+import {connect} from "react-redux";
+import {WithTranslation, withTranslation} from "react-i18next";
 
-import { getLogoutFailure, isAuthenticated, isLogoutPending, isRedirecting, logout } from "../modules/auth";
-import { ErrorPage, Loading } from "@scm-manager/ui-components";
-import { getLogoutLink } from "../modules/indexResource";
+import {getLogoutFailure, logout} from "../modules/auth";
+import {ErrorPage, Loading} from "@scm-manager/ui-components";
+import {getLogoutLink} from "../modules/indexResource";
+import {RouteComponentProps, withRouter} from "react-router-dom";
+import {compose} from "redux";
 
-type Props = WithTranslation & {
-  authenticated: boolean;
-  loading: boolean;
-  redirecting: boolean;
+type Props = RouteComponentProps &
+  WithTranslation & {
   error: Error;
   logoutLink: string;
 
   // dispatcher functions
-  logout: (link: string) => void;
+  logout: (link: string, callback: () => void) => void;
 };
 
 class Logout extends React.Component<Props> {
   componentDidMount() {
-    this.props.logout(this.props.logoutLink);
+    if (this.props.logoutLink) {
+      this.props.logout(this.props.logoutLink, () => this.props.history.push("/login"));
+    }
   }
 
   render() {
-    const { authenticated, redirecting, loading, error, t } = this.props;
+    const {error, t} = this.props;
     if (error) {
-      return <ErrorPage title={t("logout.error.title")} subtitle={t("logout.error.subtitle")} error={error} />;
-    } else if (loading || authenticated || redirecting) {
-      return <Loading />;
+      return <ErrorPage title={t("logout.error.title")} subtitle={t("logout.error.subtitle")} error={error}/>;
     } else {
-      return <Redirect to="/login" />;
+      return <Loading/>;
     }
   }
 }
 
 const mapStateToProps = (state: any) => {
-  const authenticated = isAuthenticated(state);
-  const loading = isLogoutPending(state);
-  const redirecting = isRedirecting(state);
   const error = getLogoutFailure(state);
   const logoutLink = getLogoutLink(state);
   return {
-    authenticated,
-    loading,
-    redirecting,
     error,
     logoutLink
   };
@@ -75,8 +68,8 @@ const mapStateToProps = (state: any) => {
 
 const mapDispatchToProps = (dispatch: any) => {
   return {
-    logout: (link: string) => dispatch(logout(link))
+    logout: (link: string, callback: () => void) => dispatch(logout(link, callback))
   };
 };
 
-export default connect(mapStateToProps, mapDispatchToProps)(withTranslation("commons")(Logout));
+export default compose(withTranslation("commons"), withRouter, connect(mapStateToProps, mapDispatchToProps))(Logout);

scm-ui/ui-webapp/src/containers/Main.tsx

@@ -24,7 +24,7 @@
 import React from "react";
 
 import { Redirect, Route, Switch, withRouter } from "react-router-dom";
-import { Links } from "@scm-manager/ui-types";
+import { Links, Me } from "@scm-manager/ui-types";
 
 import Overview from "../repos/containers/Overview";
 import Users from "../users/containers/Users";
@@ -48,18 +48,25 @@ import Admin from "../admin/containers/Admin";
 import Profile from "./Profile";
 
 type Props = {
+  me: Me;
   authenticated?: boolean;
   links: Links;
 };
 
 class Main extends React.Component<Props> {
   render() {
-    const { authenticated, links } = this.props;
+    const { authenticated, me, links } = this.props;
     const redirectUrlFactory = binder.getExtension("main.redirect", this.props);
-    let url = "/repos/";
+    let url = "/";
+    if (authenticated) {
+      url = "/repos/";
+    }
     if (redirectUrlFactory) {
       url = redirectUrlFactory(this.props);
     }
+    if (!me) {
+      url = "/login";
+    }
     return (
       <div className="main">
         <Switch>
@@ -88,6 +95,7 @@ class Main extends React.Component<Props> {
             renderAll={true}
             props={{
               authenticated,
+              me,
               links
             }}
           />

scm-ui/ui-webapp/src/containers/Profile.tsx

@@ -65,6 +65,16 @@ class Profile extends React.Component<Props> {
     return this.stripEndingSlash(this.props.match.url);
   };
 
+  mayChangePassword = () => {
+    const { me } = this.props;
+    return !!me?._links?.password;
+  };
+
+  canManagePublicKeys = () => {
+    const { me } = this.props;
+    return !!me?._links?.publicKeys;
+  };
+
   render() {
     const url = this.matchedUrl();
 
@@ -94,8 +104,12 @@ class Profile extends React.Component<Props> {
           <CustomQueryFlexWrappedColumns>
             <PrimaryContentColumn>
               <Route path={url} exact render={() => <ProfileInfo me={me} />} />
-              <Route path={`${url}/settings/password`} render={() => <ChangeUserPassword me={me} />} />
-              <Route path={`${url}/settings/publicKeys`} render={() => <SetPublicKeys user={me}/>} />
+              {this.mayChangePassword() && (
+                <Route path={`${url}/settings/password`} render={() => <ChangeUserPassword me={me} />} />
+              )}
+              {this.canManagePublicKeys() && (
+                <Route path={`${url}/settings/publicKeys`} render={() => <SetPublicKeys user={me} />} />
+              )}
               <ExtensionPoint name="profile.route" props={extensionProps} renderAll={true} />
             </PrimaryContentColumn>
             <SecondaryNavigationColumn>
@@ -106,15 +120,17 @@ class Profile extends React.Component<Props> {
                   label={t("profile.informationNavLink")}
                   title={t("profile.informationNavLink")}
                 />
-                <SubNavigation
-                  to={`${url}/settings/password`}
-                  label={t("profile.settingsNavLink")}
-                  title={t("profile.settingsNavLink")}
-                >
-                  <NavLink to={`${url}/settings/password`} label={t("profile.changePasswordNavLink")} />
-                  <SetPublicKeyNavLink user={me} publicKeyUrl={`${url}/settings/publicKeys`} />
-                  <ExtensionPoint name="profile.setting" props={extensionProps} renderAll={true} />
-                </SubNavigation>
+                {this.mayChangePassword() && (
+                  <SubNavigation
+                    to={`${url}/settings/password`}
+                    label={t("profile.settingsNavLink")}
+                    title={t("profile.settingsNavLink")}
+                  >
+                    <NavLink to={`${url}/settings/password`} label={t("profile.changePasswordNavLink")} />
+                    <SetPublicKeyNavLink user={me} publicKeyUrl={`${url}/settings/publicKeys`} />
+                    <ExtensionPoint name="profile.setting" props={extensionProps} renderAll={true} />
+                  </SubNavigation>
+                )}
               </SecondaryNavigation>
             </SecondaryNavigationColumn>
           </CustomQueryFlexWrappedColumns>

scm-ui/ui-webapp/src/containers/ProfileInfo.tsx

@@ -24,7 +24,12 @@
 import React from "react";
 import { WithTranslation, withTranslation } from "react-i18next";
 import { Me } from "@scm-manager/ui-types";
-import { AvatarImage, AvatarWrapper, MailLink } from "@scm-manager/ui-components";
+import {
+  AvatarImage,
+  AvatarWrapper,
+  MailLink,
+  createAttributesForTesting
+} from "@scm-manager/ui-components";
 
 type Props = WithTranslation & {
   me: Me;
@@ -47,11 +52,11 @@ class ProfileInfo extends React.Component<Props> {
             <tbody>
               <tr>
                 <th>{t("profile.username")}</th>
-                <td>{me.name}</td>
+                <td {...createAttributesForTesting(me.name)}>{me.name}</td>
               </tr>
               <tr>
                 <th>{t("profile.displayName")}</th>
-                <td>{me.displayName}</td>
+                <td {...createAttributesForTesting(me.displayName)}>{me.displayName}</td>
               </tr>
               <tr>
                 <th>{t("profile.mail")}</th>