Fix cannot remove child issue

feature/appm-store/pbac
Jayasanka 5 years ago
parent f66ad9ddd9
commit 7675f5a315

@ -118,7 +118,6 @@ class FiltersForm extends React.Component {
}); });
}; };
render() { render() {
const {categories, tags, deviceTypes} = this.state; const {categories, tags, deviceTypes} = this.state;
const {getFieldDecorator} = this.props.form; const {getFieldDecorator} = this.props.form;
@ -148,10 +147,7 @@ class FiltersForm extends React.Component {
</Form.Item> </Form.Item>
</Col> </Col>
</Row> </Row>
<Divider/>
{/*<Text strong={true}>Category</Text>*/}
{/*<br/><br/>*/}
<Form.Item label="Categories"> <Form.Item label="Categories">
{getFieldDecorator('categories', { {getFieldDecorator('categories', {
rules: [{ rules: [{
@ -178,15 +174,7 @@ class FiltersForm extends React.Component {
</Select> </Select>
)} )}
</Form.Item> </Form.Item>
{/*<Select*/}
{/*mode="multiple"*/}
{/*style={{width: '100%'}}*/}
{/*placeholder="All Categories"*/}
{/*>*/}
{/*<Option key={1}>IoT</Option>*/}
{/*<Option key={2}>EMM</Option>*/}
{/*</Select>*/}
<Divider/>
<Form.Item label="Device Types"> <Form.Item label="Device Types">
{getFieldDecorator('deviceTypes', { {getFieldDecorator('deviceTypes', {
@ -213,7 +201,6 @@ class FiltersForm extends React.Component {
)} )}
</Form.Item> </Form.Item>
{/*<Text strong={true}>Tags</Text>*/}
<Form.Item label="Tags"> <Form.Item label="Tags">
{getFieldDecorator('tags', { {getFieldDecorator('tags', {
rules: [{ rules: [{
@ -240,7 +227,6 @@ class FiltersForm extends React.Component {
)} )}
</Form.Item> </Form.Item>
<Divider/>
<Form.Item label="App Type"> <Form.Item label="App Type">
{getFieldDecorator('appType', {})( {getFieldDecorator('appType', {})(
<Select <Select

@ -20,7 +20,7 @@ class App extends React.Component {
<Router> <Router>
<div> <div>
<Switch> <Switch>
<Redirect exact from="/store" to="/store/apps"/> <Redirect exact from="/store" to="/store/android"/>
{this.routes.map((route) => ( {this.routes.map((route) => (
<RouteWithSubRoutes key={route.path} {...route} /> <RouteWithSubRoutes key={route.path} {...route} />
))} ))}

@ -9,6 +9,7 @@ import AddReview from "./review/AddReview";
import axios from "axios"; import axios from "axios";
import config from "../../../../public/conf/config.json"; import config from "../../../../public/conf/config.json";
import AppInstallModal from "./install/AppInstallModal"; import AppInstallModal from "./install/AppInstallModal";
import CurrentUsersReview from "./review/CurrentUsersReview";
const {Title, Text, Paragraph} = Typography; const {Title, Text, Paragraph} = Typography;
@ -129,14 +130,13 @@ class ReleaseView extends React.Component {
{release.description} {release.description}
</Paragraph> </Paragraph>
<Divider/> <Divider/>
<CurrentUsersReview uuid={release.uuid}/>
<Divider dashed={true}/>
<Text>REVIEWS</Text> <Text>REVIEWS</Text>
<Row> <Row>
<Col lg={18}> <Col lg={18} md={24}>
<DetailedRating type="app" uuid={release.uuid}/> <DetailedRating type="app" uuid={release.uuid}/>
</Col> </Col>
<Col lg={6}>
<AddReview uuid={release.uuid}/>
</Col>
</Row> </Row>
<Reviews type="app" uuid={release.uuid}/> <Reviews type="app" uuid={release.uuid}/>
</div> </div>

@ -52,8 +52,6 @@ class AddReview extends React.Component {
rating: rating rating: rating
}; };
const request = "method=post&content-type=application/json&payload="+JSON.stringify(payload)+"&api-endpoint=/application-mgt-store/v1.0/reviews/"+uuid;
axios.post( axios.post(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + uuid, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + uuid,
payload, payload,
@ -105,8 +103,8 @@ class AddReview extends React.Component {
render() { render() {
return ( return (
<div style={{paddingTop: 20}}> <div>
<Button style={{float: "right"}} type="dashed" onClick={this.showDrawer}> <Button type="primary" onClick={this.showDrawer}>
<Icon type="star"/> Add a review <Icon type="star"/> Add a review
</Button> </Button>

@ -0,0 +1,101 @@
import React from "react";
import {List, message, Typography, Empty, Button, Row, Col} from "antd";
import SingleReview from "./SingleReview";
import axios from "axios";
import config from "../../../../../public/conf/config.json";
import AddReview from "./AddReview";
const {Text, Paragraph} = Typography;
class CurrentUsersReview extends React.Component {
constructor(props) {
super(props);
this.state = {
data: []
};
}
componentDidMount() {
this.fetchData();
}
fetchData = () => {
const {uuid} = this.props;
axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + 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) => {
if (error.response.hasOwnProperty(status) && error.response.status === 401) {
message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login';
} else {
message.error('Something went wrong when trying to get your review... :(');
}
});
};
render() {
const {data} = this.state;
const {uuid} = this.props;
return (
<div>
<Text>MY REVIEW</Text>
<div style={{
overflow: "auto",
paddingTop: 8,
paddingLeft: 24
}}>
{data.length > 0 && (
<div>
<Row>
<Col span={18}>
<List
dataSource={data}
renderItem={item => (
<List.Item key={item.id}>
<SingleReview review={item}/>
</List.Item>
)}
>
</List>
</Col>
<Col span={6}>
<Button type="primary" shape="circle" icon="search" />
</Col>
</Row>
</div>
)}
{data.length === 0 && (
<div>
<Empty
image={Empty.PRESENTED_IMAGE_DEFAULT}
imagestyle={{
height: 60,
}}
description={
<span>Share your experience with your community by adding a review.</span>
}
>
{/*<Button type="primary">Add review</Button>*/}
<AddReview uuid={uuid}/>
</Empty>
</div>
)}
</div>
</div>
);
}
}
export default CurrentUsersReview;

@ -0,0 +1,164 @@
import React from "react";
import {Drawer, Button, Icon, Row, Col, Typography, Divider, Input, Spin, notification} from 'antd';
import StarRatings from "react-star-ratings";
import axios from "axios";
import config from "../../../../../public/conf/config.json";
const {Title} = Typography;
const {TextArea} = Input;
class EditReview extends React.Component {
constructor(props) {
super(props);
this.state = {
visible: false,
content: '',
rating: 0,
loading: false
};
}
showDrawer = () => {
this.setState({
visible: true,
content: '',
rating: 0,
loading: false
});
};
onClose = () => {
this.setState({
visible: false,
});
};
changeRating = (newRating, name) => {
this.setState({
rating: newRating
});
};
onChange = (e) => {
this.setState({content: e.target.value})
};
onSubmit = () => {
const {content, rating} = this.state;
const {uuid} = this.props;
this.setState({
loading: true
});
const payload = {
content: content,
rating: rating
};
axios.post(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.store + "/reviews/" + uuid,
payload,
).then(res => {
if (res.status === 201) {
this.setState({
loading: false,
visible: false
});
notification["success"]({
message: 'Done!',
description:
'Your review has been posted successfully.',
});
setTimeout(() => {
window.location.href = uuid;
}, 2000)
} else {
this.setState({
loading: false,
visible: false
});
notification["error"]({
message: 'Something went wrong',
description:
"We are unable to add your review right now.",
});
}
}).catch((error) => {
if (error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/store/login';
} else {
this.setState({
loading: false,
visible: false
});
notification["error"]({
message: 'Something went wrong',
description:
"We are unable to add your review right now.",
});
}
});
};
render() {
return (
<div>
<Button type="primary" onClick={this.showDrawer}>
<Icon type="star"/> Add a review
</Button>
<Drawer
// title="Basic Drawer"
placement="bottom"
closable={false}
onClose={this.onClose}
visible={this.state.visible}
height={400}
>
<Spin spinning={this.state.loading} tip="Posting your review...">
<Row>
<Col lg={8}/>
<Col lg={8}>
<Title level={4}>Add review</Title>
<Divider/>
<TextArea
placeholder="Tell others what you think about this app. Would you recommend it, and why?"
onChange={this.onChange}
autosize={{minRows: 6, maxRows: 12}}
value={this.state.content || ''}
style={{marginBottom: 20}}
/>
<StarRatings
rating={this.state.rating}
changeRating={this.changeRating}
starRatedColor="#777"
starHoverColor="#444"
starDimension="20px"
starSpacing="2px"
numberOfStars={5}
name='rating'
/>
<br/><br/>
<Button onClick={this.onClose} style={{marginRight: 8}}>
Cancel
</Button>
<Button disabled={this.state.rating === 0} onClick={this.onSubmit} type="primary">
Submit
</Button>
</Col>
</Row>
</Spin>
</Drawer>
</div>
);
}
}
export default EditReview;

@ -1,15 +1,15 @@
.demo-infinite-container { .infinite-container {
overflow: auto; overflow: auto;
padding: 8px 24px; padding: 8px 24px;
} }
.demo-loading-container { .loading-container {
position: absolute; position: absolute;
bottom: 40px; bottom: 40px;
width: 100%; width: 100%;
text-align: center; text-align: center;
} }
.demo-loading { .loading {
position: absolute; position: absolute;
bottom: -40px; bottom: -40px;
left: 50%; left: 50%;

@ -87,20 +87,8 @@ class Reviews extends React.Component {
}; };
render() { render() {
const review = {
id: 2,
content: "Btw, it was clear to me that I can cancel the 1 year subscription before the free trial week and so I did. Dont understand the negative reviews about that. It has a good collection of excercises, meditations etc. You just answer 5 questions and you get challenges assigned to you. I would have liked something even more personalized. I didnt like the interface. It is a bit messy and difficult to follow your tasks. So, I didnt want to do a full-year subscription. There could be more options.",
rootParentI: -1,
immediateParentId: -1,
createdAt: "Fri, 24 May 2019 17:27:22 IST",
modifiedAt: "Fri, 24 May 2019 17:27:22 IST",
rating: 4,
replies: []
};
// console.log(this.state.loadMore);
// console.log(this.state.data.length);
return ( return (
<div className="demo-infinite-container"> <div className="infinite-container">
<InfiniteScroll <InfiniteScroll
initialLoad={false} initialLoad={false}
pageStart={0} pageStart={0}
@ -117,7 +105,7 @@ class Reviews extends React.Component {
)} )}
> >
{this.state.loading && this.state.hasMore && ( {this.state.loading && this.state.hasMore && (
<div className="demo-loading-container"> <div className="loading-container">
<Spin/> <Spin/>
</div> </div>
)} )}

@ -6,14 +6,15 @@ import Twemoji from "react-twemoji";
import "./Reviews.css"; import "./Reviews.css";
const {Text, Paragraph} = Typography; const {Text, Paragraph} = Typography;
const colorList = ['#f0932b', '#badc58', '#6ab04c', '#eb4d4b', '#0abde3', '#9b59b6', '#3498db', '#22a6b3']; const colorList = ['#f0932b', '#badc58', '#6ab04c', '#eb4d4b', '#0abde3', '#9b59b6', '#3498db', '#22a6b3','#e84393','#f9ca24'];
class SingleReview extends React.Component { class SingleReview extends React.Component {
render() { render() {
const review = this.props.review; const {review} = this.props;
const randomColor = colorList[Math.floor(Math.random() * (colorList.length))]; const {username} = review;
const avatarLetter = review.username.charAt(0).toUpperCase(); const randomColor = colorList[username.length%10];
const avatarLetter = username.charAt(0).toUpperCase();
const content = ( const content = (
<div style={{marginTop: -5}}> <div style={{marginTop: -5}}>
<StarRatings <StarRatings
@ -25,11 +26,11 @@ class SingleReview extends React.Component {
name='rating' name='rating'
/> />
<Text style={{fontSize: 12, color: "#aaa"}} type="secondary"> {review.createdAt}</Text><br/> <Text style={{fontSize: 12, color: "#aaa"}} type="secondary"> {review.createdAt}</Text><br/>
<Paragraph style={{color: "#777"}}>
<Twemoji options={{className: 'twemoji'}}> <Twemoji options={{className: 'twemoji'}}>
<Paragraph ellipsis={{rows: 3, expandable: true}} style={{color: "#777"}}>
{review.content} {review.content}
</Paragraph>
</Twemoji> </Twemoji>
</Paragraph>
</div> </div>
); );

@ -68,7 +68,7 @@ class NormalLoginForm extends React.Component {
axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname+':'+config.serverConfig.httpsPort+config.serverConfig.loginUri, request axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname+':'+config.serverConfig.httpsPort+config.serverConfig.loginUri, request
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
window.location = res.data.url; window.location = config.serverConfig.protocol + "://"+config.serverConfig.hostname+':'+config.serverConfig.httpsPort+"/store";
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 400) { if (error.response.status === 400) {

@ -48,7 +48,6 @@ class Dashboard extends React.Component {
<Layout> <Layout>
<Content style={{padding: '0 0'}}> <Content style={{padding: '0 0'}}>
<Switch> <Switch>
<Redirect exact from="/store" to="/store/android"/>
{this.state.routes.map((route) => ( {this.state.routes.map((route) => (
<RouteWithSubRoutes changeSelectedMenuItem={this.changeSelectedMenuItem} key={route.path} {...route} /> <RouteWithSubRoutes changeSelectedMenuItem={this.changeSelectedMenuItem} key={route.path} {...route} />
))} ))}

Loading…
Cancel
Save