fix: environment filters (#6611)

This commit is contained in:
Prospector
2026-07-04 16:15:28 -07:00
committed by GitHub
parent ac63abadb7
commit b0108e0624
13 changed files with 190 additions and 68 deletions
@@ -1,6 +1,6 @@
<template>
<div v-bind="$attrs">
<div v-if="divider && !!slots.title" class="flex items-center gap-4 mb-4">
<div v-if="divider && (!!slots.title || !!slots.button)" class="flex items-center gap-4 mb-4">
<button
:class="
buttonClass ??
@@ -24,7 +24,7 @@
<hr class="h-px w-full border-none bg-divider" aria-hidden="true" />
</div>
<button
v-else-if="!!slots.title"
v-else-if="!!slots.title || !!slots.button"
:class="buttonClass ?? 'flex flex-col gap-2 bg-transparent m-0 p-0 border-none'"
@click="() => (forceOpen ? undefined : toggledOpen ? close() : open())"
>
@@ -7,10 +7,16 @@
title-wrapper-class="flex flex-col gap-2 justify-start items-start"
:open-by-default="openByDefault !== undefined ? openByDefault : true"
>
<template #title>
<slot name="header" :filter="filterType">
<h2 class="font-semibold">{{ filterType.formatted_name }}</h2>
</slot>
<template #button="{ open }">
<div class="flex items-center gap-1 w-full text-contrast">
<slot name="header" :filter="filterType">
<h2 class="text-base font-semibold text-red">{{ filterType.formatted_name }}</h2>
</slot>
<DropdownIcon
class="ml-auto size-5 transition-transform duration-300 shrink-0 text-primary group-hover:text-contrast"
:class="{ 'rotate-180': open }"
/>
</div>
</template>
<template
v-if="
@@ -39,7 +45,7 @@
</div>
</template>
<template v-if="locked" #default>
<div class="flex flex-col gap-2 p-3 border-dashed border-2 rounded-2xl border-divider mx-2">
<div class="flex flex-col gap-2 p-3 border-dashed border-2 rounded-2xl border-divider">
<p class="m-0 font-bold items-center">
<slot :name="`locked-${filterType.id}`">
{{ formatMessage(messages.lockedTitle, { type: filterType.formatted_name }) }}