Skip to content

Commit acf8e3d

Browse files
author
Nicola Lanzilotto
committed
Adds the ability to see who left an "abandoned chat" in the non-real-time conversations page and in the history page
1 parent a137cdf commit acf8e3d

File tree

2 files changed

+255
-0
lines changed

2 files changed

+255
-0
lines changed

src/app/ws_requests/history-and-nort-convs/history-and-nort-convs.component.html

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1307,6 +1307,9 @@
13071307
</span>
13081308
</span>
13091309

1310+
<!-- ---------------------------------- -->
1311+
<!-- Abandoned -->
1312+
<!-- ---------------------------------- -->
13101313
<span *ngIf="request?.status === 150" style="position: relative;">
13111314
<span (click)='goToRequestMsgs(request?.request_id)' style="cursor:pointer">
13121315

@@ -1315,6 +1318,94 @@
13151318
matTooltip="{{ 'RequestMsgsPage.RequestAbandoned' | translate }}" #tooltip="matTooltip"
13161319
matTooltipPosition='right' matTooltipHideDelay="100">
13171320

1321+
<div class="abandoned_chat-badge-wpr" (click)="$event.stopPropagation();toggleTooltip(i)"
1322+
*ngIf="request?.attributes?.last_abandoned_by_project_user_array?.length > 0 ">
1323+
<span class="tool_tip">
1324+
<span class="material-icons">
1325+
person_off
1326+
</span>
1327+
1328+
<!-- ------------------------------------------------------------------------------------------------- -->
1329+
<!-- Tooltip with list of who has abandoned the chat -->
1330+
<!-- ------------------------------------------------------------------------------------------------- -->
1331+
<span id="{{'tooltip_' + i}}" class="right"
1332+
style="white-space: normal;padding: 6px 12px;;font-weight: 200; width: fit-content;max-width: unset!important"
1333+
[ngStyle]="{'height': (request?.attributes?.other_project_users_that_has_abandoned_array?.length > 0) ? '100px' : '76px'}">
1334+
<h4 style="font-weight:400" style="white-space: nowrap;">
1335+
{{'ThisChatHasBeenAbandonedBy' | translate}}
1336+
</h4>
1337+
1338+
1339+
<div *ngIf="request.attributes.last_abandoned_by_project_user_array[0].has_image === true" style="display: flex; align-items: center; gap: 6px;">
1340+
<div class="pu-user-avatar-wpr"
1341+
style="width: 24px !important;height: 24px !important;">
1342+
<img
1343+
style="width: 24px !important;height: 24px !important; border-radius: 50%; object-fit: cover;"
1344+
src={{request.attributes.last_abandoned_by_project_user_array[0].img_url}} />
1345+
</div>
1346+
<span style="white-space: nowrap; font-size: 12px; font-weight: 400;">
1347+
<span>{{request.attributes.last_abandoned_by_project_user_array[0].firstname}} </span>
1348+
<span>{{request.attributes.last_abandoned_by_project_user_array[0].lastname | slice:0:1}}.
1349+
<span style="font-style: italic; color: #94a3b8;">
1350+
({{'theLastOneWhoLeft' | translate}})
1351+
</span>
1352+
</span>
1353+
</span>
1354+
</div>
1355+
1356+
<div *ngIf="request.attributes.last_abandoned_by_project_user_array[0].has_image === false" style="display: flex; align-items: center; gap: 6px;">
1357+
<div class="pu-user-avatar-wpr"
1358+
style="width: 24px !important;height: 24px !important;">
1359+
<div class="avatar-when-not-has-image"
1360+
[ngStyle]="{'background-color': request.attributes.last_abandoned_by_project_user_array[0].fillColour }">
1361+
{{request.attributes.last_abandoned_by_project_user_array[0].fullname_initial}}
1362+
</div>
1363+
</div>
1364+
<span style="white-space: nowrap; font-size: 12px; font-weight: 400;">
1365+
<span>{{request.attributes.last_abandoned_by_project_user_array[0].firstname}} </span>
1366+
<span>{{request.attributes.last_abandoned_by_project_user_array[0].lastname | slice:0:1}}.
1367+
<span style="font-style: italic; color: #94a3b8;">
1368+
({{'theLastOneWhoLeft' | translate}})
1369+
</span>
1370+
</span>
1371+
</span>
1372+
</div>
1373+
1374+
<div class="others-that-has-abandoned"
1375+
*ngIf="request?.attributes?.other_project_users_that_has_abandoned_array?.length > 0"
1376+
style="margin-top: 6px;">
1377+
<div class="served-by-desktop-a-in-tooltip">
1378+
<div class="served-by-desktop-b-in-tooltip"
1379+
*ngFor="let agent of request?.attributes?.other_project_users_that_has_abandoned_array; let first = first;"
1380+
style="display: flex; align-items: center; gap: 6px; margin-bottom: 4px;">
1381+
1382+
<div class="served-by-desktop-d-in-tooltip">
1383+
<div class="served-by-desktop-e-in-tooltip">
1384+
<img *ngIf="agent.has_image" src={{agent.img_url}} alt=""
1385+
style="width: 24px !important;height: 24px !important; border-radius: 50%; object-fit: cover;"
1386+
onerror="this.src='assets/img/no_image_user.png'">
1387+
1388+
<div *ngIf="!agent.has_image" class="avatar-when-not-has-image"
1389+
style="width: 24px !important;height: 24px !important;"
1390+
[ngStyle]="{'background-color': agent?.fillColour }">
1391+
{{ agent?.fullname_initial }}
1392+
</div>
1393+
</div>
1394+
</div>
1395+
<span style="white-space: nowrap; font-size: 12px; font-weight: 400; text-transform: capitalize;">
1396+
{{ agent?.firstname }}
1397+
<span *ngIf="agent?.lastname">
1398+
<span *ngIf="agent?.lastname !== ' '"> {{ agent?.lastname | slice:0:1 }}.</span>
1399+
</span>
1400+
</span>
1401+
</div>
1402+
</div>
1403+
</div>
1404+
<i></i>
1405+
</span>
1406+
</span>
1407+
</div>
1408+
13181409
</span>
13191410
</span>
13201411
</td>

src/app/ws_requests/history-and-nort-convs/history-and-nort-convs.component.ts

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -167,6 +167,7 @@ export class HistoryAndNortConvsComponent extends WsSharedComponent implements O
167167

168168
date_picker_is_disabled: boolean;
169169
projectUsersArray: any;
170+
other_project_users_that_has_abandoned_array: Array<any>;
170171
requestWillBePermanentlyDeleted: string;
171172
selectedRequestWillBePermanentDeleted: string;
172173
selectedRequestsWasSuccessfullyDeleted: string;
@@ -1582,6 +1583,123 @@ export class HistoryAndNortConvsComponent extends WsSharedComponent implements O
15821583
request['requester_is_verified'] = false;
15831584
}
15841585

1586+
// ------------------------------------------------------------------------------------------
1587+
// for the tooltip on the icon of unserved conversations showing last users who have left the chat
1588+
// ------------------------------------------------------------------------------------------
1589+
if (request.status === 150 && request.attributes && request.attributes.last_abandoned_by_project_user) {
1590+
1591+
this.logger.log('[HISTORY & NORT-CONVS] - for the tooltip - request.attributes', request.attributes)
1592+
1593+
const project_user_id = request.attributes.last_abandoned_by_project_user;
1594+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED project_user_id', project_user_id)
1595+
1596+
const users_found_in_storage_by_projectuserid = this.usersLocalDbService.getMemberFromStorage(project_user_id);
1597+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED project_users_found_in_storage', users_found_in_storage_by_projectuserid)
1598+
1599+
if (users_found_in_storage_by_projectuserid !== null) {
1600+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED project_users_found_in_storage 1', users_found_in_storage_by_projectuserid)
1601+
this.createArrayLast_abandoned_by_project_user(users_found_in_storage_by_projectuserid, request)
1602+
} else {
1603+
1604+
this.usersService.getProjectUserByProjecUserId(project_user_id)
1605+
.subscribe((projectuser) => {
1606+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED getProjectUserById RES', projectuser)
1607+
1608+
let imgUrl = ''
1609+
if (this.UPLOAD_ENGINE_IS_FIREBASE === true) {
1610+
imgUrl = "https://firebasestorage.googleapis.com/v0/b/" + this.storageBucket + "/o/profiles%2F" + projectuser['id_user']._id + "%2Fphoto.jpg?alt=media"
1611+
} else {
1612+
imgUrl = this.baseUrl + "images?path=uploads%2Fusers%2F" + projectuser['id_user']._id + "%2Fimages%2Fthumbnails_200_200-photo.jpg"
1613+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED has image ', imgUrl)
1614+
}
1615+
this.checkImageExists(imgUrl, (existsImage) => {
1616+
if (existsImage == true) {
1617+
projectuser['id_user'].hasImage = true
1618+
}
1619+
else {
1620+
projectuser['id_user'].hasImage = false
1621+
1622+
this.createAgentAvatar(projectuser['id_user'])
1623+
}
1624+
1625+
this.usersLocalDbService.saveMembersInStorage(projectuser['id_user']._id, projectuser['id_user'], 'history-and-nort-convs');
1626+
this.usersLocalDbService.saveUserInStorageWithProjectUserId(projectuser['_id'], projectuser['id_user']);
1627+
1628+
this.createArrayLast_abandoned_by_project_user(projectuser['id_user'], request);
1629+
})
1630+
}, error => {
1631+
// this.showSpinner = false;
1632+
this.logger.error('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED getProjectUserById - ERROR', error);
1633+
}, () => {
1634+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED getProjectUserById - COMPLETE')
1635+
});
1636+
}
1637+
}
1638+
1639+
// ------------------------------------------------------------------------------------------
1640+
// for the tooltip on the icon of unserved conversations showing users who have left the chat
1641+
// ------------------------------------------------------------------------------------------
1642+
if (request.status === 150 && request.attributes && request.attributes && request.attributes.abandoned_by_project_users) {
1643+
this.other_project_users_that_has_abandoned_array = []
1644+
for (const [key, value] of Object.entries(request.attributes.abandoned_by_project_users)) {
1645+
this.logger.log('[HISTORY & NORT-CONVS] - OTHERS PROJECT-USER THAT HAVE ABANDONED key:value ', `${key}: ${value}`);
1646+
1647+
if (key !== request.attributes.last_abandoned_by_project_user) {
1648+
1649+
const other_project_users_found = this.usersLocalDbService.getMemberFromStorage(key);
1650+
1651+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED other_project_users_found', other_project_users_found)
1652+
if (other_project_users_found !== null) {
1653+
this.logger.log('[HISTORY & NORT-CONVS] - OTHER PROJECT-USER THAT HAS ABANDONED other_project_users_found 1', other_project_users_found)
1654+
this.createArrayOther_project_users_that_has_abandoned(other_project_users_found)
1655+
1656+
} else {
1657+
1658+
this.usersService.getProjectUserByProjecUserId(key)
1659+
.subscribe((projectuser) => {
1660+
this.logger.log('[HISTORY & NORT-CONVS] - OTHER PROJECT-USER THAT HAS ABANDONED getProjectUserById RES', projectuser)
1661+
1662+
let imgUrl = ''
1663+
if (this.UPLOAD_ENGINE_IS_FIREBASE === true) {
1664+
imgUrl = "https://firebasestorage.googleapis.com/v0/b/" + this.storageBucket + "/o/profiles%2F" + projectuser['id_user']._id + "%2Fphoto.jpg?alt=media"
1665+
} else {
1666+
imgUrl = this.baseUrl + "images?path=uploads%2Fusers%2F" + projectuser['id_user']._id + "%2Fimages%2Fthumbnails_200_200-photo.jpg"
1667+
this.logger.log('[HISTORY & NORT-CONVS] - OTHER PROJECT-USER THAT HAS ABANDONED has image ', imgUrl)
1668+
}
1669+
this.checkImageExists(imgUrl, (existsImage) => {
1670+
if (existsImage == true) {
1671+
projectuser['id_user'].hasImage = true
1672+
}
1673+
else {
1674+
projectuser['id_user'].hasImage = false
1675+
1676+
this.createAgentAvatar(projectuser['id_user'])
1677+
}
1678+
1679+
this.usersLocalDbService.saveMembersInStorage(projectuser['id_user']._id, projectuser['id_user'], 'history-and-nort-convs');
1680+
this.usersLocalDbService.saveUserInStorageWithProjectUserId(projectuser['_id'], projectuser['id_user']);
1681+
})
1682+
1683+
}, error => {
1684+
1685+
this.logger.error('[HISTORY & NORT-CONVS] - OTHER PROJECT-USER THAT HAS ABANDONED getProjectUserById - ERROR', error);
1686+
}, () => {
1687+
this.logger.log('[HISTORY & NORT-CONVS] - OTHER PROJECT-USER THAT HAS ABANDONED getProjectUserById - COMPLETE')
1688+
1689+
const _other_project_users_found = this.usersLocalDbService.getMemberFromStorage(key);
1690+
this.logger.log('[HISTORY & NORT-CONVS] - OTHER PROJECT-USER THAT HAS ABANDONED other_project_users_found 2', _other_project_users_found)
1691+
1692+
if (_other_project_users_found) {
1693+
this.createArrayOther_project_users_that_has_abandoned(_other_project_users_found)
1694+
}
1695+
});
1696+
}
1697+
this.logger.log('[HISTORY & NORT-CONVS] - LAST PROJECT-USER THAT HAS ABANDONED other_project_users_that_has_abandoned_array', this.other_project_users_that_has_abandoned_array)
1698+
request['attributes']['other_project_users_that_has_abandoned_array'] = this.other_project_users_that_has_abandoned_array
1699+
}
1700+
}
1701+
}
1702+
15851703
if (request.department) {
15861704
const deptHasName = request.department.hasOwnProperty('name')
15871705
if (deptHasName) {
@@ -3427,4 +3545,50 @@ export class HistoryAndNortConvsComponent extends WsSharedComponent implements O
34273545
})
34283546
}
34293547

3548+
createArrayLast_abandoned_by_project_user(user, request) {
3549+
let imgUrl = ''
3550+
if (this.UPLOAD_ENGINE_IS_FIREBASE === true) {
3551+
imgUrl = "https://firebasestorage.googleapis.com/v0/b/" + this.storageBucket + "/o/profiles%2F" + user['_id'] + "%2Fphoto.jpg?alt=media"
3552+
} else {
3553+
imgUrl = this.baseUrl + "images?path=uploads%2Fusers%2F" + user['_id'] + "%2Fimages%2Fthumbnails_200_200-photo.jpg"
3554+
}
3555+
3556+
const last_abandoned_by_project_user_array = []
3557+
last_abandoned_by_project_user_array.push(
3558+
{
3559+
_id: user['_id'],
3560+
firstname: user['firstname'],
3561+
lastname: user['lastname'],
3562+
has_image: user['hasImage'],
3563+
img_url: imgUrl,
3564+
fillColour: user['fillColour'],
3565+
fullname_initial: user['fullname_initial']
3566+
}
3567+
)
3568+
request['attributes']['last_abandoned_by_project_user_array'] = last_abandoned_by_project_user_array
3569+
}
3570+
3571+
createArrayOther_project_users_that_has_abandoned(other_project_users_found) {
3572+
3573+
this.logger.log('[HISTORY & NORT-CONVS] createArrayOther_project_users_that_has_abandoned other_project_users_found', other_project_users_found)
3574+
let imgUrl = ''
3575+
if (this.UPLOAD_ENGINE_IS_FIREBASE === true) {
3576+
imgUrl = "https://firebasestorage.googleapis.com/v0/b/" + this.storageBucket + "/o/profiles%2F" + other_project_users_found['_id'] + "%2Fphoto.jpg?alt=media"
3577+
} else {
3578+
imgUrl = this.baseUrl + "images?path=uploads%2Fusers%2F" + other_project_users_found['_id'] + "%2Fimages%2Fthumbnails_200_200-photo.jpg"
3579+
}
3580+
3581+
this.other_project_users_that_has_abandoned_array.push(
3582+
{
3583+
_id: other_project_users_found['_id'],
3584+
firstname: other_project_users_found['firstname'],
3585+
lastname: other_project_users_found['lastname'],
3586+
has_image: other_project_users_found['hasImage'],
3587+
img_url: imgUrl,
3588+
fillColour: other_project_users_found['fillColour'],
3589+
fullname_initial: other_project_users_found['fullname_initial']
3590+
}
3591+
)
3592+
}
3593+
34303594
}

0 commit comments

Comments
 (0)