popov/mwitnessing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more responsive calendar UI

Browse Source
This commit is contained in:
Dobromir Popov
2024-05-28 18:21:50 +03:00
parent 59dd7cd7b4
commit d3ade91b80
2 changed files with 39 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
components/calendar/ShiftComponent.tsx
View File

@ -9,7 +9,7 @@ const common = require('src/helpers/common');
function ShiftComponent({ shift, onShiftSelect, isSelected, onPublisherSelect, allPublishersInfo }) {
function ShiftComponent({ shift, onShiftSelect, isSelected, onPublisherSelect, allPublishersInfo, onAssignmentChange }) {
const [isDeleted, setIsDeleted] = useState(false);
const [assignments, setAssignments] = useState(shift.assignments);
const [isModalOpen, setIsModalOpen] = useState(false);
@ -59,7 +59,11 @@ function ShiftComponent({ shift, onShiftSelect, isSelected, onPublisherSelect, a
try {
console.log("Removing assignment with id:", id);
await axiosInstance.delete("/api/data/assignments/" + id);
let assingmnt = assignments.find(ass => ass.id == id);
setAssignments(prevAssignments => prevAssignments.filter(ass => ass.id !== id));
if (onAssignmentChange) {
onAssignmentChange(assingmnt.publisherId, 'remove');
}
} catch (error) {
console.error("Error removing assignment:", error);
}
@ -77,6 +81,12 @@ function ShiftComponent({ shift, onShiftSelect, isSelected, onPublisherSelect, a
const { data } = await axiosInstance.post("/api/data/assignments", newAssignment);
// Update the 'publisher' property of the returned data with the full publisher object
data.publisher = publisher;
//ToDo: see if we need to update in state
// publisher.currentWeekAssignments += 1;
// publisher.currentMonthAssignments += 1;
if (onAssignmentChange) {
onAssignmentChange(data.publisher.id, 'add')
}
setAssignments(prevAssignments => [...prevAssignments, data]);
} catch (error) {
console.error("Error adding assignment:", error);

34
pages/cart/calendar/index.tsx
View File

@ -358,7 +358,7 @@ export default function CalendarPage({ initialEvents, initialShifts }) {
const addAssignment = async (publisher, shiftId) => {
try {
console.log(`new assignment for publisher ${publisher.id} - ${publisher.firstName} ${publisher.lastName}`);
console.log(`calendar.idx: new assignment for publisher ${publisher.id} - ${publisher.firstName} ${publisher.lastName}`);
const newAssignment = {
publisher: { connect: { id: publisher.id } },
shift: { connect: { id: shiftId } },
@ -367,6 +367,7 @@ export default function CalendarPage({ initialEvents, initialShifts }) {
const { data } = await axiosInstance.post("/api/data/assignments", newAssignment);
// Update the 'publisher' property of the returned data with the full publisher object
data.publisher = publisher;
handleAssignmentChange(publisher.id, 'add');
} catch (error) {
console.error("Error adding assignment:", error);
}
@ -374,12 +375,25 @@ export default function CalendarPage({ initialEvents, initialShifts }) {
const removeAssignment = async (publisher, shiftId) => {
try {
const assignment = publisher.assignments.find(ass => ass.shift.id === shiftId);
console.log(`remove assignment for shift ${shiftId}`);
console.log(`calendar.idx: remove assignment for shift ${shiftId}`);
const { data } = await axiosInstance.delete(`/api/data/assignments/${assignment.id}`);
//remove from local assignments:
publisher.assignments = publisher.assignments.filter(a => a.id !== assignment.id)
//
handleAssignmentChange(publisher.id, 'remove')
} catch (error) {
console.error("Error removing assignment:", error);
}
}
function handleAssignmentChange(id, type) {
// Handle assignment change logic here
let pub = availablePubs.find(pub => pub.id === id)
pub.currentMonthAssignments += type === 'add' ? 1 : -1;
pub.currentWeekAssignments += type === 'add' ? 1 : -1;
//store in state
setAvailablePubs([...availablePubs]);
}
// ----------------------------------------------------------
// button handlers
@ -558,6 +572,7 @@ export default function CalendarPage({ initialEvents, initialShifts }) {
await axiosInstance.get(`/api/?action=copyOldAvailabilities&date=${common.getISODateOnly(value)}`);
}
async function handleCreateNewShift(event: MouseEvent<HTMLButtonElement, MouseEvent>): Promise<void> {
//get last shift end time
let lastShift = shifts.sort((a, b) => new Date(b.endTime).getTime() - new Date(a.endTime).getTime())[0];
@ -807,12 +822,19 @@ export default function CalendarPage({ initialEvents, initialShifts }) {
{/* Shift list section */}
<div className="flex-grow mx-5">
<div className="flex-col" id="shiftlist">
{shifts.map((shift, index) => (
<ShiftComponent key={index} shift={shift}
onShiftSelect={handleShiftSelection} isSelected={shift.id == selectedShiftId}
onPublisherSelect={handleSelectedPublisher} showAllAuto={true}
allPublishersInfo={availablePubs} />
<ShiftComponent
key={index}
shift={shift}
onShiftSelect={handleShiftSelection}
isSelected={shift.id == selectedShiftId}
onPublisherSelect={handleSelectedPublisher}
onAssignmentChange={handleAssignmentChange}
showAllAuto={true}
allPublishersInfo={availablePubs}
/>
))}
</div>
<button