Skip to content

Add short note field to bookmark edit UI #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
tsuten wants to merge 2 commits into
base: main
Choose a base branch
from
Draft

Add short note field to bookmark edit UI #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8f1142e
Add short note field to bookmark edit drawer
cursoragent Jul 11, 2026
f4279be
Show note text in bookmark list instead of icon indicator
cursoragent Jul 12, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 7 additions & 2 deletions app/client/main.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,12 +82,17 @@ input:focus {

@layer base {
/* atoms */
input {
input,
textarea {
@apply bg-gray-100 p-1 text-sm min-w-0 max-w-full rounded-sm;
}
input:focus {
input:focus,
textarea:focus {
@apply outline-1 outline-gray-500;
}
textarea {
@apply resize-y min-h-12;
}
hr {
@apply border-gray-300;
}
Expand Down
7 changes: 4 additions & 3 deletions app/imports/api/bookmarkItems.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export const BookmarkItemSchema = new SimpleSchema({
},
tags: { type: Array, optional: true },
'tags.$': String,
note: { type: String, optional: true, trim: true },
note: { type: String, optional: true, trim: true, max: 500 },
is_archived: { type: Boolean, optional: true, defaultValue: false },
userId: { type: String },
});
Expand All @@ -62,6 +62,7 @@ export const BookmarkItemUpdateSchema = new SimpleSchema({
},
tags: { type: Array, optional: true },
'tags.$': String,
note: { type: String, optional: true, trim: true, max: 500 },
});

export async function insertBookmarkItem(doc = {}, userId) {
Expand Down Expand Up @@ -117,10 +118,10 @@ Meteor.methods({
}
},

async updateBookmarkItem({ _id, title, url, tags } = {}) {
async updateBookmarkItem({ _id, title, url, tags, note } = {}) {
if (!this.userId) {
throw new Meteor.Error('not-authorized');
}
return updateBookmarkItem({ _id, title, url, tags }, this.userId);
return updateBookmarkItem({ _id, title, url, tags, note }, this.userId);
},
});
14 changes: 14 additions & 0 deletions app/imports/ui/BookmarkEditDrawer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ export const BookmarkEditDrawer = ({ bookmarkItem, onClose }) => {
const [title, setTitle] = useState('');
const [url, setUrl] = useState('');
const [tags, setTags] = useState([]);
const [note, setNote] = useState('');
const [urlError, setUrlError] = useState('');
const [submitError, setSubmitError] = useState('');
const [submitting, setSubmitting] = useState(false);
Expand All @@ -20,6 +21,7 @@ export const BookmarkEditDrawer = ({ bookmarkItem, onClose }) => {
setTitle(bookmarkItem.title || '');
setUrl(bookmarkItem.url || '');
setTags(bookmarkItem.tags || []);
setNote(bookmarkItem.note || '');
setUrlError('');
setSubmitError('');
setSubmitting(false);
Expand Down Expand Up @@ -49,6 +51,7 @@ export const BookmarkEditDrawer = ({ bookmarkItem, onClose }) => {
title,
url: url.trim(),
tags,
note: note.trim(),
},
(error) => {
setSubmitting(false);
Expand Down Expand Up @@ -112,6 +115,17 @@ export const BookmarkEditDrawer = ({ bookmarkItem, onClose }) => {
<TagsInput value={tags} onChange={setTags} />
</label>

<label className="flex flex-col gap-1 text-sm text-gray-700">
Note
<textarea
value={note}
onChange={(event) => setNote(event.target.value)}
placeholder="Short description"
rows={2}
maxLength={500}
/>
</label>

{submitError ? (
<p className="text-sm text-red-600" role="alert">
{submitError}
Expand Down
11 changes: 9 additions & 2 deletions app/imports/ui/BookmarkItem.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,15 @@ const archiveBookmarkItem = (bookmarkItem) => {
};

export const BookmarkItem = ({ bookmarkItem, onEdit }) => {
const note = bookmarkItem.note?.trim();

return (
<li>
<div className="group flex flex-row gap-2 hover:bg-gray-100 justify-between">
<a href={bookmarkItem.url} target="_blank">
<a href={bookmarkItem.url} target="_blank" rel="noreferrer">
<div className="flex flex-col p-3">
{bookmarkItem.title}
<div className="flex flex-row gap-4">
<div className="flex flex-row gap-4 items-center">
<span className="text-sm text-gray-500">
{(bookmarkItem.tags || []).join(', ') || 'No tags'}
</span>
Expand All @@ -37,6 +39,11 @@ export const BookmarkItem = ({ bookmarkItem, onEdit }) => {
{formatCreatedAtLabel(bookmarkItem.createdAt)}
</span>
</div>
{note ? (
<p className="mt-1 text-sm text-gray-600 truncate" title={note}>
{note}
</p>
) : null}
</div>
</a>
<div className="hidden shrink-0 items-center gap-2 group-hover:flex">
Expand Down