Documentation Index
Fetch the complete documentation index at: https://human-resource-docs.ha-consultancy.com/llms.txt
Use this file to discover all available pages before exploring further.
The Roster Board is the flagship visualisation of the extension — a drag-and-drop scheduling UI that lets HR build a weekly or monthly shift roster. It runs as a Control Add-in embedded inside BC.
Where it runs
| Layer | Object | Role |
|---|
| BC page | Pag70003175.RosterBoardHAC.al (page 70003175 “Visual Roster Board”) | Hosts the control add-in; implements all data triggers |
| Control add-in | controls/RosterGridHAC.al (“Roster Scheduler HAC”) | Declares the event/procedure contract between AL and JS |
| React entry | react-roster-shift-board/src/main.tsx | Registers window.InitControls; mounts <App/> inside the iframe |
| Active screen | components/roster-scheduler/RosterScheduler.tsx | The two-pane scheduler |
| Headless loader | components/auto-load/AutoLoad.tsx | Triggers initial data fetch on mount |
Component-by-component
AutoLoad
Invisible component mounted at app start. On mount, dispatches three data fetches in parallel for the default 3-month window:
getAllResourcesAsync(from, to) — employee directorygetShiftCodesAsync() — shift configurations marked roster-eligiblegetRosterEntriesAsync(from, to) — existing assignments in the window
Stores each result in the rosterData Redux slice.
RosterScheduler
The primary screen. Renders a searchable employee list (left sidebar, every employee is a draggable card via Syncfusion’s Draggable utility) and a Syncfusion ScheduleComponent grouped by ShiftCode (right pane). Supports Day, Week, WorkWeek, and Month views.
| Action | What happens |
|---|
| Drag employee from sidebar onto a shift slot | New roster entry created — calls saveRosterEntryAsync(empNo, date, shiftCode) |
| Drag an existing assignment to another date | Existing entry updated with the same call but including the entry number |
| Right-click an entry → Delete | Calls deleteRosterEntryAsync(entryNo) |
| Change the view (Day/Week/Month) | Re-renders client-side from the loaded slice; no refetch |
| Navigate to a date outside the loaded window | Refetches roster entries for the new window |
The shift colour mapping is a local constant (SHIFT_WINDOWS) in roster-scheduler.component.tsx — adjust there if you want a different palette per shift.
Gantt screen (built, not active)
components/project-gantt-chart/ implements a Syncfusion GanttComponent-based view of BC project tasks and per-resource planning lines. To re-enable it, mount <ProjectGanttChart/> from App.tsx. Data services and Redux slices are already wired.
State slices
rosterData
| Key | Type | Notes |
|---|
loading | boolean | True during initial fetch / refresh |
error | string | null | Latest error message |
employees | IResource[] | All employees from GetResources |
shiftCodes | IShiftCode[] | All shift codes from GetShiftCodes |
entries | IRosterEntry[] | Roster entries in the loaded window |
projectsData
Manages the Gantt screen’s state: projects, edit-permission flag, and visibility/context for the six modal dialogs.
resourcesData
| Key | Type | Notes |
|---|
resources | IResource[] | Loaded resources for the Gantt resource panel |
refreshList | Date | Bump to force remount after a drag-drop |
Domain types
| Type | Shape |
|---|
IResource | { resourceNo, resourceName, isGeneric, groupName } |
IShiftCode | { code, name, workingHours } |
IRosterEntry | { entryNo, employeeNo, employeeName, date, shiftCode, workingHours } |
Customisation
Never directly edit BC-Human-Resource-AL/scripts/assets/js/base.js — it’s overwritten on the next React build.
SHIFT_WINDOWS constant), and the default view range (3-month window in AutoLoad — change there).
