From c44de0030cf90398e2857312f8f50c457ac23141 Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Mon, 15 Mar 2021 18:59:42 -0500
Subject: [PATCH] Display user favicon in deletion modal

---
 app/soapbox/actions/moderation.js | 11 ++++++++++-
 app/styles/components/modal.scss  | 17 +++++++++++++++++
 2 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/app/soapbox/actions/moderation.js b/app/soapbox/actions/moderation.js
index 2aa8896be..d2489658f 100644
--- a/app/soapbox/actions/moderation.js
+++ b/app/soapbox/actions/moderation.js
@@ -48,15 +48,24 @@ export function deleteUserModal(intl, accountId, afterConfirm = () => {}) {
     const state = getState();
     const acct = state.getIn(['accounts', accountId, 'acct']);
     const name = state.getIn(['accounts', accountId, 'username']);
+    const favicon = state.getIn(['accounts', accountId, 'pleroma', 'favicon']);
 
     const message = (<>
       <AccountContainer id={accountId} />
       {intl.formatMessage(messages.deleteUserPrompt, { acct })}
     </>);
 
+    const confirm = (<>
+      {favicon &&
+        <div className='submit__favicon'>
+          <img src={favicon} alt='' />
+        </div>}
+      {intl.formatMessage(messages.deleteUserConfirm, { name })}
+    </>);
+
     dispatch(openModal('CONFIRM', {
       message,
-      confirm: intl.formatMessage(messages.deleteUserConfirm, { name }),
+      confirm,
       onConfirm: () => {
         dispatch(deleteUsers([acct])).then(() => {
           const message = intl.formatMessage(messages.userDeleted, { acct });
diff --git a/app/styles/components/modal.scss b/app/styles/components/modal.scss
index 37c1bcf6e..4327ac152 100644
--- a/app/styles/components/modal.scss
+++ b/app/styles/components/modal.scss
@@ -393,6 +393,23 @@
 
   .button {
     flex: 0 0 auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .submit__favicon {
+      width: 16px;
+      height: 16px;
+      margin-right: 8px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      img {
+        width: 100%;
+        max-height: 100%;
+      }
+    }
   }
 }