zoeissleeping/veridian
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: dropdown settings buttons | fix: improve model selector

Browse Source 
I should have split this into two commits, but I found the issue with the
settings buttons *after* I changed how the model selector worked, so its
all in this single commit.
This commit is contained in:
Zoe
2026-02-25 16:12:51 +00:00
parent f6dc4c1ee9
commit 62f1fe1c27
8 changed files with 157 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/Settings/AIServiceProvider.vue
+8 -5
View File
@@ -7,14 +7,17 @@ import ModelItem from './ModelItem.vue';
import RowVirtualizerDynamic from '../RowVirtualizerDynamic.vue';
const triplit = useTriplitClient();
const { pageParams } = useSettings();
const props = defineProps<{
params?: string;
}>();
const { providers } = useModels();
const scrollContainerRef = ref<HTMLDivElement | null>(null);
const provider = computed(() => {
if (pageParams.value.length === 0) return null;
return providers.value!.find(p => p.id === pageParams.value[0]);
if (props.params === undefined) return null;
return providers.value!.find(p => p.id === props.params);
});
watch(provider, async () => {
@@ -28,8 +31,8 @@ const apiKey = ref('');
const apiProxyUrl = ref(provider.value?.config.apiProxyUrl ?? '');
const modelSearch = ref('');
watch(pageParams, () => {
if (pageParams.value.length === 0) return;
watch(() => props.params, () => {
if (props.params === undefined) return;
console.log(scrollContainerRef.value);
apiKey.value = provider.value?.config.apiKey ?? '';
apiProxyUrl.value = provider.value?.config.apiProxyUrl ?? '';
app/components/Settings/ProviderSidebar.vue
+6 -4
View File
@@ -1,8 +1,10 @@
<script setup lang="ts">
import { providerIcons } from '~/utils/model-mapping';
const { pageParams } = useSettings();
const { providers } = await useModels();
defineProps<{
params?: string;
}>();
const { providers } = useModels();
defineEmits(['navigate']);
</script>
@@ -22,7 +24,7 @@ defineEmits(['navigate']);
<div class="px-2 py-4 font-bold text-xs uppercase opacity-50">Enabled Providers</div>
<button v-for="p in providers?.filter(p => p.enabled)" :key="p.id" @click="$emit('navigate', 'providers', p.id)"
:class="['capitalize flex items-center justify-between p-2 hover:bg-[var(--color-hover)] transition-colors duration-200 ease-[cubic-bezier(0.5,_1,_0.89,_1)] rounded-lg', p.id === pageParams[0] ? 'bg-[var(--color-hover)]' : '']">
:class="['capitalize flex items-center justify-between p-2 hover:bg-[var(--color-hover)] transition-colors duration-200 ease-[cubic-bezier(0.5,_1,_0.89,_1)] rounded-lg', p.id === params ? 'bg-[var(--color-hover)]' : '']">
<div class="flex items-center gap-2">
<component v-if="providerIcons[p.type]" :color="true" :is="providerIcons[p.type]"
class="w-4 h-4 text-[var(--text-primary)]" />
@@ -34,7 +36,7 @@ defineEmits(['navigate']);
<button v-for="p in providers?.filter(p => !p.enabled)" :key="p.id"
@click="$emit('navigate', 'providers', p.id)"
:class="['capitalize flex items-center justify-between p-2 hover:bg-[var(--color-hover)] transition-colors duration-200 ease-[cubic-bezier(0.5,_1,_0.89,_1)] rounded-lg', p.id === pageParams[0] ? 'bg-[var(--color-hover)]' : '']">
:class="['capitalize flex items-center justify-between p-2 hover:bg-[var(--color-hover)] transition-colors duration-200 ease-[cubic-bezier(0.5,_1,_0.89,_1)] rounded-lg', p.id === params ? 'bg-[var(--color-hover)]' : '']">
<div class="flex items-center gap-2">
<component v-if="providerIcons[p.type]" :color="true" :is="providerIcons[p.type]"
class="w-4 h-4 text-[var(--text-primary)]" />