Deleting a user should show name

.gitignore

@@ -8,6 +8,7 @@ config.json
 
 # ide
 .idea
+.vs
 
 # log
 yarn-error.log

CONTRIBUTORS.md

@@ -80,6 +80,7 @@
 - [Rasmus Krämer](https://github.com/rasmuslos)
 - [ntarelix](https://github.com/ntarelix)
 - [András Maróy](https://github.com/andrasmaroy)
+- [Chris-Codes-It](https://github.com/Chris-Codes-It)
 
 ## Emby Contributors
 

src/apps/dashboard/routes/users/index.tsx

@@ -49,6 +49,7 @@ const UserProfiles: FunctionComponent = () => {
         const showUserMenu = (elem: HTMLElement) => {
             const card = dom.parentWithClass(elem, 'card');
             const userId = card?.getAttribute('data-userid');
+            const username = card?.getAttribute('data-username');
 
             if (!userId) {
                 console.error('Unexpected null user id');
@@ -106,7 +107,7 @@ const UserProfiles: FunctionComponent = () => {
                                 break;
 
                             case 'delete':
-                                deleteUser(userId);
+                                deleteUser(userId, username);
                         }
                     }
                 }).catch(() => {
@@ -117,12 +118,13 @@ const UserProfiles: FunctionComponent = () => {
             });
         };
 
-        const deleteUser = (id: string) => {
-            const msg = globalize.translate('DeleteUserConfirmation');
+        const deleteUser = (id: string, username?: string | null) => {
+            const title = username ? globalize.translate('DeleteName', username) : globalize.translate('DeleteUser');
+            const text = globalize.translate('DeleteUserConfirmation');
 
             confirm({
-                title: globalize.translate('DeleteUser'),
-                text: msg,
+                title,
+                text,
                 confirmText: globalize.translate('Delete'),
                 primary: 'delete'
             }).then(function () {

src/components/dashboard/users/UserCardBox.tsx

@@ -61,7 +61,7 @@ const UserCardBox: FunctionComponent<IProps> = ({ user = {} }: IProps) => {
         </div>`;
 
     return (
-        <div data-userid={user.Id} className={cssClass}>
+        <div data-userid={user.Id} data-username={user.Name} className={cssClass}>
             <div className='cardBox visualCardBox'>
                 <div className='cardScalable visualCardBox-cardScalable'>
                     <div className='cardPadder cardPadder-square'></div>

src/strings/en-us.json

@@ -187,6 +187,7 @@
     "DeleteImage": "Delete Image",
     "DeleteImageConfirmation": "Are you sure you wish to delete this image?",
     "DeleteMedia": "Delete media",
+    "DeleteName": "Delete {0}",
     "DeleteUser": "Delete User",
     "DeleteUserConfirmation": "Are you sure you wish to delete this user?",
     "Depressed": "Depressed",