Update ratings & review when adding/editing or deleting a review in APPM

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/DetailedRating.js

@@ -29,46 +29,9 @@ const { Text } = Typography;
 
 class DetailedRating extends React.Component{
 
-    constructor(props){
-        super(props);
-        this.state={
-            detailedRating: null
-        }
-    }
-
-    componentDidMount() {
-        const {type,uuid} = this.props;
-        this.getData(type,uuid);
-    }
-
-    componentDidUpdate(prevProps, prevState) {
-        if (prevProps.uuid !== this.props.uuid) {
-            const {type,uuid} = this.props;
-            this.getData(type,uuid);
-        }
-    }
-
-
-    getData = (type, uuid)=>{
-        const config = this.props.context;
-
-        return axios.get(
-            window.location.origin+ config.serverConfig.invoker.uri +config.serverConfig.invoker.store+"/reviews/"+uuid+"/"+type+"-rating",
-            ).then(res => {
-            if (res.status === 200) {
-                let detailedRating = res.data.data;
-                this.setState({
-                    detailedRating
-                })
-            }
-
-        }).catch(function (error) {
-            handleApiError(error,"Error occurred while trying to load ratings.");
-        });
-    };
 
     render() {
-        const detailedRating = this.state.detailedRating;
+        const {detailedRating} = this.props;
 
         if(detailedRating ==null){
             return null;

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js

@@ -29,6 +29,7 @@ import AppUninstallModal from "./install/AppUninstallModal";
 import CurrentUsersReview from "./review/CurrentUsersReview";
 import {withConfigContext} from "../../../context/ConfigContext";
 import {handleApiError} from "../../../js/Utils";
+import ReviewContainer from "./review/ReviewContainer";
 
 const {Title, Text, Paragraph} = Typography;
 
@@ -193,15 +194,7 @@ class ReleaseView extends React.Component {
                         {(metaData.length === 0) && (<Text type="secondary">No meta data available.</Text>)}
                     </Row>
                     <Divider/>
-                    <CurrentUsersReview uuid={release.uuid}/>
+                    <ReviewContainer uuid={release.uuid}/>
-                    <Divider dashed={true}/>
-                    <Text>REVIEWS</Text>
-                    <Row>
-                        <Col lg={18} md={24}>
-                            <DetailedRating type="app" uuid={release.uuid}/>
-                        </Col>
-                    </Row>
-                    <Reviews type="app" uuid={release.uuid}/>
                 </div>
             </div>
         );

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/AddReview.js

@@ -86,10 +86,7 @@ class AddReview extends React.Component {
                     description:
                         'Your review has been posted successfully.',
                 });
-
+                this.props.onUpdateReview();
-                setTimeout(() => {
-                    window.location.href = uuid;
-                }, 2000)
             } else {
                 this.setState({
                     loading: false,

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/CurrentUsersReview.js

@@ -28,48 +28,9 @@ const {Text, Paragraph} = Typography;
 
 class CurrentUsersReview extends React.Component {
 
-    constructor(props) {
-        super(props);
-        this.state = {
-            data: []
-
-        };
-    }
-
-    componentDidMount() {
-        this.fetchData();
-    }
-
-    fetchData = () => {
-        const {uuid} = this.props;
-        const config = this.props.context;
-
-        axios.get(
-            window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/app/user/" + uuid,
-        ).then(res => {
-            if (res.status === 200) {
-                const data = res.data.data.data;
-                this.setState({data});
-            }
-
-        }).catch((error) => {
-            handleApiError(error,"Error occurred while trying to get your review.");
-        });
-    };
-
-    deleteCallback = () =>{
-        this.setState({
-            data: []
-        });
-    };
-
-    addCallBack =(review) =>{
-
-    };
 
     render() {
-        const {data} = this.state;
+        const {uuid, currentUserReviews} = this.props;
-        const {uuid} = this.props;
         return (
             <div>
                 <Text>MY REVIEW</Text>
@@ -78,13 +39,20 @@ class CurrentUsersReview extends React.Component {
                     paddingTop: 8,
                     paddingLeft: 24
                 }}>
-                    {data.length > 0 && (
+                    {currentUserReviews.length > 0 && (
                         <div>
                             <List
-                                dataSource={data}
+                                dataSource={currentUserReviews}
                                 renderItem={item => (
                                     <List.Item key={item.id}>
-                                        <SingleReview uuid={uuid} review={item} isDeletable={true} isEditable={true} deleteCallback={this.deleteCallback} isPersonalReview={true}/>
+                                        <SingleReview
+                                            uuid={uuid}
+                                            review={item}
+                                            isDeletable={true}
+                                            isEditable={true}
+                                            deleteCallback={this.props.deleteCallback}
+                                            onUpdateReview={this.props.onUpdateReview}
+                                            isPersonalReview={true}/>
                                     </List.Item>
                                 )}
                             >
@@ -92,7 +60,7 @@ class CurrentUsersReview extends React.Component {
                         </div>
                     )}
 
-                    {data.length === 0 && (
+                    {currentUserReviews.length === 0 && (
                         <div>
                             <Empty
                                 image={Empty.PRESENTED_IMAGE_DEFAULT}
@@ -104,7 +72,9 @@ class CurrentUsersReview extends React.Component {
                                 }
                             >
                                 {/*<Button type="primary">Add review</Button>*/}
-                                <AddReview uuid={uuid}/>
+                                <AddReview
+                                    uuid={uuid}
+                                    onUpdateReview={this.props.onUpdateReview}/>
                             </Empty>
                         </div>
                     )}

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/ReviewContainer.js

@@ -0,0 +1,119 @@
+/*
+ * Copyright (c) 2019, Entgra (pvt) Ltd. (http://entgra.io) All Rights Reserved.
+ *
+ * Entgra (pvt) Ltd. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React from "react";
+import CurrentUsersReview from "./CurrentUsersReview";
+import {Col, Divider, Row, Typography} from "antd";
+import DetailedRating from "../DetailedRating";
+import Reviews from "./Reviews";
+import axios from "axios";
+import {handleApiError} from "../../../../js/Utils";
+import {withConfigContext} from "../../../../context/ConfigContext";
+
+const {Text} = Typography;
+
+class ReviewContainer extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            currentUserReviews: [],
+            detailedRating: null
+        }
+    }
+
+    componentDidMount() {
+        this.fetchCurrentUserReviews();
+        this.fetchDetailedRating("app", this.props.uuid);
+    }
+
+    fetchCurrentUserReviews = () => {
+        const {uuid} = this.props;
+        const config = this.props.context;
+
+        axios.get(
+            window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/app/user/" + uuid,
+        ).then(res => {
+            if (res.status === 200) {
+                const currentUserReviews = res.data.data.data;
+                this.setState({currentUserReviews});
+            }
+
+        }).catch((error) => {
+            handleApiError(error, "Error occurred while trying to get your review.");
+        });
+    };
+
+    deleteCurrentUserReviewCallback = () => {
+        this.setState({
+            currentUserReviews: []
+        });
+        this.fetchDetailedRating("app", this.props.uuid);
+    };
+
+    fetchDetailedRating = (type, uuid) => {
+        const config = this.props.context;
+
+        axios.get(
+            window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + uuid + "/" + type + "-rating",
+        ).then(res => {
+            if (res.status === 200) {
+                let detailedRating = res.data.data;
+                this.setState({
+                    detailedRating
+                })
+            }
+
+        }).catch(function (error) {
+            handleApiError(error, "Error occurred while trying to load ratings.");
+        });
+    };
+
+    onUpdateReview = () => {
+        this.fetchCurrentUserReviews();
+        this.fetchDetailedRating("app", this.props.uuid);
+    };
+
+    render() {
+        const {uuid} = this.props;
+        const {currentUserReviews,detailedRating} = this.state;
+        return (
+            <div>
+                <CurrentUsersReview
+                    uuid={uuid}
+                    currentUserReviews={currentUserReviews}
+                    onUpdateReview={this.onUpdateReview}
+                    deleteCallback={this.deleteCurrentUserReviewCallback}/>
+                <Divider dashed={true}/>
+                <Text>REVIEWS</Text>
+                <Row>
+                    <Col lg={18} md={24}>
+                        <DetailedRating
+                            type="app"
+                            detailedRating={detailedRating}/>
+                    </Col>
+                </Row>
+                <Reviews
+                    type="app"
+                    uuid={uuid}
+                    deleteCallback={this.onUpdateReview}/>
+            </div>
+        )
+    }
+}
+
+export default withConfigContext(ReviewContainer);

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/Reviews.js

@@ -107,6 +107,7 @@ class Reviews extends React.Component {
                 data: res,
             });
         });
+        this.props.deleteCallback();
     };
 
     render() {
@@ -119,16 +120,14 @@ class Reviews extends React.Component {
                     pageStart={0}
                     loadMore={this.handleInfiniteOnLoad}
                     hasMore={!loading && hasMore}
-                    useWindow={true}
+                    useWindow={true}>
-                >
                     <List
                         dataSource={data}
                         renderItem={item => (
                             <List.Item key={item.id}>
                                 <SingleReview uuid={uuid} review={item} isDeletable={true} isEditable={false} deleteCallback={this.deleteCallback}/>
                             </List.Item>
-                        )}
+                        )}>
-                    >
                         {loading && hasMore && (
                             <div className="loading-container">
                                 <Spin/>

components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/review/singleReview/SingleReview.js

@@ -52,6 +52,7 @@ class SingleReview extends React.Component {
         this.setState({
             review
         });
+        this.props.onUpdateReview();
     };
 
     deleteReview = () => {