Radish alpha
r
radicle-explorer
Radicle web interface
Radicle
Git (anonymous pull)
Log in to clone via SSH
Commits ›
Move Compare tab in Patch view to where revision button is
Rūdolfs Ošiņš committed 1 year ago
commit 30d7991d144cfc95699a6d3409b2b4bb82ef2c68
parent ea915a698be665ed41550f38fe41a0bf2b965293
2 files changed +43 -31
modified src/views/projects/Patch.svelte
@@ -66,6 +66,7 @@
  import CobHeader from "@app/views/projects/Cob/CobHeader.svelte";

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

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

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

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

  import Embeds from "@app/views/projects/Cob/Embeds.svelte";
@@ -688,10 +689,6 @@
    gap: 0.5rem;

    width: 100%;

  }
- 
  .diff-button-range {
- 
    font-family: var(--font-family-monospace);
- 
    font-weight: var(--font-weight-bold);
- 
  }

  .connector {

    width: 1px;

    height: 1.5rem;
@@ -898,35 +895,15 @@
            <Link {route}>

              <Button

                size="large"
- 
                variant={name === view.name ? "tab-active" : "tab"}>
+ 
                variant={name === view.name ||
+ 
                (view.name === "diff" && name === "changes")
+ 
                  ? "tab-active"
+ 
                  : "tab"}>

                <IconSmall name={icon} />

                {capitalize(name)}

              </Button>

            </Link>

          {/each}
- 
          {#if view.name === "diff"}
- 
            <Link
- 
              route={{
- 
                resource: "project.patch",
- 
                project: project.id,
- 
                node: baseUrl,
- 
                patch: patch.id,
- 
                view: {
- 
                  name: "diff",
- 
                  fromCommit: view.fromCommit,
- 
                  toCommit: view.toCommit,
- 
                },
- 
              }}>
- 
              <Button size="large" variant="tab-active">
- 
                Compare <span class="diff-button-range">
- 
                  {view.fromCommit.substring(0, 6)}..{view.toCommit.substring(
- 
                    0,
- 
                    6,
- 
                  )}
- 
                </span>
- 
              </Button>
- 
            </Link>
- 
          {/if}

        </Radio>



        {#if view.name === "changes"}
@@ -936,6 +913,17 @@
            <RevisionSelector {view} {baseUrl} {patch} {project} />

          </div>

        {/if}
+ 
        {#if view.name === "diff"}
+ 
          <div
+ 
            class="global-hide-on-mobile-down"
+ 
            style="margin-left: auto; margin-top: -0.5rem;">
+ 
            <div style:margin-left="auto">
+ 
              <CompareButton
+ 
                fromCommit={view.fromCommit}
+ 
                toCommit={view.toCommit} />
+ 
            </div>
+ 
          </div>
+ 
        {/if}

        <div class="tabs-spacer" />

      </div>

      <div class="bottom">
@@ -945,12 +933,19 @@
            style:padding="0 1rem"

            style:display="flex"

            class="global-hide-on-small-desktop-up">
- 
            <div style:margin-left="auto">
- 
              <RevisionSelector {view} {baseUrl} {patch} {project} />
- 
            </div>
+ 
            <RevisionSelector {view} {baseUrl} {patch} {project} />

          </div>

        {/if}

        {#if view.name === "diff"}
+ 
          <div
+ 
            style:width="100%"
+ 
            style:padding="0 1rem"
+ 
            style:display="flex"
+ 
            class="global-hide-on-small-desktop-up">
+ 
            <CompareButton
+ 
              fromCommit={view.fromCommit}
+ 
              toCommit={view.toCommit} />
+ 
          </div>

          <Changeset

            {baseUrl}

            projectId={project.id}
added src/views/projects/Patch/CompareButton.svelte
@@ -0,0 +1,17 @@
+ 
<script lang="ts">
+ 
  import Button from "@app/components/Button.svelte";
+ 
  import IconSmall from "@app/components/IconSmall.svelte";
+
+ 
  export let fromCommit: string;
+ 
  export let toCommit: string;
+ 
</script>
+
+ 
<Button size="regular" disabled>
+ 
  <span style:color="var(--color-foreground-contrast)">Compare</span>
+ 
  <span
+ 
    style:color="var(--color-fill-secondary)"
+ 
    style:font-family="var(--font-family-monospace)">
+ 
    {fromCommit.substring(0, 6)}..{toCommit.substring(0, 6)}
+ 
  </span>
+ 
  <IconSmall name={"chevron-down"} />
+ 
</Button>