Update ImageList.js

photo/src/ImageList.js

@@ -37,19 +37,23 @@ class imageList extends React.Component {
         this.state = {
             images: this.props.images,
             currentImage: 0,
+            currentImagePath: "",
 
             error: null,
             isLoaded: false,
             items: [],
 
             open: false,
+            //for modal
+            uuid: "https://arozos.com/share/not_found",
+            permission: "anyone",
+            ShareError: null,
         };
 
         this.onCurrentImageChange = this.onCurrentImageChange.bind(this);
         this.shareImage = this.shareImage.bind(this);
 
         //this.onChangeValue = this.onChangeValue.bind(this);
-
     }
 
     onCurrentImageChange(index) {
@@ -57,8 +61,25 @@ class imageList extends React.Component {
     }
 
     shareImage() {
-        this.setState({ open: true });
-        console.log(this.state.images[this.state.currentImage].src);
+        this.setState({ open: true, currentImagePath: this.state.images[this.state.currentImage].src });
+        fetch("/backend_test/share?path=" + this.state.currentImagePath, {})
+            .then(res => res.json())
+            .then(
+                (result) => {
+                    this.setState({
+                        uuid: result.UUID,
+                        permission: result.permission,
+                    });
+                },
+                // Note: it's important to handle errors here
+                // instead of a catch() block so that we don't swallow
+                // exceptions from actual bugs in components.
+                (error) => {
+                    this.setState({
+                        ShareError: error
+                    });
+                }
+            )
     }
     
     //modal
@@ -68,16 +89,27 @@ class imageList extends React.Component {
     }
 */
     handleChange(event) {
-        console.log(event.target.value);
-        //this.setState({ currency: event.target.value });
-        fetch('/backend_test/share?path=' + event.target.value, {
-            method: 'GET',
-            headers: {
-                'Content-Type': 'application/json'
-            }
-        })
-            .then((response) => response.json())
-            .then((data) => data);
+        if (!(event.target.value == "remove")) {
+            //this.setState({ currency: event.target.value });
+            fetch('/backend_test/edit?uuid=' + this.state.uuid + '&mode=' + event.target.value, {
+                method: 'GET',
+                headers: {
+                    'Content-Type': 'application/json'
+                }
+            })
+                .then((response) => response.json())
+                .then((data) => data);
+        } else {
+            //remove but use edit response now
+            fetch("/backend_test/remove?path=" + this.state.currentImagePath, {
+                method: 'GET',
+                headers: {
+                    'Content-Type': 'application/json'
+                }
+            })
+                .then((response) => response.json())
+                .then((data) => data);
+        }
     };
 
     componentDidMount() {
@@ -151,7 +183,6 @@ class imageList extends React.Component {
                     <Dialog
                         style={{ zIndex: 99999 }}
                         open={this.state.open}
-                        onEnter={console.log('Hey.')}
                         maxWidth="md"
                         fullWidth="true"
                     >
@@ -176,12 +207,13 @@ class imageList extends React.Component {
                                 }}
                                 variant="filled"
                                 fullWidth="true"
+                                value={this.state.uuid}
                             />
                             <br/><br/>
                             <TextField
                                 select
                                 label="Share option"
-                                value={this.state.currency}
+                                value={this.state.permission}
                                 onChange={this.handleChange}
                                 SelectProps={{
                                     native: true,
@@ -193,15 +225,15 @@ class imageList extends React.Component {
                                 {[
                                     {
                                         label: 'Anyone with the link',
-                                        value: 'link',
+                                        value: 'anyone',
                                     },
                                     {
                                         label: 'Anyone signed in',
-                                        value: 'signin',
+                                        value: 'signedin',
                                     },
                                     {
                                         label: 'Users in the same group',
-                                        value: 'group',
+                                        value: 'samegroup',
                                     },
                                     {
                                         label: 'Not public',