diff --git a/scm-ui/ui-components/src/__resources__/changesets.tsx b/scm-ui/ui-components/src/__resources__/changesets.tsx new file mode 100644 index 0000000000..5b235c4938 --- /dev/null +++ b/scm-ui/ui-components/src/__resources__/changesets.tsx @@ -0,0 +1,250 @@ +/* + * MIT License + * + * Copyright (c) 2020-present Cloudogu GmbH and Contributors + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ + +import { Changeset, PagedCollection } from "@scm-manager/ui-types"; + +const one: Changeset = { + id: "a88567ef1e9528a700555cad8c4576b72fc7c6dd", + author: { mail: "scm-admin@scm-manager.org", name: "SCM Administrator" }, + date: new Date("2020-06-09T06:34:47Z"), + description: + "The starship Heart of Gold was the first spacecraft to make use of the Infinite Improbability Drive. The craft was stolen by then-President Zaphod Beeblebrox at the official launch of the ship, as he was supposed to be officiating the launch. Later, during the use of the Infinite Improbability Drive, the ship picked up Arthur Dent and Ford Prefect, who were floating unprotected in deep space in the same star sector, having just escaped the destruction of the same planet.\n\n", + trailers: [ + { + trailerType: "Committed-by", + person: { mail: "zaphod.beeblebrox@hitchhiker.cm", name: "Zaphod Beeblebrox" } + }, + { trailerType: "Co-authored-by", person: { mail: "ford.prefect@hitchhiker.com", name: "Ford Prefect" } } + ], + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/changesets/a88567ef1e9528a700555cad8c4576b72fc7c6dd" + }, + diff: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/a88567ef1e9528a700555cad8c4576b72fc7c6dd" + }, + sources: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/sources/a88567ef1e9528a700555cad8c4576b72fc7c6dd" + }, + modifications: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/modifications/a88567ef1e9528a700555cad8c4576b72fc7c6dd" + }, + diffParsed: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/a88567ef1e9528a700555cad8c4576b72fc7c6dd/parsed" + } + }, + _embedded: { + tags: [], + branches: [], + parents: [ + { + id: "d21cc6c359270aef2196796f4d96af65f51866dc", + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/changesets/d21cc6c359270aef2196796f4d96af65f51866dc" + }, + diff: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/d21cc6c359270aef2196796f4d96af65f51866dc" + } + } + } + ] + } +}; + +const two: Changeset = { + id: "d21cc6c359270aef2196796f4d96af65f51866dc", + author: { mail: "scm-admin@scm-manager.org", name: "SCM Administrator" }, + date: new Date("2020-06-09T05:39:50Z"), + description: 'Change heading to "Heart Of Gold"\n\n', + trailers: [ + { + trailerType: "Committed-by", + person: { mail: "zaphod.beeblebrox@hitchhiker.cm", name: "Zaphod Beeblebrox" } + } + ], + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/changesets/d21cc6c359270aef2196796f4d96af65f51866dc" + }, + diff: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/d21cc6c359270aef2196796f4d96af65f51866dc" + }, + sources: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/sources/d21cc6c359270aef2196796f4d96af65f51866dc" + }, + modifications: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/modifications/d21cc6c359270aef2196796f4d96af65f51866dc" + }, + diffParsed: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/d21cc6c359270aef2196796f4d96af65f51866dc/parsed" + } + }, + _embedded: { + tags: [], + branches: [], + parents: [ + { + id: "e163c8f632db571c9aa51a8eb440e37cf550b825", + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/changesets/e163c8f632db571c9aa51a8eb440e37cf550b825" + }, + diff: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/e163c8f632db571c9aa51a8eb440e37cf550b825" + } + } + } + ] + } +}; + +const three: Changeset = { + id: "e163c8f632db571c9aa51a8eb440e37cf550b825", + author: { mail: "scm-admin@scm-manager.org", name: "SCM Administrator" }, + date: new Date("2020-06-09T05:25:16Z"), + description: "initialize repository", + trailers: [], + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/changesets/e163c8f632db571c9aa51a8eb440e37cf550b825" + }, + diff: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/e163c8f632db571c9aa51a8eb440e37cf550b825" + }, + sources: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/sources/e163c8f632db571c9aa51a8eb440e37cf550b825" + }, + modifications: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/modifications/e163c8f632db571c9aa51a8eb440e37cf550b825" + }, + diffParsed: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/e163c8f632db571c9aa51a8eb440e37cf550b825/parsed" + } + }, + _embedded: { tags: [], branches: [], parents: [] } +}; + +const four: Changeset = { + id: "b6c6f8fbd0d490936fae7d26ffdd4695cc2a0930", + author: { mail: "scm-admin@scm-manager.org", name: "SCM Administrator" }, + date: new Date("2020-06-09T09:23:49Z"), + description: "Added design docs\n\n", + trailers: [ + { trailerType: "Co-authored-by", person: { mail: "ford.prefect@hitchhiker.com", name: "Ford Prefect" } }, + { trailerType: "Co-authored-by", person: { mail: "zaphod.beeblebrox@hitchhiker.cm", name: "Zaphod Beeblebrox" } }, + { trailerType: "Co-authored-by", person: { mail: "trillian@hitchhiker.cm", name: "Tricia Marie McMillan" } } + ], + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/changesets/b6c6f8fbd0d490936fae7d26ffdd4695cc2a0930" + }, + diff: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/b6c6f8fbd0d490936fae7d26ffdd4695cc2a0930" + }, + sources: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/sources/b6c6f8fbd0d490936fae7d26ffdd4695cc2a0930" + }, + modifications: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/modifications/b6c6f8fbd0d490936fae7d26ffdd4695cc2a0930" + }, + diffParsed: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/b6c6f8fbd0d490936fae7d26ffdd4695cc2a0930/parsed" + } + }, + _embedded: { + tags: [], + branches: [], + parents: [ + { + id: "a88567ef1e9528a700555cad8c4576b72fc7c6dd", + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/changesets/a88567ef1e9528a700555cad8c4576b72fc7c6dd" + }, + diff: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/diff/a88567ef1e9528a700555cad8c4576b72fc7c6dd" + } + } + } + ] + } +}; + +const changesets: PagedCollection = { + page: 0, + pageTotal: 1, + _links: { + self: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/branches/master/changesets/?page=0&pageSize=10" + }, + first: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/branches/master/changesets/?page=0&pageSize=10" + }, + last: { + href: + "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/branches/master/changesets/?page=0&pageSize=10" + } + }, + _embedded: { + changesets: [one, two, three, four], + branch: { + name: "master", + _links: { + self: { href: "http://localhost:8081/scm/api/v2/repositories/hitchhiker/heart-of-gold/branches/master" } + } + } + } +}; + +export { one, two, three, four }; +export default changesets; diff --git a/scm-ui/ui-components/src/repos/changesets/ChangesetAuthor.tsx b/scm-ui/ui-components/src/repos/changesets/ChangesetAuthor.tsx index a5cbd09110..60e1e17f33 100644 --- a/scm-ui/ui-components/src/repos/changesets/ChangesetAuthor.tsx +++ b/scm-ui/ui-components/src/repos/changesets/ChangesetAuthor.tsx @@ -21,69 +21,117 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE * SOFTWARE. */ -import React from "react"; +import React, { FC } from "react"; import { Changeset } from "@scm-manager/ui-types"; -import { WithTranslation, withTranslation } from "react-i18next"; +import { useTranslation, WithTranslation, withTranslation } from "react-i18next"; +import { binder } from "@scm-manager/ui-extensions"; type Props = WithTranslation & { changeset: Changeset; }; -class ChangesetAuthor extends React.Component { - render() { - const { changeset } = this.props; - if (!changeset.author) { - return null; - } +type PersonType = { + name: string; + mail?: string; +}; - const { name, mail } = changeset.author; - if (mail) { - return this.withExtensionPoint(this.renderWithMail(name, mail)); - } - return this.withExtensionPoint(<>{name}); - } +type PersonProps = { + person: PersonType; +}; - renderWithMail(name: string, mail: string) { - const { t } = this.props; +const Person: FC = ({ person }) => { + const [t] = useTranslation("repos"); + if (person.mail) { return ( - - {name} + + {person.name} ); } + return <>{person.name}; +}; - getCoAuthorsFromChangeset() { - return this.props.changeset.trailers.filter(p => p.trailerType === "Co-authored-by").map(trailer => trailer.person); - } +type PersonsProps = { + persons: PersonType[]; + label: string; +}; - renderCoAuthors() { - const { t } = this.props; - const coAuthors = this.getCoAuthorsFromChangeset(); - - if (coAuthors.length > 0) { - const authorLabel = t("changeset.coAuthor.label", { count: coAuthors.length }); - return ( - <> - {" " + t("changeset.coAuthor.prefix") + " "} - "- " + person.name).join("\n")}> - {coAuthors.length + " " + authorLabel} - - - ); - } - - return null; - } - - withExtensionPoint(child: any) { - const { t } = this.props; +const Persons: FC = ({ persons, label }) => { + const [t] = useTranslation("repos"); + if (persons.length === 1) { return ( <> - {t("changeset.author.prefix")} {child} - {this.renderCoAuthors()} + {t(label)} ); } + return ( + <> + {t(label)}{" "} + "- " + person.name).join("\n")}> + {t("changesets.authors.more", { count: persons.length })} + + + ); +}; + +class ChangesetAuthor extends React.Component { + render() { + const { changeset, t } = this.props; + + const authorLine = []; + + if (changeset.author) { + authorLine.push(); + } + + const commiters = this.getCommiters(); + if (commiters.length > 0) { + authorLine.push(); + } + + const coAuthors = this.getCoAuthors(); + if (coAuthors.length > 0) { + authorLine.push(); + } + + // extensions + const extensions = binder.getExtensions("changesets.author.suffix", this.props); + if (extensions) { + coAuthors.push(...extensions); + } + + return ( + <> + {authorLine.map((p, i) => { + if (i === 0) { + return <>{p}; + } else if (i + 1 === authorLine.length) { + return ( + <> + {" "} + {t("changesets.authors.and")} {p}{" "} + + ); + } else { + return <>, {p}; + } + })} + + ); + } + + getCoAuthors() { + return this.filterTrailersByType("Co-authored-by"); + } + + getCommiters() { + return this.filterTrailersByType("Committed-by"); + } + + filterTrailersByType(t: string) { + return this.props.changeset.trailers.filter(p => p.trailerType === t).map(trailer => trailer.person); + } } export default withTranslation("repos")(ChangesetAuthor); diff --git a/scm-ui/ui-components/src/repos/changesets/ChangesetRow.tsx b/scm-ui/ui-components/src/repos/changesets/ChangesetRow.tsx index b6163ab3f9..0956f7f131 100644 --- a/scm-ui/ui-components/src/repos/changesets/ChangesetRow.tsx +++ b/scm-ui/ui-components/src/repos/changesets/ChangesetRow.tsx @@ -123,7 +123,7 @@ class ChangesetRow extends React.Component {

- + diff --git a/scm-ui/ui-components/src/repos/changesets/Changesets.stories.tsx b/scm-ui/ui-components/src/repos/changesets/Changesets.stories.tsx new file mode 100644 index 0000000000..a8a83ad30b --- /dev/null +++ b/scm-ui/ui-components/src/repos/changesets/Changesets.stories.tsx @@ -0,0 +1,51 @@ +/* + * MIT License + * + * Copyright (c) 2020-present Cloudogu GmbH and Contributors + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ + +import { storiesOf } from "@storybook/react"; +import * as React from "react"; +import styled from "styled-components"; +import { MemoryRouter } from "react-router-dom"; +import repository from "../../__resources__/repository"; +import ChangesetRow from "./ChangesetRow"; +import {one, two, three, four} from "../../__resources__/changesets"; + +const Wrapper = styled.div` + margin: 2rem; +`; + +storiesOf("Changesets", module) + .addDecorator(story => {story()}) + .addDecorator(storyFn => {storyFn()}) + .add("Default", () => ( + + )) + .add("With Committer", () => ( + + )) + .add("With Committer and Co-Author", () => ( + + )) + .add("With multiple Co-Authors", () => ( + + )); diff --git a/scm-ui/ui-webapp/public/locales/en/repos.json b/scm-ui/ui-webapp/public/locales/en/repos.json index 9bbc57ff19..621e3eafb8 100644 --- a/scm-ui/ui-webapp/public/locales/en/repos.json +++ b/scm-ui/ui-webapp/public/locales/en/repos.json @@ -79,7 +79,14 @@ "errorSubtitle": "Could not fetch changesets", "noChangesets": "No changesets found for this branch. The commits could have been removed.", "branchSelectorLabel": "Branches", - "collapseDiffs": "Collapse" + "collapseDiffs": "Collapse", + "authors": { + "and": "and", + "authoredBy": "Authored by", + "committedBy": "committed by", + "coAuthoredBy": "co authored by", + "more": "{{count}} more" + } }, "changeset": { "description": "Description",