Radish alpha
r
radicle-explorer
rad:z4V1sjrXqjvFdnCUbxPFqd5p4DtH5
Radicle web interface
Radicle
Git
Patches › 2e69a190
Add Checkout button to patch view
Merged rudolfs opened 1 year ago

check check-visual check-unit-test check-http-client-unit-test check-radicle-httpd check-e2e check-build check-http 👉 Preview 👉 Workflow runs 👉 Branch on GitHub

Activity Changes +44 -1
2 files changed +44 -1 c60b6451 → 0a2dbe9e
modified src/views/projects/Patch.svelte
@@ -52,6 +52,7 @@
  import Badge from "@app/components/Badge.svelte";

  import Button from "@app/components/Button.svelte";

  import Changeset from "@app/views/projects/Changeset.svelte";
+ 
  import CheckoutButton from "@app/views/projects/Patch/CheckoutButton.svelte";

  import CobHeader from "@app/views/projects/Cob/CobHeader.svelte";

  import CompareButton from "@app/views/projects/Patch/CompareButton.svelte";

  import DiffStatBadge from "@app/components/DiffStatBadge.svelte";
@@ -304,7 +305,12 @@
          {:else}

            <span class="txt-missing">No title</span>

          {/if}
- 
          <Share />
+ 
          <div class="global-flex-item">
+ 
            <Share />
+ 
            <div class="global-hide-on-mobile-down">
+ 
              <CheckoutButton id={patch.id} />
+ 
            </div>
+ 
          </div>

        </svelte:fragment>

        <svelte:fragment slot="state">

          <Badge size="tiny" variant={badgeColor(patch.state.status)}>
added src/views/projects/Patch/CheckoutButton.svelte
@@ -0,0 +1,37 @@
+ 
<script lang="ts">
+ 
  import Button from "@app/components/Button.svelte";
+ 
  import Command from "@app/components/Command.svelte";
+ 
  import IconSmall from "@app/components/IconSmall.svelte";
+ 
  import Popover from "@app/components/Popover.svelte";
+
+ 
  export let id: string;
+ 
</script>
+
+ 
<style>
+ 
  .label {
+ 
    display: block;
+ 
    font-size: var(--font-size-small);
+ 
    font-weight: var(--font-weight-regular);
+ 
    margin-bottom: 0.75rem;
+ 
  }
+ 
</style>
+
+ 
<Popover popoverPositionTop="2.5rem" popoverPositionRight="0">
+ 
  <Button
+ 
    slot="toggle"
+ 
    let:toggle
+ 
    variant="secondary-toggle-off"
+ 
    on:click={() => {
+ 
      toggle();
+ 
    }}>
+ 
    <IconSmall name="branch" />
+ 
    <span class="global-hide-on-small-desktop-down">Checkout</span>
+ 
  </Button>
+
+ 
  <div slot="popover" style:width="20rem">
+ 
    <span class="label">
+ 
      Run this command from a Radicle working copy to checkout this patch.
+ 
    </span>
+ 
    <Command command={`rad patch checkout ${id}`} />
+ 
  </div>
+ 
</Popover>