tag prefixing via @ and #

src/components/NotesSidebar.tsx

@@ -81,7 +81,7 @@ export const NotesSidebar: Component<{
                                     <For each={note.tags.slice(0, 3)}>
                                         {(t) => (
                                             <span class="text-[0.6rem] px-1.5 py-0.5 bg-muted rounded-md text-muted-foreground whitespace-nowrap border border-border/50">
-                                                #{t}
+                                                {t}
                                             </span>
                                         )}
                                     </For>

src/components/TagPicker.tsx

@@ -24,8 +24,8 @@ export const TagPicker: Component<TagPickerProps> = (props) => {
 
     const allTagNames = () => {
         const definedTags = store.tagDefinitions.map(d => d.name);
-        const bucketTags = store.buckets.map(b => b.name);
-        const noteTags = store.notes.map(n => n.title);
+        const bucketTags = store.buckets.map(b => `@${b.name}`);
+        const noteTags = store.notes.map(n => `#${n.title}`);
         return [...new Set([...definedTags, ...bucketTags, ...noteTags])].sort();
     };
 
@@ -52,7 +52,7 @@ export const TagPicker: Component<TagPickerProps> = (props) => {
         if (!name) return;
 
         // update global definition
-        const bucket = store.buckets.find(b => b.name === name);
+        const bucket = store.buckets.find(b => b.name === name || `@${b.name}` === name);
         const color = bucket ? bucket.color : undefined;
         upsertTagDefinition(name, valueScore(), color, resolvedTheme());
 

src/components/TaskCard.tsx

@@ -33,8 +33,9 @@ export const TaskCard: Component<{ task: Task }> = (props) => {
 
         if (typeof ctx === 'object' && 'bucketId' in ctx) {
             // We are in a bucket view. Hide the tag that matches this bucket's name.
-            const bucketName = (ctx as { name: string }).name.toLowerCase();
-            return tags.filter(t => t.toLowerCase() !== bucketName);
+            // Buckets are now tagged with '@' + name.
+            const bucketTagName = `@${(ctx as { name: string }).name.toLowerCase()}`;
+            return tags.filter(t => t.toLowerCase() !== bucketTagName);
         }
 
         return tags;

src/components/TaskDetail.tsx

@@ -101,10 +101,10 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
 
         // If in a bucket view, ensure the bucket tag is preserved (it was hidden from the UI so it's missing from 'tags')
         if (typeof ctx === 'object' && 'bucketId' in ctx) {
-            const bucketName = (ctx as { name: string }).name;
+            const bucketTagName = `@${(ctx as { name: string }).name}`;
             // Check case-insensitive existence
-            if (!newTags.some(t => t.toLowerCase() === bucketName.toLowerCase())) {
-                newTags.push(bucketName);
+            if (!newTags.some(t => t.toLowerCase() === bucketTagName.toLowerCase())) {
+                newTags.push(bucketTagName);
             }
         }
 
@@ -129,8 +129,9 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
 
         if (typeof ctx === 'object' && 'bucketId' in ctx) {
             // We are in a bucket view. Hide the tag that matches this bucket's name.
-            const bucketName = (ctx as { name: string }).name.toLowerCase();
-            return tags.filter(t => t.toLowerCase() !== bucketName);
+            // Buckets are now tagged with '@' + name.
+            const bucketTagName = `@${(ctx as { name: string }).name.toLowerCase()}`;
+            return tags.filter(t => t.toLowerCase() !== bucketTagName);
         }
 
         return tags;