fix(i18n): avoid $t() inside $derived() to fix PostCSS error

Using $t() store subscriptions inside $derived() was causing
vite-plugin-svelte CSS extraction to fail, resulting in PostCSS
receiving the entire file content instead of just the style block.

Changed networkFsOptions to use labelKey pattern with $t() called
directly in the template instead.
This commit is contained in:
vicrodh committed 2026-02-02 18:11:28 -06:00
1 parent a489b2e875
commit e2c3c9447d
1 file changed
+6 -6
@@ -47,9 +47,9 @@
let accessible = $state(true);
let checkingAccessibility = $state(false);
// Network filesystem options (derived to support i18n reactivity)
const networkFsOptions = $derived([
{ value: '', label: $t('library.networkFs.auto') },
// Network filesystem options - static values, labels use $t() in template for reactivity
const networkFsOptions = [
{ value: '', labelKey: 'library.networkFs.auto' },
{ value: 'cifs', label: 'SMB/CIFS (Samba)' },
{ value: 'nfs', label: 'NFS' },
{ value: 'sshfs', label: 'SSHFS' },
@@ -57,8 +57,8 @@
{ value: 'webdav', label: 'WebDAV' },
{ value: 'glusterfs', label: 'GlusterFS' },
{ value: 'ceph', label: 'CephFS' },
{ value: 'other', label: $t('library.networkFs.other') }
]);
{ value: 'other', labelKey: 'library.networkFs.other' }
];
// Reset form when modal opens
$effect(() => {
@@ -340,7 +340,7 @@
disabled={loading}
>
{#each networkFsOptions as option}
<option value={option.value}>{option.label}</option>
<option value={option.value}>{option.labelKey ? $t(option.labelKey) : option.label}</option>
{/each}
</select>
<span class="form-hint">{$t('library.networkFsTypeHint')}</span>