refac: ui

This commit is contained in:
Timothy J. Baek 2024-03-23 12:46:06 -07:00
parent 7e6d499486
commit 642ca5a94a

View file

@ -159,7 +159,7 @@
// Remove the downloaded model // Remove the downloaded model
delete modelDownloadStatus[modelName]; delete modelDownloadStatus[modelName];
modelDownloadStatus = {...modelDownloadStatus} modelDownloadStatus = { ...modelDownloadStatus };
if (!data.success) { if (!data.success) {
toast.error(data.error); toast.error(data.error);
@ -474,10 +474,8 @@
delete modelDownloadStatus[model]; delete modelDownloadStatus[model];
await deleteModel(localStorage.token, model); await deleteModel(localStorage.token, model);
toast.success(`${model} download has been canceled`); toast.success(`${model} download has been canceled`);
}
} }
};
</script> </script>
<div class="flex flex-col h-full justify-between text-sm"> <div class="flex flex-col h-full justify-between text-sm">
@ -611,7 +609,7 @@
<div class="flex flex-col"> <div class="flex flex-col">
<div class="font-medium mb-1">{model}</div> <div class="font-medium mb-1">{model}</div>
<div class=""> <div class="">
<div class="flex flex-row space-x-4"> <div class="flex flex-row space-x-4 pr-2">
<div <div
class="dark:bg-gray-600 bg-gray-500 text-xs font-medium text-gray-100 text-center p-0.5 leading-none rounded-full" class="dark:bg-gray-600 bg-gray-500 text-xs font-medium text-gray-100 text-center p-0.5 leading-none rounded-full"
style="width: {Math.max(15, modelDownloadStatus[model].pullProgress ?? 0)}%" style="width: {Math.max(15, modelDownloadStatus[model].pullProgress ?? 0)}%"
@ -619,15 +617,28 @@
{modelDownloadStatus[model].pullProgress ?? 0}% {modelDownloadStatus[model].pullProgress ?? 0}%
</div> </div>
<button <button
class="px-2.5 bg-gray-100 hover:bg-gray-200 text-gray-800 dark:bg-gray-850 dark:hover:bg-gray-800 dark:text-gray-100 rounded-lg transition" class="text-gray-800 dark:text-gray-100"
on:click={() => { on:click={() => {
deleteModelPull(model); deleteModelPull(model);
}} }}
> >
<svg class="w-4 h-4 text-gray-800 dark:text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24"> <svg
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18 17.94 6M18 18 6.06 6"/> class="w-4 h-4 text-gray-800 dark:text-white"
aria-hidden="true"
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
fill="currentColor"
viewBox="0 0 24 24"
>
<path
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M6 18 17.94 6M18 18 6.06 6"
/>
</svg> </svg>
</button> </button>
</div> </div>
<div class="mt-1 text-xs dark:text-gray-500" style="font-size: 0.5rem;"> <div class="mt-1 text-xs dark:text-gray-500" style="font-size: 0.5rem;">