From 9bfc110d1c0f95541dc16234b69d010c053c8189 Mon Sep 17 00:00:00 2001
From: Nicolas Baglivo <nicolas.baglivo@gmail.com>
Date: Fri, 15 Sep 2023 23:56:02 +0200
Subject: [PATCH 1/3] feat(workspace-daily-editor): Add Pin functionality

---
 .../components/daily-note-editor/options.tsx  | 22 +++++++++++++------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx b/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx
index 7d367811..1d0e1a4d 100644
--- a/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx
+++ b/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx
@@ -8,14 +8,22 @@ import { getTagsFromFragment } from '../editor-utils';
 export default function Options({ selection }: { selection?: Selection }) {
     const { mutate: createNote } = useZact(createNoteAction);
 
+    function createNoteFromSelection(extraTags?: string[]) {
+        if (selection) {
+            const tags = getTagsFromFragment(selection.content().content);
+            createNote({ text: JSON.stringify({ ...selection.content(), type: 'doc' }), tags: [...tags, ...extraTags || []] });
+        }
+    }
+
     const options = [
-        { label: 'Unresolved note',
-            action: () => {
-                if (selection) {
-                    const tags = getTagsFromFragment(selection.content().content);
-                    createNote({ text: JSON.stringify({ ...selection.content(), type: 'doc' }), tags });
-                }
-            } },
+        {
+            label: 'Unresolved note',
+            action: () => createNoteFromSelection()
+        },
+        {
+            label: 'Pin',
+            action: () => createNoteFromSelection(['pinned'])
+        },
         /* eslint-disable no-empty-function */
         { label: 'Task', action: () => {} },
         /* eslint-disable no-empty-function */

From 7ed4053bf697bf1700eefc83dee1cf0620cdc1d3 Mon Sep 17 00:00:00 2001
From: Nicolas Baglivo <nicolas.baglivo@gmail.com>
Date: Sat, 16 Sep 2023 00:34:00 +0200
Subject: [PATCH 2/3] feat(workspace-daily-editor): Improve menu style

---
 .../components/daily-note-editor/options.tsx  | 64 ++++++++++++-------
 1 file changed, 42 insertions(+), 22 deletions(-)

diff --git a/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx b/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx
index 1d0e1a4d..819bf2e4 100644
--- a/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx
+++ b/src/app/(user)/components/workspace/components/daily-note-editor/options.tsx
@@ -1,10 +1,13 @@
 import { Selection } from '@tiptap/pm/state';
+import { AiOutlinePushpin } from 'react-icons/ai';
+import { MdEditNote } from 'react-icons/md';
 import { useZact } from 'zact/client';
 
 import { createNoteAction } from '@/lib/notes/create';
 
 import { getTagsFromFragment } from '../editor-utils';
 
+
 export default function Options({ selection }: { selection?: Selection }) {
     const { mutate: createNote } = useZact(createNoteAction);
 
@@ -17,34 +20,51 @@ export default function Options({ selection }: { selection?: Selection }) {
 
     const options = [
         {
-            label: 'Unresolved note',
-            action: () => createNoteFromSelection()
+            icon: null,
+            sectionTitle: '',
+            actions: [
+                {
+                    label: 'Pin',
+                    icon: <AiOutlinePushpin className="mr-2" />,
+                    exec: () => createNoteFromSelection(['pinned'])
+                }
+            ]
         },
         {
-            label: 'Pin',
-            action: () => createNoteFromSelection(['pinned'])
-        },
-        /* eslint-disable no-empty-function */
-        { label: 'Task', action: () => {} },
-        /* eslint-disable no-empty-function */
-        { label: 'Commitment', action: () => {} },
-        /* eslint-disable no-empty-function */
-        { label: 'Feedback', action: () => {} }
+            icon: null,
+            sectionTitle: 'Turn into',
+            actions: [
+                {
+                    label: 'Standalone Note',
+                    icon: <MdEditNote className="mr-2" />,
+                    exec: () => createNoteFromSelection()
+                }
+            ]
+        }
     ];
 
     return (
-        <div className="p-2">
-            <div className="text-sm text-neutral-200">Turn into</div>
+        <div className="h-64 w-64 rounded border border-neutral-950 bg-neutral-900 shadow-xl">
             <div className="flex flex-col items-start">
-                {options.map((option) => (
-                    <button onClick={option.action}
-                        className="w-full rounded px-2 py-1 text-left outline-none hover:bg-neutral-500 focus:bg-neutral-500"
-                        type="button"
-                        key={option.label}
-                    >
-                        {option.label}
-                    </button>
-                ))}
+                {
+                    options.map((option, index) => (
+                        <div key={option.sectionTitle} className={`flex w-full flex-col ${index > 0 ? ' my-1 border-t border-neutral-950 ' : ''}`}>
+                            <div className="mx-1 mt-2 text-sm text-neutral-400">{option.sectionTitle}</div>
+                            {option.actions.map((action) => (
+                                <div key={action.label}
+                                    className="mx-1 rounded-sm hover:bg-neutral-700 focus:bg-neutral-700"
+                                >
+                                    <button onClick={action.exec}
+                                        className="mx-2 flex items-center px-2 py-1 outline-none"
+                                        type="button"
+                                    >
+                                        {action.icon} {action.label}
+                                    </button>
+                                </div>
+                            ))}
+                        </div>
+                    ))
+                }
             </div>
         </div>
     );

From 025fd998a49521ee5dc104171cb52e43ee419cb6 Mon Sep 17 00:00:00 2001
From: Nicolas Baglivo <nicolas.baglivo@gmail.com>
Date: Sat, 16 Sep 2023 00:53:07 +0200
Subject: [PATCH 3/3] feat(workspace-context): Always show Pinned tag filter

---
 .../workspace/components/context/context.tsx  | 36 ++++++++++++++-----
 1 file changed, 28 insertions(+), 8 deletions(-)

diff --git a/src/app/(user)/components/workspace/components/context/context.tsx b/src/app/(user)/components/workspace/components/context/context.tsx
index 7bf131cd..baa9bc21 100644
--- a/src/app/(user)/components/workspace/components/context/context.tsx
+++ b/src/app/(user)/components/workspace/components/context/context.tsx
@@ -1,5 +1,6 @@
 import { Note } from '@prisma/client';
 import Link from 'next/link';
+import { ParsedUrlQuery } from 'querystring';
 
 import { FilterOption } from '@/lib/notes/get-notes-by-tags';
 
@@ -16,6 +17,19 @@ function buildQueryWithoutTag(tag: string, selectedTagsFilter?: string[]) {
 
 type ContextProps = { tags: string[], notes: Note[], selectedTagsFilter?: string[], selectedOperator?: FilterOption };
 
+const fixedTags = [{ label: 'Pinned', value: 'pinned' }];
+const fixedTagValues = fixedTags.map(({ value }) => value);
+
+function TagLink({ tag, query, isSelected }: { tag: string, query: ParsedUrlQuery, isSelected: boolean }) {
+    return (
+        <Link href={{ query }}
+            className={`cursor-pointer rounded border border-neutral-800 bg-neutral-950 px-2 ${isSelected ? ' border-red-400 ' : ''}`}
+        >
+            {tag}
+        </Link>
+    );
+}
+
 export default function Context({ tags, notes, selectedTagsFilter, selectedOperator }: ContextProps) {
     const isSelected = (tag: string) => selectedTagsFilter?.includes(tag) || false;
 
@@ -28,18 +42,24 @@ export default function Context({ tags, notes, selectedTagsFilter, selectedOpera
         };
     }
 
+    function renderTag({ value, label }: { value: string, label: string }) {
+        return <TagLink key={value} tag={label} query={buildQuery(value)} isSelected={isSelected(value)} />;
+    }
+
+    const dynamicTags = tags.reduce((tagsSofar, tag) => {
+        if (!fixedTagValues.includes(tag)) {
+            return [...tagsSofar, { value: tag, label: tag }];
+        }
+
+        return tagsSofar;
+    }, [] as { value: string, label: string }[]);
+
     return (
         <div className="overflow-scroll">
             <div className="my-5 flex flex-wrap gap-4">
                 <FilterSelect defaultValue={selectedOperator}></FilterSelect>
-                {tags.map((tag) => (
-                    <Link href={{ query: buildQuery(tag) }}
-                        className={`cursor-pointer rounded border border-neutral-800 bg-neutral-950 px-2 ${isSelected(tag) ? ' border-red-400 ' : ''}`}
-                        key={tag}
-                    >
-                        {tag}
-                    </Link>
-                ))}
+                {fixedTags.map(renderTag)}
+                {dynamicTags.map(renderTag)}
             </div>
 
             {notes.map(({ text, id }) => (