Skip to content

Commit 0bf8899

Browse files
committed
destructuring
1 parent eb96356 commit 0bf8899

File tree

9 files changed

+97
-85
lines changed

9 files changed

+97
-85
lines changed

src/user/Admin/Tickets/NewTicketEditor/index.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ class Editor extends Component {
5757
strikethrough: true,
5858
simplifiedAutoLink: true,
5959
});
60-
const { title, content, selectedTab } = this.state;
60+
const { title, content, selectedTab, shortDescription } = this.state;
6161
const { cancel } = this.props;
6262
return (
6363
<div className="new-ticket-editor">
@@ -79,7 +79,7 @@ class Editor extends Component {
7979
name="ticketTitle"
8080
className="searchbar"
8181
onChange={this.setTitle}
82-
isInvalid={this.state.title.length >= 50}
82+
isInvalid={title.length >= 50}
8383
/>
8484
</Form>
8585
<Form>
@@ -89,9 +89,9 @@ class Editor extends Component {
8989
maxLength="100"
9090
className="searchbar"
9191
name="ticketDescription"
92-
value={this.state.shortDescription}
92+
value={shortDescription}
9393
onChange={this.setShortDescription}
94-
isInvalid={this.state.shortDescription.length >= 100}
94+
isInvalid={shortDescription.length >= 100}
9595
/>
9696
</Form>
9797
<Form></Form>

src/user/Admin/Tickets/TicketDashboard.js

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -166,15 +166,16 @@ class TicketDashboard extends Component {
166166
};
167167

168168
render() {
169+
const { spinner, editorMode, viewingTicket, ticket, all, filtered, notificationDrawer, notifications } = this.state;
169170
return (
170171
<div className="ticket">
171172
<div className="navigation">
172-
<Navigation ticket={this.state.ticket} />
173+
<Navigation ticket={ticket} />
173174
</div>
174175
<div className="ticket-details" id="ticket-shadow">
175176
<LoadingOverlay
176-
text={this.state.spinner}
177-
active={!!this.state.spinner}
177+
text={spinner}
178+
active={!!spinner}
178179
spinner={<ClockLoader color={"#1A73E8"} />}
179180
styles={{
180181
spinner: (base) => ({
@@ -193,49 +194,49 @@ class TicketDashboard extends Component {
193194
<NotificationsNoneOutlinedIcon />
194195
</Button>
195196
</div>
196-
{!this.state.editorMode && !this.state.viewingTicket && (
197+
{!editorMode && !viewingTicket && (
197198
<React.Fragment>
198199
<div className="ticket-status">
199200
<TicketFilter
200-
tickets={this.state.all}
201-
filtered={this.state.filtered}
201+
tickets={all}
202+
filtered={filtered}
202203
clear={this.clearFilters}
203204
toggleNewTicketEditor={this.toggleNewTicketEditor}
204205
setFiltered={this.setFilteredTickets}
205206
/>
206207
</div>
207-
{!!this.state.all.length && (
208+
{!!all.length && (
208209
<div className="ticket-content">
209210
<TicketContent
210211
viewTicket={this.handleViewTicket}
211-
tickets={this.state.filtered}
212+
tickets={filtered}
212213
/>
213214
</div>
214215
)}
215216
</React.Fragment>
216217
)}
217-
{this.state.editorMode && !this.state.viewingTicket && (
218+
{editorMode && !viewingTicket && (
218219
<NewTicketEditor
219220
save={this.handleCreateNewTicket}
220221
cancel={() => this.toggleNewTicketEditor(false)}
221222
/>
222223
)}
223-
{this.state.viewingTicket && (
224+
{viewingTicket && (
224225
<TicketDisscussion
225226
addTag={this.handleAddTag}
226227
back={this.handleViewTicket}
227228
currentUser={this.props.user}
228229
removeTag={this.handleRemoveTag}
229230
deleteTicket={this.deleteTicket}
230-
ticketId={this.state.viewingTicket}
231+
ticketId={viewingTicket}
231232
singleUpdate={this.handleTicketSingleUpdate}
232233
/>
233234
)}
234235
</div>
235236
</LoadingOverlay>
236237
<Drawer
237238
anchor={"right"}
238-
open={this.state.notificationDrawer}
239+
open={notificationDrawer}
239240
PaperProps={{ style: { position: "absolute", zIndex: "5000" } }}
240241
BackdropProps={{ style: { position: "absolute", zIndex: "5000" } }}
241242
ModalProps={{
@@ -246,8 +247,8 @@ class TicketDashboard extends Component {
246247
onClose={this.toggleDrawer}
247248
>
248249
<List className="list">
249-
{this.state.notifications &&
250-
this.state.notifications.map((notification, index) => (
250+
{notifications &&
251+
notifications.map((notification, index) => (
251252
<ListItem
252253
key={index}
253254
style={{

src/user/Admin/Tickets/TicketDiscussion/Discussion/Discussion.js

Lines changed: 26 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import * as Showdown from "showdown";
55
import { Image } from "react-bootstrap";
66
import ReactMarkdown from "react-markdown";
77
import Button from "react-bootstrap/Button";
8-
// import Dropdown from "react-bootstrap/Dropdown";
98
import SaveButton from "@material-ui/icons/SaveOutlined";
109
import EditButton from "@material-ui/icons/EditOutlined";
1110
import CancelButton from "@material-ui/icons/ClearOutlined";
@@ -19,7 +18,7 @@ class Discussion extends Component {
1918
constructor(props) {
2019
super(props);
2120
this.state = {
22-
editer: "new",
21+
editor: "new",
2322
content: "",
2423
selectedTab: "write",
2524
};
@@ -32,22 +31,22 @@ class Discussion extends Component {
3231
handleEditTicket = () => {
3332
this.setState({
3433
content: this.props.ticket.content,
35-
editer: "ticket",
34+
editor: "ticket",
3635
});
3736
};
3837

3938
cancelEditTicket = () => {
4039
this.setState({
4140
content: "",
42-
editer: "new",
41+
editor: "new",
4342
});
4443
};
4544

4645
handleUpdateTicket = () => {
4746
const content = this.state.content;
4847
this.setState(
4948
{
50-
editer: "new",
49+
editor: "new",
5150
content: "",
5251
},
5352
async () => await this.props.updateTicket({ type: "content", content })
@@ -72,12 +71,14 @@ class Discussion extends Component {
7271
strikethrough: true,
7372
simplifiedAutoLink: true,
7473
});
74+
const { editor, content, selectedTab } = this.state;
75+
const { ticket, editsAllowed, deleteAllowed, deleteComment, upVoteComment, downVoteComment} = this.props;
7576
return (
7677
<React.Fragment>
7778
<div
7879
className="discussions"
7980
style={{
80-
height: this.state.editer === "ticket" ? "80vh" : "50vh",
81+
height: editor === "ticket" ? "80vh" : "50vh",
8182
}}
8283
>
8384
<div className="single-discussion">
@@ -97,9 +98,9 @@ class Discussion extends Component {
9798
>
9899
<div>
99100
<div style={{ display: "flex", alignItems: "center" }}>
100-
<h2>{this.props.ticket.createdBy.name}</h2>
101-
{this.state.editer === "new" &&
102-
this.props.editsAllowed && (
101+
<h2>{ticket.createdBy.name}</h2>
102+
{editor === "new" &&
103+
editsAllowed && (
103104
<EditButton
104105
style={{
105106
color: "rgba(0,0,0,0.5)",
@@ -111,11 +112,11 @@ class Discussion extends Component {
111112
</div>
112113
<div className="discussion-date">
113114
<Moment format="DD MMM YYYY">
114-
{this.props.ticket.createdAt}
115+
{ticket.createdAt}
115116
</Moment>
116117
</div>
117118
</div>
118-
{this.state.editer === "ticket" && (
119+
{editor === "ticket" && (
119120
<div>
120121
<Button
121122
style={{ margin: "8px" }}
@@ -128,7 +129,7 @@ class Discussion extends Component {
128129
<Button
129130
style={{ margin: "8px" }}
130131
onClick={this.handleUpdateTicket}
131-
disabled={this.props.ticket.content === this.state.content}
132+
disabled={ticket.content === content}
132133
>
133134
<SaveButton />
134135
Save
@@ -138,13 +139,13 @@ class Discussion extends Component {
138139
</div>
139140
<div className="comment-content">
140141
<div className="comment-details">
141-
{this.state.editer === "new" && (
142-
<ReactMarkdown source={this.props.ticket.content} />
142+
{editor === "new" && (
143+
<ReactMarkdown source={ticket.content} />
143144
)}
144-
{this.state.editer === "ticket" && (
145+
{editor === "ticket" && (
145146
<ReactMde
146-
value={this.state.content}
147-
selectedTab={this.state.selectedTab}
147+
value={content}
148+
selectedTab={selectedTab}
148149
onChange={this.setContent}
149150
onTabChange={this.setSelectedTab}
150151
generateMarkdownPreview={(markdown) =>
@@ -158,7 +159,7 @@ class Discussion extends Component {
158159
</div>
159160
</div>
160161
</div>
161-
{this.props.ticket.comments.map((ele, index) => (
162+
{ticket.comments.map((ele, index) => (
162163
<div key={index} className={`single-discussion`}>
163164
<div className="user-info">
164165
<div className="image">
@@ -173,13 +174,13 @@ class Discussion extends Component {
173174
<div className="img-desc">
174175
<h2>
175176
{ele.createdBy.name}
176-
{this.props.deleteAllowed && <DeleteOutlineOutlinedIcon
177+
{deleteAllowed && <DeleteOutlineOutlinedIcon
177178
style={{
178179
color: "rgba(0,0,0,0.5)",
179180
fontSize: "18px",
180181
cursor: "pointer"
181182
}}
182-
onClick={() => this.props.deleteComment(ele._id)}
183+
onClick={() => deleteComment(ele._id)}
183184
/>}
184185
</h2>
185186
<p className="discussion-date">
@@ -197,7 +198,7 @@ class Discussion extends Component {
197198
? ""
198199
: "selected"
199200
}
200-
onClick={() => this.props.upVoteComment(ele._id)}
201+
onClick={() => upVoteComment(ele._id)}
201202
>
202203
<ThumbUpAltOutlinedIcon />
203204
<span>{ele.votes.upVotes.user.length}</span>
@@ -208,7 +209,7 @@ class Discussion extends Component {
208209
? ""
209210
: "selected"
210211
}
211-
onClick={() => this.props.downVoteComment(ele._id)}
212+
onClick={() => downVoteComment(ele._id)}
212213
>
213214
<ThumbDownOutlinedIcon />
214215
<span>{ele.votes.downVotes.user.length}</span>
@@ -219,7 +220,7 @@ class Discussion extends Component {
219220
</div>
220221
))}
221222
</div>
222-
{this.state.editer === "new" && (
223+
{editor === "new" && (
223224
<div
224225
className={`single-discussion discussion-ticket`}
225226
id="discussion-editor"
@@ -245,8 +246,8 @@ class Discussion extends Component {
245246
</div>
246247
<div className="comment-content">
247248
<ReactMde
248-
value={this.state.content}
249-
selectedTab={this.state.selectedTab}
249+
value={content}
250+
selectedTab={selectedTab}
250251
onChange={this.setContent}
251252
onTabChange={this.setSelectedTab}
252253
generateMarkdownPreview={(markdown) =>

src/user/Admin/Tickets/TicketDiscussion/History/History.js

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ class History extends Component {
2323
view = () => {};
2424

2525
render() {
26+
const { modal } = this.state;
2627
return (
2728
<div
2829
style={{ padding: "10px 2rem", overflowY: "scroll", height: "75vh" }}
@@ -153,25 +154,25 @@ class History extends Component {
153154
);
154155
})}
155156
</Timeline>
156-
{this.state.modal && (
157+
{modal && (
157158
<Modal
158159
centered
159160
className="modal"
160-
show={this.state.modal}
161+
show={modal}
161162
onHide={this.handleClose}
162163
>
163164
<Modal.Header closeButton>
164-
<Modal.Title>{this.state.modal.title}</Modal.Title>
165+
<Modal.Title>{modal.title}</Modal.Title>
165166
</Modal.Header>
166167
<Modal.Body
167168
style={
168-
this.state.modal.type === "content"
169+
modal.type === "content"
169170
? { height: "500px", overflowY: "scroll", padding: "0 30px" }
170171
: {}
171172
}
172173
>
173-
<h5>{this.state.modal.bodyTitle}</h5>
174-
<ReactMarkdown source={this.state.modal.bodyContent}/>
174+
<h5>{modal.bodyTitle}</h5>
175+
<ReactMarkdown source={modal.bodyContent}/>
175176
</Modal.Body>
176177
</Modal>
177178
)}

src/user/Admin/Tickets/TicketDiscussion/Layout/EditableCard.js

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -31,21 +31,22 @@ class EditableCard extends Component {
3131
};
3232

3333
render() {
34+
const { editor, data } = this.state;
3435
return (
3536
<Card className="info-card">
3637
<div className="info-title">
3738
<span>{this.props.heading}</span>
38-
{!this.state.editor && this.props.editsAllowed && (
39+
{!editor && this.props.editsAllowed && (
3940
<EditButton onClick={this.toggleEditor} />
4041
)}
41-
{this.state.editor && (
42+
{editor && (
4243
<div className="buttons">
4344
<CancelButton
4445
style={{ marginRight: "10px" }}
4546
onClick={this.toggleEditor}
4647
/>
4748
<Button
48-
disabled={this.props.data === this.state.data}
49+
disabled={this.props.data === data}
4950
variant="light"
5051
onClick={this.save}
5152
>
@@ -57,16 +58,16 @@ class EditableCard extends Component {
5758
<div className="info-details">
5859
<div className="data-element">
5960
<span className="data-desc">
60-
{!this.state.editor && this.props.data}
61-
{this.state.editor && (
61+
{!editor && this.props.data}
62+
{editor && (
6263
<Form.Group>
6364
<Form.Control
6465
as="textarea"
6566
rows="3"
6667
maxLength="100"
67-
value={this.state.data}
68+
value={data}
6869
onChange={this.setData}
69-
isInvalid={this.state.data.length >= 100}
70+
isInvalid={data.length >= 100}
7071
/>
7172
</Form.Group>
7273
)}

0 commit comments

Comments
 (0)