feat: quotes will show the authors name where possible

cleaned up extra author props on quote and created a hook instead

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

@@ -82,7 +82,6 @@ export const MessageQuote = (props: Props) => {
       attachment={quote?.attachment}
       isIncoming={direction === 'incoming'}
       author={quote.author}
-      authorName={quote?.authorName}
       referencedMessageNotFound={quoteNotFound}
       isFromMe={Boolean(quote.isFromMe)}
     />

ts/components/conversation/message/message-content/quote/Quote.tsx

@@ -2,9 +2,6 @@ import React, { MouseEvent, useState } from 'react';
 
 import * as MIME from '../../../../../types/MIME';
 
-import { useSelector } from 'react-redux';
-
-import { isPublicGroupConversation } from '../../../../../state/selectors/conversations';
 import { QuoteAuthor } from './QuoteAuthor';
 import { QuoteText } from './QuoteText';
 import { QuoteIconContainer } from './QuoteIconContainer';
@@ -49,12 +46,11 @@ const StyledQuoteTextContent = styled.div`
 export type QuoteProps = {
   attachment?: QuotedAttachmentType;
   author: string;
-  authorProfileName?: string;
-  authorName?: string;
   isFromMe: boolean;
   isIncoming: boolean;
-  text: string | null;
   referencedMessageNotFound: boolean;
+  text: string | null;
+
   onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
 };
 
@@ -73,8 +69,6 @@ export interface QuotedAttachmentType {
 }
 
 export const Quote = (props: QuoteProps) => {
-  const isPublic = useSelector(isPublicGroupConversation);
-
   const { isIncoming, attachment, text, referencedMessageNotFound, onClick } = props;
 
   const [imageBroken, setImageBroken] = useState(false);
@@ -96,13 +90,7 @@ export const Quote = (props: QuoteProps) => {
           referencedMessageNotFound={referencedMessageNotFound}
         />
         <StyledQuoteTextContent>
-          <QuoteAuthor
+          <QuoteAuthor author={props.author} isIncoming={isIncoming} />
-            author={props.author}
-            authorName={props.authorName}
-            isFromMe={props.isFromMe}
-            isIncoming={isIncoming}
-            showPubkeyForAuthor={isPublic}
-          />
           <QuoteText
             isIncoming={isIncoming}
             text={text}

ts/components/conversation/message/message-content/quote/QuoteAuthor.tsx

@@ -3,6 +3,9 @@ import { ContactName } from '../../../ContactName';
 import { PubKey } from '../../../../../session/types';
 import styled from 'styled-components';
 import { QuoteProps } from './Quote';
+import { useQuoteAuthorName } from '../../../../../hooks/useParamSelector';
+import { useSelector } from 'react-redux';
+import { isPublicGroupConversation } from '../../../../../state/selectors/conversations';
 
 const StyledQuoteAuthor = styled.div<{ isIncoming: boolean }>`
   color: ${props =>
@@ -21,30 +24,26 @@ const StyledQuoteAuthor = styled.div<{ isIncoming: boolean }>`
   }
 `;
 
-type QuoteAuthorProps = Pick<QuoteProps, 'author' | 'authorName' | 'isFromMe' | 'isIncoming'> & {
+type QuoteAuthorProps = Pick<QuoteProps, 'author' | 'isIncoming'>;
-  showPubkeyForAuthor: boolean;
-};
 
 export const QuoteAuthor = (props: QuoteAuthorProps) => {
-  const { author, authorName, isFromMe, isIncoming, showPubkeyForAuthor } = props;
+  const { author, isIncoming } = props;
-  debugger;
+
+  const isPublic = useSelector(isPublicGroupConversation);
+  const authorName = useQuoteAuthorName(author);
 
-  if (author === '' || authorName === '') {
+  if (!author || author === '' || !authorName) {
     return null;
   }
 
   return (
     <StyledQuoteAuthor isIncoming={isIncoming}>
-      {isFromMe ? (
+      <ContactName
-        window.i18n('you')
+        pubkey={PubKey.shorten(author)}
-      ) : (
+        name={authorName}
-        <ContactName
+        compact={true}
-          pubkey={PubKey.shorten(author)}
+        shouldShowPubkey={Boolean(authorName && isPublic)}
-          name={authorName}
+      />
-          compact={true}
-          shouldShowPubkey={showPubkeyForAuthor}
-        />
-      )}
     </StyledQuoteAuthor>
   );
 };

ts/hooks/useParamSelector.ts

@@ -37,7 +37,7 @@ export function useConversationUsernameOrShorten(convoId?: string) {
 }
 
 /**
- * Returns the name if that conversation.
+ * Returns the name of that conversation.
  * This is the group name, or the realName of a user for a private conversation with a recent nickname set
  */
 export function useConversationRealName(convoId?: string) {
@@ -183,3 +183,12 @@ export function useMessageReactsPropsById(messageId?: string) {
     return messageReactsProps;
   });
 }
+
+export function useQuoteAuthorName(authorId?: string) {
+  const convoProps = useConversationPropsById(authorId);
+  return authorId === UserUtils.getOurPubKeyStrFromCache()
+    ? window.i18n('you')
+    : convoProps?.nickname || convoProps?.isPrivate
+    ? convoProps?.displayNameInProfile
+    : undefined;
+}

ts/state/ducks/conversations.ts

@@ -165,14 +165,13 @@ export type PropsForAttachment = {
 };
 
 export type PropsForQuote = {
-  text?: string;
   attachment?: QuotedAttachmentType;
-  isFromMe?: boolean;
   author: string;
-  authorName?: string;
+  convoId?: string;
   id?: string; // this is the quoted message timestamp
+  isFromMe?: boolean;
   referencedMessageNotFound?: boolean;
-  convoId?: string;
+  text?: string;
 };
 
 export type PropsForMessageWithoutConvoProps = {

ts/state/selectors/conversations.ts

@@ -997,33 +997,39 @@ export const getMessageQuoteProps = createSelector(
       return undefined;
     }
 
-    const { id, author, authorName: _authorName } = msgProps.quote;
+    const { id, author } = msgProps.quote;
     if (!id || !author) {
       return undefined;
     }
 
+    let isFromMe = UserUtils.isUsFromCache(author) || false;
+
+    const quoteNotFound = {
+      direction,
+      quote: { author, isFromMe, referencedMessageNotFound: true },
+    };
+
     // NOTE: if the message is not found, we still want to render the quote
     if (!quotesProps || isEmpty(quotesProps)) {
-      return { direction, quote: { author, referencedMessageNotFound: true } };
+      return quoteNotFound;
     }
 
     const sourceMessage = quotesProps[`${id}-${author}`];
     if (!sourceMessage) {
-      return { direction, quote: { author, referencedMessageNotFound: true } };
+      return quoteNotFound;
     }
 
     const sourceMsgProps = sourceMessage.propsForMessage;
     if (!sourceMsgProps || sourceMsgProps.isDeleted) {
-      return { direction, quote: { author, referencedMessageNotFound: true } };
+      return quoteNotFound;
     }
 
     const convo = getConversationController().get(sourceMsgProps.convoId);
     if (!convo) {
-      return { direction, quote: { author, referencedMessageNotFound: true } };
+      return quoteNotFound;
     }
 
     const attachment = sourceMsgProps.attachments && sourceMsgProps.attachments[0];
-    let isFromMe = convo ? UserUtils.isUsFromCache(author) : false;
 
     if (convo.isPublic() && PubKey.hasBlindedPrefix(sourceMsgProps.sender)) {
       const room = OpenGroupData.getV2OpenGroupRoom(sourceMsgProps.convoId);
@@ -1038,16 +1044,11 @@ export const getMessageQuoteProps = createSelector(
       }
     }
 
-    const authorName = isFromMe
-      ? window.i18n('you')
-      : convo.getNicknameOrRealUsernameOrPlaceholder();
-
     const quote: PropsForQuote = {
       text: sourceMsgProps.text,
       attachment: attachment ? processQuoteAttachment(attachment) : undefined,
       isFromMe,
       author: sourceMsgProps.sender,
-      authorName,
       id: sourceMsgProps.id,
       referencedMessageNotFound: false,
       convoId: convo.id,