From 1729e5ff4ffdf073701615a68ff2e7672e615195 Mon Sep 17 00:00:00 2001
From: Florian Scholdei <florian.scholdei@cloudogu.com>
Date: Wed, 26 Jun 2019 15:06:59 +0200
Subject: [PATCH] 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<Props> {
+  render() {
+    const { path, baseUrl } = this.props;
+
+    if (path) {
+      const paths = path.split("/");
+
+      return (
+        <nav className="breadcrumb" aria-label="breadcrumbs">
+          <ul>
+            {paths.map((path, index) => {
+              if (paths.length - 1 === index) {
+                return (
+                  <li className="is-active" key={index}>
+                    <Link to={"#"} aria-current="page">
+                      {path}
+                    </Link>
+                  </li>
+                );
+              }
+              return (
+                <li key={index}>
+                  <Link to={baseUrl + "/" + path}>{path}</Link>
+                </li>
+              );
+            })}
+          </ul>
+        </nav>
+      );
+    }
+    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<Props> {
       return (
         <div className="panel">
           {this.renderBranchSelector()}
+          <Breadcrumb path={path} baseUrl={baseUrl} />
           <FileTree
             repository={repository}
             revision={revision}