From 521f3dd9e9c164a7295492cad296eb823a0e2de7 Mon Sep 17 00:00:00 2001 From: Philipp Czora Date: Mon, 5 Nov 2018 16:03:54 +0100 Subject: [PATCH 1/4] Implemented Profile component --- .../ui-components/src/layout/Footer.js | 3 +- scm-ui-components/packages/ui-types/src/Me.js | 3 +- scm-ui/public/locales/en/users.json | 3 + scm-ui/src/containers/Main.js | 7 ++ scm-ui/src/modules/auth.js | 8 +- scm-ui/src/modules/auth.test.js | 6 +- scm-ui/src/users/containers/Profile.js | 90 +++++++++++++++++++ 7 files changed, 115 insertions(+), 5 deletions(-) create mode 100644 scm-ui/src/users/containers/Profile.js diff --git a/scm-ui-components/packages/ui-components/src/layout/Footer.js b/scm-ui-components/packages/ui-components/src/layout/Footer.js index 4072711c7a..11ed52ac63 100644 --- a/scm-ui-components/packages/ui-components/src/layout/Footer.js +++ b/scm-ui-components/packages/ui-components/src/layout/Footer.js @@ -1,6 +1,7 @@ //@flow import React from "react"; import type { Me } from "@scm-manager/ui-types"; +import {Link} from "react-router-dom"; type Props = { me?: Me @@ -15,7 +16,7 @@ class Footer extends React.Component { return (
-

{me.displayName}

+

{me.displayName}

); diff --git a/scm-ui-components/packages/ui-types/src/Me.js b/scm-ui-components/packages/ui-types/src/Me.js index 65e4fc8336..ab67debae7 100644 --- a/scm-ui-components/packages/ui-types/src/Me.js +++ b/scm-ui-components/packages/ui-types/src/Me.js @@ -2,5 +2,6 @@ export type Me = { name: string, - displayName: string + displayName: string, + mail: string }; diff --git a/scm-ui/public/locales/en/users.json b/scm-ui/public/locales/en/users.json index 07540134be..2c29039f67 100644 --- a/scm-ui/public/locales/en/users.json +++ b/scm-ui/public/locales/en/users.json @@ -44,6 +44,9 @@ "information-label": "Information", "back-label": "Back" }, + "profile": { + "change-pw": "Change Password" + }, "validation": { "mail-invalid": "This email is invalid", "name-invalid": "This name is invalid", diff --git a/scm-ui/src/containers/Main.js b/scm-ui/src/containers/Main.js index a971bab54d..97ffa60125 100644 --- a/scm-ui/src/containers/Main.js +++ b/scm-ui/src/containers/Main.js @@ -19,6 +19,7 @@ import SingleGroup from "../groups/containers/SingleGroup"; import AddGroup from "../groups/containers/AddGroup"; import Config from "../config/containers/Config"; +import Profile from "../users/containers/Profile"; type Props = { authenticated?: boolean @@ -106,6 +107,12 @@ class Main extends React.Component { component={Config} authenticated={authenticated} /> + ); diff --git a/scm-ui/src/modules/auth.js b/scm-ui/src/modules/auth.js index fe636ac9d3..691ae2b128 100644 --- a/scm-ui/src/modules/auth.js +++ b/scm-ui/src/modules/auth.js @@ -1,5 +1,5 @@ // @flow -import type { Me } from "@scm-manager/ui-components"; +import type { Me } from "@scm-manager/ui-types"; import * as types from "./types"; import { apiClient, UNAUTHORIZED_ERROR } from "@scm-manager/ui-components"; @@ -136,7 +136,11 @@ const callFetchMe = (link: string): Promise => { return response.json(); }) .then(json => { - return { name: json.name, displayName: json.displayName }; + return { + name: json.name, + displayName: json.displayName, + mail: json.mail + }; }); }; diff --git a/scm-ui/src/modules/auth.test.js b/scm-ui/src/modules/auth.test.js index 1839701e0a..7236f803a8 100644 --- a/scm-ui/src/modules/auth.test.js +++ b/scm-ui/src/modules/auth.test.js @@ -37,7 +37,11 @@ import { FETCH_INDEXRESOURCES_SUCCESS } from "./indexResource"; -const me = { name: "tricia", displayName: "Tricia McMillian" }; +const me = { + name: "tricia", + displayName: "Tricia McMillian", + mail: "trillian@heartofgold.universe" +}; describe("auth reducer", () => { it("should set me and login on successful fetch of me", () => { diff --git a/scm-ui/src/users/containers/Profile.js b/scm-ui/src/users/containers/Profile.js new file mode 100644 index 0000000000..b8aa3ae068 --- /dev/null +++ b/scm-ui/src/users/containers/Profile.js @@ -0,0 +1,90 @@ +// @flow + +import React from "react"; + +import { + Page, + Navigation, + Section, + MailLink +} from "@scm-manager/ui-components"; +import { NavLink } from "react-router-dom"; +import { getMe } from "../../modules/auth"; +import { compose } from "redux"; +import { connect } from "react-redux"; +import { translate } from "react-i18next"; +import type { Me } from "@scm-manager/ui-types"; +import AvatarWrapper from "../../repos/components/changesets/AvatarWrapper"; + +type Props = { + me: Me, + + // Context props + t: string => string +}; +type State = {}; + +class Profile extends React.Component { + render() { + const { me, t } = this.props; + + if (!me) { + return null; + } + return ( + +
+ +
+
+

+ { + // TODO: add avatar + } + } +

+
+
+ +
+ + + + + + + + + + + + + + + +
{t("user.name")}{me.name}
{t("user.displayName")}{me.displayName}
{t("user.mail")} + +
+
+
+ +
+ {t("profile.change-pw")} + +
+
+ + ); + } +} + +const mapStateToProps = state => { + return { + me: getMe(state) + }; +}; + +export default compose( + translate("users"), + connect(mapStateToProps) +)(Profile); From 74382f26b7255496ef512dc563c57e8a9c5daf36 Mon Sep 17 00:00:00 2001 From: Philipp Czora Date: Wed, 7 Nov 2018 12:55:09 +0100 Subject: [PATCH 2/4] Moved Profile component to top level; added error message --- scm-ui/public/locales/en/commons.json | 9 ++++++ scm-ui/src/containers/Main.js | 2 +- scm-ui/src/{users => }/containers/Profile.js | 34 ++++++++++++-------- 3 files changed, 31 insertions(+), 14 deletions(-) rename scm-ui/src/{users => }/containers/Profile.js (64%) diff --git a/scm-ui/public/locales/en/commons.json b/scm-ui/public/locales/en/commons.json index b1bad56993..05e9f79d16 100644 --- a/scm-ui/public/locales/en/commons.json +++ b/scm-ui/public/locales/en/commons.json @@ -38,5 +38,14 @@ "paginator": { "next": "Next", "previous": "Previous" + }, + "profile": { + "actions-label": "Actions", + "username": "Username", + "displayName": "Display Name", + "mail": "E-Mail", + "change-password": "Change password", + "error-title": "Error", + "error-subtitle": "Cannot display profile" } } diff --git a/scm-ui/src/containers/Main.js b/scm-ui/src/containers/Main.js index 97ffa60125..05e3819c8a 100644 --- a/scm-ui/src/containers/Main.js +++ b/scm-ui/src/containers/Main.js @@ -19,7 +19,7 @@ import SingleGroup from "../groups/containers/SingleGroup"; import AddGroup from "../groups/containers/AddGroup"; import Config from "../config/containers/Config"; -import Profile from "../users/containers/Profile"; +import Profile from "./Profile"; type Props = { authenticated?: boolean diff --git a/scm-ui/src/users/containers/Profile.js b/scm-ui/src/containers/Profile.js similarity index 64% rename from scm-ui/src/users/containers/Profile.js rename to scm-ui/src/containers/Profile.js index b8aa3ae068..adb1ba5d6c 100644 --- a/scm-ui/src/users/containers/Profile.js +++ b/scm-ui/src/containers/Profile.js @@ -7,14 +7,15 @@ import { Navigation, Section, MailLink -} from "@scm-manager/ui-components"; +} from "../../../scm-ui-components/packages/ui-components/src/index"; import { NavLink } from "react-router-dom"; -import { getMe } from "../../modules/auth"; +import { getMe } from "../modules/auth"; import { compose } from "redux"; import { connect } from "react-redux"; import { translate } from "react-i18next"; -import type { Me } from "@scm-manager/ui-types"; -import AvatarWrapper from "../../repos/components/changesets/AvatarWrapper"; +import type { Me } from "../../../scm-ui-components/packages/ui-types/src/index"; +import AvatarWrapper from "../repos/components/changesets/AvatarWrapper"; +import { ErrorPage } from "@scm-manager/ui-components"; type Props = { me: Me, @@ -28,8 +29,14 @@ class Profile extends React.Component { render() { const { me, t } = this.props; - if (!me) { - return null; + if (me) { + return ( + + ); } return ( @@ -41,7 +48,6 @@ class Profile extends React.Component { { // TODO: add avatar } - }

@@ -50,15 +56,15 @@ class Profile extends React.Component { - + - + - + @@ -68,8 +74,10 @@ class Profile extends React.Component {
-
- {t("profile.change-pw")} +
+ + {t("profile.change-password")} +
@@ -85,6 +93,6 @@ const mapStateToProps = state => { }; export default compose( - translate("users"), + translate("commons"), connect(mapStateToProps) )(Profile); From 8a23537e6857bf0aa51611cb05c9789c4b6450d6 Mon Sep 17 00:00:00 2001 From: Philipp Czora Date: Wed, 7 Nov 2018 13:10:29 +0100 Subject: [PATCH 3/4] Removed unused i18n line --- scm-ui/public/locales/en/users.json | 3 --- 1 file changed, 3 deletions(-) diff --git a/scm-ui/public/locales/en/users.json b/scm-ui/public/locales/en/users.json index 2c29039f67..07540134be 100644 --- a/scm-ui/public/locales/en/users.json +++ b/scm-ui/public/locales/en/users.json @@ -44,9 +44,6 @@ "information-label": "Information", "back-label": "Back" }, - "profile": { - "change-pw": "Change Password" - }, "validation": { "mail-invalid": "This email is invalid", "name-invalid": "This name is invalid", From 7ca88e7839efef9bc7bbe4f2526517e7ca415a52 Mon Sep 17 00:00:00 2001 From: Philipp Czora Date: Wed, 7 Nov 2018 12:11:43 +0000 Subject: [PATCH 4/4] Close branch feature/ui_userprofile
{t("user.name")}{t("profile.username")} {me.name}
{t("user.displayName")}{t("profile.displayName")} {me.displayName}
{t("user.mail")}{t("profile.mail")}