From 0bb846c19a63d6461b8f6cf8974ca5a5cc82887e Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Fri, 14 Aug 2020 19:20:14 +0200
Subject: form gallery updating like a charm

---
 .../frontend/app/views/media/components/media.formGallery.js | 12 +++++-------
 .../app/views/media/components/media.formGalleryImage.js     |  8 ++++----
 animism-align/frontend/app/views/media/media.css             |  2 +-
 3 files changed, 10 insertions(+), 12 deletions(-)

(limited to 'animism-align/frontend/app')

diff --git a/animism-align/frontend/app/views/media/components/media.formGallery.js b/animism-align/frontend/app/views/media/components/media.formGallery.js
index fb4f73a..13bb468 100644
--- a/animism-align/frontend/app/views/media/components/media.formGallery.js
+++ b/animism-align/frontend/app/views/media/components/media.formGallery.js
@@ -156,14 +156,14 @@ export default class MediaGalleryForm extends Component {
     // console.log(new_image_order)
     const image_order = new_image_order.map(el => el.id)
     if (!simpleArraysEqual(image_order, this.props.data.settings.image_order)) {
-      console.log('order changed', image_order)
       this.handleSettingsChange('image_order', image_order)
     }
   }
 
   handleSaveItem(id, item) {
-    const caption_lookup = data.settings.caption_lookup || {}
+    const caption_lookup = this.props.data.settings.caption_lookup || {}
     caption_lookup[id] = item
+    console.log(caption_lookup)
     this.handleSettingsChange('caption_lookup', caption_lookup)
     this.setState({ edit_image_id: null })
   }
@@ -172,6 +172,7 @@ export default class MediaGalleryForm extends Component {
     const { data } = this.props
     const { image_order, image_lookup, thumbnail_lookup, caption_lookup } = data.settings
     const { loading, edit_image_id } = this.state
+    console.log('render', caption_lookup)
     // console.log(data)
     return (
       <div className='galleryForm'>
@@ -206,7 +207,7 @@ export default class MediaGalleryForm extends Component {
         {edit_image_id &&
           <GalleryImageForm
             id={edit_image_id}
-            initalData={initialCaptionData(caption_lookup, edit_image_id)}
+            initialData={initialCaptionData(caption_lookup, edit_image_id)}
             thumbnail={thumbnail_lookup[edit_image_id]}
             onSave={this.handleSaveItem}
           />
@@ -218,10 +219,7 @@ export default class MediaGalleryForm extends Component {
 
 const initialCaptionData = (caption_lookup, image_id) => {
   caption_lookup = caption_lookup || {}
-  const initialData = caption_lookup[image_id] || {}
-  return {
-    ...initialData,
-  }
+  return caption_lookup[image_id] || {}
 }
 
 const GalleryListItem = ({ id, key, image, thumbnail, onClick }) => {
diff --git a/animism-align/frontend/app/views/media/components/media.formGalleryImage.js b/animism-align/frontend/app/views/media/components/media.formGalleryImage.js
index 1dbf1f2..905062f 100644
--- a/animism-align/frontend/app/views/media/components/media.formGalleryImage.js
+++ b/animism-align/frontend/app/views/media/components/media.formGalleryImage.js
@@ -11,6 +11,7 @@ export default class GalleryImageForm extends Component {
     super(props)
     this.handleChange = this.handleChange.bind(this)
     this.handleSelect = this.handleSelect.bind(this)
+    this.handleSubmit = this.handleSubmit.bind(this)
   }
   componentDidMount() {
     console.log(this.props)
@@ -31,7 +32,9 @@ export default class GalleryImageForm extends Component {
       }
     })
   }
-  handleSave() {
+  handleSubmit(e) {
+    e.preventDefault()
+    e.stopPropagation()
     this.props.onSave(this.props.id, this.state.data)
   }
   render() {
@@ -49,7 +52,6 @@ export default class GalleryImageForm extends Component {
             <TextInput
               title="Author"
               name="author"
-              required
               data={data}
               onChange={this.handleChange}
               autoComplete="off"
@@ -57,7 +59,6 @@ export default class GalleryImageForm extends Component {
             <TextInput
               title="Title"
               name="title"
-              required
               data={data}
               onChange={this.handleChange}
               autoComplete="off"
@@ -65,7 +66,6 @@ export default class GalleryImageForm extends Component {
             <TextInput
               title="Date"
               name="date"
-              required
               data={data}
               onChange={this.handleChange}
               autoComplete="off"
diff --git a/animism-align/frontend/app/views/media/media.css b/animism-align/frontend/app/views/media/media.css
index 1e20f6d..7e5517d 100644
--- a/animism-align/frontend/app/views/media/media.css
+++ b/animism-align/frontend/app/views/media/media.css
@@ -100,4 +100,4 @@
   margin-left: 1rem;
   background: #000;
   color: #88d;
-}
\ No newline at end of file
+}
-- 
cgit v1.2.3-70-g09d2