Allow setting job to "No job" after it has been set

components/CharacterGrid/index.tsx

@@ -175,23 +175,26 @@ const CharacterGrid = (props: Props) => {
   }
 
   // Methods: Saving job and job skills
-  const saveJob = function (job: Job) {
+  const saveJob = async function (job?: Job) {
     const payload = {
       party: {
-        job_id: job ? job.id : '',
+        job_id: job ? job.id : -1,
       },
     }
 
     if (party.id && appState.party.editable) {
-      api.updateJob({ partyId: party.id, params: payload }).then((response) => {
+      const response = await api.updateJob({
-        const newParty = response.data
+        partyId: party.id,
-
+        params: payload,
-        setJob(newParty.job)
-        appState.party.job = newParty.job
-
-        setJobSkills(newParty.job_skills)
-        appState.party.jobSkills = newParty.job_skills
       })
+
+      const newParty = response.data
+
+      setJob(newParty.job)
+      appState.party.job = newParty.job
+
+      setJobSkills(newParty.job_skills)
+      appState.party.jobSkills = newParty.job_skills
     }
   }
 

components/JobSection/index.tsx

@@ -18,7 +18,7 @@ interface Props {
   job?: Job
   jobSkills: JobSkillObject
   editable: boolean
-  saveJob: (job: Job) => void
+  saveJob: (job?: Job) => void
   saveSkill: (skill: JobSkill, position: number) => void
 }
 
@@ -41,17 +41,15 @@ const JobSection = (props: Props) => {
 
   useEffect(() => {
     // Set current job based on ID
-    if (props.job) {
+    setJob(props.job)
-      setJob(props.job)
+    setSkills({
-      setSkills({
+      0: props.jobSkills[0],
-        0: props.jobSkills[0],
+      1: props.jobSkills[1],
-        1: props.jobSkills[1],
+      2: props.jobSkills[2],
-        2: props.jobSkills[2],
+      3: props.jobSkills[3],
-        3: props.jobSkills[3],
+    })
-      })
 
-      if (selectRef.current) selectRef.current.value = props.job.id
+    if (selectRef.current && props.job) selectRef.current.value = props.job.id
-    }
   }, [props])
 
   useEffect(() => {
@@ -68,10 +66,8 @@ const JobSection = (props: Props) => {
   }, [job])
 
   function receiveJob(job?: Job) {
-    if (job) {
+    setJob(job)
-      setJob(job)
+    props.saveJob(job)
-      props.saveJob(job)
-    }
   }
 
   function generateImageUrl() {