Skip to content

feat: add validation when updating/creating notes that at least one label must be added #359

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

Merged
chmurson merged 6 commits into from
Dec 30, 2025
Merged

feat: add validation when updating/creating notes that at least one label must be added #359

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
d76d934
feat: add alerts when note is updated or created and won't be visible
chmurson Dec 30, 2025
b79457b
feat: protect note update or created from not having any label
chmurson Dec 30, 2025
6693e24
fix: clear timeout when closing the alert
chmurson Dec 30, 2025
aff797c
fix: typo
chmurson Dec 30, 2025
8c3fad4
Merge branch 'fix-adding-new-note-when-filtering-hides-it' into fix-a…
chmurson Dec 30, 2025
c882f24
Merge branch 'main' into fix-adding-or-updateing-note-without-any-label
chmurson Dec 30, 2025
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
17 changes: 16 additions & 1 deletion src/components/NoteManager/components/NewNote.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,17 +20,27 @@ type NewNoteProps = {

export const NewNote = ({ version, onCancel, onSave, selectionStart, selectionEnd }: NewNoteProps) => {
const [noteContentError, setNoteContentError] = useState<string | null>(null);
const [noteLabelsError, setNoteLabelsError] = useState<string | null>(null);
const [labels, setLabels] = useState<string[]>(["local"]);

const latestOnCancel = useLatestCallback(onCancel);
const latestOnSave = useLatestCallback(onSave);

const handleLabelsChange = useCallback((nextLabels: string[]) => {
setLabels(nextLabels);
if (nextLabels.length > 0) {
setNoteLabelsError(null);
}
}, []);

const handleCancelClick = useCallback(() => {
latestOnCancel.current();
}, [latestOnCancel]);

const handleSaveClick = useCallback(() => {
const noteContent = textAreaRef.current?.value ?? "";
setNoteContentError(null);
setNoteLabelsError(null);

const mathValidationError = validateMath(noteContent);
if (mathValidationError) {
Expand All @@ -41,6 +51,10 @@ export const NewNote = ({ version, onCancel, onSave, selectionStart, selectionEn
setNoteContentError("Note content cannot be empty");
return;
}
if (labels.length === 0) {
setNoteLabelsError("Select at least one label");
return;
}

latestOnSave.current({ noteContent, labels });
}, [latestOnSave, labels]);
Expand All @@ -56,7 +70,7 @@ export const NewNote = ({ version, onCancel, onSave, selectionStart, selectionEn
noteDirty,
currentVersionLink,
handleCancelClick,
handleNoteLabelsChange: setLabels,
handleNoteLabelsChange: handleLabelsChange,
handleSaveClick,
originalVersionLink,
selectionStart,
Expand All @@ -83,6 +97,7 @@ export const NewNote = ({ version, onCancel, onSave, selectionStart, selectionEn
/>
{noteContentError ? <div className="validation-message">{noteContentError}</div> : null}
<NoteLayout.Labels />
{noteLabelsError ? <div className="validation-message">{noteLabelsError}</div> : null}
<div className="actions gap-2">
<div className="fill" />
<Button variant="tertiary" data-testid={"cancel-button"} onClick={handleCancelClick} size="sm">
Expand Down
13 changes: 13 additions & 0 deletions src/components/NoteManager/components/Note.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ export function Note({ ref, note, active = false, sectionTitles, onEditNote, onD
});

const [noteContentError, setNoteContentError] = useState("");
const [noteLabelsError, setNoteLabelsError] = useState("");
const { metadata } = useMetadataContext();
const { version } = useVersionContext();
const { getHashFromLocationParams } = useGetLocationParamsToHash();
Expand All @@ -46,6 +47,7 @@ export function Note({ ref, note, active = false, sectionTitles, onEditNote, onD
const content = textAreaRef.current?.value ?? "";
const mathValidationError = validateMath(content);
setNoteContentError("");
setNoteLabelsError("");

if (mathValidationError) {
setNoteContentError(mathValidationError);
Expand All @@ -57,6 +59,11 @@ export function Note({ ref, note, active = false, sectionTitles, onEditNote, onD
return;
}

if (noteDirty.labels.length === 0) {
setNoteLabelsError("Select at least one label");
return;
}

noteDirty.content = content;

onEditNote(note, noteDirty);
Expand All @@ -70,10 +77,14 @@ export function Note({ ref, note, active = false, sectionTitles, onEditNote, onD
setIsEditing(true);
setNoteDirty({ ...note.original });
setNoteContentError("");
setNoteLabelsError("");
}, [note, isEditable]);

const handleNoteLabelsChange = useCallback((labels: string[]) => {
setNoteDirty((prevNoteDirty) => ({ ...prevNoteDirty, labels }));
if (labels.length > 0) {
setNoteLabelsError("");
}
}, []);

const handleDeleteClick = useCallback(() => {
Expand All @@ -82,6 +93,7 @@ export function Note({ ref, note, active = false, sectionTitles, onEditNote, onD

const handleCancelClick = useCallback(() => {
setNoteContentError("");
setNoteLabelsError("");
setIsEditing(false);
}, []);

Expand Down Expand Up @@ -284,6 +296,7 @@ export function Note({ ref, note, active = false, sectionTitles, onEditNote, onD
<NoteLayout.TextArea className={noteContentError ? "error" : ""} ref={textAreaRef} />
{noteContentError ? <div className="validation-message">{noteContentError}</div> : null}
<NoteLayout.Labels />
{noteLabelsError ? <div className="validation-message">{noteLabelsError}</div> : null}
<div className="actions gap-2">
<Button variant="ghost" intent="destructive" size="sm" onClick={handleDeleteClick}>
Delete
Expand Down