Radish alpha
r
radicle-explorer
Radicle web interface
Radicle
Git (anonymous pull)
Log in to clone via SSH
Commits ›
Improve the Branch Selector
Sebastian Martinez committed 2 years ago
commit b8408db4f114abce2d3c80f9c945c860990b5f3c
parent e172aac1af65a97ee9e15c603538540ed02b7308
3 files changed +13 -9
modified src/components/DropdownList.svelte
@@ -2,6 +2,7 @@
  type T = $$Generic;



  export let items: T[];
+ 
  export let styleDropdownMinWidth: string | undefined = undefined;

</script>



<style>
@@ -20,7 +21,7 @@
  }

</style>
- 
<div class="dropdown">
+ 
<div class="dropdown" style:min-width={styleDropdownMinWidth}>

  {#each items as item}

    <div class="dropdown-item">

      <slot name="item" {item} />
modified src/views/projects/Source/BranchSelector.svelte
@@ -19,7 +19,7 @@
  export let selectedBranch: string | undefined;

  export let selectedCommitId: string;
- 
  $: hideDropdown = branches.length <= 1;
+ 
  $: onCanonicalBranch = branches.length === 0;

  $: selectedCommitShortId = utils.formatCommit(selectedCommitId);

</script>
@@ -38,7 +38,7 @@


<div class="branch">

  {#if selectedBranch}
- 
    {#if hideDropdown}
+ 
    {#if onCanonicalBranch}

      <HoverPopover popoverPositionLeft="0" popoverPositionTop="0.5rem">

        <Button

          ariaLabel="canonical-branch"
@@ -73,15 +73,18 @@
          on:click={toggle}

          slot="toggle"

          styleBorderRadius="var(--border-radius-tiny) 0 0 var(--border-radius-tiny)"
- 
          title="Change branch"
- 
          disabled={hideDropdown}>
+ 
          title="Change branch">

          <IconSmall name="branch" />

          <div class="identifier">{selectedBranch}</div>
- 
          <IconSmall
- 
            name={hideDropdown && expanded ? "chevron-up" : "chevron-down"} />
+ 
          {#if !onCanonicalBranch}
+ 
            <IconSmall name={expanded ? "chevron-up" : "chevron-down"} />
+ 
          {/if}

        </Button>
- 
        <DropdownList slot="popover" items={branches}>
+ 
        <DropdownList
+ 
          slot="popover"
+ 
          styleDropdownMinWidth="12.5rem"
+ 
          items={branches}>

          <svelte:fragment slot="item" let:item>

            <Link route={item.route} on:afterNavigate={() => closeFocused()}>

              <DropdownListItem selected={item.name === selectedBranch}>
modified tests/e2e/project.spec.ts
@@ -352,7 +352,7 @@ test("peer and branch switching", async ({ page }) => {


    // Default `main` branch.

    {
- 
      await expect(page.getByLabel("canonical-branch")).toBeVisible();
+ 
      await expect(page.getByRole("button", { name: "main" })).toBeVisible();

      await expect(page.getByTitle("Current HEAD")).toHaveText(

        bobHead.substring(0, 7),

      );