From 51a90de01eea5ba3004732f66daff651075e49ee Mon Sep 17 00:00:00 2001
From: 1aerostorm <aerostorm1@gmail.com>
Date: Fri, 6 Sep 2024 01:16:57 +0300
Subject: [PATCH] HF 30 - Private groups - Avatars

---
 .../elements/messages/Compose/index.jsx       | 14 ++++++++-----
 .../elements/messages/Message/Message.css     |  5 +++++
 .../elements/messages/Message/index.jsx       | 14 ++++++++++++-
 src/components/pages/Messages.jsx             | 20 +++++++++++++++++--
 src/utils/Normalizators.js                    |  2 +-
 5 files changed, 46 insertions(+), 9 deletions(-)

diff --git a/src/components/elements/messages/Compose/index.jsx b/src/components/elements/messages/Compose/index.jsx
index 127ee32a1..d7b20c909 100644
--- a/src/components/elements/messages/Compose/index.jsx
+++ b/src/components/elements/messages/Compose/index.jsx
@@ -211,11 +211,15 @@ export default class Compose extends React.Component {
 
         const selectedMessages = Object.entries(this.props.selectedMessages);
         let selectedMessagesCount = 0;
-        let selectedEditablesCount = 0;
+        let selectedEditables = 0
+        let selectedDeletables = 0
         for (let [nonce, info] of selectedMessages) {
             selectedMessagesCount++;
             if (info.editable) {
-                selectedEditablesCount++;
+                selectedEditables++;
+            }
+            if (info.deletable) {
+                selectedDeletables++
             }
         }
 
@@ -271,11 +275,11 @@ export default class Compose extends React.Component {
                         <Icon name='cross' />
                         <span>{tt('g.cancel')}</span>
                     </button>
-                    <button className='button hollow small alert delete-button' onClick={onPanelDeleteClick}>
+                    {selectedDeletables === selectedMessagesCount ? <button className='button hollow small alert delete-button' onClick={onPanelDeleteClick}>
                         <Icon name='ionicons/trash-outline' />
                         <span>{tt('g.delete') + ' (' + selectedMessagesCount + ')'}</span>
-                    </button>
-                    {(selectedMessagesCount === 1 && selectedEditablesCount === 1) ? (<button className='button hollow small edit-button' onClick={onPanelEditClick}>
+                    </button> : null}
+                    {(selectedMessagesCount === 1 && selectedEditables === 1) ? (<button className='button hollow small edit-button' onClick={onPanelEditClick}>
                         <Icon name='pencil' />
                         <span>{tt('g.edit')}</span>
                     </button>) : null}
diff --git a/src/components/elements/messages/Message/Message.css b/src/components/elements/messages/Message/Message.css
index 1b59c724e..97828d2be 100644
--- a/src/components/elements/messages/Message/Message.css
+++ b/src/components/elements/messages/Message/Message.css
@@ -20,6 +20,11 @@
     display: flex;
 }
 
+.msgs-message .bubble-container .avatar {
+    width: 42px;
+    margin-top: 14px;
+}
+
 .msgs-message .bubble-container a {
     color: #007aff;
     text-decoration: underline;
diff --git a/src/components/elements/messages/Message/index.jsx b/src/components/elements/messages/Message/index.jsx
index 3f73964d9..b54dea9f2 100644
--- a/src/components/elements/messages/Message/index.jsx
+++ b/src/components/elements/messages/Message/index.jsx
@@ -3,6 +3,7 @@ import tt from 'counterpart';
 import { Asset } from 'golos-lib-js/lib/utils'
 
 import Donating from 'app/components/elements/messages/Donating'
+import Userpic from 'app/components/elements/Userpic'
 import { displayQuoteMsg } from 'app/utils/MessageUtils';
 import { proxifyImageUrl } from 'app/utils/ProxifyUrl';
 import './Message.css';
@@ -36,7 +37,7 @@ export default class Message extends React.Component {
 
         const unread = data.unread ? (<div className={'unread' + loading}>●</div>) : null;
 
-        const { message } = data;
+        const { message, group, from} = data;
 
         let content;
         if (message.type === 'image') {
@@ -100,6 +101,16 @@ export default class Message extends React.Component {
             adds.unshift(unread)
         }
 
+        let avatar
+        if (!isMine && group) {
+            if (startsSequence) {
+                avatar = <Userpic account={from} title={'@' + from} width={32} height={32} />
+            }
+            avatar = <div className='avatar'>
+                {avatar} 
+            </div>
+        }
+
         return (
             <div className={[
                 'msgs-message',
@@ -115,6 +126,7 @@ export default class Message extends React.Component {
                 }
 
                 <div className={'bubble-container' + (selected ? ' selected' : '')}>
+                    {avatar}
                     {isMine ? adds : null}
                     <div className={'bubble' + loading} onClick={(event) => this.onMessageSelect(idx, event)} title={friendlyDate + (modified ? tt('g.modified') : '')}>
                         { quoteHeader }
diff --git a/src/components/pages/Messages.jsx b/src/components/pages/Messages.jsx
index fba08ba0f..feaf8ed47 100644
--- a/src/components/pages/Messages.jsx
+++ b/src/components/pages/Messages.jsx
@@ -27,6 +27,7 @@ import MessagesTopCenter from 'app/components/modules/MessagesTopCenter'
 import g from 'app/redux/GlobalReducer'
 import transaction from 'app/redux/TransactionReducer'
 import user from 'app/redux/UserReducer'
+import { getRoleInGroup } from 'app/utils/groups'
 import { getProfileImage, } from 'app/utils/NormalizeProfile';
 import { normalizeContacts, normalizeMessages } from 'app/utils/Normalizators';
 import { fitToPreview } from 'app/utils/ImageUtils';
@@ -447,7 +448,20 @@ class Messages extends React.Component {
             let selectedMessages = {...this.state.selectedMessages};
 
             let selectMessage = (msg, idx) => {
-                const isMine = account.name === msg.from;
+                const isMine = account.name === msg.from
+                let canIEdit = isMine
+                let canIDelete = true
+                if (this.isGroup()) {
+                    const { the_group } = this.props
+                    const { amModer, amMember, amBanned } = getRoleInGroup(the_group, account.name)
+                    if (amModer) {
+                        canIEdit = true
+                    } else if (amBanned || (the_group.privacy !== 'public_group' && !amModer && !amMember)) {
+                        canIEdit = false
+                    }
+                    canIDelete = canIEdit
+                }
+
                 let isImage = false;
                 let isInvalid = true;
                 const { message } = msg;
@@ -456,7 +470,9 @@ class Messages extends React.Component {
                     isInvalid = !!message.invalid;
                 }
                 selectedMessages[msg.nonce] = {
-                    editable: isMine && !isImage && !isInvalid, idx };
+                    editable: canIEdit && !isImage && !isInvalid,
+                    deletable: canIDelete,
+                    idx };
             };
 
             if (event.shiftKey) {
diff --git a/src/utils/Normalizators.js b/src/utils/Normalizators.js
index 7b3694de5..9d6ff1402 100644
--- a/src/utils/Normalizators.js
+++ b/src/utils/Normalizators.js
@@ -182,7 +182,7 @@ export async function normalizeMessages(messages, accounts, currentUser, to) {
                         }
                     }
                 }
-                msg.decrypt_date = null
+                //msg.decrypt_date = null
 
                 if (loadFromCache(msg)) {
                     results.push(msg)