Presets: Added conditional presets option

Now presets can be configured to show up only when specific tag is
provided.

src/lib/extension/entities/TagEditorPreset.ts

@@ -3,6 +3,8 @@ import StorageEntity from "$lib/extension/base/StorageEntity";
 interface TagEditorPresetSettings {
   name: string;
   tags: string[];
+  conditional: boolean;
+  requiredTags: string[];
 }
 
 export default class TagEditorPreset extends StorageEntity<TagEditorPresetSettings> {
@@ -10,6 +12,8 @@ export default class TagEditorPreset extends StorageEntity<TagEditorPresetSettin
     super(id, {
       name: settings.name || '',
       tags: settings.tags || [],
+      conditional: settings.conditional || false,
+      requiredTags: settings.requiredTags || [],
     });
   }
 

src/lib/extension/transporting/exporters.ts

@@ -42,6 +42,8 @@ const entitiesExporters: ExportersMap = {
       id: entity.id,
       name: entity.settings.name,
       tags: entity.settings.tags,
+      conditional: entity.settings.conditional,
+      requiredTags: entity.settings.requiredTags,
     }
   }
 };

src/lib/extension/transporting/validators.ts

@@ -73,6 +73,8 @@ const entitiesValidators: EntitiesValidationMap = {
       !validateRequiredString(importedObject?.id)
       || !validateRequiredString(importedObject?.name)
       || !validateOptionalArray(importedObject?.tags)
+      || typeof importedObject.conditional !== 'boolean'
+      || !validateOptionalArray(importedObject?.requiredTags)
     ) {
       throw new Error('Invalid preset format detected!');
     }

src/routes/features/presets/[id]/edit/+page.svelte

@@ -10,6 +10,7 @@
   import FormControl from "$components/ui/forms/FormControl.svelte";
   import TextField from "$components/ui/forms/TextField.svelte";
   import TagsEditor from "$components/tags/TagsEditor.svelte";
+  import CheckboxField from "$components/ui/forms/CheckboxField.svelte";
 
   let presetId = $derived(page.params.id);
 
@@ -23,6 +24,8 @@
 
   let presetName = $state('');
   let tagsList = $state<string[]>([]);
+  let isConditional = $state<boolean>(false);
+  let requiredTags = $state<string[]>([]);
 
   $effect(() => {
     if (presetId === 'new') {
@@ -39,6 +42,8 @@
 
     presetName = targetPreset.settings.name;
     tagsList = [...targetPreset.settings.tags].sort((a, b) => a.localeCompare(b));
+    isConditional = targetPreset.settings.conditional;
+    requiredTags = [...targetPreset.settings.requiredTags].sort((a, b) => a.localeCompare(b));
   });
 
   async function savePreset() {
@@ -49,6 +54,8 @@
 
     targetPreset.settings.name = presetName;
     targetPreset.settings.tags = [...tagsList];
+    targetPreset.settings.conditional = isConditional;
+    targetPreset.settings.requiredTags = [...requiredTags];
 
     await targetPreset.save();
     await goto(`/features/presets/${targetPreset.id}`);
@@ -67,6 +74,16 @@
   <FormControl label="Tags">
     <TagsEditor bind:tags={tagsList}></TagsEditor>
   </FormControl>
+  <FormControl>
+    <CheckboxField bind:checked={isConditional}>
+      Show this preset only when specified tags are provided.
+    </CheckboxField>
+  </FormControl>
+  {#if isConditional}
+    <FormControl label="Required Tags">
+      <TagsEditor bind:tags={requiredTags}></TagsEditor>
+    </FormControl>
+  {/if}
 </FormContainer>
 <Menu>
   <hr>