refac: loading

This commit is contained in:
Timothy J. Baek 2024-05-25 16:26:25 -07:00
parent c1526b0022
commit 1ab01170b9
3 changed files with 15 additions and 7 deletions

View File

@ -164,7 +164,7 @@ export const getOllamaVersion = async (token: string = '') => {
throw error; throw error;
} }
return res?.version ?? ''; return res?.version ?? false;
}; };
export const getOllamaModels = async (token: string = '') => { export const getOllamaModels = async (token: string = '') => {

View File

@ -18,6 +18,7 @@
import { onMount, getContext } from 'svelte'; import { onMount, getContext } from 'svelte';
import Tooltip from '$lib/components/common/Tooltip.svelte'; import Tooltip from '$lib/components/common/Tooltip.svelte';
import Spinner from '$lib/components/common/Spinner.svelte';
const i18n = getContext('i18n'); const i18n = getContext('i18n');
@ -34,7 +35,8 @@
let updateProgress = null; let updateProgress = null;
let showExperimentalOllama = false; let showExperimentalOllama = false;
let ollamaVersion = '';
let ollamaVersion = null;
const MAX_PARALLEL_DOWNLOADS = 3; const MAX_PARALLEL_DOWNLOADS = 3;
let modelTransferring = false; let modelTransferring = false;
@ -449,7 +451,7 @@
<div class="flex flex-col h-full justify-between text-sm"> <div class="flex flex-col h-full justify-between text-sm">
<div class=" space-y-3 pr-1.5 overflow-y-scroll h-[24rem]"> <div class=" space-y-3 pr-1.5 overflow-y-scroll h-[24rem]">
{#if ollamaVersion} {#if ollamaVersion !== null}
<div class="space-y-2 pr-1.5"> <div class="space-y-2 pr-1.5">
<div class="text-sm font-medium">{$i18n.t('Manage Ollama Models')}</div> <div class="text-sm font-medium">{$i18n.t('Manage Ollama Models')}</div>
@ -880,8 +882,14 @@
{/if} {/if}
</div> </div>
</div> </div>
{:else} {:else if ollamaVersion === false}
<div>Ollama Not Detected</div> <div>Ollama Not Detected</div>
{:else}
<div class="flex h-full justify-center">
<div class="my-auto">
<Spinner className="size-6" />
</div>
</div>
{/if} {/if}
</div> </div>
</div> </div>

View File

@ -1,9 +1,9 @@
<script lang="ts"> <script lang="ts">
export let className: string = ''; export let className: string = 'size-5';
</script> </script>
<div class="flex justify-center text-center {className}"> <div class="flex justify-center text-center">
<svg class="size-5" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" <svg class={className} viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
><style> ><style>
.spinner_ajPY { .spinner_ajPY {
transform-origin: center; transform-origin: center;