18621254025

Committed 18 Oct 2025 09:32PM UTC coverage: 19.473% (+0.2%) from 19.299%

Build # 18621254025

Build Type

push

github

Committed by

jcubic

Commit Message

replace History API with Next.js routes system

Run Details

77 of 109 branches covered (70.64%)

Branch coverage included in aggregate %.

0 of 33 new or added lines in 5 files covered. (0.0%)

118 existing lines in 9 files now uncovered.

462 of 2659 relevant lines covered (17.37%)

2.69 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

85.71

/src/components/notes/LeftPanel.tsx

'use client';

import { useState, useMemo, memo, useCallback } from 'react';
import { Box, Button, Input, Stack, Text } from '@chakra-ui/react';
import type { NoteTreeNode, TreeNode } from '@/types/tree';

import TreeView from '@/components/TreeView';
import { ConfirmationDialog } from '@/components/ui/confirmation-dialog';

interface LeftPanelProps {
  notes: NoteTreeNode[];
  onNoteSelect: (id: number) => void;
  onNewNote: () => void;
  onDeleteNote: (id: number) => void;
  onRenameNote: (id: number, name: string) => Promise<void>;
}

const LeftPanel = memo(function LeftPanel({
  notes,
  onNoteSelect,
  onNewNote,
  onDeleteNote,
  onRenameNote
}: LeftPanelProps) {
  const [filter, setFilter] = useState('');
  const [deleteDialog, setDeleteDialog] = useState<{
    isOpen: boolean;
    note: NoteTreeNode | null;
  }>({ isOpen: false, note: null });

  // Filter and prepare notes for TreeView
  const treeData = useMemo<NoteTreeNode[]>(() => {
    return notes
      .filter((note) => note.name.toLowerCase().includes(filter.toLowerCase()))
      .sort((a, b) => a.id - b.id);
  }, [notes, filter]);

  // Handle TreeNode selection
  const handleTreeNodeSelect = useCallback(
    (node: TreeNode) => {
      onNoteSelect((node as NoteTreeNode).id);
    },
    [onNoteSelect]
  );

  // Handle TreeNode rename
  const handleTreeNodeRename = useCallback(
    async (node: TreeNode, newName: string) => {
      await onRenameNote?.((node as NoteTreeNode).id, newName);
    },
    [onRenameNote]
  );

  // Handle TreeNode delete
  const handleTreeNodeDelete = useCallback((node: TreeNode) => {
    setDeleteDialog({ isOpen: true, note: node as NoteTreeNode });
  }, []);

  const handleConfirmDelete = useCallback(() => {
    if (deleteDialog.note) {
      onDeleteNote?.(deleteDialog.note.id);
    }
  }, [deleteDialog.note, onDeleteNote]);

  const handleCloseDeleteDialog = useCallback(() => {
    setDeleteDialog({ isOpen: false, note: null });
  }, []);

  return (
    <Box as="aside" h="100%" display="flex" flexDirection="column" p={6} bg="bg.subtle">
      <Stack gap={4} align="stretch">
        <Button colorPalette="blue" variant="solid" onClick={onNewNote}>
          New Note
        </Button>

        <Input
          p={3}
          placeholder="Filter notes..."
          value={filter}
          onChange={(e) => setFilter(e.target.value)}
          size="sm"
        />
      </Stack>

      <Box flex={1} mt={4} overflow="auto">
        {treeData.length === 0 ? (
          <Text textAlign="center" color="fg.muted" fontSize="sm" mt={4}>
            {notes.length === 0 ? 'No notes yet' : 'No matching notes'}
          </Text>
        ) : (
          <TreeView
            data={treeData}
            onNodeSelect={handleTreeNodeSelect}
            onNodeRename={handleTreeNodeRename}
            onNodeDelete={handleTreeNodeDelete}
            generateName={(node) => `${node.data?.dirty ? '* ' : ''}${node.name}`}
            title=""
          />
        )}
      </Box>

      <ConfirmationDialog
        isOpen={deleteDialog.isOpen}
        onClose={handleCloseDeleteDialog}
        onConfirm={handleConfirmDelete}
        title="Delete Note"
        message={`Are you sure you want to delete "${deleteDialog.note?.name}"? This action cannot be undone.`}
        confirmText="Delete"
        cancelText="Cancel"
        variant="danger"
      />
    </Box>
  );
});

export default LeftPanel;

1	'use client';
2
3	import { useState, useMemo, memo, useCallback } from 'react';	1✔
4	import { Box, Button, Input, Stack, Text } from '@chakra-ui/react';	1✔
5	import type { NoteTreeNode, TreeNode } from '@/types/tree';
6
7	import TreeView from '@/components/TreeView';	1✔
8	import { ConfirmationDialog } from '@/components/ui/confirmation-dialog';	1✔
9
10	interface LeftPanelProps {
11	notes: NoteTreeNode[];
12	onNoteSelect: (id: number) => void;
13	onNewNote: () => void;
14	onDeleteNote: (id: number) => void;
15	onRenameNote: (id: number, name: string) => Promise<void>;
16	}
17
18	const LeftPanel = memo(function LeftPanel({	1✔
19	notes,	6✔
20	onNoteSelect,	6✔
21	onNewNote,	6✔
22	onDeleteNote,	6✔
23	onRenameNote	6✔
24	}: LeftPanelProps) {	6✔
25	const [filter, setFilter] = useState('');	6✔
26	const [deleteDialog, setDeleteDialog] = useState<{	6✔
27	isOpen: boolean;
28	note: NoteTreeNode \| null;
29	}>({ isOpen: false, note: null });	6✔
30
31	// Filter and prepare notes for TreeView
32	const treeData = useMemo<NoteTreeNode[]>(() => {	6✔
33	return notes	6✔
34	.filter((note) => note.name.toLowerCase().includes(filter.toLowerCase()))	6✔
35	.sort((a, b) => a.id - b.id);	6✔
36	}, [notes, filter]);	6✔
37
38	// Handle TreeNode selection
39	const handleTreeNodeSelect = useCallback(	6✔
40	(node: TreeNode) => {	6✔
UNCOV 41	onNoteSelect((node as NoteTreeNode).id);	×
UNCOV 42	},	×
43	[onNoteSelect]	6✔
44	);	6✔
45
46	// Handle TreeNode rename
47	const handleTreeNodeRename = useCallback(	6✔
48	async (node: TreeNode, newName: string) => {	6✔
49	await onRenameNote?.((node as NoteTreeNode).id, newName);	1✔
50	},	1✔
51	[onRenameNote]	6✔
52	);	6✔
53
54	// Handle TreeNode delete
55	const handleTreeNodeDelete = useCallback((node: TreeNode) => {	6✔
UNCOV 56	setDeleteDialog({ isOpen: true, note: node as NoteTreeNode });	×
57	}, []);	6✔
58
59	const handleConfirmDelete = useCallback(() => {	6✔
UNCOV 60	if (deleteDialog.note) {	×
UNCOV 61	onDeleteNote?.(deleteDialog.note.id);	×
62	}	×
63	}, [deleteDialog.note, onDeleteNote]);	6✔
64
65	const handleCloseDeleteDialog = useCallback(() => {	6✔
UNCOV 66	setDeleteDialog({ isOpen: false, note: null });	×
67	}, []);	6✔
68
69	return (	6✔
70	<Box as="aside" h="100%" display="flex" flexDirection="column" p={6} bg="bg.subtle">	6✔
71	<Stack gap={4} align="stretch">	6✔
72	<Button colorPalette="blue" variant="solid" onClick={onNewNote}>	6✔
73	New Note
74	</Button>	6✔
75
76	<Input	6✔
77	p={3}	6✔
78	placeholder="Filter notes..."	6✔
79	value={filter}	6✔
80	onChange={(e) => setFilter(e.target.value)}	6✔
81	size="sm"	6✔
82	/>	6✔
83	</Stack>	6✔
84
85	<Box flex={1} mt={4} overflow="auto">	6✔
86	{treeData.length === 0 ? (	6!
UNCOV 87	<Text textAlign="center" color="fg.muted" fontSize="sm" mt={4}>	×
UNCOV 88	{notes.length === 0 ? 'No notes yet' : 'No matching notes'}	×
89	</Text>	×
90	) : (
91	<TreeView	6✔
92	data={treeData}	6✔
93	onNodeSelect={handleTreeNodeSelect}	6✔
94	onNodeRename={handleTreeNodeRename}	6✔
95	onNodeDelete={handleTreeNodeDelete}	6✔
96	generateName={(node) => `${node.data?.dirty ? '* ' : ''}${node.name}`}	6!
97	title=""	6✔
98	/>	6✔
99	)}
100	</Box>	6✔
101
102	<ConfirmationDialog	6✔
103	isOpen={deleteDialog.isOpen}	6✔
104	onClose={handleCloseDeleteDialog}	6✔
105	onConfirm={handleConfirmDelete}	6✔
106	title="Delete Note"	6✔
107	message={`Are you sure you want to delete "${deleteDialog.note?.name}"? This action cannot be undone.`}	6!
108	confirmText="Delete"	6✔
109	cancelText="Cancel"	6✔
110	variant="danger"	6✔
111	/>	6✔
112	</Box>	6✔
113	);
114	});	6✔
115
116	export default LeftPanel;	1✔

jcubic / 10xDevs / 18621254025

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous