Disabled the right click, paste and spell check on the Writing

src/components/Exercises/Writing.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @next/next/no-img-element */
 import {WritingExercise} from "@/interfaces/exam";
 import {CommonProps} from ".";
-import {Fragment, useEffect, useState} from "react";
+import React, {Fragment, useEffect, useRef, useState} from "react";
 import {toast} from "react-toastify";
 import Button from "../Low/Button";
 import {Dialog, Transition} from "@headlessui/react";
@@ -25,6 +25,20 @@ export default function Writing({
 
 	const hasExamEnded = useExamStore((state) => state.hasExamEnded);
 
+	useEffect(() => {
+		const listener = (e: KeyboardEvent) => {
+			if ((e.ctrlKey || e.metaKey) && e.key === "v") {
+				e.preventDefault();
+			}
+		};
+
+		document.addEventListener("keydown", listener);
+
+		return () => {
+			document.removeEventListener("keydown", listener);
+		};
+	}, []);
+
 	useEffect(() => {
 		if (hasExamEnded) onNext({exercise: id, solutions: [{id, solution: inputText}], score: {correct: 1, total: 1, missing: 0}, type});
 		// eslint-disable-next-line react-hooks/exhaustive-deps
@@ -80,11 +94,11 @@ export default function Writing({
 			<div className="flex flex-col h-full w-full gap-9 mb-20">
 				<div className="flex flex-col w-full gap-7 bg-mti-gray-smoke rounded-xl py-8 pb-12 px-16">
 					<span>
-						{prefix.split("\\n").map((line) => (
+						{prefix.split("\\n").map((line, index) => (
-							<>
+							<React.Fragment key={index}>
 								{line}
 								<br />
-							</>
+							</React.Fragment>
 						))}
 					</span>
 					<span className="font-semibold">
@@ -107,18 +121,20 @@ export default function Writing({
 
 				<div className="w-full h-full flex flex-col gap-4">
 					<span>
-						{suffix.split("\\n").map((line) => (
+						{suffix.split("\\n").map((line, index) => (
-							<>
+							<React.Fragment key={index}>
 								{line}
 								<br />
-							</>
+							</React.Fragment>
 						))}
 					</span>
 					<textarea
-						className="w-full h-full min-h-[148px] cursor-text px-7 py-8 input border-2 border-mti-gray-platinum bg-white rounded-3xl"
+						onContextMenu={(e) => e.preventDefault()}
+						className="w-full h-full min-h-[300px] cursor-text px-7 py-8 input border-2 border-mti-gray-platinum bg-white rounded-3xl"
 						onChange={(e) => setInputText(e.target.value)}
 						value={inputText}
 						placeholder="Write your text here..."
+						spellCheck={false}
 					/>
 				</div>
 			</div>