Creepso/miru
1
0
Fork 0
mirror of https://github.com/ThaUnknown/miru.git synced 2026-04-13 18:50:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

extensions ui

Browse source
This commit is contained in:
ThaUnknown 2025-02-12 17:22:54 +01:00
parent 9b1ec67e69
commit e17dcb4a6f
No known key found for this signature in database
2 changed files with 51 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
src/routes/settings/extensions/+page.svelte
View file

@ -1,38 +1,51 @@
<script lang='ts'>
import { Button } from '$lib/components/ui/button'
import { Settings, Trash } from 'lucide-svelte'
import { saved } from '$lib/modules/extensions'
import ExtensionSettings from './ExtensionSettings.svelte'
const typeMap = {
nzb: 'NZB',
torrent: 'Torrent',
url: 'URL'
}
</script>
<div class='bg-neutral-950 px-5 py-4 rounded-md flex flex-row space-x-3 justify-between w-[500px] max-w-full'>
<div class='flex flex-col space-y-3'>
<div class='flex flex-row space-x-3'>
<img src='https://releases.moe/favicon.png' alt='ico' class='size-12 rounded-md bg-neutral-900' />
<div class='flex flex-col'>
<div class='text-lg font-bold'>
Seadex
</div>
<div class='text-sm text-muted-foreground'>
seadex
<div class='space-y-3 pb-10'>
<div class='font-weight-bold text-xl font-bold'>Extension Settings</div>
<div class='grid grid-cols-1 sm:grid-cols-[repeat(auto-fit,minmax(400px,1fr))] place-items-center gap-x-10 gap-y-7 justify-center py-3'>
{#each Object.entries($saved) as [id, config] (id)}
<div class='bg-neutral-950 px-5 py-4 rounded-md flex flex-row space-x-3 justify-between w-full'>
<div class='flex flex-col space-y-3'>
<div class='flex flex-row space-x-3'>
<img src={config.icon} alt='ico' class='size-12 rounded-md bg-neutral-900' />
<div class='flex flex-col'>
<div class='text-lg font-bold'>
{config.name}
</div>
<div class='text-sm text-muted-foreground'>
{id}
</div>
</div>
</div>
<div class='flex-wrap w-full justify-start gap-2 flex text-neutral-300 text-sm'>
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug'>
{config.version}
</div>
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug'>
{typeMap[config.type]}
</div>
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug capitalize'>
{config.accuracy} Accuracy
</div>
{#if config.ratio}
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug'>
{config.ratio} Ratio
</div>
{/if}
</div>
</div>
<ExtensionSettings {config} />
</div>
</div>
<div class='flex-wrap w-full justify-start gap-2 flex text-neutral-300 text-sm'>
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug'>
v0.0.1
</div>
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug'>
Torrent
</div>
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug'>
High Accuracy
</div>
<div class='rounded px-3 py-0.5 font-bold bg-neutral-900 leading-snug'>
2.0 Ratio
</div>
</div>
</div>
<div class='flex flex-col space-y-2'>
<Button variant='ghost' size='icon-sm'><Settings size={18} /></Button>
<Button variant='ghost' size='icon-sm'><Trash size={18} /></Button>
{/each}
</div>
</div>

12
src/routes/settings/extensions/ExtensionSettings.svelte
View file

@ -13,9 +13,11 @@
function deleteExtension () {
storage.delete(config.id)
}
$: opts = $exopts[config.id]!
</script>
<div class='flex justify-between flex-col items-end'>
<div class='flex justify-between flex-col items-end pb-1.5'>
<Dialog.Root>
<Dialog.Trigger let:builder asChild>
<Button builders={[builder]} variant='ghost' size='icon-sm'><Settings size={18} /></Button>
@ -28,17 +30,17 @@
{#if options.type === 'string'}
<div class='space-y-2'>
<Label for={id} class='leading-[unset] grow font-bold'>{options.description}</Label>
<Input type='text' {id} placeholder={options.default} bind:value={$exopts[config.id].options[id]} />
<Input type='text' {id} placeholder={options.default} bind:value={opts.options[id]} />
</div>
{:else if options.type === 'number'}
<div class='space-y-2'>
<Label for={id} class='leading-[unset] grow font-bold'>{options.description}</Label>
<Input type='number' {id} placeholder={options.default} bind:value={$exopts[config.id].options[id]} />
<Input type='number' {id} placeholder={options.default} bind:value={opts.options[id]} />
</div>
{:else if options.type === 'boolean'}
<div class='flex items-center space-x-2'>
<Label for={id} class='leading-[unset] grow font-bold'>{options.description}</Label>
<Switch {id} bind:checked={$exopts[config.id].options[id]} />
<Switch {id} bind:checked={opts.options[id]} />
</div>
{/if}
{/each}
@ -52,5 +54,5 @@
</Dialog.Header>
</Dialog.Content>
</Dialog.Root>
<Switch bind:checked={$exopts[config.id].enabled} hideState={true} />
<Switch bind:checked={opts.enabled} hideState={true} />
</div>