Skip to content

Commit c645a6e

Browse files
jesusantguerrerojesusantguerrero
authored
Merge pull request #30 from mctekk/feat/performance
add lint
2 parents 7fb924e + 05749db commit c645a6e

File tree

10 files changed

+304
-254
lines changed

10 files changed

+304
-254
lines changed

‎src/App.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div id="app" style="height: 98vh">
33
<twilio-chat
44
v-if="leadId && token"
5-
token-field="channel_client_token"
5+
token-field="channel_client_token"
66
:endpoint="`${endpoint}chats`"
77
:show-header="false"
88
:show-channel-list="false"

‎src/components/chat/header.vue

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,7 @@
99
<i :class="leftIcon"></i>
1010
</div>
1111

12-
<profile-image
13-
:url="profileImage"
14-
></profile-image>
12+
<profile-image :url="profileImage"></profile-image>
1513

1614
<div class="chat-header__title">
1715
<div>

‎src/components/chat/index.vue

Lines changed: 29 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -123,11 +123,13 @@ export default {
123123
},
124124
userData: {
125125
type: Object,
126-
default: {}
126+
default() {
127+
return {};
128+
}
127129
},
128130
branchId: {
129-
type: [String, Number],
130-
default: ""
131+
type: [String, Number],
132+
default: ""
131133
}
132134
},
133135
data() {
@@ -173,7 +175,9 @@ export default {
173175
174176
async loadChannel() {
175177
if (!this.activeChannel && !this.showChannelList) {
176-
const channel = await this.client.getChannelBySid(this.userContext.channel_sid)
178+
const channel = await this.client.getChannelBySid(
179+
this.userContext.channel_sid
180+
);
177181
if (channel) {
178182
this.joinChannel(channel);
179183
}
@@ -202,28 +206,31 @@ export default {
202206
channel.join();
203207
}
204208
205-
if (!this.isLoading) {
206-
this.isLoading = true;
207-
if (!this.showChannelList) {
208-
await this.loadChannel();
209-
this.isLoaded = true;
210-
this.isLoading = false;
211-
} else {
212-
const subscribed = await this.client
213-
.getSubscribedChannels({ limit: 100 })
214-
.then(page => {
215-
return this.appendChannels(page, []);
216-
});
217-
this.channels = subscribed;
218-
this.isLoaded = true;
219-
this.isLoading = false;
220-
}
221-
209+
if (!this.isLoading) {
210+
this.isLoading = true;
211+
if (!this.showChannelList) {
212+
await this.loadChannel();
213+
this.isLoaded = true;
214+
this.isLoading = false;
215+
} else {
216+
const subscribed = await this.client
217+
.getSubscribedChannels({ limit: 100 })
218+
.then(page => {
219+
return this.appendChannels(page, []);
220+
});
221+
this.channels = subscribed;
222+
this.isLoaded = true;
223+
this.isLoading = false;
222224
}
225+
}
223226
},
224227
225228
async appendChannels(paginator, current) {
226-
current.push(...paginator.items.filter((channel) => channel.attributes.branchId == this.branchId));
229+
current.push(
230+
...paginator.items.filter(
231+
channel => channel.attributes.branchId == this.branchId
232+
)
233+
);
227234
if (paginator.hasNextPage) {
228235
return this.appendChannels(await paginator.nextPage(), current);
229236
} else {

‎src/components/chat/login.vue

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -62,10 +62,10 @@ export default {
6262
},
6363
created() {
6464
if (this.receiver) {
65-
this.formData.identity = this.receiver;
66-
this.login();
65+
this.formData.identity = this.receiver;
66+
this.login();
6767
} else {
68-
this.getUserToken()
68+
this.getUserToken();
6969
}
7070
},
7171
methods: {
@@ -84,13 +84,11 @@ export default {
8484
},
8585
8686
getUserToken() {
87-
axios
88-
.get("/users/0/chats-token", this.httpOptions)
89-
.then(({ data }) => {
90-
this.$emit("logged", {
91-
"channel_client_token": data
92-
});
93-
});
87+
axios.get("/users/0/chats-token", this.httpOptions).then(({ data }) => {
88+
this.$emit("logged", {
89+
channel_client_token: data
90+
});
91+
});
9492
},
9593
9694
getAccessToken(identity) {
@@ -102,11 +100,9 @@ export default {
102100
});
103101
return;
104102
} else {
105-
axios
106-
.get(url, this.httpOptions)
107-
.then(({ data }) => {
108-
this.setData(data);
109-
});
103+
axios.get(url, this.httpOptions).then(({ data }) => {
104+
this.setData(data);
105+
});
110106
}
111107
}
112108
}

‎src/components/chat/messager-item.vue

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -54,12 +54,18 @@ export default {
5454
},
5555
5656
authorName() {
57-
if (this.members && this.members.length) {
58-
const memberUser = this.members.find( member => member.identity == this.message.author)
59-
return memberUser && memberUser.userAttributes && memberUser.userAttributes.name ? memberUser.userAttributes.name : this.message.author;
60-
} else {
61-
return this.message.author;
62-
}
57+
if (this.members && this.members.length) {
58+
const memberUser = this.members.find(
59+
member => member.identity == this.message.author
60+
);
61+
return memberUser &&
62+
memberUser.userAttributes &&
63+
memberUser.userAttributes.name
64+
? memberUser.userAttributes.name
65+
: this.message.author;
66+
} else {
67+
return this.message.author;
68+
}
6369
},
6470
6571
renderedMessage() {

‎src/components/chat/messager.vue

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,8 @@
5252
spellcheck="true"
5353
ref="Message"
5454
placeholder="Type..."
55+
@focus="isFocused = true"
56+
@blur="isFocused = false"
5557
@keydown="listenTyping"
5658
></textarea>
5759

@@ -100,6 +102,7 @@ export default {
100102
description: "",
101103
channel: null,
102104
isLoading: false,
105+
isFocused: false,
103106
messages: null,
104107
typing: [],
105108
members: [],
@@ -254,7 +257,7 @@ export default {
254257
this.messages = page.items || [];
255258
this.scrollToBottom();
256259
const lastIndex = this.messages.length - 1;
257-
if (lastIndex >= 0) {
260+
if (lastIndex >= 0 && this.isFocused) {
258261
this.setLastConsumedIndex(this.messages[lastIndex].index);
259262
}
260263
this.channel.on("messageAdded", this.addMessage);

‎src/components/chat/profile-image.vue

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div class="profile-image__container">
3-
<img :src="url" alt="" v-if="url"/>
3+
<img :src="url" alt="" v-if="url" />
44
</div>
55
</template>
66

@@ -29,14 +29,12 @@ export default {
2929
position: relative;
3030
3131
img {
32-
width: 100%;
33-
height: 100%;
34-
object-fit: cover;
35-
border-radius: 50%;
32+
width: 100%;
33+
height: 100%;
34+
object-fit: cover;
35+
border-radius: 50%;
3636
}
3737
38-
39-
4038
&.status-active::after {
4139
content: "";
4240
background: green;

‎src/components/chat/side-list-item.vue

Lines changed: 50 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -38,26 +38,26 @@ import Tracker from "../tracker.js";
3838
3939
export default {
4040
components: {
41-
ProfileImage,
41+
ProfileImage
4242
},
4343
props: {
4444
channel: {
4545
type: Object,
46-
required: true,
46+
required: true
4747
},
4848
channelData: {
4949
type: Object,
5050
default() {
5151
return {};
52-
},
52+
}
5353
},
5454
activeChannel: {
55-
type: Object,
55+
type: Object
5656
},
5757
userContext: {
5858
type: Object,
59-
required: true,
60-
},
59+
required: true
60+
}
6161
},
6262
data() {
6363
return {
@@ -73,20 +73,38 @@ export default {
7373
this.watchTime();
7474
},
7575
mounted() {
76-
this.$root.$on("leads:status-updated", (data) => {
77-
if (this.channel.attributes && data.id == this.channel.attributes.lead_id) {
78-
this.$set(this.channel.attributes, "status", data.status)
79-
}
80-
})
81-
82-
this.$root.$on("leads:stopwatch", (data) => {
83-
if (this.channel.attributes && data.lead_id == this.channel.attributes.lead_id) {
84-
this.$set(this.channel.attributes, "chrono_start_date", data.chrono_start_date);
85-
this.$set(this.channel.attributes, "is_chrono_running", data.is_chrono_running)
86-
this.$set(this.channel.attributes, "leads_visits_count", data.leads_visits_count)
87-
this.$set(this.channel.attributes, "status", data.status)
88-
this.watchTime();
89-
}
76+
this.$root.$on("leads:status-updated", data => {
77+
if (
78+
this.channel.attributes &&
79+
data.id == this.channel.attributes.lead_id
80+
) {
81+
this.$set(this.channel.attributes, "status", data.status);
82+
}
83+
});
84+
85+
this.$root.$on("leads:stopwatch", data => {
86+
if (
87+
this.channel.attributes &&
88+
data.lead_id == this.channel.attributes.lead_id
89+
) {
90+
this.$set(
91+
this.channel.attributes,
92+
"chrono_start_date",
93+
data.chrono_start_date
94+
);
95+
this.$set(
96+
this.channel.attributes,
97+
"is_chrono_running",
98+
data.is_chrono_running
99+
);
100+
this.$set(
101+
this.channel.attributes,
102+
"leads_visits_count",
103+
data.leads_visits_count
104+
);
105+
this.$set(this.channel.attributes, "status", data.status);
106+
this.watchTime();
107+
}
90108
});
91109
},
92110
computed: {
@@ -116,7 +134,7 @@ export default {
116134
return (
117135
this.channelData.members &&
118136
this.channelData.members.find(
119-
(member) => member.identity != this.userContext.identity
137+
member => member.identity != this.userContext.identity
120138
)
121139
);
122140
},
@@ -127,7 +145,7 @@ export default {
127145
return (
128146
this.channelData.members &&
129147
this.channelData.members.find(
130-
(member) => member.identity == this.userContext.identity
148+
member => member.identity == this.userContext.identity
131149
)
132150
);
133151
},
@@ -141,7 +159,7 @@ export default {
141159
},
142160
isActive() {
143161
return this.activeChannel && this.channel.sid == this.activeChannel.sid;
144-
},
162+
}
145163
},
146164
methods: {
147165
isRead() {
@@ -163,7 +181,7 @@ export default {
163181
getAuthorName() {
164182
if (this.channelData.members && this.channelData.lastMessage) {
165183
const memberUser = this.channelData.members.find(
166-
(member) => member.identity == this.channelData.lastMessage.author
184+
member => member.identity == this.channelData.lastMessage.author
167185
);
168186
return memberUser && memberUser.userAttributes
169187
? memberUser.userAttributes.name
@@ -182,22 +200,26 @@ export default {
182200
},
183201
184202
visits() {
185-
return Number(this.channel.attributes.leads_visits_count || this.channel.leads_visits_count || 0);
203+
return Number(
204+
this.channel.attributes.leads_visits_count ||
205+
this.channel.leads_visits_count ||
206+
0
207+
);
186208
},
187209
188210
trackTime(formData) {
189211
if (formData && formData.chrono_start_date) {
190212
this.tracker = this.tracker || new Tracker();
191-
this.tracker.trackTime(formData.chrono_start_date, (duration) => {
213+
this.tracker.trackTime(formData.chrono_start_date, duration => {
192214
this.stopwatch = duration;
193215
});
194216
} else if (this.tracker) {
195217
this.tracker.stop();
196218
this.tracker = null;
197219
this.stopwatch = null;
198220
}
199-
},
200-
},
221+
}
222+
}
201223
};
202224
</script>
203225

0 commit comments

Comments
 (0)