@arbor-education/design-system.components 4.6.0 → 4.7.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.changeset/twenty-groups-wonder.md +5 -0
- package/.changeset/yellow-falcons-search.md +5 -0
- package/dist/components/button/Button.story.d.ts +47 -0
- package/dist/components/button/Button.story.d.ts.map +1 -0
- package/dist/components/button/Button.story.js +123 -0
- package/dist/components/button/Button.story.js.map +1 -0
- package/dist/components/button/ButtonUsageExample.d.ts +2 -0
- package/dist/components/button/ButtonUsageExample.d.ts.map +1 -0
- package/dist/components/button/ButtonUsageExample.js +11 -0
- package/dist/components/button/ButtonUsageExample.js.map +1 -0
- package/dist/components/combobox/useElementWidth.d.ts +2 -0
- package/dist/components/combobox/useElementWidth.d.ts.map +1 -0
- package/dist/components/combobox/useElementWidth.js +31 -0
- package/dist/components/combobox/useElementWidth.js.map +1 -0
- package/dist/components/combobox/useVisibleChips.d.ts +21 -0
- package/dist/components/combobox/useVisibleChips.d.ts.map +1 -0
- package/dist/components/combobox/useVisibleChips.js +59 -0
- package/dist/components/combobox/useVisibleChips.js.map +1 -0
- package/dist/components/combobox/useVisibleChips.test.d.ts +2 -0
- package/dist/components/combobox/useVisibleChips.test.d.ts.map +1 -0
- package/dist/components/combobox/useVisibleChips.test.js +81 -0
- package/dist/components/combobox/useVisibleChips.test.js.map +1 -0
- package/dist/components/heading/HeadingInnerContainer.d.ts +5 -0
- package/dist/components/heading/HeadingInnerContainer.d.ts.map +1 -0
- package/dist/components/heading/HeadingInnerContainer.js +7 -0
- package/dist/components/heading/HeadingInnerContainer.js.map +1 -0
- package/dist/components/icoText/IcoText.d.ts +37 -0
- package/dist/components/icoText/IcoText.d.ts.map +1 -0
- package/dist/components/icoText/IcoText.js +29 -0
- package/dist/components/icoText/IcoText.js.map +1 -0
- package/dist/components/icoText/IcoText.stories.d.ts +60 -0
- package/dist/components/icoText/IcoText.stories.d.ts.map +1 -0
- package/dist/components/icoText/IcoText.stories.js +319 -0
- package/dist/components/icoText/IcoText.stories.js.map +1 -0
- package/dist/components/icoText/IcoText.test.d.ts +2 -0
- package/dist/components/icoText/IcoText.test.d.ts.map +1 -0
- package/dist/components/icoText/IcoText.test.js +27 -0
- package/dist/components/icoText/IcoText.test.js.map +1 -0
- package/dist/components/pill/Pill.d.ts.map +1 -1
- package/dist/components/pill/Pill.js +1 -1
- package/dist/components/pill/Pill.js.map +1 -1
- package/dist/components/sidebarNav/SidebarNav.d.ts +46 -0
- package/dist/components/sidebarNav/SidebarNav.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNav.js +102 -0
- package/dist/components/sidebarNav/SidebarNav.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNav.stories.d.ts +61 -0
- package/dist/components/sidebarNav/SidebarNav.stories.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNav.stories.js +253 -0
- package/dist/components/sidebarNav/SidebarNav.stories.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNav.test.d.ts +2 -0
- package/dist/components/sidebarNav/SidebarNav.test.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNav.test.js +240 -0
- package/dist/components/sidebarNav/SidebarNav.test.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavContext.d.ts +13 -0
- package/dist/components/sidebarNav/SidebarNavContext.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavContext.js +15 -0
- package/dist/components/sidebarNav/SidebarNavContext.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavGroup.d.ts +10 -0
- package/dist/components/sidebarNav/SidebarNavGroup.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavGroup.js +16 -0
- package/dist/components/sidebarNav/SidebarNavGroup.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavItem.d.ts +32 -0
- package/dist/components/sidebarNav/SidebarNavItem.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavItem.js +44 -0
- package/dist/components/sidebarNav/SidebarNavItem.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavItemFavourite.d.ts +8 -0
- package/dist/components/sidebarNav/SidebarNavItemFavourite.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavItemFavourite.js +14 -0
- package/dist/components/sidebarNav/SidebarNavItemFavourite.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavPanel.d.ts +4 -0
- package/dist/components/sidebarNav/SidebarNavPanel.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavPanel.js +9 -0
- package/dist/components/sidebarNav/SidebarNavPanel.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavPanelNav.d.ts +10 -0
- package/dist/components/sidebarNav/SidebarNavPanelNav.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavPanelNav.js +21 -0
- package/dist/components/sidebarNav/SidebarNavPanelNav.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRail.d.ts +6 -0
- package/dist/components/sidebarNav/SidebarNavRail.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRail.js +7 -0
- package/dist/components/sidebarNav/SidebarNavRail.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRailItem.d.ts +10 -0
- package/dist/components/sidebarNav/SidebarNavRailItem.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRailItem.js +25 -0
- package/dist/components/sidebarNav/SidebarNavRailItem.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRailList.d.ts +4 -0
- package/dist/components/sidebarNav/SidebarNavRailList.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRailList.js +7 -0
- package/dist/components/sidebarNav/SidebarNavRailList.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRailSlot.d.ts +6 -0
- package/dist/components/sidebarNav/SidebarNavRailSlot.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavRailSlot.js +7 -0
- package/dist/components/sidebarNav/SidebarNavRailSlot.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavSeparator.d.ts +6 -0
- package/dist/components/sidebarNav/SidebarNavSeparator.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavSeparator.js +8 -0
- package/dist/components/sidebarNav/SidebarNavSeparator.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavTitle.d.ts +4 -0
- package/dist/components/sidebarNav/SidebarNavTitle.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavTitle.js +7 -0
- package/dist/components/sidebarNav/SidebarNavTitle.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavTooltip.d.ts +7 -0
- package/dist/components/sidebarNav/SidebarNavTooltip.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavTooltip.js +9 -0
- package/dist/components/sidebarNav/SidebarNavTooltip.js.map +1 -0
- package/dist/components/sidebarNav/SidebarNavTrigger.d.ts +8 -0
- package/dist/components/sidebarNav/SidebarNavTrigger.d.ts.map +1 -0
- package/dist/components/sidebarNav/SidebarNavTrigger.js +15 -0
- package/dist/components/sidebarNav/SidebarNavTrigger.js.map +1 -0
- package/dist/components/sidebarNav/index.d.ts +4 -0
- package/dist/components/sidebarNav/index.d.ts.map +1 -0
- package/dist/components/sidebarNav/index.js +3 -0
- package/dist/components/sidebarNav/index.js.map +1 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.d.ts +4 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.d.ts.map +1 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.js +43 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.js.map +1 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.test.d.ts +2 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.test.d.ts.map +1 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.test.js +52 -0
- package/dist/components/sidebarNav/resolvePanelItemProps.test.js.map +1 -0
- package/dist/components/sidebarNav/types.d.ts +100 -0
- package/dist/components/sidebarNav/types.d.ts.map +1 -0
- package/dist/components/sidebarNav/types.js +4 -0
- package/dist/components/sidebarNav/types.js.map +1 -0
- package/dist/components/sidebarNav/useControllableBoolean.d.ts +9 -0
- package/dist/components/sidebarNav/useControllableBoolean.d.ts.map +1 -0
- package/dist/components/sidebarNav/useControllableBoolean.js +15 -0
- package/dist/components/sidebarNav/useControllableBoolean.js.map +1 -0
- package/dist/components/slideover/Slideover.stories.d.ts +10 -0
- package/dist/components/slideover/Slideover.stories.d.ts.map +1 -0
- package/dist/components/slideover/Slideover.stories.js +12 -0
- package/dist/components/slideover/Slideover.stories.js.map +1 -0
- package/dist/components/table/BulkActionsDropdown.d.ts +12 -0
- package/dist/components/table/BulkActionsDropdown.d.ts.map +1 -0
- package/dist/components/table/BulkActionsDropdown.js +11 -0
- package/dist/components/table/BulkActionsDropdown.js.map +1 -0
- package/dist/components/table/HideColumnsDropdown.d.ts +9 -0
- package/dist/components/table/HideColumnsDropdown.d.ts.map +1 -0
- package/dist/components/table/HideColumnsDropdown.js +33 -0
- package/dist/components/table/HideColumnsDropdown.js.map +1 -0
- package/dist/components/table/Table.d.ts +1 -1
- package/dist/components/table/Table.stories.d.ts.map +1 -1
- package/dist/components/table/Table.stories.js +0 -5
- package/dist/components/table/Table.stories.js.map +1 -1
- package/dist/components/table/Table.test.js +0 -5
- package/dist/components/table/Table.test.js.map +1 -1
- package/dist/components/table/cellRenderers/SelectDropdownCellEditor.d.ts +8 -0
- package/dist/components/table/cellRenderers/SelectDropdownCellEditor.d.ts.map +1 -0
- package/dist/components/table/cellRenderers/SelectDropdownCellEditor.js +19 -0
- package/dist/components/table/cellRenderers/SelectDropdownCellEditor.js.map +1 -0
- package/dist/components/table/hooks/useHistory.d.ts +20 -0
- package/dist/components/table/hooks/useHistory.d.ts.map +1 -0
- package/dist/components/table/hooks/useHistory.js +73 -0
- package/dist/components/table/hooks/useHistory.js.map +1 -0
- package/dist/components/table/hooks/useTableHistory.d.ts +21 -0
- package/dist/components/table/hooks/useTableHistory.d.ts.map +1 -0
- package/dist/components/table/hooks/useTableHistory.js +88 -0
- package/dist/components/table/hooks/useTableHistory.js.map +1 -0
- package/dist/components/table/pagination/TableSettingsDropdown.d.ts +2 -0
- package/dist/components/table/pagination/TableSettingsDropdown.d.ts.map +1 -0
- package/dist/components/table/pagination/TableSettingsDropdown.js +42 -0
- package/dist/components/table/pagination/TableSettingsDropdown.js.map +1 -0
- package/dist/components/table/tableHeader/TableHeader.d.ts +14 -0
- package/dist/components/table/tableHeader/TableHeader.d.ts.map +1 -0
- package/dist/components/table/tableHeader/TableHeader.js +55 -0
- package/dist/components/table/tableHeader/TableHeader.js.map +1 -0
- package/dist/components/table/tableHeader/index.d.ts +2 -0
- package/dist/components/table/tableHeader/index.d.ts.map +1 -0
- package/dist/components/table/tableHeader/index.js +2 -0
- package/dist/components/table/tableHeader/index.js.map +1 -0
- package/dist/components/table/tableTheme.d.ts +2 -0
- package/dist/components/table/tableTheme.d.ts.map +1 -0
- package/dist/components/table/tableTheme.js +18 -0
- package/dist/components/table/tableTheme.js.map +1 -0
- package/dist/components/table/types.d.ts +169 -0
- package/dist/components/table/types.d.ts.map +1 -0
- package/dist/components/table/types.js +11 -0
- package/dist/components/table/types.js.map +1 -0
- package/dist/components/table/utils/setAgGridLicenseKey.d.ts +2 -0
- package/dist/components/table/utils/setAgGridLicenseKey.d.ts.map +1 -0
- package/dist/components/table/utils/setAgGridLicenseKey.js +11 -0
- package/dist/components/table/utils/setAgGridLicenseKey.js.map +1 -0
- package/dist/layoutTest.stories.d.ts +6 -0
- package/dist/layoutTest.stories.d.ts.map +1 -0
- package/dist/layoutTest.stories.js +9 -0
- package/dist/layoutTest.stories.js.map +1 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.d.ts +39 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.d.ts.map +1 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.js +112 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.js.map +1 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.stories.d.ts +184 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.stories.d.ts.map +1 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.stories.js +317 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.stories.js.map +1 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.test.d.ts +2 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.test.d.ts.map +1 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.test.js +160 -0
- package/dist/pages/assessmentBuilderPage/AssessmentBuilderPage.test.js.map +1 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.d.ts +11 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.d.ts.map +1 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.js +13 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.js.map +1 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.stories.d.ts +174 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.stories.d.ts.map +1 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.stories.js +212 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.stories.js.map +1 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.test.d.ts +2 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.test.d.ts.map +1 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.test.js +84 -0
- package/dist/pages/assessmentSettingsPage/AssessmentSettingsPage.test.js.map +1 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.d.ts +16 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.d.ts.map +1 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.js +31 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.js.map +1 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.stories.d.ts +162 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.stories.d.ts.map +1 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.stories.js +290 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.stories.js.map +1 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.test.d.ts +2 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.test.d.ts.map +1 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.test.js +109 -0
- package/dist/pages/assessmentsPage/AssessmentsPage.test.js.map +1 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.d.ts +40 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.d.ts.map +1 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.js +156 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.js.map +1 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.stories.d.ts +239 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.stories.d.ts.map +1 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.stories.js +318 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.stories.js.map +1 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.test.d.ts +2 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.test.d.ts.map +1 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.test.js +183 -0
- package/dist/pages/customReportWriterPage/CustomReportWriterPage.test.js.map +1 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.d.ts +26 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.d.ts.map +1 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.js +33 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.js.map +1 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.stories.d.ts +176 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.stories.d.ts.map +1 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.stories.js +237 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.stories.js.map +1 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.test.d.ts +2 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.test.d.ts.map +1 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.test.js +91 -0
- package/dist/pages/gradeSetsPage/GradeSetsPage.test.js.map +1 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.d.ts +48 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.d.ts.map +1 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.js +52 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.js.map +1 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.stories.d.ts +218 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.stories.d.ts.map +1 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.stories.js +273 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.stories.js.map +1 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.test.d.ts +2 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.test.d.ts.map +1 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.test.js +197 -0
- package/dist/pages/studentProfilePage/StudentProfilePage.test.js.map +1 -0
- package/dist/utils/PopupParentContext.d.ts +3 -0
- package/dist/utils/PopupParentContext.d.ts.map +1 -0
- package/dist/utils/PopupParentContext.js +6 -0
- package/dist/utils/PopupParentContext.js.map +1 -0
- package/dist/utils/PopupParentContext.stories.d.ts +17 -0
- package/dist/utils/PopupParentContext.stories.d.ts.map +1 -0
- package/dist/utils/PopupParentContext.stories.js +266 -0
- package/dist/utils/PopupParentContext.stories.js.map +1 -0
- package/dist/utils/getDefaultPopupParent.d.ts +2 -0
- package/dist/utils/getDefaultPopupParent.d.ts.map +1 -0
- package/dist/utils/getDefaultPopupParent.js +19 -0
- package/dist/utils/getDefaultPopupParent.js.map +1 -0
- package/package.json +4 -4
- package/src/components/pill/Pill.tsx +1 -0
- package/src/components/table/Table.stories.tsx +0 -5
- package/src/components/table/Table.test.tsx +0 -5
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { describe, it, expect, vi } from 'vitest';
|
|
3
|
+
import { render, screen } from '@testing-library/react';
|
|
4
|
+
import userEvent from '@testing-library/user-event';
|
|
5
|
+
import '@testing-library/jest-dom/vitest';
|
|
6
|
+
import { AssessmentSettingsPage } from './AssessmentSettingsPage.js';
|
|
7
|
+
describe('AssessmentSettingsPage', () => {
|
|
8
|
+
it('renders the page heading', () => {
|
|
9
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
10
|
+
expect(screen.getByRole('heading', { name: /assessment settings/i, level: 1 })).toBeInTheDocument();
|
|
11
|
+
});
|
|
12
|
+
it('renders breadcrumb navigation', () => {
|
|
13
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
14
|
+
expect(screen.getByRole('navigation', { name: /breadcrumb/i })).toBeInTheDocument();
|
|
15
|
+
expect(screen.getByRole('link', { name: /assessments/i })).toBeInTheDocument();
|
|
16
|
+
});
|
|
17
|
+
it('renders the Basic section heading', () => {
|
|
18
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
19
|
+
expect(screen.getByRole('heading', { name: /basic/i, level: 2 })).toBeInTheDocument();
|
|
20
|
+
});
|
|
21
|
+
it('renders the Advanced section heading', () => {
|
|
22
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
23
|
+
expect(screen.getByRole('heading', { name: /advanced/i, level: 2 })).toBeInTheDocument();
|
|
24
|
+
});
|
|
25
|
+
it('renders all Basic settings cards', () => {
|
|
26
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
27
|
+
expect(screen.getByText('Grade Sets')).toBeInTheDocument();
|
|
28
|
+
expect(screen.getByText('Subjects')).toBeInTheDocument();
|
|
29
|
+
expect(screen.getByText('Assessment Component')).toBeInTheDocument();
|
|
30
|
+
expect(screen.getByText('Assessment Periods (Data Drops)')).toBeInTheDocument();
|
|
31
|
+
});
|
|
32
|
+
it('renders all Advanced settings cards', () => {
|
|
33
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
34
|
+
expect(screen.getByText('Comment Banks')).toBeInTheDocument();
|
|
35
|
+
expect(screen.getByText('Assessment Lookups')).toBeInTheDocument();
|
|
36
|
+
});
|
|
37
|
+
it('renders card descriptions', () => {
|
|
38
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
39
|
+
expect(screen.getByText(/manage grade sets/i)).toBeInTheDocument();
|
|
40
|
+
expect(screen.getByText(/manage assessment subjects/i)).toBeInTheDocument();
|
|
41
|
+
expect(screen.getByText(/manage comment banks/i)).toBeInTheDocument();
|
|
42
|
+
});
|
|
43
|
+
it('calls onGradeSetsClick when Grade Sets card is clicked', async () => {
|
|
44
|
+
const onGradeSetsClick = vi.fn();
|
|
45
|
+
render(_jsx(AssessmentSettingsPage, { onGradeSetsClick: onGradeSetsClick }));
|
|
46
|
+
await userEvent.click(screen.getByText('Grade Sets'));
|
|
47
|
+
expect(onGradeSetsClick).toHaveBeenCalledTimes(1);
|
|
48
|
+
});
|
|
49
|
+
it('calls onSubjectsClick when Subjects card is clicked', async () => {
|
|
50
|
+
const onSubjectsClick = vi.fn();
|
|
51
|
+
render(_jsx(AssessmentSettingsPage, { onSubjectsClick: onSubjectsClick }));
|
|
52
|
+
await userEvent.click(screen.getByText('Subjects'));
|
|
53
|
+
expect(onSubjectsClick).toHaveBeenCalledTimes(1);
|
|
54
|
+
});
|
|
55
|
+
it('calls onAssessmentComponentClick when Assessment Component card is clicked', async () => {
|
|
56
|
+
const onAssessmentComponentClick = vi.fn();
|
|
57
|
+
render(_jsx(AssessmentSettingsPage, { onAssessmentComponentClick: onAssessmentComponentClick }));
|
|
58
|
+
await userEvent.click(screen.getByText('Assessment Component'));
|
|
59
|
+
expect(onAssessmentComponentClick).toHaveBeenCalledTimes(1);
|
|
60
|
+
});
|
|
61
|
+
it('calls onAssessmentPeriodsClick when Assessment Periods card is clicked', async () => {
|
|
62
|
+
const onAssessmentPeriodsClick = vi.fn();
|
|
63
|
+
render(_jsx(AssessmentSettingsPage, { onAssessmentPeriodsClick: onAssessmentPeriodsClick }));
|
|
64
|
+
await userEvent.click(screen.getByText('Assessment Periods (Data Drops)'));
|
|
65
|
+
expect(onAssessmentPeriodsClick).toHaveBeenCalledTimes(1);
|
|
66
|
+
});
|
|
67
|
+
it('calls onCommentBanksClick when Comment Banks card is clicked', async () => {
|
|
68
|
+
const onCommentBanksClick = vi.fn();
|
|
69
|
+
render(_jsx(AssessmentSettingsPage, { onCommentBanksClick: onCommentBanksClick }));
|
|
70
|
+
await userEvent.click(screen.getByText('Comment Banks'));
|
|
71
|
+
expect(onCommentBanksClick).toHaveBeenCalledTimes(1);
|
|
72
|
+
});
|
|
73
|
+
it('calls onAssessmentLookupsClick when Assessment Lookups card is clicked', async () => {
|
|
74
|
+
const onAssessmentLookupsClick = vi.fn();
|
|
75
|
+
render(_jsx(AssessmentSettingsPage, { onAssessmentLookupsClick: onAssessmentLookupsClick }));
|
|
76
|
+
await userEvent.click(screen.getByText('Assessment Lookups'));
|
|
77
|
+
expect(onAssessmentLookupsClick).toHaveBeenCalledTimes(1);
|
|
78
|
+
});
|
|
79
|
+
it('renders without crashing when no callbacks are provided', () => {
|
|
80
|
+
render(_jsx(AssessmentSettingsPage, {}));
|
|
81
|
+
expect(screen.getByRole('heading', { name: /assessment settings/i, level: 1 })).toBeInTheDocument();
|
|
82
|
+
});
|
|
83
|
+
});
|
|
84
|
+
//# sourceMappingURL=AssessmentSettingsPage.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AssessmentSettingsPage.test.js","sourceRoot":"","sources":["../../../src/pages/assessmentSettingsPage/AssessmentSettingsPage.test.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export type Assessment = {
|
|
2
|
+
id: string;
|
|
3
|
+
name: string;
|
|
4
|
+
completionPercentage: number;
|
|
5
|
+
status: 'active' | 'draft' | 'archived';
|
|
6
|
+
};
|
|
7
|
+
export type AssessmentsPageProps = {
|
|
8
|
+
assessments?: Assessment[];
|
|
9
|
+
onCreateNewAssessment?: () => void;
|
|
10
|
+
onOpenMarksheetSettings?: () => void;
|
|
11
|
+
onEditAssessment?: (id: string) => void;
|
|
12
|
+
onOpenMarksheets?: (id: string) => void;
|
|
13
|
+
className?: string;
|
|
14
|
+
};
|
|
15
|
+
export declare const AssessmentsPage: ({ assessments, onCreateNewAssessment, onOpenMarksheetSettings, onEditAssessment, onOpenMarksheets, className, }: AssessmentsPageProps) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
//# sourceMappingURL=AssessmentsPage.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AssessmentsPage.d.ts","sourceRoot":"","sources":["../../../src/pages/assessmentsPage/AssessmentsPage.tsx"],"names":[],"mappings":"AAcA,MAAM,MAAM,UAAU,GAAG;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,oBAAoB,EAAE,MAAM,CAAC;IAC7B,MAAM,EAAE,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;IACrC,gBAAgB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,gBAAgB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,iHAO7B,oBAAoB,4CA4HtB,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
/**
|
|
3
|
+
* AssessmentsPage - The main Assessments Homepage.
|
|
4
|
+
* Displays a filterable, searchable list of assessments with edit and marksheet actions.
|
|
5
|
+
*/
|
|
6
|
+
import classNames from 'classnames';
|
|
7
|
+
import { useState } from 'react';
|
|
8
|
+
import { Button } from '../../components/button/Button.js';
|
|
9
|
+
import { Heading } from '../../components/heading/Heading.js';
|
|
10
|
+
import { Icon } from '../../components/icon/Icon.js';
|
|
11
|
+
import { Pill } from '../../components/pill/Pill.js';
|
|
12
|
+
import { Section } from '../../components/section/Section.js';
|
|
13
|
+
import { Separator } from '../../components/separator/Separator.js';
|
|
14
|
+
import { TextInput } from '../../components/formField/inputs/text/TextInput.js';
|
|
15
|
+
export const AssessmentsPage = ({ assessments = [], onCreateNewAssessment, onOpenMarksheetSettings, onEditAssessment, onOpenMarksheets, className, }) => {
|
|
16
|
+
const [showAllActive, setShowAllActive] = useState(true);
|
|
17
|
+
const [showDraft, setShowDraft] = useState(false);
|
|
18
|
+
const [showArchived, setShowArchived] = useState(false);
|
|
19
|
+
const [searchQuery, setSearchQuery] = useState('');
|
|
20
|
+
const filteredAssessments = assessments.filter((assessment) => {
|
|
21
|
+
const matchesSearch = assessment.name
|
|
22
|
+
.toLowerCase()
|
|
23
|
+
.includes(searchQuery.toLowerCase());
|
|
24
|
+
const matchesFilter = (showAllActive && assessment.status === 'active')
|
|
25
|
+
|| (showDraft && assessment.status === 'draft')
|
|
26
|
+
|| (showArchived && assessment.status === 'archived');
|
|
27
|
+
return matchesSearch && matchesFilter;
|
|
28
|
+
});
|
|
29
|
+
return (_jsxs("div", { className: classNames('ds-assessments-page', className), children: [_jsx("nav", { "aria-label": "Breadcrumb", className: "ds-assessments-page__breadcrumbs", children: _jsxs("ol", { className: "ds-assessments-page__breadcrumb-list", children: [_jsx("li", { className: "ds-assessments-page__breadcrumb-item", children: _jsx("a", { href: "/assessments", className: "ds-assessments-page__breadcrumb-link", children: "Assessments" }) }), _jsxs("li", { className: "ds-assessments-page__breadcrumb-item ds-assessments-page__breadcrumb-item--current", "aria-current": "page", children: ["Assessments Homepage", _jsx(Icon, { name: "link", size: 16, screenReaderText: "Permalink" })] })] }) }), _jsxs("header", { className: "ds-assessments-page__header", children: [_jsx(Heading, { level: 1, children: "Assessments" }), _jsxs("div", { className: "ds-assessments-page__header-actions", children: [_jsx(Button, { variant: "secondary", iconLeftName: "settings", onClick: onOpenMarksheetSettings, children: "Marksheet Settings" }), _jsx(Button, { variant: "primary", iconLeftName: "plus", onClick: onCreateNewAssessment, children: "Create New Assessment" })] })] }), _jsxs("div", { className: "ds-assessments-page__filter-bar", children: [_jsxs("div", { className: "ds-assessments-page__filters", children: [_jsx(Pill, { text: "All Active", initialValue: showAllActive, onclick: setShowAllActive }), _jsx(Pill, { text: "Draft", initialValue: showDraft, onclick: setShowDraft }), _jsx(Pill, { text: "Archived", initialValue: showArchived, onclick: setShowArchived })] }), _jsx(TextInput, { placeholder: "Search Marksheets", "aria-label": "Search Marksheets", value: searchQuery, onChange: e => setSearchQuery(e.target.value), size: "S" })] }), _jsx("main", { className: "ds-assessments-page__content", children: _jsx("div", { className: "ds-assessments-page__assessment-list", children: filteredAssessments.map((assessment, index) => (_jsxs("div", { className: "ds-assessments-page__assessment-item", children: [_jsx(Section, { collapsible: true, title: assessment.name, headingLevel: 2, children: _jsxs("div", { className: "ds-assessments-page__assessment-details", children: [_jsxs("span", { className: "ds-assessments-page__assessment-completion", children: [assessment.completionPercentage, "% completed"] }), _jsxs("div", { className: "ds-assessments-page__assessment-actions", children: [_jsx(Button, { variant: "secondary", size: "S", onClick: () => onEditAssessment?.(assessment.id), children: "Edit" }), _jsx(Button, { variant: "secondary", size: "S", onClick: () => onOpenMarksheets?.(assessment.id), children: "Open Marksheets" })] })] }) }), index < filteredAssessments.length - 1 && _jsx(Separator, {})] }, assessment.id))) }) })] }));
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=AssessmentsPage.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AssessmentsPage.js","sourceRoot":"","sources":["../../../src/pages/assessmentsPage/AssessmentsPage.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,162 @@
|
|
|
1
|
+
import type { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
/**
|
|
3
|
+
* Well, picture it: a school in St. Olaf, circa 1987.
|
|
4
|
+
*
|
|
5
|
+
* Every term, the teachers had to manage dozens of assessments - tracking which ones were
|
|
6
|
+
* active, which were still drafts, and which had been lovingly archived for posterity.
|
|
7
|
+
* Back then, Gunnar Gustafsson kept them all on index cards in a shoebox. It took him
|
|
8
|
+
* three days to find anything, and once he lost an entire set of phonics assessments
|
|
9
|
+
* between a jar of aquavit and a picture of the school mascot (a very distinguished herring).
|
|
10
|
+
*
|
|
11
|
+
* The AssessmentsPage is the digital solution that Gunnar never had. It is the main
|
|
12
|
+
* homepage for browsing, filtering, and actioning assessments - with a beautiful
|
|
13
|
+
* search input, status-based filter pills (All Active, Draft, Archived), and collapsible
|
|
14
|
+
* assessment rows powered by the Section component.
|
|
15
|
+
*
|
|
16
|
+
* Each assessment row is a collapsible Section. Sections start **expanded** by default,
|
|
17
|
+
* so the completion percentage and Edit / Open Marksheets action buttons are immediately
|
|
18
|
+
* visible. A user can click the assessment name (the Section heading) or the chevron
|
|
19
|
+
* button to collapse an individual row and tuck it away - just like folding up a card
|
|
20
|
+
* in Gunnar's shoebox when you're done with it. The Section component manages its own
|
|
21
|
+
* collapsed state internally, so each row collapses and expands independently.
|
|
22
|
+
*
|
|
23
|
+
* **Features:**
|
|
24
|
+
* - Breadcrumb navigation for orientation within the app
|
|
25
|
+
* - Page-level actions: Create New Assessment and Marksheet Settings
|
|
26
|
+
* - Filter pills for All Active, Draft, and Archived statuses (independent toggles)
|
|
27
|
+
* - Live search filtering by assessment name
|
|
28
|
+
* - Collapsible assessment rows via the Section component (start expanded by default)
|
|
29
|
+
* - Completion percentage display per assessment (visible in the expanded Section body)
|
|
30
|
+
* - Per-assessment Edit and Open Marksheets action buttons (visible in the expanded Section body)
|
|
31
|
+
*
|
|
32
|
+
* **Collapse / Expand behaviour:**
|
|
33
|
+
* - Each assessment row is a `<Section collapsible>` with no `collapsed` prop, so it
|
|
34
|
+
* initialises in the **expanded** state.
|
|
35
|
+
* - Clicking the Section heading or the chevron button toggles that row's collapsed state.
|
|
36
|
+
* - The Section's internal `aria-expanded` attribute on the chevron button updates
|
|
37
|
+
* automatically (`true` = expanded, `false` = collapsed).
|
|
38
|
+
* - The chevron icon switches between `chevron-up` (expanded) and `chevron-down` (collapsed).
|
|
39
|
+
* - Each row's state is fully independent - collapsing one does not affect the others.
|
|
40
|
+
*
|
|
41
|
+
* **Accessibility:**
|
|
42
|
+
* - Breadcrumb uses `<nav aria-label="Breadcrumb">` with `aria-current="page"` on the current item
|
|
43
|
+
* - The Section component's collapse button has `aria-expanded` to communicate state to screen readers
|
|
44
|
+
* - Screen-reader-only text on the chevron icon reads "Expand section" or "Collapse section"
|
|
45
|
+
* - The Section heading is keyboard-focusable and responds to Space and Enter to toggle collapse
|
|
46
|
+
* - Search input has an explicit `aria-label`
|
|
47
|
+
* - Page structure uses semantic `<header>` and `<main>` landmarks
|
|
48
|
+
* - Each `<section>` element has an implicit ARIA role of "region" via its `aria-label`
|
|
49
|
+
*/
|
|
50
|
+
declare const meta: {
|
|
51
|
+
title: string;
|
|
52
|
+
component: ({ assessments, onCreateNewAssessment, onOpenMarksheetSettings, onEditAssessment, onOpenMarksheets, className, }: import("./AssessmentsPage.js").AssessmentsPageProps) => import("react/jsx-runtime").JSX.Element;
|
|
53
|
+
parameters: {
|
|
54
|
+
layout: string;
|
|
55
|
+
docs: {
|
|
56
|
+
description: {
|
|
57
|
+
component: string;
|
|
58
|
+
};
|
|
59
|
+
};
|
|
60
|
+
};
|
|
61
|
+
tags: string[];
|
|
62
|
+
args: {
|
|
63
|
+
onCreateNewAssessment: import("@vitest/spy").Mock<(...args: any[]) => any>;
|
|
64
|
+
onOpenMarksheetSettings: import("@vitest/spy").Mock<(...args: any[]) => any>;
|
|
65
|
+
onEditAssessment: import("@vitest/spy").Mock<(...args: any[]) => any>;
|
|
66
|
+
onOpenMarksheets: import("@vitest/spy").Mock<(...args: any[]) => any>;
|
|
67
|
+
};
|
|
68
|
+
argTypes: {
|
|
69
|
+
assessments: {
|
|
70
|
+
control: "object";
|
|
71
|
+
description: string;
|
|
72
|
+
};
|
|
73
|
+
onCreateNewAssessment: {
|
|
74
|
+
description: string;
|
|
75
|
+
};
|
|
76
|
+
onOpenMarksheetSettings: {
|
|
77
|
+
description: string;
|
|
78
|
+
};
|
|
79
|
+
onEditAssessment: {
|
|
80
|
+
description: string;
|
|
81
|
+
};
|
|
82
|
+
onOpenMarksheets: {
|
|
83
|
+
description: string;
|
|
84
|
+
};
|
|
85
|
+
className: {
|
|
86
|
+
control: "text";
|
|
87
|
+
description: string;
|
|
88
|
+
};
|
|
89
|
+
};
|
|
90
|
+
};
|
|
91
|
+
export default meta;
|
|
92
|
+
type Story = StoryObj<typeof meta>;
|
|
93
|
+
/**
|
|
94
|
+
* The empty state - no assessments have been created yet.
|
|
95
|
+
*
|
|
96
|
+
* Oh, this is like arriving in St. Olaf for the first time. The town square is
|
|
97
|
+
* quiet, nothing is happening yet, but you can feel the potential! The page
|
|
98
|
+
* renders all its chrome - breadcrumbs, header actions, filter bar, and search -
|
|
99
|
+
* but the assessment list is gloriously empty. This is your starting point.
|
|
100
|
+
*
|
|
101
|
+
* Note: by default the "All Active" filter pill is toggled on, so no assessments
|
|
102
|
+
* means no assessments are shown (rather than an unfiltered full list).
|
|
103
|
+
*/
|
|
104
|
+
export declare const Default: Story;
|
|
105
|
+
/**
|
|
106
|
+
* The page with active assessments loaded and the default "All Active" filter.
|
|
107
|
+
*
|
|
108
|
+
* Back in St. Olaf, when we finally got the assessments organised, the first
|
|
109
|
+
* thing everyone wanted to see was the active ones - the live, in-progress work.
|
|
110
|
+
* This story shows the AssessmentsPage in its most common real-world state:
|
|
111
|
+
* a short list of active assessments, each rendered as a collapsible Section.
|
|
112
|
+
*
|
|
113
|
+
* Notice that both rows start **fully expanded** - the completion percentage
|
|
114
|
+
* and the Edit / Open Marksheets buttons are right there, visible and ready,
|
|
115
|
+
* like a barn door thrown open on a sunny St. Olaf morning. Click an assessment
|
|
116
|
+
* name or the chevron button on the right to collapse that row and tuck the
|
|
117
|
+
* details away. Click again to expand it back. Each row is completely independent.
|
|
118
|
+
*
|
|
119
|
+
* The Section component handles all of this internally using its own useState -
|
|
120
|
+
* no expand/collapse wiring is needed in AssessmentsPage itself.
|
|
121
|
+
*/
|
|
122
|
+
export declare const WithActiveAssessments: Story;
|
|
123
|
+
/**
|
|
124
|
+
* A realistic scenario with assessments across all three statuses.
|
|
125
|
+
*
|
|
126
|
+
* You know, this reminds me of the time in St. Olaf when we were sorting the
|
|
127
|
+
* annual herring festival entries into "active", "still marinating" (draft),
|
|
128
|
+
* and "last year's" (archived). You had to toggle each category yourself -
|
|
129
|
+
* just like these independent filter pills!
|
|
130
|
+
*
|
|
131
|
+
* By default only "All Active" is on, so you will only see the active
|
|
132
|
+
* assessments. Toggle the Draft and Archived pills in the controls panel
|
|
133
|
+
* (or right there in the Storybook canvas!) to reveal the other statuses.
|
|
134
|
+
* Each pill is completely independent of the others.
|
|
135
|
+
*
|
|
136
|
+
* Every visible assessment row starts in the expanded state. Try clicking an
|
|
137
|
+
* assessment heading or the chevron to collapse it - then toggle in more statuses
|
|
138
|
+
* to see fresh rows appear, also expanded and ready to go.
|
|
139
|
+
*/
|
|
140
|
+
export declare const WithMixedStatuses: Story;
|
|
141
|
+
/**
|
|
142
|
+
* A larger dataset to verify list rendering, separators, and scroll behaviour.
|
|
143
|
+
*
|
|
144
|
+
* Oh my stars, ten whole assessments! Back in St. Olaf, Ingrid Nordstrom once
|
|
145
|
+
* catalogued every single assessment in the district - all forty-seven of them -
|
|
146
|
+
* in a single afternoon. We were all very impressed, but also slightly concerned
|
|
147
|
+
* because she forgot to eat lunch. Ten is a much more manageable number, and it
|
|
148
|
+
* lets you see how the list looks with separators between rows and all sections
|
|
149
|
+
* starting expanded.
|
|
150
|
+
*
|
|
151
|
+
* With all rows expanded by default, you can really appreciate how the list
|
|
152
|
+
* fills out - completion percentages and action buttons visible for every
|
|
153
|
+
* assessment all at once. Try collapsing a few rows to see how much space
|
|
154
|
+
* you can reclaim, then use the search box (try typing "KS") or the filter
|
|
155
|
+
* pills to narrow the list down. Rows that disappear from the filter and
|
|
156
|
+
* come back will start expanded again, fresh as a St. Olaf morning.
|
|
157
|
+
*
|
|
158
|
+
* Note: By default only "All Active" assessments are shown. Toggle the Draft
|
|
159
|
+
* and Archived pills to see the full ten-assessment dataset.
|
|
160
|
+
*/
|
|
161
|
+
export declare const WithManyAssessments: Story;
|
|
162
|
+
//# sourceMappingURL=AssessmentsPage.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AssessmentsPage.stories.d.ts","sourceRoot":"","sources":["../../../src/pages/assessmentsPage/AssessmentsPage.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAK5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4C8B,CAAC;AAEzC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAmHnC;;;;;;;;;;GAUG;AACH,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAKnC,CAAC;AAEF;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAK/B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAKjC,CAAC"}
|
|
@@ -0,0 +1,290 @@
|
|
|
1
|
+
import { fn } from 'storybook/test';
|
|
2
|
+
import { AssessmentsPage } from './AssessmentsPage.js';
|
|
3
|
+
/**
|
|
4
|
+
* Well, picture it: a school in St. Olaf, circa 1987.
|
|
5
|
+
*
|
|
6
|
+
* Every term, the teachers had to manage dozens of assessments - tracking which ones were
|
|
7
|
+
* active, which were still drafts, and which had been lovingly archived for posterity.
|
|
8
|
+
* Back then, Gunnar Gustafsson kept them all on index cards in a shoebox. It took him
|
|
9
|
+
* three days to find anything, and once he lost an entire set of phonics assessments
|
|
10
|
+
* between a jar of aquavit and a picture of the school mascot (a very distinguished herring).
|
|
11
|
+
*
|
|
12
|
+
* The AssessmentsPage is the digital solution that Gunnar never had. It is the main
|
|
13
|
+
* homepage for browsing, filtering, and actioning assessments - with a beautiful
|
|
14
|
+
* search input, status-based filter pills (All Active, Draft, Archived), and collapsible
|
|
15
|
+
* assessment rows powered by the Section component.
|
|
16
|
+
*
|
|
17
|
+
* Each assessment row is a collapsible Section. Sections start **expanded** by default,
|
|
18
|
+
* so the completion percentage and Edit / Open Marksheets action buttons are immediately
|
|
19
|
+
* visible. A user can click the assessment name (the Section heading) or the chevron
|
|
20
|
+
* button to collapse an individual row and tuck it away - just like folding up a card
|
|
21
|
+
* in Gunnar's shoebox when you're done with it. The Section component manages its own
|
|
22
|
+
* collapsed state internally, so each row collapses and expands independently.
|
|
23
|
+
*
|
|
24
|
+
* **Features:**
|
|
25
|
+
* - Breadcrumb navigation for orientation within the app
|
|
26
|
+
* - Page-level actions: Create New Assessment and Marksheet Settings
|
|
27
|
+
* - Filter pills for All Active, Draft, and Archived statuses (independent toggles)
|
|
28
|
+
* - Live search filtering by assessment name
|
|
29
|
+
* - Collapsible assessment rows via the Section component (start expanded by default)
|
|
30
|
+
* - Completion percentage display per assessment (visible in the expanded Section body)
|
|
31
|
+
* - Per-assessment Edit and Open Marksheets action buttons (visible in the expanded Section body)
|
|
32
|
+
*
|
|
33
|
+
* **Collapse / Expand behaviour:**
|
|
34
|
+
* - Each assessment row is a `<Section collapsible>` with no `collapsed` prop, so it
|
|
35
|
+
* initialises in the **expanded** state.
|
|
36
|
+
* - Clicking the Section heading or the chevron button toggles that row's collapsed state.
|
|
37
|
+
* - The Section's internal `aria-expanded` attribute on the chevron button updates
|
|
38
|
+
* automatically (`true` = expanded, `false` = collapsed).
|
|
39
|
+
* - The chevron icon switches between `chevron-up` (expanded) and `chevron-down` (collapsed).
|
|
40
|
+
* - Each row's state is fully independent - collapsing one does not affect the others.
|
|
41
|
+
*
|
|
42
|
+
* **Accessibility:**
|
|
43
|
+
* - Breadcrumb uses `<nav aria-label="Breadcrumb">` with `aria-current="page"` on the current item
|
|
44
|
+
* - The Section component's collapse button has `aria-expanded` to communicate state to screen readers
|
|
45
|
+
* - Screen-reader-only text on the chevron icon reads "Expand section" or "Collapse section"
|
|
46
|
+
* - The Section heading is keyboard-focusable and responds to Space and Enter to toggle collapse
|
|
47
|
+
* - Search input has an explicit `aria-label`
|
|
48
|
+
* - Page structure uses semantic `<header>` and `<main>` landmarks
|
|
49
|
+
* - Each `<section>` element has an implicit ARIA role of "region" via its `aria-label`
|
|
50
|
+
*/
|
|
51
|
+
const meta = {
|
|
52
|
+
title: 'Pages/AssessmentsPage',
|
|
53
|
+
component: AssessmentsPage,
|
|
54
|
+
parameters: {
|
|
55
|
+
layout: 'fullscreen',
|
|
56
|
+
docs: {
|
|
57
|
+
description: {
|
|
58
|
+
component: 'The main Assessments Homepage. Displays a filterable, searchable list of assessments with collapsible rows, edit, and marksheet actions. Each assessment row is a Section component that starts expanded - users can collapse individual rows by clicking the heading or chevron. Back in St. Olaf they did this with index cards in a shoebox - we do it with this lovely page component.',
|
|
59
|
+
},
|
|
60
|
+
},
|
|
61
|
+
},
|
|
62
|
+
tags: ['autodocs'],
|
|
63
|
+
args: {
|
|
64
|
+
onCreateNewAssessment: fn(),
|
|
65
|
+
onOpenMarksheetSettings: fn(),
|
|
66
|
+
onEditAssessment: fn(),
|
|
67
|
+
onOpenMarksheets: fn(),
|
|
68
|
+
},
|
|
69
|
+
argTypes: {
|
|
70
|
+
assessments: {
|
|
71
|
+
control: 'object',
|
|
72
|
+
description: 'The list of assessments to display. Each assessment has an id, name, completionPercentage, and status. Each assessment is rendered as a collapsible Section that starts expanded.',
|
|
73
|
+
},
|
|
74
|
+
onCreateNewAssessment: {
|
|
75
|
+
description: 'Called when the "Create New Assessment" header button is clicked.',
|
|
76
|
+
},
|
|
77
|
+
onOpenMarksheetSettings: {
|
|
78
|
+
description: 'Called when the "Marksheet Settings" header button is clicked.',
|
|
79
|
+
},
|
|
80
|
+
onEditAssessment: {
|
|
81
|
+
description: 'Called with the assessment id when the "Edit" button inside an assessment\'s expanded Section is clicked.',
|
|
82
|
+
},
|
|
83
|
+
onOpenMarksheets: {
|
|
84
|
+
description: 'Called with the assessment id when the "Open Marksheets" button inside an assessment\'s expanded Section is clicked.',
|
|
85
|
+
},
|
|
86
|
+
className: {
|
|
87
|
+
control: 'text',
|
|
88
|
+
description: 'Optional additional CSS class name(s) to apply to the page root element.',
|
|
89
|
+
},
|
|
90
|
+
},
|
|
91
|
+
};
|
|
92
|
+
export default meta;
|
|
93
|
+
// ---------------------------------------------------------------------------
|
|
94
|
+
// Shared data fixtures - think of these as St. Olaf's finest assessment records
|
|
95
|
+
// ---------------------------------------------------------------------------
|
|
96
|
+
const activeAssessments = [
|
|
97
|
+
{
|
|
98
|
+
id: '1',
|
|
99
|
+
name: 'Internal Progress Tracking (Years 7-11)',
|
|
100
|
+
completionPercentage: 66,
|
|
101
|
+
status: 'active',
|
|
102
|
+
},
|
|
103
|
+
{
|
|
104
|
+
id: '2',
|
|
105
|
+
name: 'KS3 History (ARE)',
|
|
106
|
+
completionPercentage: 79,
|
|
107
|
+
status: 'active',
|
|
108
|
+
},
|
|
109
|
+
];
|
|
110
|
+
const mixedAssessments = [
|
|
111
|
+
{
|
|
112
|
+
id: '1',
|
|
113
|
+
name: 'Internal Progress Tracking (Years 7-11)',
|
|
114
|
+
completionPercentage: 66,
|
|
115
|
+
status: 'active',
|
|
116
|
+
},
|
|
117
|
+
{
|
|
118
|
+
id: '2',
|
|
119
|
+
name: 'KS3 History (ARE)',
|
|
120
|
+
completionPercentage: 79,
|
|
121
|
+
status: 'active',
|
|
122
|
+
},
|
|
123
|
+
{
|
|
124
|
+
id: '3',
|
|
125
|
+
name: 'KS4 Assessment 2025/26',
|
|
126
|
+
completionPercentage: 50,
|
|
127
|
+
status: 'draft',
|
|
128
|
+
},
|
|
129
|
+
{
|
|
130
|
+
id: '4',
|
|
131
|
+
name: 'Year 1 Phonics Screening Check',
|
|
132
|
+
completionPercentage: 48,
|
|
133
|
+
status: 'archived',
|
|
134
|
+
},
|
|
135
|
+
];
|
|
136
|
+
const manyAssessments = [
|
|
137
|
+
{
|
|
138
|
+
id: '1',
|
|
139
|
+
name: 'Internal Progress Tracking (Years 7-11)',
|
|
140
|
+
completionPercentage: 66,
|
|
141
|
+
status: 'active',
|
|
142
|
+
},
|
|
143
|
+
{
|
|
144
|
+
id: '2',
|
|
145
|
+
name: 'KS3 History (ARE)',
|
|
146
|
+
completionPercentage: 79,
|
|
147
|
+
status: 'active',
|
|
148
|
+
},
|
|
149
|
+
{
|
|
150
|
+
id: '3',
|
|
151
|
+
name: 'KS4 Maths Foundation',
|
|
152
|
+
completionPercentage: 34,
|
|
153
|
+
status: 'active',
|
|
154
|
+
},
|
|
155
|
+
{
|
|
156
|
+
id: '4',
|
|
157
|
+
name: 'Year 9 Science Mid-Year Review',
|
|
158
|
+
completionPercentage: 91,
|
|
159
|
+
status: 'active',
|
|
160
|
+
},
|
|
161
|
+
{
|
|
162
|
+
id: '5',
|
|
163
|
+
name: 'Year 11 English Literature Mock',
|
|
164
|
+
completionPercentage: 55,
|
|
165
|
+
status: 'active',
|
|
166
|
+
},
|
|
167
|
+
{
|
|
168
|
+
id: '6',
|
|
169
|
+
name: 'KS4 Assessment 2025/26',
|
|
170
|
+
completionPercentage: 50,
|
|
171
|
+
status: 'draft',
|
|
172
|
+
},
|
|
173
|
+
{
|
|
174
|
+
id: '7',
|
|
175
|
+
name: 'Year 10 Geography Coursework Tracker',
|
|
176
|
+
completionPercentage: 20,
|
|
177
|
+
status: 'draft',
|
|
178
|
+
},
|
|
179
|
+
{
|
|
180
|
+
id: '8',
|
|
181
|
+
name: 'Year 1 Phonics Screening Check',
|
|
182
|
+
completionPercentage: 48,
|
|
183
|
+
status: 'archived',
|
|
184
|
+
},
|
|
185
|
+
{
|
|
186
|
+
id: '9',
|
|
187
|
+
name: 'KS2 SATs Preparation 2024',
|
|
188
|
+
completionPercentage: 100,
|
|
189
|
+
status: 'archived',
|
|
190
|
+
},
|
|
191
|
+
{
|
|
192
|
+
id: '10',
|
|
193
|
+
name: 'Year 7 Baseline Assessment',
|
|
194
|
+
completionPercentage: 100,
|
|
195
|
+
status: 'archived',
|
|
196
|
+
},
|
|
197
|
+
];
|
|
198
|
+
// ---------------------------------------------------------------------------
|
|
199
|
+
// Stories
|
|
200
|
+
// ---------------------------------------------------------------------------
|
|
201
|
+
/**
|
|
202
|
+
* The empty state - no assessments have been created yet.
|
|
203
|
+
*
|
|
204
|
+
* Oh, this is like arriving in St. Olaf for the first time. The town square is
|
|
205
|
+
* quiet, nothing is happening yet, but you can feel the potential! The page
|
|
206
|
+
* renders all its chrome - breadcrumbs, header actions, filter bar, and search -
|
|
207
|
+
* but the assessment list is gloriously empty. This is your starting point.
|
|
208
|
+
*
|
|
209
|
+
* Note: by default the "All Active" filter pill is toggled on, so no assessments
|
|
210
|
+
* means no assessments are shown (rather than an unfiltered full list).
|
|
211
|
+
*/
|
|
212
|
+
export const Default = {
|
|
213
|
+
name: 'Default (Empty)',
|
|
214
|
+
args: {
|
|
215
|
+
assessments: [],
|
|
216
|
+
},
|
|
217
|
+
};
|
|
218
|
+
/**
|
|
219
|
+
* The page with active assessments loaded and the default "All Active" filter.
|
|
220
|
+
*
|
|
221
|
+
* Back in St. Olaf, when we finally got the assessments organised, the first
|
|
222
|
+
* thing everyone wanted to see was the active ones - the live, in-progress work.
|
|
223
|
+
* This story shows the AssessmentsPage in its most common real-world state:
|
|
224
|
+
* a short list of active assessments, each rendered as a collapsible Section.
|
|
225
|
+
*
|
|
226
|
+
* Notice that both rows start **fully expanded** - the completion percentage
|
|
227
|
+
* and the Edit / Open Marksheets buttons are right there, visible and ready,
|
|
228
|
+
* like a barn door thrown open on a sunny St. Olaf morning. Click an assessment
|
|
229
|
+
* name or the chevron button on the right to collapse that row and tuck the
|
|
230
|
+
* details away. Click again to expand it back. Each row is completely independent.
|
|
231
|
+
*
|
|
232
|
+
* The Section component handles all of this internally using its own useState -
|
|
233
|
+
* no expand/collapse wiring is needed in AssessmentsPage itself.
|
|
234
|
+
*/
|
|
235
|
+
export const WithActiveAssessments = {
|
|
236
|
+
name: 'With Active Assessments',
|
|
237
|
+
args: {
|
|
238
|
+
assessments: activeAssessments,
|
|
239
|
+
},
|
|
240
|
+
};
|
|
241
|
+
/**
|
|
242
|
+
* A realistic scenario with assessments across all three statuses.
|
|
243
|
+
*
|
|
244
|
+
* You know, this reminds me of the time in St. Olaf when we were sorting the
|
|
245
|
+
* annual herring festival entries into "active", "still marinating" (draft),
|
|
246
|
+
* and "last year's" (archived). You had to toggle each category yourself -
|
|
247
|
+
* just like these independent filter pills!
|
|
248
|
+
*
|
|
249
|
+
* By default only "All Active" is on, so you will only see the active
|
|
250
|
+
* assessments. Toggle the Draft and Archived pills in the controls panel
|
|
251
|
+
* (or right there in the Storybook canvas!) to reveal the other statuses.
|
|
252
|
+
* Each pill is completely independent of the others.
|
|
253
|
+
*
|
|
254
|
+
* Every visible assessment row starts in the expanded state. Try clicking an
|
|
255
|
+
* assessment heading or the chevron to collapse it - then toggle in more statuses
|
|
256
|
+
* to see fresh rows appear, also expanded and ready to go.
|
|
257
|
+
*/
|
|
258
|
+
export const WithMixedStatuses = {
|
|
259
|
+
name: 'With Mixed Statuses',
|
|
260
|
+
args: {
|
|
261
|
+
assessments: mixedAssessments,
|
|
262
|
+
},
|
|
263
|
+
};
|
|
264
|
+
/**
|
|
265
|
+
* A larger dataset to verify list rendering, separators, and scroll behaviour.
|
|
266
|
+
*
|
|
267
|
+
* Oh my stars, ten whole assessments! Back in St. Olaf, Ingrid Nordstrom once
|
|
268
|
+
* catalogued every single assessment in the district - all forty-seven of them -
|
|
269
|
+
* in a single afternoon. We were all very impressed, but also slightly concerned
|
|
270
|
+
* because she forgot to eat lunch. Ten is a much more manageable number, and it
|
|
271
|
+
* lets you see how the list looks with separators between rows and all sections
|
|
272
|
+
* starting expanded.
|
|
273
|
+
*
|
|
274
|
+
* With all rows expanded by default, you can really appreciate how the list
|
|
275
|
+
* fills out - completion percentages and action buttons visible for every
|
|
276
|
+
* assessment all at once. Try collapsing a few rows to see how much space
|
|
277
|
+
* you can reclaim, then use the search box (try typing "KS") or the filter
|
|
278
|
+
* pills to narrow the list down. Rows that disappear from the filter and
|
|
279
|
+
* come back will start expanded again, fresh as a St. Olaf morning.
|
|
280
|
+
*
|
|
281
|
+
* Note: By default only "All Active" assessments are shown. Toggle the Draft
|
|
282
|
+
* and Archived pills to see the full ten-assessment dataset.
|
|
283
|
+
*/
|
|
284
|
+
export const WithManyAssessments = {
|
|
285
|
+
name: 'With Many Assessments',
|
|
286
|
+
args: {
|
|
287
|
+
assessments: manyAssessments,
|
|
288
|
+
},
|
|
289
|
+
};
|
|
290
|
+
//# sourceMappingURL=AssessmentsPage.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AssessmentsPage.stories.js","sourceRoot":"","sources":["../../../src/pages/assessmentsPage/AssessmentsPage.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AssessmentsPage.test.d.ts","sourceRoot":"","sources":["../../../src/pages/assessmentsPage/AssessmentsPage.test.tsx"],"names":[],"mappings":"AAGA,OAAO,kCAAkC,CAAC"}
|