Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add function for editing absence ranges #652

Merged
merged 5 commits into from
Sep 15, 2022
Merged

Add function for editing absence ranges #652

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
bd9f815
Add class for edit button
jonandernovella Sep 14, 2022
2849859
Make it possible to edit absence ranges
jonandernovella Sep 14, 2022
777fd3c
Avoid duplicated ranges
jonandernovella Sep 14, 2022
b2df703
Add check for already reported entries
jonandernovella Sep 15, 2022
9af4065
Toggle climber on edit range
jonandernovella Sep 15, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion frontend/src/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -920,7 +920,8 @@ tr:last-of-type td {
width: 1.25rem;
}

.trash-button {
.trash-button,
.edit-range-button {
border: none;
background: none;
cursor: pointer;
Expand Down
170 changes: 131 additions & 39 deletions frontend/src/pages/AbsencePlanner.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ import { HeaderUser } from "../components/HeaderUser";
import { Chart } from "react-google-charts";
import trash from "../icons/trash.svg";
import pencil from "../icons/pencil.svg";
import { FetchedTimeEntry } from "../model";

export const AbsencePlanner = () => {
const [startDate, setStartDate] = useState<Date>(undefined);
Expand Down Expand Up @@ -107,7 +108,7 @@ export const AbsencePlanner = () => {
context,
"me"
);
return myReportedEntries.length;
return myReportedEntries;
};

const getReportedEntryDates = async () => {
Expand Down Expand Up @@ -143,28 +144,89 @@ export const AbsencePlanner = () => {
};

const removeTimeEntries = async (entryIds: number[]) => {
let removed = undefined;
let allRemoved: boolean = true;
for await (let entryId of entryIds) {
let entry: TimeEntry = { id: entryId, hours: 0 };
removed = await reportTime(entry, onErrorRemovingEntries, context);
const result = await reportTime(entry, onErrorRemovingEntries, context);
if (!result) {
allRemoved = false;
}
}
if (removed) {
return allRemoved;
};

const onUpdateAbsenceRanges = async (
oldEntryIds: number[],
newAbsenceStart: Date,
newAbsenceEnd: Date
) => {
const reportedEntries: FetchedTimeEntry[] = await hasAlreadyReported(
newAbsenceStart,
newAbsenceEnd
);
const filteredReportedEntries: FetchedTimeEntry[] = reportedEntries.filter(
(entry: FetchedTimeEntry) => {
return !oldEntryIds.includes(entry.id);
}
);
if (filteredReportedEntries.length > 0) {
setToastList([
...toastList,
{
type: "info",
type: "warning",
timeout: 8000,
message: "Absence period was successfully removed",
message:
"The absence plan was not updated. Time has already been reported on this period",
},
]);
setReloadPage(!reloadPage);
} else {
const removedAll = await removeTimeEntries(oldEntryIds);
if (removedAll) {
const reportable_days = getReportableDays(
newAbsenceStart,
newAbsenceEnd
);
const added = await reportAbsenceTime(reportable_days);
if (added) {
setToastList([
...toastList,
{
type: "info",
timeout: 8000,
message: "The absence period was successfully updated",
},
]);
} else {
setToastList([
...toastList,
{
type: "warning",
timeout: 8000,
message:
"Something went wrong! Your absence plan could not be updated",
},
]);
}
}
}
setReloadPage(!reloadPage);
};

const onRemoveEntriesButton = async (entryIds: number[]) => {
toggleLoadingPage(true);
await removeTimeEntries(entryIds);
const removed: boolean = await removeTimeEntries(entryIds);
if (removed) {
setToastList([
...toastList,
{
type: "info",
timeout: 8000,
message: "Absence period was successfully removed",
},
]);
}
toggleLoadingPage(false);
setReloadPage(!reloadPage);
};

const getAbsenceRanges = (entries: FetchedTimeEntry[]) => {
Expand Down Expand Up @@ -272,8 +334,15 @@ export const AbsencePlanner = () => {
});
} else {
entryRanges.push({ entryIds: [toEntryId], dates: [toDate] });
entryRanges.push({ entryIds: [fromEntryId], dates: [fromDate] });
rangesIndex++;
if (!dateExists(entryRanges, fromDate)) {
entryRanges.push({
entryIds: [fromEntryId],
dates: [fromDate],
});
rangesIndex++;
} else {
entryRanges[rangesIndex].entryIds.push(fromEntryId);
}
}
} else {
entryRanges.push({ entryIds: [toEntryId], dates: [toDate] });
Expand Down Expand Up @@ -434,8 +503,16 @@ export const AbsencePlanner = () => {

return absenceTimeEntries;
};
const getReportableDays = (frDate: Date, toDate: Date): Date[] => {
const dates_interval: Interval = { start: frDate, end: toDate };
const all_days = eachDayOfInterval(dates_interval);
let reportable_days = all_days.slice();
reportable_days = reportable_days.filter((date) => isWeekday(date));
return reportable_days;
};

const reportAbsenceTime = async (reportable_days: Date[]) => {
let allReported: boolean = true;
for await (let absence_day of reportable_days) {
const time_entry: TimeEntry = {
issue_id: 3499,
Expand All @@ -447,17 +524,10 @@ export const AbsencePlanner = () => {
const saved = await reportTime(time_entry, onAbsenceReportError, context);

if (!saved) {
setToastList([
...toastList,
{
type: "warning",
timeout: 5000,
message:
"Something went wrong! Your absence plan could not be submitted",
},
]);
allReported = false;
}
}
return allReported;
};

const validateDates = async () => {
Expand All @@ -476,11 +546,11 @@ export const AbsencePlanner = () => {
endDate.getTime() &&
endDate >= startDate
) {
let reportedEntries: number = await hasAlreadyReported(
let reportedEntries: FetchedTimeEntry[] = await hasAlreadyReported(
startDate,
endDate
);
if (reportedEntries > 0) {
if (reportedEntries.length > 0) {
setToastList([
...toastList,
{
Expand All @@ -491,23 +561,32 @@ export const AbsencePlanner = () => {
]);
return;
}
const dates_interval: Interval = { start: startDate, end: endDate };
const all_days = eachDayOfInterval(dates_interval);
let reportable_days = all_days.slice();
reportable_days = reportable_days.filter((date) => isWeekday(date));
const reportable_days = getReportableDays(startDate, endDate);
toggleLoadingPage(true);
await reportAbsenceTime(reportable_days);
const allReported = await reportAbsenceTime(reportable_days);
toggleLoadingPage(false);
setStartDate(undefined);
setEndDate(undefined);
setToastList([
...toastList,
{
type: "info",
timeout: 10000,
message: "Absence plan submitted!",
},
]);
if (!allReported) {
setToastList([
...toastList,
{
type: "warning",
timeout: 10000,
message:
"Something went wrong! Your absence plan could not be submitted",
},
]);
} else {
setToastList([
...toastList,
{
type: "info",
timeout: 10000,
message: "Absence plan submitted!",
},
]);
}
setReloadPage(!reloadPage);
} else {
setToastList([
Expand Down Expand Up @@ -641,11 +720,24 @@ export const AbsencePlanner = () => {
<td>{formatDate(element.startDate, dateFormat)}</td>
<td>{formatDate(element.endDate, dateFormat)}</td>
<td>
<img
src={pencil}
className="table-icon"
alt="pencil to edit"
/>
<button
onClick={() => {
toggleLoadingPage(true);
onUpdateAbsenceRanges(
element.entryIds,
new Date("2023-01-03"),
new Date("2023-01-03")
);
toggleLoadingPage(false);
}}
className="edit-range-button"
>
<img
src={pencil}
className="table-icon"
alt="pencil to edit"
/>
</button>
</td>
<td>
<button
Expand Down