Exchange not allowing submission when Schedule has a conflict

src/components/exchange/requests/view/cards/RequestCard.tsx

@@ -7,6 +7,7 @@ import exchangeRequestService from "../../../../../api/services/exchangeRequestS
 import { ListRequestChanges } from "./ListRequestChanges";
 import ExchangeRequestCommonContext from "../../../../../contexts/ExchangeRequestCommonContext";
 import { CommonCardHeader } from "./CommonCardHeader";
+import ConflictsContext from "../../../../../contexts/ConflictsContext";
 
 export const RequestCard = ({ }) => {
   const {
@@ -15,6 +16,8 @@ export const RequestCard = ({ }) => {
   } = useContext(ExchangeRequestCommonContext);
   const [hovered, setHovered] = useState<boolean>(false);
 
+  const { conflictsSeverity } = useContext(ConflictsContext);
+
   useEffect(() => {
     if (chosenRequest?.id !== request.id) {
       setOpen(false);
@@ -102,7 +105,12 @@ export const RequestCard = ({ }) => {
               <label htmlFor="select-all">Selecionar todas</label>
             </div>
             <form className="flex flex-row gap-2">
-              <Button type="submit" onClick={submitExchange} className="success-button hover:bg-white">
+              <Button
+                type="submit"
+                onClick={!conflictsSeverity ? submitExchange : () => { }}
+                className={conflictsSeverity ? "disabled:bg-red-400" : "success-button hover:bg-white"}
+                disabled={conflictsSeverity}
+              >
                 Propôr troca
               </Button>
             </form>

src/components/planner/schedules/LessonBox.tsx

@@ -1,6 +1,7 @@
 import classNames from 'classnames'
-import { useState, useEffect } from 'react'
+import { useContext, useState, useEffect } from 'react'
 
+import ConflictsContext from '../../../contexts/ConflictsContext'
 import LessonPopover from './LessonPopover'
 import ConflictsPopover from './ConflictsPopover'
 import { CourseInfo, ClassInfo, SlotInfo, ClassDescriptor, ConflictInfo } from '../../../@types'
@@ -40,6 +41,7 @@ const LessonBox = ({
   const [isHovered, setIsHovered] = useState(false)
   const [conflict, setConflict] = useState(conflicts[slotInfo.id]);
   const hasConflict = conflict?.conflictingClasses?.length > 1;
+  const { setConflictsSeverity } = useContext(ConflictsContext);
 
   // Needs to change the entry with the id of this lesson to contain the correct ConflictInfo when the classes change
   useEffect(() => {
@@ -72,6 +74,10 @@ const LessonBox = ({
     setConflict(newConflictInfo);
   }, [classInfo, classes]);
 
+  useEffect(() => {
+    setConflictsSeverity(conflict?.severe);
+  }, [hasConflict]);
+
   const showConflicts = () => {
     setConflictsShown(true)
   }

src/contexts/CombinedProvider.tsx

@@ -8,6 +8,7 @@ import useSession from "../hooks/useSession";
 import SessionContext from "./SessionContext";
 import MajorContext from "./MajorContext";
 import CourseContext from "./CourseContext";
+import ConflictsContext from "./ConflictsContext";
 
 type Props = {
   children: React.JSX.Element
@@ -28,6 +29,8 @@ const CombinedProvider = ({ children }: Props) => {
   const [selectedOption, setSelectedOptionState] = useState<number>(StorageAPI.getSelectedOptionStorage());
   const { signedIn } = useSession();
 
+  const [conflictsSeverity, setConflictsSeverity] = useState<number>(0);
+
   const setMultipleOptions = (newMultipleOptions: MultipleOptions | ((prevMultipleOptions: MultipleOptions) => MultipleOptions)) => {
     if (newMultipleOptions instanceof Function)
       newMultipleOptions = newMultipleOptions(multipleOptions);
@@ -58,7 +61,9 @@ const CombinedProvider = ({ children }: Props) => {
             }
           }>
             <MultipleOptionsContext.Provider value={{ multipleOptions, setMultipleOptions, selectedOption, setSelectedOption }}>
-              {children}
+              <ConflictsContext.Provider value={{ conflictsSeverity, setConflictsSeverity }}>
+                {children}
+              </ConflictsContext.Provider>
             </MultipleOptionsContext.Provider>
           </CourseContext.Provider>
         </MajorContext.Provider>

src/contexts/ConflictsContext.tsx

@@ -0,0 +1,13 @@
+import { Context, Dispatch, createContext, SetStateAction } from "react";
+
+interface ConflictsContextType {
+    conflictsSeverity: boolean;
+    setConflictsSeverity: Dispatch<SetStateAction<boolean>>;
+}
+
+const ConflictsContext: Context<ConflictsContextType> = createContext({
+    conflictsSeverity: false,
+    setConflictsSeverity: () => { },
+})
+
+export default ConflictsContext