Merge pull request #13 from jedmund/fix-editable-issues

Fix editable issues

components/CharacterGrid/index.tsx

@@ -71,9 +71,10 @@ const CharacterGrid = (props: Props) => {
         const partyUser = (party.user_id) ? party.user_id : undefined
         const loggedInUser = (cookies.user) ? cookies.user.user_id : ''
 
-        if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser) {
+        if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser)
-            party.editable = true
+            appState.party.editable = true
-        }
+        else
+            appState.party.editable = false
         
         // Store the important party and state-keeping values
         appState.party.id = party.id
@@ -120,6 +121,7 @@ const CharacterGrid = (props: Props) => {
                         .catch(error => console.error(error))
                 })
         } else {
+            if (party.editable)
                 saveCharacter(party.id, character, position)
                     .then(response => storeGridCharacter(response.data.grid_character))
                     .catch(error => console.error(error))

components/CharacterUnit/index.tsx

@@ -6,6 +6,7 @@ import UncapIndicator from '~components/UncapIndicator'
 import PlusIcon from '~public/icons/Add.svg'
 
 import './index.scss'
+import { omit } from 'lodash'
 
 interface Props {
     gridCharacter: GridCharacter | undefined
@@ -47,20 +48,27 @@ const CharacterUnit = (props: Props) => {
             props.updateUncap(props.gridCharacter.id, props.position, uncap)
     }
 
-    return (
+    const image = (
-        <div>
+        <div className="CharacterImage">
-            <div className={classes}>
+            <img alt={character?.name.en} className="grid_image" src={imageUrl} />
+            { (props.editable) ? <span className='icon'><PlusIcon /></span> : '' }
+        </div>
+    )
+
+    const editableImage = (
         <SearchModal 
             placeholderText="Search for a character..." 
             fromPosition={props.position} 
             object="characters"
             send={props.updateObject}>
-                        <div className="CharacterImage">
+                {image}
-                            <img alt={character?.name.en} className="grid_image" src={imageUrl} />
-                            { (props.editable) ? <span className='icon'><PlusIcon /></span> : '' }
-                        </div>
         </SearchModal>
+    )
 
+    return (
+        <div>
+            <div className={classes}>
+                { (props.editable) ? editableImage : image }
                 { (gridCharacter && character) ? 
                     <UncapIndicator 
                         type="character"

components/SummonGrid/index.tsx

@@ -81,9 +81,10 @@ const SummonGrid = (props: Props) => {
         const partyUser = (party.user_id) ? party.user_id : undefined
         const loggedInUser = (cookies.user) ? cookies.user.user_id : ''
 
-        if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser) {
+        if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser.id)
             appState.party.editable = true
-        }
+        else
+            appState.party.editable = false
         
         // Store the important party and state-keeping values
         appState.party.id = party.id
@@ -134,6 +135,7 @@ const SummonGrid = (props: Props) => {
                         .then(response => storeGridSummon(response.data.grid_summon))
                 })
         } else {
+            if (party.editable)
                 saveSummon(party.id, summon, position)
                     .then(response => storeGridSummon(response.data.grid_summon))
         }

components/SummonUnit/index.tsx

@@ -55,20 +55,26 @@ const SummonUnit = (props: Props) => {
             props.updateUncap(props.gridSummon.id, props.position, uncap)
     }
 
-    return (
+    const image = (
-        <div>
+        <div className="SummonImage">
-            <div className={classes}>
+            <img alt={summon?.name.en} className="grid_image" src={imageUrl} />
+            { (props.editable) ? <span className='icon'><PlusIcon /></span> : '' }
+        </div>
+    )
+
+    const editableImage = (
         <SearchModal 
             placeholderText="Search for a summon..." 
             fromPosition={props.position} 
             object="summons"
             send={props.updateObject}>
-                        <div className="SummonImage">
+                {image}
-                            <img alt={summon?.name.en} className="grid_image" src={imageUrl} />
-                            { (props.editable) ? <span className='icon'><PlusIcon /></span> : '' }
-                        </div>
         </SearchModal>
+    )
 
+    return (
+        <div className={classes}>
+            { (props.editable) ? editableImage : image }
             { (gridSummon) ? 
                 <UncapIndicator 
                     type="summon"
@@ -81,7 +87,6 @@ const SummonUnit = (props: Props) => {
             }
             <h3 className="SummonName">{summon?.name.en}</h3>
         </div>
-        </div>
     )
 }
 

components/WeaponGrid/index.tsx

@@ -77,14 +77,16 @@ const WeaponGrid = (props: Props) => {
         const partyUser = (party.user_id) ? party.user_id : undefined
         const loggedInUser = (cookies.user) ? cookies.user.user_id : ''
 
-        if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser) {
+        if (partyUser != undefined && loggedInUser != undefined && partyUser === loggedInUser.id)
             appState.party.editable = true
-        }
+        else
+            appState.party.editable = false
         
         // Store the important party and state-keeping values
         appState.party.id = party.id
         appState.party.extra = party.is_extra
 
+
         setFound(true)
         setLoading(false)
 
@@ -133,6 +135,7 @@ const WeaponGrid = (props: Props) => {
                         .then(response => storeGridWeapon(response.data.grid_weapon))
                 })
         } else {
+            console.log(party.editable)
                 saveWeapon(party.id, weapon, position)
                     .then(response => storeGridWeapon(response.data.grid_weapon))
         }

components/WeaponUnit/index.tsx

@@ -53,20 +53,27 @@ const WeaponUnit = (props: Props) => {
             props.updateUncap(props.gridWeapon.id, props.position, uncap)
     }
 
-    return (
+    const image = (
-        <div>
+        <div className="WeaponImage">
-            <div className={classes}>
+            <img alt={weapon?.name.en} className="grid_image" src={imageUrl} />
+            { (props.editable) ? <span className='icon'><PlusIcon /></span> : '' }
+        </div>
+    )
+
+    const editableImage = (
         <SearchModal 
             placeholderText="Search for a weapon..." 
             fromPosition={props.position} 
             object="weapons"
             send={props.updateObject}>
-                        <div className="WeaponImage">
+                {image}
-                            <img alt={weapon?.name.en} className="grid_image" src={imageUrl} />
-                            { (props.editable) ? <span className='icon'><PlusIcon /></span> : '' }
-                        </div>
         </SearchModal>
+    )
 
+    return (
+        <div>
+            <div className={classes}>
+                { (props.editable) ? editableImage : image }
                 { (gridWeapon) ? 
                     <UncapIndicator 
                         type="weapon"