Add files to empty repository (#1717)

It should also be possible to create new files in empty non-initiated repositories with the help of scm-manager/scm-editor-plugin/pull/39. So that the plugin can mount itself, a new endpoint was provided hereby.

Co-authored-by: Eduard Heimbuch <eduard.heimbuch@cloudogu.com>

scm-ui/ui-components/src/Breadcrumb.tsx

@@ -26,12 +26,12 @@ import { useTranslation } from "react-i18next";
 import { useHistory, useLocation, Link } from "react-router-dom";
 import classNames from "classnames";
 import styled from "styled-components";
-import { binder, ExtensionPoint } from "@scm-manager/ui-extensions";
+import { urls } from "@scm-manager/ui-api";
 import { Branch, Repository, File } from "@scm-manager/ui-types";
+import { binder, ExtensionPoint, extensionPoints } from "@scm-manager/ui-extensions";
 import Icon from "./Icon";
 import Tooltip from "./Tooltip";
 import copyToClipboard from "./CopyToClipboard";
-import { urls } from "@scm-manager/ui-api";
 
 type Props = {
   repository: Repository;
@@ -65,8 +65,6 @@ const BreadcrumbNav = styled.nav`
   flex: 1;
   display: flex;
   align-items: center;
-  margin: 1rem 1rem !important;
-
   width: 100%;
 
   /* move slash to end */
@@ -127,7 +125,7 @@ const Breadcrumb: FC<Props> = ({
   baseUrl,
   sources,
   permalink,
-  preButtons
+  preButtons,
 }) => {
   const location = useLocation();
   const history = useHistory();
@@ -138,7 +136,10 @@ const Breadcrumb: FC<Props> = ({
     if (path) {
       const paths = path.split("/");
       return paths.map((pathFragment, index) => {
-        const currPath = paths.slice(0, index + 1).join("/");
+        let currPath = paths.slice(0, index + 1).join("/");
+        if (!currPath.endsWith("/")) {
+          currPath = currPath + "/";
+        }
         if (paths.length - 1 === index) {
           return (
             <li className="is-active" key={index}>
@@ -172,15 +173,45 @@ const Breadcrumb: FC<Props> = ({
     ).finally(() => setCopying(false));
   };
 
-  let homeUrl = baseUrl + "/";
-  if (revision) {
-    homeUrl += encodeURIComponent(revision) + "/";
-  }
+  const renderBreadcrumbNav = () => {
+    let prefixButtons = null;
+    if (preButtons) {
+      prefixButtons = <PrefixButton>{preButtons}</PrefixButton>;
+    }
 
-  let prefixButtons = null;
-  if (preButtons) {
-    prefixButtons = <PrefixButton>{preButtons}</PrefixButton>;
-  }
+    let homeUrl = baseUrl + "/";
+    if (revision) {
+      homeUrl += encodeURIComponent(revision) + "/";
+    } else {
+      homeUrl = `/repo/${repository.namespace}/${repository.name}/code/sources/`;
+    }
+
+    return (
+      <BreadcrumbNav
+        className={classNames("breadcrumb", "sources-breadcrumb", "mx-2", "my-4")}
+        aria-label="breadcrumbs"
+      >
+        {prefixButtons}
+        <ul>
+          <li>
+            <Link to={homeUrl}>
+              <HomeIcon title={t("breadcrumb.home")} name="home" color="inherit" />
+            </Link>
+          </li>
+          {pathSection()}
+        </ul>
+        <PermaLinkWrapper className="ml-1">
+          {copying ? (
+            <Icon name="spinner fa-spin" />
+          ) : (
+            <Tooltip message={t("breadcrumb.copyPermalink")}>
+              <Icon name="link" color="inherit" onClick={() => copySource()} />
+            </Tooltip>
+          )}
+        </PermaLinkWrapper>
+      </BreadcrumbNav>
+    );
+  };
 
   const extProps = {
     baseUrl,
@@ -188,40 +219,33 @@ const Breadcrumb: FC<Props> = ({
     branch: branch ? branch : defaultBranch,
     path,
     sources,
-    repository
+    repository,
+  };
+
+  const renderExtensionPoints = () => {
+    if (
+      binder.hasExtension<extensionPoints.ReposSourcesEmptyActionbar>("repos.sources.empty.actionbar") &&
+      sources?._embedded?.children?.length === 0
+    ) {
+      return (
+        <ExtensionPoint
+          name="repos.sources.empty.actionbar"
+          props={{ repository, sources }}
+          renderAll={true}
+        />
+      );
+    }
+    if (binder.hasExtension<extensionPoints.ReposSourcesActionbar>("repos.sources.actionbar")) {
+      return <ExtensionPoint name="repos.sources.actionbar" props={extProps} renderAll={true} />;
+    }
+    return null;
   };
 
   return (
     <>
-      <div className="is-flex is-align-items-center">
-        <BreadcrumbNav
-          className={classNames("breadcrumb", "sources-breadcrumb", "ml-1", "mb-0")}
-          aria-label="breadcrumbs"
-        >
-          {prefixButtons}
-          <ul>
-            <li>
-              <Link to={homeUrl}>
-                <HomeIcon title={t("breadcrumb.home")} name="home" color="inherit" />
-              </Link>
-            </li>
-            {pathSection()}
-          </ul>
-          <PermaLinkWrapper className="ml-1">
-            {copying ? (
-              <Icon name="spinner fa-spin" />
-            ) : (
-              <Tooltip message={t("breadcrumb.copyPermalink")}>
-                <Icon name="link" color="inherit" onClick={() => copySource()} />
-              </Tooltip>
-            )}
-          </PermaLinkWrapper>
-        </BreadcrumbNav>
-        {binder.hasExtension("repos.sources.actionbar") && (
-          <ActionBar>
-            <ExtensionPoint name="repos.sources.actionbar" props={extProps} renderAll={true} />
-          </ActionBar>
-        )}
+      <div className="is-flex is-align-items-center is-justify-content-flex-end">
+        {renderBreadcrumbNav()}
+        {<ActionBar className="my-2">{renderExtensionPoints()}</ActionBar>}
       </div>
       <hr className="is-marginless" />
     </>

scm-ui/ui-components/src/__snapshots__/storyshots.test.ts.snap

@@ -1663,11 +1663,11 @@ exports[`Storyshots BreadCrumb Default 1`] = `
   className="Breadcrumbstories__Wrapper-sc-1eq8sgz-0 exRctT"
 >
   <div
-    className="is-flex is-align-items-center"
+    className="is-flex is-align-items-center is-justify-content-flex-end"
   >
     <nav
       aria-label="breadcrumbs"
-      className="Breadcrumb__BreadcrumbNav-zvtb4t-1 ieUHOq breadcrumb sources-breadcrumb ml-1 mb-0"
+      className="Breadcrumb__BreadcrumbNav-zvtb4t-1 eupowG breadcrumb sources-breadcrumb mx-2 my-4"
     >
       <ul>
         <li>
@@ -1684,7 +1684,7 @@ exports[`Storyshots BreadCrumb Default 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src/"
             onClick={[Function]}
             title="src"
           >
@@ -1694,7 +1694,7 @@ exports[`Storyshots BreadCrumb Default 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src/main"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src/main/"
             onClick={[Function]}
             title="main"
           >
@@ -1704,7 +1704,7 @@ exports[`Storyshots BreadCrumb Default 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src/main/java"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src/main/java/"
             onClick={[Function]}
             title="java"
           >
@@ -1714,7 +1714,7 @@ exports[`Storyshots BreadCrumb Default 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src/main/java/com"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/src/main/java/com/"
             onClick={[Function]}
             title="com"
           >
@@ -1748,6 +1748,9 @@ exports[`Storyshots BreadCrumb Default 1`] = `
         </span>
       </span>
     </nav>
+    <div
+      className="Breadcrumb__ActionBar-zvtb4t-3 izqSnl my-2"
+    />
   </div>
   <hr
     className="is-marginless"
@@ -1760,11 +1763,11 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
   className="Breadcrumbstories__Wrapper-sc-1eq8sgz-0 exRctT"
 >
   <div
-    className="is-flex is-align-items-center"
+    className="is-flex is-align-items-center is-justify-content-flex-end"
   >
     <nav
       aria-label="breadcrumbs"
-      className="Breadcrumb__BreadcrumbNav-zvtb4t-1 ieUHOq breadcrumb sources-breadcrumb ml-1 mb-0"
+      className="Breadcrumb__BreadcrumbNav-zvtb4t-1 eupowG breadcrumb sources-breadcrumb mx-2 my-4"
     >
       <ul>
         <li>
@@ -1781,7 +1784,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/"
             onClick={[Function]}
             title="dream-path"
           >
@@ -1791,7 +1794,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/"
             onClick={[Function]}
             title="src"
           >
@@ -1801,7 +1804,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/"
             onClick={[Function]}
             title="main"
           >
@@ -1811,7 +1814,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/"
             onClick={[Function]}
             title="scm-plugins"
           >
@@ -1821,7 +1824,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/"
             onClick={[Function]}
             title="javaUtilityHomeHousingLinkReferrer"
           >
@@ -1831,7 +1834,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia/"
             onClick={[Function]}
             title="sonia"
           >
@@ -1841,7 +1844,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia/scm"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia/scm/"
             onClick={[Function]}
             title="scm"
           >
@@ -1851,7 +1854,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia/scm/repositoryUndergroundSupportManager"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia/scm/repositoryUndergroundSupportManager/"
             onClick={[Function]}
             title="repositoryUndergroundSupportManager"
           >
@@ -1861,7 +1864,7 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         <li>
           <a
             className="is-ellipsis-overflow"
-            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia/scm/repositoryUndergroundSupportManager/spi"
+            href="/scm-manager.org/scm/repo/hitchhiker/heartOfGold/sources/1/dream-path/src/main/scm-plugins/javaUtilityHomeHousingLinkReferrer/sonia/scm/repositoryUndergroundSupportManager/spi/"
             onClick={[Function]}
             title="spi"
           >
@@ -1895,6 +1898,9 @@ exports[`Storyshots BreadCrumb Long path 1`] = `
         </span>
       </span>
     </nav>
+    <div
+      className="Breadcrumb__ActionBar-zvtb4t-3 izqSnl my-2"
+    />
   </div>
   <hr
     className="is-marginless"