Update tinker_tickets_react/src/Components/CreateTicket/TicketForm.tsx

tinker_tickets_react/src/Components/CreateTicket/TicketForm.tsx

@@ -1,73 +1,74 @@
 import React, { useState } from "react";
 import TicketFieldRow from "./TicketRow";
 import TicketTextarea from "./TicketText";
-import type { TicketFormData } from "../../types/ticket";
+import type { CreateTicketFormData } from "../../types/ticket";
 
 interface TicketFormProps {
-  onError: (msg: string | null) => void;
+onError: (msg: string | null) => void;
 }
 
 const TicketForm: React.FC<TicketFormProps> = ({ onError }) => {
-  const [form, setForm] = useState<TicketFormData>({
-    title: "",
-    status: "Open",
-    priority: "4",
-    category: "General",
-    type: "Issue",
-    description: "",
-  });
+const [form, setForm] = useState<CreateTicketFormData>({
+title: "",
+status: "Open",
+priority: "4",
+category: "General",
+type: "Issue",
+description: "",
+});
 
-  function updateField(field: keyof TicketFormData, value: string) {
-    setForm(prev => ({ ...prev, [field]: value }));
-  }
+function updateField(field: keyof CreateTicketFormData, value: string) {
+setForm((prev: CreateTicketFormData) => ({ ...prev, [field]: value }));
+}
 
-  function handleSubmit(e: React.FormEvent) {
-    e.preventDefault();
+function handleSubmit(e: React.FormEvent) {
+e.preventDefault();
 
-    if (!form.title.trim() || !form.description.trim()) {
-      onError("Title and description are required.");
-      return;
-    }
+```
+if (!form.title.trim() || !form.description.trim()) {
+  onError("Title and description are required.");
+  return;
+}
 
-    console.log("Submitting:", form);
-    // Later: POST to Express/PHP
-  }
+console.log("Submitting:", form);
+// Later: POST to Express/PHP
+```
 
-  return (
-    <form className="ticket-form" onSubmit={handleSubmit}>
-      <div className="ticket-details">
-        <div className="detail-group">
-          <label>Title</label>
-          <input
-            type="text"
-            value={form.title}
-            onChange={e => updateField("title", e.target.value)}
-            required
-          />
-        </div>
+}
 
-        <TicketFieldRow form={form} updateField={updateField} />
+return ( <form className="ticket-form" onSubmit={handleSubmit}> <div className="ticket-details"> <div className="detail-group"> <label>Title</label>
+<input
+type="text"
+value={form.title}
+onChange={e => updateField("title", e.target.value)}
+required
+/> </div>
 
-        <TicketTextarea
-          label="Description"
-          value={form.description}
-          onChange={value => updateField("description", value)}
-          required
-        />
-      </div>
+```
+    <TicketFieldRow form={form} updateField={updateField} />
 
-      <div className="ticket-footer">
-        <button type="submit" className="btn primary">Create Ticket</button>
-        <button
-          type="button"
-          className="btn back-btn"
-          onClick={() => (window.location.href = "/")}
-        >
-          Cancel
-        </button>
-      </div>
-    </form>
-  );
+    <TicketTextarea
+      label="Description"
+      value={form.description}
+      onChange={value => updateField("description", value)}
+      required
+    />
+  </div>
+
+  <div className="ticket-footer">
+    <button type="submit" className="btn primary">Create Ticket</button>
+    <button
+      type="button"
+      className="btn back-btn"
+      onClick={() => (window.location.href = "/")}
+    >
+      Cancel
+    </button>
+  </div>
+</form>
+```
+
+);
 };
 
-export default TicketForm;
+export default TicketForm;