Merge pull request #4103 from estib-vega/filter-branches-fix

Branches filtering: Don't hide the filter component when filtering
This commit is contained in:
Caleb Owens 2024-06-18 10:53:13 +02:00 committed by GitHub
commit c1e579656a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 32 additions and 21 deletions

View File

@ -109,19 +109,23 @@
</script> </script>
<div class="branch-list"> <div class="branch-list">
<BranchesHeader count={$filteredBranches$?.length ?? 0} filtersActive={$filtersActive}> <BranchesHeader
<FilterPopupMenu totalBranchCount={$branches$.length}
slot="context-menu" filteredBranchCount={$filteredBranches$?.length}
let:visible filtersActive={$filtersActive}
{visible} >
{includePrs} {#snippet contextMenu({ visible })}
{includeRemote} <FilterPopupMenu
{includeStashed} {visible}
{hideBots} {includePrs}
{hideInactive} {includeRemote}
showPrCheckbox={githubService.isEnabled} {includeStashed}
on:action {hideBots}
/> {hideInactive}
showPrCheckbox={githubService.isEnabled}
on:action
/>
{/snippet}
</BranchesHeader> </BranchesHeader>
{#if $branches$?.length > 0} {#if $branches$?.length > 0}
<ScrollableContainer <ScrollableContainer

View File

@ -2,12 +2,19 @@
import { clickOutside } from '$lib/clickOutside'; import { clickOutside } from '$lib/clickOutside';
import Badge from '$lib/components/Badge.svelte'; import Badge from '$lib/components/Badge.svelte';
import Button from '$lib/components/Button.svelte'; import Button from '$lib/components/Button.svelte';
import type { Snippet } from 'svelte';
export let count: number | undefined; interface Props {
export let filtersActive = false; filteredBranchCount?: number;
totalBranchCount: number;
filtersActive: boolean;
contextMenu: Snippet<[{ visible: boolean }]>;
}
let visible = false; const { filteredBranchCount, totalBranchCount, filtersActive, contextMenu }: Props = $props();
let filterButton: HTMLDivElement;
let visible = $state(false);
let filterButton = $state<HTMLDivElement>();
function onFilterClick(e: Event) { function onFilterClick(e: Event) {
visible = !visible; visible = !visible;
@ -20,11 +27,11 @@
<div class="branches-title"> <div class="branches-title">
<span class="text-base-14 text-bold">Branches</span> <span class="text-base-14 text-bold">Branches</span>
{#if count !== undefined} {#if filteredBranchCount !== undefined}
<Badge {count} /> <Badge count={filteredBranchCount} />
{/if} {/if}
</div> </div>
{#if count && count > 0} {#if totalBranchCount > 0}
<div class="header__filter-btn" bind:this={filterButton}> <div class="header__filter-btn" bind:this={filterButton}>
<Button <Button
style="ghost" style="ghost"
@ -38,7 +45,7 @@
class="filter-popup-menu" class="filter-popup-menu"
use:clickOutside={{ trigger: filterButton, handler: () => (visible = false) }} use:clickOutside={{ trigger: filterButton, handler: () => (visible = false) }}
> >
<slot name="context-menu" {visible} /> {@render contextMenu({ visible })}
</div> </div>
</div> </div>
{/if} {/if}