From 1729e5ff4ffdf073701615a68ff2e7672e615195 Mon Sep 17 00:00:00 2001 From: Florian Scholdei Date: Wed, 26 Jun 2019 15:06:59 +0200 Subject: [PATCH 1/5] implemented Breadcrumb ui-component --- .../packages/ui-components/src/Breadcrumb.js | 44 +++++++++++++++++++ .../packages/ui-components/src/index.js | 1 + .../src/repos/sources/containers/Sources.js | 4 +- 3 files changed, 47 insertions(+), 2 deletions(-) create mode 100644 scm-ui-components/packages/ui-components/src/Breadcrumb.js diff --git a/scm-ui-components/packages/ui-components/src/Breadcrumb.js b/scm-ui-components/packages/ui-components/src/Breadcrumb.js new file mode 100644 index 0000000000..7196a4ba3a --- /dev/null +++ b/scm-ui-components/packages/ui-components/src/Breadcrumb.js @@ -0,0 +1,44 @@ +//@flow +import React from "react"; +import { Link } from "react-router-dom"; + +type Props = { + path: string, + baseUrl: string +}; + +class Breadcrumb extends React.Component { + render() { + const { path, baseUrl } = this.props; + + if (path) { + const paths = path.split("/"); + + return ( + + ); + } + return null; + } +} + +export default Breadcrumb; diff --git a/scm-ui-components/packages/ui-components/src/index.js b/scm-ui-components/packages/ui-components/src/index.js index 82780c94eb..ae6fd6f875 100644 --- a/scm-ui-components/packages/ui-components/src/index.js +++ b/scm-ui-components/packages/ui-components/src/index.js @@ -27,6 +27,7 @@ export { default as Tooltip } from "./Tooltip"; export { getPageFromMatch } from "./urls"; export { default as Autocomplete} from "./Autocomplete"; export { default as BranchSelector } from "./BranchSelector"; +export { default as Breadcrumb } from "./Breadcrumb"; export { default as MarkdownView } from "./MarkdownView"; export { default as SyntaxHighlighter } from "./SyntaxHighlighter"; export { default as ErrorBoundary } from "./ErrorBoundary"; diff --git a/scm-ui/src/repos/sources/containers/Sources.js b/scm-ui/src/repos/sources/containers/Sources.js index 5cbf66c032..08d1a7c741 100644 --- a/scm-ui/src/repos/sources/containers/Sources.js +++ b/scm-ui/src/repos/sources/containers/Sources.js @@ -4,8 +4,7 @@ import { connect } from "react-redux"; import { withRouter } from "react-router-dom"; import type { Branch, Repository } from "@scm-manager/ui-types"; import FileTree from "../components/FileTree"; -import { ErrorNotification, Loading } from "@scm-manager/ui-components"; -import BranchSelector from "../../../../../scm-ui-components/packages/ui-components/src/BranchSelector"; +import { ErrorNotification, Loading, BranchSelector, Breadcrumb } from "@scm-manager/ui-components"; import { translate } from "react-i18next"; import { fetchBranches, @@ -95,6 +94,7 @@ class Sources extends React.Component { return (
{this.renderBranchSelector()} + Date: Wed, 26 Jun 2019 15:17:16 +0200 Subject: [PATCH 2/5] styling --- .../packages/ui-components/src/Breadcrumb.js | 55 ++++++++++++------- 1 file changed, 35 insertions(+), 20 deletions(-) diff --git a/scm-ui-components/packages/ui-components/src/Breadcrumb.js b/scm-ui-components/packages/ui-components/src/Breadcrumb.js index 7196a4ba3a..48342a5a25 100644 --- a/scm-ui-components/packages/ui-components/src/Breadcrumb.js +++ b/scm-ui-components/packages/ui-components/src/Breadcrumb.js @@ -1,44 +1,59 @@ //@flow import React from "react"; import { Link } from "react-router-dom"; +import injectSheet from "react-jss"; +import classNames from "classnames"; type Props = { path: string, - baseUrl: string + baseUrl: string, + classes: any +}; + +const styles = { + margin: { + margin: "1rem 1.25rem 0rem" + } }; class Breadcrumb extends React.Component { render() { - const { path, baseUrl } = this.props; + const { path, baseUrl, classes } = this.props; if (path) { const paths = path.split("/"); return ( - +
+ ); } return null; } } -export default Breadcrumb; +export default injectSheet(styles)(Breadcrumb); From c94998c454432bfae6a387cb4c56137699f4229d Mon Sep 17 00:00:00 2001 From: Florian Scholdei Date: Thu, 27 Jun 2019 13:54:04 +0200 Subject: [PATCH 3/5] corrected path link --- .../packages/ui-components/src/Breadcrumb.js | 8 ++++++-- scm-ui/src/repos/sources/containers/Sources.js | 9 +++++++-- 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/scm-ui-components/packages/ui-components/src/Breadcrumb.js b/scm-ui-components/packages/ui-components/src/Breadcrumb.js index 48342a5a25..35d96bc0cd 100644 --- a/scm-ui-components/packages/ui-components/src/Breadcrumb.js +++ b/scm-ui-components/packages/ui-components/src/Breadcrumb.js @@ -5,6 +5,7 @@ import injectSheet from "react-jss"; import classNames from "classnames"; type Props = { + revision: string, path: string, baseUrl: string, classes: any @@ -18,7 +19,7 @@ const styles = { class Breadcrumb extends React.Component { render() { - const { path, baseUrl, classes } = this.props; + const { revision, path, baseUrl, classes } = this.props; if (path) { const paths = path.split("/"); @@ -31,6 +32,7 @@ class Breadcrumb extends React.Component { >
    {paths.map((path, index) => { + const currPath = paths.slice(0, index + 1).join("/"); if (paths.length - 1 === index) { return (
  • @@ -42,7 +44,9 @@ class Breadcrumb extends React.Component { } return (
  • - {path} + + {path} +
    • ); })} diff --git a/scm-ui/src/repos/sources/containers/Sources.js b/scm-ui/src/repos/sources/containers/Sources.js index 08d1a7c741..ddc469760c 100644 --- a/scm-ui/src/repos/sources/containers/Sources.js +++ b/scm-ui/src/repos/sources/containers/Sources.js @@ -4,7 +4,12 @@ import { connect } from "react-redux"; import { withRouter } from "react-router-dom"; import type { Branch, Repository } from "@scm-manager/ui-types"; import FileTree from "../components/FileTree"; -import { ErrorNotification, Loading, BranchSelector, Breadcrumb } from "@scm-manager/ui-components"; +import { + ErrorNotification, + Loading, + BranchSelector, + Breadcrumb +} from "@scm-manager/ui-components"; import { translate } from "react-i18next"; import { fetchBranches, @@ -94,7 +99,7 @@ class Sources extends React.Component { return (
    {this.renderBranchSelector()} - + Date: Thu, 27 Jun 2019 17:56:26 +0200 Subject: [PATCH 4/5] improved sizing, added slash at the end --- .../packages/ui-components/src/Breadcrumb.js | 74 +++++++++---------- scm-ui/styles/scm.scss | 10 +++ 2 files changed, 46 insertions(+), 38 deletions(-) diff --git a/scm-ui-components/packages/ui-components/src/Breadcrumb.js b/scm-ui-components/packages/ui-components/src/Breadcrumb.js index 35d96bc0cd..d26bb826b4 100644 --- a/scm-ui-components/packages/ui-components/src/Breadcrumb.js +++ b/scm-ui-components/packages/ui-components/src/Breadcrumb.js @@ -2,7 +2,6 @@ import React from "react"; import { Link } from "react-router-dom"; import injectSheet from "react-jss"; -import classNames from "classnames"; type Props = { revision: string, @@ -12,51 +11,50 @@ type Props = { }; const styles = { - margin: { - margin: "1rem 1.25rem 0rem" + noMargin: { + margin: "0" } }; class Breadcrumb extends React.Component { - render() { - const { revision, path, baseUrl, classes } = this.props; + renderPath() { + const { revision, path, baseUrl } = this.props; if (path) { const paths = path.split("/"); - - return ( - <> - -
    - - ); + const map = paths.map((path, index) => { + const currPath = paths.slice(0, index + 1).join("/"); + if (paths.length - 1 === index) { + return ( +
  • + + {path} + +
    • + ); + } + return ( +
  • + {path} +
    • + ); + }); + return map; } - return null; + return
  • ; + } + + render() { + const { classes } = this.props; + + return ( + <> + +
    + + ); } } diff --git a/scm-ui/styles/scm.scss b/scm-ui/styles/scm.scss index 05bd1c2949..44c3aaae62 100644 --- a/scm-ui/styles/scm.scss +++ b/scm-ui/styles/scm.scss @@ -339,6 +339,16 @@ form .field:not(.is-grouped) { } } +// sources breadcrumb +.sources-breadcrumb { + margin: 1rem 1.25rem !important; + + li:last-child:after { + color: #b5b5b5; + content: "\0002f"; + } +} + // pagination .pagination-next, .pagination-link, From 7f55f1d46dc97210b0561bc378f2aa6bd138fa85 Mon Sep 17 00:00:00 2001 From: Eduard Heimbuch Date: Tue, 2 Jul 2019 12:11:25 +0000 Subject: [PATCH 5/5] Close branch feature/source_breadcrumb