inventree/InvenTree
2
0
Fork 0
mirror of https://github.com/inventree/InvenTree.git synced 2026-09-02 02:01:20 +00:00
Code Activity

Add "no notes" item

Browse Source
This commit is contained in:
Oliver Walters
2026-05-20 12:31:31 +00:00
parent bc197f9409
commit ac8e8d978c
1 changed files with 49 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/frontend/src/components/editors/NotesEditor.tsx
+20 -4
View File
@@ -18,6 +18,7 @@ import { BlockNoteView } from '@blocknote/mantine';
import '@blocknote/mantine/style.css'; import '@blocknote/mantine/style.css';
import { useCreateBlockNote } from '@blocknote/react'; import { useCreateBlockNote } from '@blocknote/react';
import { import {
Alert,
Box, Box,
Button, Button,
Flex, Flex,
@@ -27,7 +28,7 @@ import {
Tabs, Tabs,
Text Text
} from '@mantine/core'; } from '@mantine/core';
import { IconCirclePlus } from '@tabler/icons-react'; import { IconCirclePlus, IconInfoCircle } from '@tabler/icons-react';
import { useNoteFields } from '../../forms/CommonForms'; import { useNoteFields } from '../../forms/CommonForms';
import { useCreateApiFormModal } from '../../hooks/UseForm'; import { useCreateApiFormModal } from '../../hooks/UseForm';
import { useUserState } from '../../states/UserState'; import { useUserState } from '../../states/UserState';
@@ -88,10 +89,15 @@ export default function NotesEditor({
() => () =>
user.hasChangePermission(modelType) && user.hasChangePermission(modelType) &&
notesQuery.isFetched && notesQuery.isFetched &&
notesQuery.isSuccess, notesQuery.isSuccess &&
!!notesQuery.data,
[user, modelType, notesQuery] [user, modelType, notesQuery]
); );
const hasNotes = useMemo(() => {
return notesQuery.data && notesQuery.data.length > 0;
}, [notesQuery.data]);
const editor = useCreateBlockNote(); const editor = useCreateBlockNote();
const noteFields = useNoteFields({ modelType: modelType, modelId: modelId }); const noteFields = useNoteFields({ modelType: modelType, modelId: modelId });
@@ -115,15 +121,24 @@ export default function NotesEditor({
{createNote.modal} {createNote.modal}
<Flex align='left'> <Flex align='left'>
<Box style={{ flex: 1 }}> <Box style={{ flex: 1 }}>
<Paper p='md' shadow='sm' withBorder> <Paper p='sm' shadow='sm' withBorder>
{hasNotes ? (
<Stack gap='xs'>
<BlockNoteView <BlockNoteView
editor={editor} editor={editor}
content={''} content={''}
editable={canEdit} editable={canEdit}
style={{ minHeight: '400px' }} style={{ minHeight: '400px' }}
/> />
</Stack>
) : (
<Alert title={t`Notes`} icon={<IconInfoCircle />}>
{t`There are no notes yet for this item.`}
</Alert>
)}
</Paper> </Paper>
</Box> </Box>
<Paper p='sm' shadow='sm' withBorder ml='md' style={{ width: '200px' }}>
<Stack gap='xs'> <Stack gap='xs'>
<Button leftSection={<IconCirclePlus />} onClick={createNote.open}> <Button leftSection={<IconCirclePlus />} onClick={createNote.open}>
{t`Add Note`} {t`Add Note`}
@@ -133,7 +148,7 @@ export default function NotesEditor({
placement='right' placement='right'
value={selectedNote?.toString()} value={selectedNote?.toString()}
> >
<Tabs.List style={{ minWidth: '200px' }}> <Tabs.List style={{ width: '100%' }}>
{notesQuery.data?.map((note: any) => ( {notesQuery.data?.map((note: any) => (
<Tabs.Tab <Tabs.Tab
key={note.pk} key={note.pk}
@@ -148,6 +163,7 @@ export default function NotesEditor({
</Tabs.List> </Tabs.List>
</Tabs> </Tabs>
</Stack> </Stack>
</Paper>
</Flex> </Flex>
</> </>
); );