Radish alpha
r
rad:z4V1sjrXqjvFdnCUbxPFqd5p4DtH5
Radicle web interface
Radicle
Git
Hide git clone behind a tab in the Clone button
Open rudolfs opened 2 years ago
4 files changed +56 -15 975d1823 703fb384
modified src/components/IconSmall.svelte
@@ -36,6 +36,7 @@
    | "file"
    | "folder"
    | "folder-open"
+
    | "git"
    | "globe"
    | "help"
    | "home"
@@ -324,6 +325,9 @@
      fill-rule="evenodd"
      clip-rule="evenodd"
      d="M3.672 6.97a1.25 1.25 0 011.24-1.095h8.238a1.25 1.25 0 011.24 1.405l-.562 4.5a1.25 1.25 0 01-1.24 1.095H3.585a.575.575 0 01-.57-.646l.657-5.259zm1.24-.095a.25.25 0 00-.248.219l-.598 4.781h8.522a.25.25 0 00.248-.219l.563-4.5a.25.25 0 00-.249-.281H4.912z" />
+
  {:else if name === "git"}
+
    <path
+
      d="M14.5354 8.22385L9.29616 2.98517C9.22442 2.9134 9.13924 2.85647 9.04549 2.81762C8.95173 2.77878 8.85125 2.75879 8.74977 2.75879C8.64829 2.75879 8.5478 2.77878 8.45405 2.81762C8.3603 2.85647 8.27512 2.9134 8.20337 2.98517L7.11545 4.07296L8.49527 5.4533C8.65748 5.398 8.83194 5.38926 8.99887 5.42808C9.1658 5.46689 9.31851 5.55171 9.43968 5.67291C9.56143 5.79488 9.64644 5.94862 9.68499 6.11659C9.72355 6.28457 9.71409 6.45999 9.65771 6.62285L10.9878 7.95329C11.1506 7.89668 11.326 7.88712 11.494 7.92571C11.662 7.9643 11.8158 8.04947 11.9376 8.17145C12.023 8.25676 12.0908 8.35809 12.1371 8.46964C12.1834 8.58119 12.2072 8.70077 12.2072 8.82153C12.2072 8.94229 12.1834 9.06187 12.1371 9.17342C12.0908 9.28497 12.023 9.3863 11.9376 9.47161C11.8522 9.5571 11.7508 9.62492 11.6392 9.6712C11.5276 9.71747 11.408 9.74129 11.2872 9.74129C11.1664 9.74129 11.0468 9.71747 10.9352 9.6712C10.8236 9.62492 10.7222 9.5571 10.6369 9.47161C10.5087 9.34325 10.4213 9.17984 10.3857 9.00194C10.3501 8.82403 10.3679 8.63958 10.4369 8.47177L9.19636 7.23126V10.4955C9.28641 10.5398 9.36861 10.5985 9.43968 10.6693C9.61212 10.8419 9.70899 11.0758 9.70899 11.3197C9.70899 11.5637 9.61212 11.7976 9.43968 11.9702C9.08024 12.3291 8.4979 12.3291 8.13952 11.9702C8.05401 11.8848 7.98617 11.7834 7.93988 11.6718C7.89359 11.5602 7.86977 11.4406 7.86977 11.3197C7.86977 11.1989 7.89359 11.0793 7.93988 10.9677C7.98617 10.8561 8.05401 10.7547 8.13952 10.6693C8.22534 10.583 8.32765 10.5148 8.44036 10.4688V7.17411C8.32765 7.12813 8.22534 7.05994 8.13952 6.97359C8.01043 6.84458 7.92262 6.6801 7.88727 6.50105C7.85191 6.322 7.87061 6.13649 7.94097 5.96809L6.58064 4.60724L2.98825 8.19963C2.91647 8.27137 2.85952 8.35656 2.82066 8.45033C2.78181 8.54409 2.76181 8.64459 2.76181 8.74609C2.76181 8.84758 2.78181 8.94809 2.82066 9.04185C2.85952 9.13561 2.91647 9.2208 2.98825 9.29255L8.22747 14.5318C8.29921 14.6035 8.38439 14.6605 8.47815 14.6993C8.5719 14.7381 8.67238 14.7581 8.77386 14.7581C8.87534 14.7581 8.97583 14.7381 9.06958 14.6993C9.16333 14.6605 9.24851 14.6035 9.32026 14.5318L14.5354 9.3173C14.6804 9.17229 14.7618 8.97563 14.7618 8.77058C14.7618 8.56552 14.6804 8.36886 14.5354 8.22385Z" />
  {:else if name === "globe"}
    <path
      fill-rule="evenodd"
modified src/views/projects/Header/CloneButton.svelte
@@ -1,19 +1,22 @@
<script lang="ts">
  import type { BaseUrl } from "@httpd-client";

-
  import { parseRepositoryId } from "@app/lib/utils";
  import { config } from "@app/lib/config";
+
  import { parseRepositoryId } from "@app/lib/utils";

  import Button from "@app/components/Button.svelte";
  import Command from "@app/components/Command.svelte";
-
  import ExternalLink from "@app/components/ExternalLink.svelte";
  import Icon from "@app/components/Icon.svelte";
+
  import IconSmall from "@app/components/IconSmall.svelte";
  import Popover from "@app/components/Popover.svelte";
+
  import Radio from "@app/components/Radio.svelte";

  export let baseUrl: BaseUrl;
  export let id: string;
  export let name: string;

+
  let radicle: boolean = true;
+

  $: radCloneUrl = `rad clone ${id}`;
  $: portFragment =
    baseUrl.scheme === config.nodes.defaultHttpdScheme &&
@@ -26,10 +29,12 @@
</script>

<style>
-
  label {
-
    display: block;
+
  .popover {
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-regular);
+
  }
+
  label {
+
    display: block;
    margin-bottom: 0.75rem;
  }
</style>
@@ -40,19 +45,49 @@
    <Icon name="download" />
  </Button>

-
  <div slot="popover" style:width="24rem">
+
  <div slot="popover" style:width="24rem" class="popover">
    <div style:margin-bottom="1.5rem">
+
      <Radio ariaLabel="Toggle render method">
+
        <Button
+
          styleWidth="100%"
+
          styleBorderRadius="0"
+
          variant={radicle ? "selected" : "not-selected"}
+
          on:click={() => {
+
            radicle = true;
+
          }}>
+
          <IconSmall name="logo" />
+
          Radicle
+
        </Button>
+
        <Button
+
          styleWidth="100%"
+
          styleBorderRadius="0"
+
          variant={!radicle ? "selected" : "not-selected"}
+
          on:click={() => {
+
            radicle = false;
+
          }}>
+
          <IconSmall name="git" />
+
          Git
+
        </Button>
+
      </Radio>
+
    </div>
+

+
    {#if radicle}
      <label for="rad-clone-url">
-
        Use the
-
        <ExternalLink href="https://radicle.xyz/#try">Radicle CLI</ExternalLink>
-
        to clone this project.
+
        Use the Radicle CLI to clone this project.
      </label>
      <Command command={radCloneUrl} />
-
    </div>
-

-
    <div>
-
      <label for="git-clone-url">Use Git to clone this repository.</label>
-
      <Command command={gitCloneUrl} />
-
    </div>
+
    {:else}
+
      <div>
+
        <label for="git-clone-url">
+
          If you don't have Radicle installed, you can still clone the
+
          repository via Git.
+
        </label>
+
        <Command command={gitCloneUrl} />
+
        <div style:margin-top="1.5rem">
+
          Note that a Git clone does not include any of the social artifacts
+
          such as issues or patches.
+
        </div>
+
      </div>
+
    {/if}
  </div>
</Popover>
modified tests/e2e/clipboard.spec.ts
@@ -49,6 +49,7 @@ test("copy to clipboard", async ({ page, browserName, context }) => {

  // `git clone` URL.
  {
+
    await page.getByRole("button", { name: "Git" }).click();
    await page.getByText("git clone").locator(".clipboard").first().click();
    await expectClipboard(
      `git clone http://127.0.0.1/${sourceBrowsingRid.replace(
modified tests/e2e/project.spec.ts
@@ -258,8 +258,9 @@ test("markdown files", async ({ page }) => {
test("clone modal", async ({ page }) => {
  await page.goto(sourceBrowsingUrl);

-
  await page.getByText("Clone").click();
+
  await page.getByRole("button", { name: "Clone" }).click();
  await expect(page.getByText(`rad clone ${sourceBrowsingRid}`)).toBeVisible();
+
  await page.getByRole("button", { name: "Git" }).click();
  await expect(
    page.getByText(
      `http://127.0.0.1/${sourceBrowsingRid.replace("rad:", "")}.git`,