-
+
+
+ );
+}
+export function MainTitle() {
+ return (
+
+
+
+ Twake
+ Calendar
+
);
}
-
-function HandleLogin() {
- const userData = useAppSelector((state) => state.user.userData);
- if (!userData) {
- return (
-
- );
- } else {
- return
{userData.sub}
;
- }
-}
diff --git a/src/features/Events/EventModal.tsx b/src/features/Events/EventModal.tsx
new file mode 100644
index 0000000..b03a0b2
--- /dev/null
+++ b/src/features/Events/EventModal.tsx
@@ -0,0 +1,137 @@
+// components/EventModal.tsx
+import React, { useEffect, useState } from "react";
+import { addEvent } from "./EventsSlice";
+import { CalendarEvent } from "./EventsTypes";
+import { DateSelectArg } from "@fullcalendar/core";
+import { useAppDispatch } from "../../app/hooks";
+import { Popover, TextField, Button, Box, Typography } from "@mui/material";
+
+function EventPopover({
+ anchorEl,
+ open,
+ onClose,
+ selectedRange,
+}: {
+ anchorEl: HTMLElement | null;
+ open: boolean;
+ onClose: (event: {}, reason: "backdropClick" | "escapeKeyDown") => void;
+ selectedRange: any;
+}) {
+ const dispatch = useAppDispatch();
+
+ const [title, setTitle] = useState("");
+ const [description, setDescription] = useState("");
+ const [location, setLocation] = useState("");
+ const [calendar, setCalendar] = useState("");
+ const [start, setStart] = useState("");
+ const [end, setEnd] = useState("");
+
+ useEffect(() => {
+ if (selectedRange) {
+ setStart(selectedRange.startStr);
+ setEnd(selectedRange.endStr ?? "");
+ }
+ }, [selectedRange]);
+
+ const handleSave = () => {
+ const newEvent: CalendarEvent = {
+ title,
+ start,
+ end,
+ calendar,
+ extendedProps: {
+ description,
+ location,
+ },
+ };
+ dispatch(addEvent(newEvent));
+ console.log(newEvent)
+ onClose({}, "backdropClick");
+
+ // Reset
+ setTitle("");
+ setDescription("");
+ setLocation("");
+ };
+
+ return (
+
+
+
+ Create Event
+
+ setTitle(e.target.value)}
+ size="small"
+ margin="dense"
+ />
+ setStart(e.target.value)}
+ size="small"
+ margin="dense"
+ InputLabelProps={{ shrink: true }}
+ />
+ setEnd(e.target.value)}
+ size="small"
+ margin="dense"
+ InputLabelProps={{ shrink: true }}
+ />
+ setDescription(e.target.value)}
+ size="small"
+ margin="dense"
+ multiline
+ rows={2}
+ />
+ setLocation(e.target.value)}
+ size="small"
+ margin="dense"
+ />
+
+
+
+
+
+
+ );
+}
+
+export default EventPopover;
diff --git a/src/features/Events/EventsSlice.ts b/src/features/Events/EventsSlice.ts
new file mode 100644
index 0000000..624898c
--- /dev/null
+++ b/src/features/Events/EventsSlice.ts
@@ -0,0 +1,17 @@
+// store/eventsSlice.ts
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+import { CalendarEvent } from "./EventsTypes";
+
+const eventsSlice = createSlice({
+ name: "events",
+ initialState: [] as CalendarEvent[],
+ reducers: {
+ addEvent: (state, action: PayloadAction
) => {
+ state.push(action.payload);
+ },
+ },
+});
+
+
+export const { addEvent } = eventsSlice.actions;
+export default eventsSlice.reducer;
diff --git a/src/features/Events/EventsTypes.ts b/src/features/Events/EventsTypes.ts
new file mode 100644
index 0000000..698cd0c
--- /dev/null
+++ b/src/features/Events/EventsTypes.ts
@@ -0,0 +1,11 @@
+// types/Event.ts
+export interface CalendarEvent {
+ title: string;
+ start: string; // ISO date
+ end?: string;
+ calendar:string;
+ extendedProps?: {
+ description?: string;
+ location?: string;
+ };
+}
diff --git a/src/features/User/HandleLogin.tsx b/src/features/User/HandleLogin.tsx
new file mode 100644
index 0000000..2970b79
--- /dev/null
+++ b/src/features/User/HandleLogin.tsx
@@ -0,0 +1,38 @@
+import React, { useEffect } from "react";
+import { useAppDispatch, useAppSelector } from "../../app/hooks";
+import { Auth } from "./oidcAuth";
+import { Loading } from "../../components/Loading/Loading";
+import { Error } from "../../components/Error/Error";
+import { push } from "redux-first-history";
+
+export function HandleLogin() {
+ const userData = useAppSelector((state) => state.user.userData);
+ const dispatch = useAppDispatch();
+ useEffect(() => {
+ const initiateLogin = async () => {
+ if (!userData) {
+ const loginurl = await Auth();
+
+ sessionStorage.setItem(
+ "redirectState",
+ JSON.stringify({
+ code_verifier: loginurl.code_verifier,
+ state: loginurl.state,
+ })
+ );
+
+ window.location.assign(loginurl.redirectTo);
+ }
+ };
+
+ initiateLogin();
+ }, [userData]);
+
+ if (!userData) {
+ return ;
+ }
+ dispatch(push("/calendar"));
+ return ;
+}
+
+export default HandleLogin;
diff --git a/src/features/User/LoginCallback.tsx b/src/features/User/LoginCallback.tsx
index a86ceeb..150c485 100644
--- a/src/features/User/LoginCallback.tsx
+++ b/src/features/User/LoginCallback.tsx
@@ -4,6 +4,7 @@ import { Callback } from "./oidcAuth";
import { useAppDispatch, useAppSelector } from "../../app/hooks";
import { push } from "redux-first-history";
import { setUserData } from "./userSlice";
+import { Loading } from "../../components/Loading/Loading";
export function CallbackResume() {
const dispatch = useAppDispatch();
@@ -43,23 +44,5 @@ export function CallbackResume() {
}
}, [dispatch, saved]);
- return (
-
-
Processing OIDC callback...
- {/* Optionally show loading or debug info */}
- {tokens && (
-
- -
- ID_Token:
{JSON.stringify(tokens?.id_token)}
-
- -
- Access_Token:
{JSON.stringify(tokens?.access_token)}
-
- -
- User info:
{JSON.stringify(userInfo, null, 2)}
-
-
- )}
-