Commit 62a251e5 authored by Pascal MOLIN's avatar Pascal MOLIN
Browse files

Merge branch '11-add-to-calendar' into 'master'

Resolve "add to calendar"

Closes #11

See merge request !21
parents 7250c4b3 55bf1bab
import React, { ChangeEventHandler, useEffect, useRef } from "react";
import { Link } from "react-router-dom";
import { OurCalendarProps, getBgColor, getFgColor } from ".";
type GroupChooserProps = OurCalendarProps & {
......
import React, { useMemo } from "react";
import { Link } from "react-router-dom";
import { Group } from ".";
interface GroupsIcalProps {
groups: Group[];
shown: Map<number, boolean>;
}
const GroupsIcal: React.FC<GroupsIcalProps> = ({ groups, shown }) => {
const filteredGroups = useMemo(() => (
groups.filter(g => shown.get(g.code))
), [groups, shown]);
return (
<div className="mt-2 border-t-2">
<div className="flex flex-wrap gap-2">
<div>
Liens permanents :
</div>
{filteredGroups
.map(({ parcours, year, label, code }) => (
<Link to={`/parcours/${parcours}/year/${year}/${code}`}>
{`#${label}`}
</Link>
))}
</div>
<div className="flex flex-wrap gap-2">
<div>
Données au format <code>ical</code> :
</div>
{filteredGroups
.map(({ code, label }) => (
<a
href={`data/${code}.ics`}
key={code}
className="block text-blue-800 hover:underline"
title={`Fichier ical pour ${label} (code : ${code}).`}
>
{`${label}.ical`}
</a>
))}
</div>
</div>
);
};
export default GroupsIcal;
......@@ -3,12 +3,13 @@ import FullCalendar, { EventApi, EventContentArg } from '@fullcalendar/react';
import timeGridPlugin from '@fullcalendar/timegrid';
/*import interactionPlugin from '@fullcalendar/interaction';*/
import listPlugin from '@fullcalendar/list';
import dayGridPlugin from '@fullcalendar/daygrid'
import iCalendarPlugin from '@fullcalendar/icalendar'
import dayGridPlugin from '@fullcalendar/daygrid';
import iCalendarPlugin from '@fullcalendar/icalendar';
import frLocale from '@fullcalendar/core/locales/fr';
import GroupChooser from "./GroupChooser";
import ModalEvent from "./ModalEvent";
import { parcoursTitles } from "../Parcours";
import GroupsIcal from "./GroupsIcal";
/**
* Convert an event to HTML.
......@@ -86,17 +87,22 @@ function getBorderColor(name: string): string {
return borderPalette[index % borderPalette.length];
}
/**
* The type of a specific group.
*/
export interface Group {
code: number;
title: string;
label: string;
parcours: string;
year: string;
}
/**
* The type of the props ("parameters") of OurCalendar
*/
export interface OurCalendarProps {
groups: {
code: number;
title: string;
label: string;
parcours: string;
year: string;
}[];
groups: Group[];
selectedGroup?: string;
}
......@@ -164,7 +170,7 @@ const OurCalendar: React.FC<OurCalendarProps> = ({ groups, selectedGroup }) => {
api.addEventSource(src);
}
}
}, [groups, shown])
}, [groups, shown]);
return (
<>
......@@ -202,8 +208,9 @@ const OurCalendar: React.FC<OurCalendarProps> = ({ groups, selectedGroup }) => {
}}
eventClassNames={({ event: { title } }) => `border-2 !${getBorderColor(title)} cursor-pointer`}
/>
<GroupsIcal groups={groups} shown={shown} />
</div>
</>
)
}
);
};
export default OurCalendar;
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment