From ea791838bf0929a524b7ba5e80e15568eba67239 Mon Sep 17 00:00:00 2001
From: KoloMl <thekolomoets@hotmail.com>
Date: Sun, 2 Mar 2025 18:55:51 +0400
Subject: [PATCH] Display stars in the tag editor for prefixes/suffixes

---
 src/components/tags/TagsEditor.svelte             |  6 ++++--
 src/routes/features/groups/[id]/edit/+page.svelte | 12 ++++++++++--
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/components/tags/TagsEditor.svelte b/src/components/tags/TagsEditor.svelte
index 83a433f..07ced57 100644
--- a/src/components/tags/TagsEditor.svelte
+++ b/src/components/tags/TagsEditor.svelte
@@ -4,10 +4,12 @@
   interface TagEditorProps {
     // List of tags to edit. Any duplicated tags present in the array will be removed on the first edit.
     tags?: string[];
+    mapTagNames?: (tagName: string) => string;
   }
 
   let {
-    tags = $bindable([])
+    tags = $bindable([]),
+    mapTagNames,
   }: TagEditorProps = $props();
 
   let uniqueTags = $state<Set<string>>(new Set());
@@ -87,7 +89,7 @@
 <div class="tags-editor">
   {#each uniqueTags.values() as tagName}
     <div class="tag">
-      {tagName}
+      {mapTagNames?.(tagName) ?? tagName}
       <span class="remove" onclick={createTagRemoveHandler(tagName)}
             onkeydown={createTagRemoveHandler(tagName)}
             role="button" tabindex="0">x</span>
diff --git a/src/routes/features/groups/[id]/edit/+page.svelte b/src/routes/features/groups/[id]/edit/+page.svelte
index 88d2764..8d68f71 100644
--- a/src/routes/features/groups/[id]/edit/+page.svelte
+++ b/src/routes/features/groups/[id]/edit/+page.svelte
@@ -60,6 +60,14 @@
     await targetGroup.save();
     await goto(`/features/groups/${targetGroup.id}`);
   }
+
+  function mapPrefixNames(tagName: string): string {
+    return `${tagName}*`;
+  }
+
+  function mapSuffixNames(tagName: string): string {
+    return `*${tagName}`;
+  }
 </script>
 
 <Menu>
@@ -80,12 +88,12 @@
   </TagsColorContainer>
   <TagsColorContainer targetCategory={tagCategory}>
     <FormControl label="Tag Prefixes">
-      <TagsEditor bind:tags={prefixesList}/>
+      <TagsEditor bind:tags={prefixesList} mapTagNames={mapPrefixNames}/>
     </FormControl>
   </TagsColorContainer>
   <TagsColorContainer targetCategory={tagCategory}>
     <FormControl label="Tag Suffixes">
-      <TagsEditor bind:tags={suffixesList}/>
+      <TagsEditor bind:tags={suffixesList} mapTagNames={mapSuffixNames}/>
     </FormControl>
   </TagsColorContainer>
 </FormContainer>