feat: mii descriptions

src/components/report/mii-form.tsx

@@ -65,6 +65,7 @@ export default function ReportMiiForm({ mii, likes }: Props) {
 				</label>
 				<textarea
 					rows={3}
+					maxLength={256}
 					placeholder="Type notes here for the report..."
 					className="pill input !rounded-xl resize-none col-span-2"
 					value={notes}

src/components/report/user-form.tsx

@@ -69,6 +69,7 @@ export default function ReportUserForm({ user }: Props) {
 				</label>
 				<textarea
 					rows={3}
+					maxLength={256}
 					placeholder="Type notes here for the report..."
 					className="pill input !rounded-xl resize-none col-span-2"
 					value={notes}

src/components/submit-form/index.tsx

@@ -49,6 +49,7 @@ export default function SubmitForm() {
 
 	const [name, setName] = useState("");
 	const [tags, setTags] = useState<string[]>([]);
+	const [description, setDescription] = useState("");
 	const [qrBytesRaw, setQrBytesRaw] = useState<number[]>([]);
 
 	const handleSubmit = async () => {
@@ -68,6 +69,7 @@ export default function SubmitForm() {
 		const formData = new FormData();
 		formData.append("name", name);
 		formData.append("tags", JSON.stringify(tags));
+		formData.append("description", description);
 		formData.append("qrBytesRaw", JSON.stringify(qrBytesRaw));
 		files.forEach((file, index) => {
 			// image1, image2, etc.
@@ -190,6 +192,20 @@ export default function SubmitForm() {
 					<TagSelector tags={tags} setTags={setTags} />
 				</div>
 
+				<div className="w-full grid grid-cols-3 items-start">
+					<label htmlFor="reason-note" className="font-semibold py-2">
+						Description
+					</label>
+					<textarea
+						rows={3}
+						maxLength={256}
+						placeholder="(optional) Type a description..."
+						className="pill input !rounded-xl resize-none col-span-2"
+						value={description}
+						onChange={(e) => setDescription(e.target.value)}
+					/>
+				</div>
+
 				{/* Separator */}
 				<div className="flex items-center gap-4 text-zinc-500 text-sm font-medium mt-8 mb-2">
 					<hr className="flex-grow border-zinc-300" />