Skip to content
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

[PUI] Notes Editor UX #8265

Merged
merged 8 commits into from
Oct 10, 2024
Merged

[PUI] Notes Editor UX #8265

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
7c763c8
Rearrange icons
SchrodingersGat Oct 9, 2024
e37da30
Remove isDirty flag
SchrodingersGat Oct 9, 2024
34ea6d3
Merge branch 'master' into notes-save
SchrodingersGat Oct 9, 2024
298de28
Fix playwright test
SchrodingersGat Oct 9, 2024
7e50f17
Merge branch 'master' into notes-save
SchrodingersGat Oct 10, 2024
0b9edc9
Fix playwright test
SchrodingersGat Oct 10, 2024
540f75c
Merge branch 'notes-save' of github.com:SchrodingersGat/InvenTree int…
SchrodingersGat Oct 10, 2024
be1e921
Merge branch 'master' into notes-save
SchrodingersGat Oct 10, 2024
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
60 changes: 31 additions & 29 deletions src/frontend/src/components/editors/NotesEditor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,6 +99,7 @@ export default function NotesEditor({
enabled: true
});

// Update internal markdown data when the query data changes
useEffect(() => {
setMarkdown(dataQuery.data ?? '');
}, [dataQuery.data]);
Expand All @@ -118,7 +119,8 @@ export default function NotesEditor({
title: t`Success`,
message: t`Notes saved successfully`,
color: 'green',
id: 'notes'
id: 'notes',
autoClose: 2000
});
})
.catch((error) => {
Expand All @@ -142,43 +144,40 @@ export default function NotesEditor({
const editorOptions: SimpleMde.Options = useMemo(() => {
let icons: any[] = [];

if (editable) {
if (editing) {
icons.push({
name: 'edit-disabled',
action: () => setEditing(false),
className: 'fa fa-eye',
title: t`Disable Editing`
});
if (editing) {
icons.push({
name: 'save-notes',
action: (editor: SimpleMde) => {
saveNotes(editor.value());
},
className: 'fa fa-save',
title: t`Save Notes`
});

icons.push('|', 'side-by-side', '|');
} else {
icons.push({
name: 'edit-enabled',
action: () => setEditing(true),
className: 'fa fa-edit',
title: t`Enable Editing`
});
}
}
icons.push('|');

if (editing) {
icons.push('heading-1', 'heading-2', 'heading-3', '|'); // Headings
icons.push('bold', 'italic', 'strikethrough', '|'); // Text styles
icons.push('unordered-list', 'ordered-list', 'code', 'quote', '|'); // Text formatting
icons.push('table', 'link', 'image', '|');
icons.push('horizontal-rule', '|', 'guide'); // Misc

icons.push('|', 'undo', 'redo'); // Undo/Redo

icons.push('|');

icons.push({
name: 'save-notes',
action: (editor: SimpleMde) => {
saveNotes(editor.value());
},
className: 'fa fa-save',
title: t`Save Notes`
name: 'edit-disabled',
action: () => setEditing(false),
className: 'fa fa-times',
title: t`Close Editor`
});
} else if (editable) {
icons.push({
name: 'edit-enabled',
action: () => setEditing(true),
className: 'fa fa-edit',
title: t`Enable Editing`
});
}

Expand Down Expand Up @@ -219,10 +218,13 @@ export default function NotesEditor({

return (
<SimpleMDE
value={markdown}
onChange={setMarkdown}
options={editorOptions}
autoFocus
getMdeInstance={(instance: SimpleMde) => setMdeInstance(instance)}
onChange={(value: string) => {
setMarkdown(value);
}}
options={editorOptions}
value={markdown}
/>
);
}
5 changes: 3 additions & 2 deletions src/frontend/tests/pages/pui_index.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,8 @@ test('Pages - Index - Playground', async ({ page }) => {

// New Part
await page.getByRole('button', { name: 'Create New Part' }).click();
await page.locator('#react-select-3-input').fill('category 0');
await page.getByLabel('related-field-category').fill('category 0');

await page
.getByRole('option', { name: 'Category 0' })
.locator('div')
Expand All @@ -22,7 +23,7 @@ test('Pages - Index - Playground', async ({ page }) => {

// Set the "name"
await page.getByLabel('text-field-name').fill(newPartName);
await page.getByLabel('number-field-initial_stock.').fill('1');
await page.getByLabel('number-field-initial_stock').fill('1');

await page
.getByLabel('Create Part')
Expand Down
3 changes: 2 additions & 1 deletion src/frontend/tests/pages/pui_part.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -237,8 +237,9 @@ test('Pages - Part - Notes', async ({ page }) => {

// Enable notes editing
await page.getByLabel('Enable Editing').click();
await page.getByLabel('Disable Editing').waitFor();

await page.getByLabel('Save Notes').waitFor();
await page.getByLabel('Close Editor').waitFor();
});

test('Pages - Part - 404', async ({ page }) => {
Expand Down
Loading