CS5340 — Spring 2025
Author: Andy Yu
SmartShift is an interactive, modular React-based web application built as part of a Human-Computer Interaction (HCI) course. It simulates a smart shift-scheduling interface, allowing users to assign employees to time slots using drag-and-drop functionality.
This project integrates the DayPilot Lite Calendar to represent a dynamic scheduling calendar, and is structured to support future features such as shift recommendations, availability filtering, and employee profiles.
Install dependencies by running "npm install", then start the application by using "npm start"
The app will open at http://localhost:3000/.
- App.js defines the layout and routing using react-router-dom.
- MainLayout renders the header, control panel, and content area.
- HomePage displays the current day's calendar view and weekly grid selector.
- The EmployeeBar provides hardcoded draggable employee names.
- DayCalendar (powered by DayPilot) allows dropping those names to schedule 1-hour shift blocks.
- A sidebar allows task tracking with checklist modules similar to Google Tasks.