Fix userconfig

package.json

@@ -100,7 +100,7 @@
     "glob": "7.1.2",
     "image-type": "^4.1.0",
     "ip2country": "1.0.1",
-    "libsession_util_nodejs": "https://github.com/oxen-io/libsession-util-nodejs/releases/download/v0.1.17/libsession_util_nodejs-v0.1.17.tar.gz",
+    "libsession_util_nodejs": "https://github.com/oxen-io/libsession-util-nodejs/releases/download/v0.1.18/libsession_util_nodejs-v0.1.18.tar.gz",
     "libsodium-wrappers-sumo": "^0.7.9",
     "linkify-it": "3.0.2",
     "lodash": "^4.17.21",

ts/components/avatar/Avatar.tsx

@@ -1,19 +1,18 @@
-import React, { useState } from 'react';
 import classNames from 'classnames';
+import React, { useState } from 'react';
+import { useSelector } from 'react-redux';
+import styled from 'styled-components';
+import { useDisableDrag } from '../../hooks/useDisableDrag';
 import { useEncryptedFileFetch } from '../../hooks/useEncryptedFileFetch';
-import { isEqual } from 'lodash';
 import {
   useAvatarPath,
   useConversationUsername,
   useIsClosedGroup,
 } from '../../hooks/useParamSelector';
+import { isMessageSelectionMode } from '../../state/selectors/conversations';
+import { SessionIcon } from '../icon';
 import { AvatarPlaceHolder } from './AvatarPlaceHolder/AvatarPlaceHolder';
 import { ClosedGroupAvatar } from './AvatarPlaceHolder/ClosedGroupAvatar';
-import { useDisableDrag } from '../../hooks/useDisableDrag';
-import styled from 'styled-components';
-import { SessionIcon } from '../icon';
-import { useSelector } from 'react-redux';
-import { isMessageSelectionMode } from '../../state/selectors/conversations';
 
 export enum AvatarSize {
   XS = 28,
@@ -90,7 +89,7 @@ const AvatarImage = (props: {
   datatestId?: string;
   handleImageError: () => any;
 }) => {
-  const { avatarPath, base64Data, name, imageBroken, datatestId, handleImageError } = props;
+  const { avatarPath, base64Data, imageBroken, datatestId, handleImageError } = props;
 
   const disableDrag = useDisableDrag();
 
@@ -99,11 +98,11 @@ const AvatarImage = (props: {
   }
   const dataToDisplay = base64Data ? `data:image/jpeg;base64,${base64Data}` : avatarPath;
 
+  // tslint:disable: react-a11y-img-has-alt
   return (
     <img
       onError={handleImageError}
       onDragStart={disableDrag}
-      alt={window.i18n('contactAvatarAlt', [name || 'avatar'])}
       src={dataToDisplay}
       data-testid={datatestId}
     />
@@ -173,4 +172,4 @@ const AvatarInner = (props: Props) => {
   );
 };
 
-export const Avatar = React.memo(AvatarInner, isEqual);
+export const Avatar = AvatarInner;

ts/components/conversation/message/message-content/MessageAuthorText.tsx

@@ -1,21 +1,20 @@
 import React from 'react';
-import { useSelector } from 'react-redux';
 import styled from 'styled-components';
-import { MessageRenderingProps } from '../../../../models/messageType';
 import { PubKey } from '../../../../session/types';
-import { getMessageAuthorProps } from '../../../../state/selectors/conversations';
+import {
+  useAuthorName,
+  useAuthorProfileName,
+  useFirstMessageOfSeries,
+  useMessageAuthor,
+  useMessageDirection,
+} from '../../../../state/selectors';
 import {
   useSelectedIsGroup,
   useSelectedIsPublic,
 } from '../../../../state/selectors/selectedConversation';
 import { Flex } from '../../../basic/Flex';
 import { ContactName } from '../../ContactName';
 
-export type MessageAuthorSelectorProps = Pick<
-  MessageRenderingProps,
-  'authorName' | 'authorProfileName' | 'sender' | 'direction' | 'firstMessageOfSeries'
->;
-
 type Props = {
   messageId: string;
 };
@@ -25,15 +24,17 @@ const StyledAuthorContainer = styled(Flex)`
 `;
 
 export const MessageAuthorText = (props: Props) => {
-  const selected = useSelector(state => getMessageAuthorProps(state as any, props.messageId));
-
   const isPublic = useSelectedIsPublic();
   const isGroup = useSelectedIsGroup();
+  const authorProfileName = useAuthorProfileName(props.messageId);
+  const authorName = useAuthorName(props.messageId);
+  const sender = useMessageAuthor(props.messageId);
+  const direction = useMessageDirection(props.messageId);
+  const firstMessageOfSeries = useFirstMessageOfSeries(props.messageId);
 
-  if (!selected) {
+  if (!props.messageId || !sender || !direction) {
     return null;
   }
-  const { authorName, sender, authorProfileName, direction, firstMessageOfSeries } = selected;
 
   const title = authorName ? authorName : sender;
 

ts/components/conversation/message/message-content/MessageAvatar.tsx

@@ -9,10 +9,18 @@ import { getSodiumRenderer } from '../../../../session/crypto';
 import { PubKey } from '../../../../session/types';
 import { openConversationWithMessages } from '../../../../state/ducks/conversations';
 import { updateUserDetailsModal } from '../../../../state/ducks/modalDialog';
-import { getMessageAvatarProps } from '../../../../state/selectors/conversations';
+import {
+  useAuthorAvatarPath,
+  useAuthorName,
+  useAuthorProfileName,
+  useLastMessageOfSeries,
+  useMessageAuthor,
+  useMessageSenderIsAdmin,
+} from '../../../../state/selectors/';
 import {
   getSelectedCanWrite,
   useSelectedConversationKey,
+  useSelectedIsPublic,
 } from '../../../../state/selectors/selectedConversation';
 import { Avatar, AvatarSize, CrownIcon } from '../../../avatar/Avatar';
 // tslint:disable: use-simple-attributes
@@ -26,13 +34,7 @@ const StyledAvatar = styled.div`
 
 export type MessageAvatarSelectorProps = Pick<
   MessageRenderingProps,
-  | 'authorAvatarPath'
-  | 'authorName'
-  | 'sender'
-  | 'authorProfileName'
-  | 'isSenderAdmin'
-  | 'isPublic'
-  | 'lastMessageOfSeries'
+  'sender' | 'isSenderAdmin' | 'lastMessageOfSeries'
 >;
 
 type Props = { messageId: string; noAvatar: boolean };
@@ -41,26 +43,18 @@ export const MessageAvatar = (props: Props) => {
   const { messageId, noAvatar } = props;
 
   const dispatch = useDispatch();
-  const avatarProps = useSelector(state => getMessageAvatarProps(state as any, messageId));
   const selectedConvoKey = useSelectedConversationKey();
 
   const isTypingEnabled = useSelector(getSelectedCanWrite);
-
-  if (!avatarProps) {
-    return null;
-  }
-
-  const {
-    authorAvatarPath,
-    authorName,
-    sender,
-    authorProfileName,
-    isSenderAdmin,
-    lastMessageOfSeries,
-    isPublic,
-  } = avatarProps;
-
-  if (noAvatar) {
+  const isPublic = useSelectedIsPublic();
+  const authorName = useAuthorName(messageId);
+  const authorProfileName = useAuthorProfileName(messageId);
+  const authorAvatarPath = useAuthorAvatarPath(messageId);
+  const sender = useMessageAuthor(messageId);
+  const lastMessageOfSeries = useLastMessageOfSeries(messageId);
+  const isSenderAdmin = useMessageSenderIsAdmin(messageId);
+
+  if (noAvatar || !sender) {
     return null;
   }
 

ts/components/conversation/message/message-content/MessageContent.tsx

@@ -10,8 +10,8 @@ import {
   getMessageContentSelectorProps,
   getQuotedMessageToAnimate,
   getShouldHighlightMessage,
-  useMessageIsDeleted,
 } from '../../../../state/selectors/conversations';
+import { useMessageIsDeleted } from '../../../../state/selectors';
 import { ScrollToLoadedMessageContext } from '../../SessionMessagesListContainer';
 import { MessageAttachment } from './MessageAttachment';
 import { MessageLinkPreview } from './MessageLinkPreview';

ts/components/conversation/message/message-content/MessageContextMenu.tsx

@@ -24,6 +24,13 @@ import {
 } from '../../../../state/ducks/conversations';
 import { StateType } from '../../../../state/reducer';
 import { getMessageContextMenuProps } from '../../../../state/selectors/conversations';
+import {
+  useSelectedConversationKey,
+  useSelectedIsBlocked,
+  useSelectedIsPublic,
+  useSelectedWeAreAdmin,
+  useSelectedWeAreModerator,
+} from '../../../../state/selectors/selectedConversation';
 import { saveAttachmentToDisk } from '../../../../util/attachmentsUtil';
 import { Reactions } from '../../../../util/reactions';
 import { SessionContextMenuContainer } from '../../../SessionContextMenuContainer';
@@ -34,18 +41,13 @@ export type MessageContextMenuSelectorProps = Pick<
   MessageRenderingProps,
   | 'attachments'
   | 'sender'
-  | 'convoId'
   | 'direction'
   | 'status'
   | 'isDeletable'
-  | 'isPublic'
-  | 'isOpenGroupV2'
-  | 'weAreAdmin'
   | 'isSenderAdmin'
   | 'text'
   | 'serverTimestamp'
   | 'timestamp'
-  | 'isBlocked'
   | 'isDeletableForEveryone'
 >;
 
@@ -80,27 +82,31 @@ export const MessageContextMenu = (props: Props) => {
   const dispatch = useDispatch();
   const { hideAll } = useContextMenu();
 
+  const isSelectedBlocked = useSelectedIsBlocked();
+  const convoId = useSelectedConversationKey();
+  const isPublic = useSelectedIsPublic();
+  const weAreModerator = useSelectedWeAreModerator();
+  const weAreAdmin = useSelectedWeAreAdmin();
+
+  const showAdminActions = weAreAdmin || weAreModerator;
+
   const selected = useSelector((state: StateType) => getMessageContextMenuProps(state, messageId));
 
-  if (!selected) {
+  if (!selected || !convoId) {
     return null;
   }
 
   const {
     attachments,
     sender,
-    convoId,
     direction,
     status,
     isDeletable,
     isDeletableForEveryone,
-    isPublic,
-    weAreAdmin,
     isSenderAdmin,
     text,
     serverTimestamp,
     timestamp,
-    isBlocked,
   } = selected;
 
   const isOutgoing = direction === 'outgoing';
@@ -157,12 +163,12 @@ export const MessageContextMenu = (props: Props) => {
   }, [sender, convoId]);
 
   const onReply = useCallback(() => {
-    if (isBlocked) {
+    if (isSelectedBlocked) {
       pushUnblockToSend();
       return;
     }
     void replyToMessage(messageId);
-  }, [isBlocked, messageId]);
+  }, [isSelectedBlocked, messageId]);
 
   const saveAttachment = useCallback(
     (e: any) => {
@@ -330,14 +336,12 @@ export const MessageContextMenu = (props: Props) => {
               <Item onClick={onDeleteForEveryone}>{unsendMessageText}</Item>
             </>
           ) : null}
-          {weAreAdmin && isPublic ? <Item onClick={onBan}>{window.i18n('banUser')}</Item> : null}
-          {weAreAdmin && isPublic ? (
-            <Item onClick={onUnban}>{window.i18n('unbanUser')}</Item>
-          ) : null}
-          {weAreAdmin && isPublic && !isSenderAdmin ? (
+          {showAdminActions ? <Item onClick={onBan}>{window.i18n('banUser')}</Item> : null}
+          {showAdminActions ? <Item onClick={onUnban}>{window.i18n('unbanUser')}</Item> : null}
+          {showAdminActions && !isSenderAdmin ? (
             <Item onClick={addModerator}>{window.i18n('addAsModerator')}</Item>
           ) : null}
-          {weAreAdmin && isPublic && isSenderAdmin ? (
+          {showAdminActions && isSenderAdmin ? (
             <Item onClick={removeModerator}>{window.i18n('removeFromModerators')}</Item>
           ) : null}
         </Menu>

ts/components/conversation/message/message-content/MessageLinkPreview.tsx

@@ -4,12 +4,14 @@ import { isImageAttachment } from '../../../../types/Attachment';
 import { Image } from '../../Image';
 import { MessageRenderingProps } from '../../../../models/messageType';
 import { useDispatch, useSelector } from 'react-redux';
-import {
-  getIsMessageSelectionMode,
-  getMessageLinkPreviewProps,
-} from '../../../../state/selectors/conversations';
+import { getIsMessageSelectionMode } from '../../../../state/selectors/conversations';
 import { SessionIcon } from '../../../icon';
 import { showLinkVisitWarningDialog } from '../../../dialog/SessionConfirm';
+import {
+  useMessageAttachments,
+  useMessageDirection,
+  useMessageLinkPreview,
+} from '../../../../state/selectors';
 
 export type MessageLinkPreviewSelectorProps = Pick<
   MessageRenderingProps,
@@ -24,14 +26,15 @@ type Props = {
 const linkPreviewsImageSize = 100;
 
 export const MessageLinkPreview = (props: Props) => {
-  const selected = useSelector(state => getMessageLinkPreviewProps(state as any, props.messageId));
   const dispatch = useDispatch();
+  const direction = useMessageDirection(props.messageId);
+  const attachments = useMessageAttachments(props.messageId);
+  const previews = useMessageLinkPreview(props.messageId);
   const isMessageSelectionMode = useSelector(getIsMessageSelectionMode);
 
-  if (!selected) {
+  if (!props.messageId) {
     return null;
   }
-  const { direction, attachments, previews } = selected;
 
   // Attachments take precedence over Link Previews
   if (attachments && attachments.length) {

ts/components/conversation/message/message-content/MessageQuote.tsx

@@ -5,14 +5,14 @@ import { MessageRenderingProps } from '../../../../models/messageType';
 import { PubKey } from '../../../../session/types';
 import { openConversationToSpecificMessage } from '../../../../state/ducks/conversations';
 import {
-  getMessageQuoteProps,
   isMessageDetailView,
   isMessageSelectionMode,
 } from '../../../../state/selectors/conversations';
 import { Quote } from './Quote';
 import { ToastUtils } from '../../../../session/utils';
 import { Data } from '../../../../data/data';
 import { MessageModel } from '../../../../models/message';
+import { useMessageDirection, useMessageQuote } from '../../../../state/selectors';
 
 // tslint:disable: use-simple-attributes
 
@@ -23,13 +23,11 @@ type Props = {
 export type MessageQuoteSelectorProps = Pick<MessageRenderingProps, 'quote' | 'direction'>;
 
 export const MessageQuote = (props: Props) => {
-  const selected = useSelector(state => getMessageQuoteProps(state as any, props.messageId));
+  const quote = useMessageQuote(props.messageId);
+  const direction = useMessageDirection(props.messageId);
   const multiSelectMode = useSelector(isMessageSelectionMode);
   const isMessageDetailViewMode = useSelector(isMessageDetailView);
 
-  const quote = selected ? selected.quote : undefined;
-  const direction = selected ? selected.direction : undefined;
-
   const onQuoteClick = useCallback(
     async (event: React.MouseEvent<HTMLDivElement>) => {
       event.preventDefault();
@@ -76,7 +74,7 @@ export const MessageQuote = (props: Props) => {
     },
     [quote, multiSelectMode, props.messageId]
   );
-  if (!selected) {
+  if (!props.messageId) {
     return null;
   }