diff --git a/.env.example b/.env.example index 00066c8..c53a8f9 100644 --- a/.env.example +++ b/.env.example @@ -14,4 +14,4 @@ GOOGLE_CALENDAR_ID= POSTGRES_USER=postgres POSTGRES_PASSWORD=postgres -POSTGRES_DB=next-payload-3 +POSTGRES_DB=next-payload-3 \ No newline at end of file diff --git a/components/RequestTab/DatePickerComponent.tsx b/app/(site)/(aefeup)/requests/DatePickerComponent.tsx similarity index 100% rename from components/RequestTab/DatePickerComponent.tsx rename to app/(site)/(aefeup)/requests/DatePickerComponent.tsx diff --git a/components/RequestTab/MaterialSelector.tsx b/app/(site)/(aefeup)/requests/MaterialSelector.tsx similarity index 97% rename from components/RequestTab/MaterialSelector.tsx rename to app/(site)/(aefeup)/requests/MaterialSelector.tsx index 5a33c22..0df76cf 100644 --- a/components/RequestTab/MaterialSelector.tsx +++ b/app/(site)/(aefeup)/requests/MaterialSelector.tsx @@ -4,7 +4,7 @@ import { Inbox } from "lucide-react"; import { X } from "lucide-react"; import { useState } from "react"; -import MultipleSelector, { Option } from '../ui/multiple-selector'; +import MultipleSelector, { Option } from '../../../../components/ui/multiple-selector'; interface Props { materialData: Material[] diff --git a/components/RequestTab/index.tsx b/app/(site)/(aefeup)/requests/RequestTab.tsx similarity index 90% rename from components/RequestTab/index.tsx rename to app/(site)/(aefeup)/requests/RequestTab.tsx index ca0a295..ca13aa2 100644 --- a/components/RequestTab/index.tsx +++ b/app/(site)/(aefeup)/requests/RequestTab.tsx @@ -1,23 +1,46 @@ 'use client' -import { useEffect, useRef, useState } from "react" -import SectionHeader from "../Common/SectionHeader"; +import { useEffect, useState } from "react" +import SectionHeader from "../../../../components/Common/SectionHeader"; import { EventRequestInfo } from "@/types/eventRequestInfo"; import { SingleMaterialRequest } from "@/types/singleMaterialRequest"; import { Material } from "@/types/material"; import DatePickerComponent from "./DatePickerComponent"; import MaterialSelector from "./MaterialSelector"; -import { Docfile, Space } from "@/payload-types"; -import { DialogTrigger } from "../ui/dialog"; +import { Space } from "@/payload-types"; +import EmailTemplate from "@/emails"; +import { sendEmail } from "@/lib/sendEmail"; +import toast, { Toaster } from "react-hot-toast"; +import { render } from "@react-email/render"; +import { Docfile } from "@/payload-types"; +import { DialogTrigger } from "@/components/ui/dialog"; interface Props { materialData: Material[], - sendEmail: (eventRequest: EventRequestInfo) => void, availableSpaces: Space[], - regulation?: Docfile, + regulation?: Docfile } -export default function RequestTab({ materialData, sendEmail, availableSpaces, regulation }: Props) { +const sendEmailRequest = async (requestInfo: EventRequestInfo) => { + const emailString = await render(EmailTemplate({ requestEventInfo: requestInfo })); + const { data, error } = await sendEmail( + requestInfo.email, + 'gta@aefeup.pt', + `${requestInfo.isEvent ? "Reserva de Espaço" : "Pedido de Material"}`, + emailString, + ) + + if (error) { + console.error(error) + return { error: "Erro ao enviar email" } + } + + if (data) { + return { success: "Email enviado com sucesso" } + } +} + +export default function RequestTab({ materialData, availableSpaces, regulation }: Props) { const [currentTab, setCurrentTab] = useState("tabOne"); const [startDate, setStartDate] = useState(new Date()); const [endDate, setEndDate] = useState(new Date()); @@ -49,7 +72,11 @@ export default function RequestTab({ materialData, sendEmail, availableSpaces, r requestedMaterial: requestedMaterial } - sendEmail(requestInfo); + if (materialData.length === 0) { + return toast.error("Não há material disponível") + } + + await sendEmailRequest(requestInfo); (document.getElementById("material-request-form") as HTMLFormElement).reset() // TODO: Change this } @@ -72,10 +99,9 @@ export default function RequestTab({ materialData, sendEmail, availableSpaces, r requestedMaterial: requestedMaterial } - sendEmail(requestInfo); + await sendEmailRequest(requestInfo); (document.getElementById("event-request-form") as HTMLFormElement).reset() // TODO: Change this //TODO: Remove the selected materials - //TODO: Show snack bar } return ( @@ -129,7 +155,7 @@ export default function RequestTab({ materialData, sendEmail, availableSpaces, r @@ -248,6 +274,9 @@ export default function RequestTab({ materialData, sendEmail, availableSpaces, r + ) } diff --git a/app/(site)/(aefeup)/requests/calendar.tsx b/app/(site)/(aefeup)/requests/calendar.tsx new file mode 100644 index 0000000..6d22f3a --- /dev/null +++ b/app/(site)/(aefeup)/requests/calendar.tsx @@ -0,0 +1,47 @@ +'use client' +import FullCalendar from '@fullcalendar/react' +import dayGridPlugin from '@fullcalendar/daygrid' // a plugin! +import googleCalendarPlugin from '@fullcalendar/google-calendar' +import SectionHeader from '../../../../components/Common/SectionHeader' + +const CalendarComponent = ({ calendarID, calendarApiKey }: { calendarID: string | undefined, calendarApiKey: string | undefined }) => { + return ( + <> +
+
+ +
+ { + delete event.url + event.title = event.title ?? "Ocupado" + event.allDay = true + return event + }} + height={700} + /> +
+
+
+ + ) +} + +export default CalendarComponent; \ No newline at end of file diff --git a/app/(site)/(aefeup)/requests/client.tsx b/app/(site)/(aefeup)/requests/client.tsx index 4caff62..7fb73ba 100644 --- a/app/(site)/(aefeup)/requests/client.tsx +++ b/app/(site)/(aefeup)/requests/client.tsx @@ -1,11 +1,9 @@ +"use client" + import CalendarComponent from "@/components/Calendar"; -import RequestTab from "@/components/RequestTab"; -import EmailTemplate from "@/emails"; -import { EventRequestInfo } from "@/types/eventRequestInfo"; -import { render } from "@react-email/render"; -import { Resend } from "resend"; import { Dialog, DialogContent, DialogDescription } from "@/components/ui/dialog" import { Docfile, Material, Space } from "@/payload-types"; +import RequestTab from "./RequestTab"; interface Props { calendarID?: string; @@ -15,28 +13,11 @@ interface Props { regulation?: Docfile; } - const RequestPageContent = ({ calendarID, calendarApiKey, materialData, availableSpaces, regulation }: Props) => { - - const sendEmail = async (requestInfo: EventRequestInfo) => { - 'use server' - const resend = new Resend(process.env.RESEND_API_KEY) - - if (!requestInfo.isEvent && materialData.length === 0) { - return - } - const { data, error } = await resend.emails.send({ - from: process.env.RESEND_EMAIL ? `AEFEUP <${process.env.RESEND_EMAIL}>` : 'Acme ', - to: [requestInfo.email], - subject: `${requestInfo.isEvent ? "Reserva de Espaço" : "Pedido de Material"}`, - html: await render(EmailTemplate({ requestEventInfo: requestInfo })), - }) - } - return ( - +