Start typing in the search bar to show proposed results
// Render the CommandPalette
<CommandPalette
items={categories}
onChange={(item) => {
console.log('Selected report:', item);
}}
/>
// Define the command palette categories
const categories: CommandPaletteCategory[] = [
{
label: 'Student Reports',
items: [
{
label: 'Academic Performance Report',
value: 'report-academic',
},
{
label: 'Attendance Summary Report',
value: 'report-attendance',
},
{ label: 'Progress Report Card', value: 'report-progress' },
{ label: 'Student Transcript', value: 'report-transcript' },
],
},
{
label: 'Test Reports',
items: [
{ label: 'Midterm Exam Analysis', value: 'test-midterm' },
{ label: 'Final Exam Report', value: 'test-final' },
{ label: 'Quiz Performance Summary', value: 'test-quiz' },
{
label: 'Benchmark Assessment Results',
value: 'test-benchmark',
},
],
},
{
label: 'Class Reports',
items: [
{ label: 'Class Roster Report', value: 'class-roster' },
{ label: 'Grade Distribution Report', value: 'class-grades' },
{
label: 'Class Attendance Report',
value: 'class-attendance',
},
{
label: 'Missing Assignment Report',
value: 'class-missing',
},
],
},
];