better graphical approach to removing list of sessions in profile page

Noovolari · Feb 22, 2021 · ea5304c · ea5304c
1 parent a17f52d
commit ea5304c
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/src/app/shared/profile-page/profile-page.component.ts b/src/app/shared/profile-page/profile-page.component.ts
@@ -180,13 +180,15 @@ export class ProfilePageComponent extends AntiMemLeak implements OnInit {
     });
 
     // Get only names for display
-    let sessionsNames = sessions.map(s => s.account.accountName);
+    let sessionsNames = sessions.map(s => {
+      return `<li><div class="removed-sessions"><b>${s.account.accountName}</b> - <small>${(s.account as AwsAccount).role.name}</small></div></li>`;
+    });
     if (sessionsNames.length === 0) {
-      sessionsNames = ['no sessions'];
+      sessionsNames = ['<li><b>no sessions</b></li>'];
     }
 
     // Ask for deletion
-    this.appService.confirmDialog(`Deleting this Idp url will also remove these sessions: <br><p class="text-left text-info">- ${sessionsNames.join('<br>- ')}</p>Do you want to proceed?`, (res) => {
+    this.appService.confirmDialog(`Deleting this Idp url will also remove these sessions: <br><ul>${sessionsNames.join('')}</ul>Do you want to proceed?`, (res) => {
       if (res !== constants.CONFIRM_CLOSED) {
         this.appService.logger(`Removing idp url with id: ${id}`, LoggerLevel.INFO, this);
         const idpUrl = this.workspaceData.idpUrl.findIndex(u => u.id === id);

diff --git a/src/assets/scss/global.scss b/src/assets/scss/global.scss
@@ -227,3 +227,9 @@ body.moved .mask { display: block; opacity: 0; position: fixed; z-index: 1000; l
     }
   }
 }
+
+ul li div.removed-sessions {
+  text-align: left!important;
+  overflow-x: hidden!important;
+  text-overflow: ellipsis!important;
+}