From 3b17e08ea6a0194b25385210189d1c6d4fc35e7f Mon Sep 17 00:00:00 2001
From: William Grant <willmgrant@gmail.com>
Date: Fri, 14 Jun 2024 16:59:38 +1000
Subject: [PATCH] fix: more review feedback part 2

---
 package.json                                     |  1 +
 ts/components/buttons/CopyToClipboardButton.tsx  |  2 ++
 .../message-info/components/MessageFrom.tsx      | 16 +++++++++++++++-
 .../message-info/components/MessageInfo.tsx      | 14 +++++++++++++-
 ts/components/dialog/EnterPasswordModal.tsx      |  2 ++
 5 files changed, 33 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 721cee71d..6a1dd1e4d 100644
--- a/package.json
+++ b/package.json
@@ -304,6 +304,7 @@
       "ts/**/*.js",
       "ts/*.js",
       "!dist/**",
+      "stylesheets/fonts.css",
       "stylesheets/dist/*",
       "!js/register.js",
       "preload.js",
diff --git a/ts/components/buttons/CopyToClipboardButton.tsx b/ts/components/buttons/CopyToClipboardButton.tsx
index 2979b1996..4d0b3c786 100644
--- a/ts/components/buttons/CopyToClipboardButton.tsx
+++ b/ts/components/buttons/CopyToClipboardButton.tsx
@@ -81,6 +81,8 @@ export const CopyToClipboardIcon = (props: CopyToClipboardIconProps & { copyCont
   return (
     <SessionIconButton
       aria-label={'copy to clipboard icon button'}
+      padding="0"
+      margin="0"
       {...props}
       iconType={'copy'}
       onClick={onClick}
diff --git a/ts/components/conversation/right-panel/overlay/message-info/components/MessageFrom.tsx b/ts/components/conversation/right-panel/overlay/message-info/components/MessageFrom.tsx
index 520fad45d..67c8ba85d 100644
--- a/ts/components/conversation/right-panel/overlay/message-info/components/MessageFrom.tsx
+++ b/ts/components/conversation/right-panel/overlay/message-info/components/MessageFrom.tsx
@@ -1,7 +1,10 @@
 import styled from 'styled-components';
 import { MessageInfoLabel } from '.';
 import { useConversationUsername } from '../../../../../../hooks/useParamSelector';
+import { isDevProd } from '../../../../../../shared/env_vars';
 import { Avatar, AvatarSize, CrownIcon } from '../../../../../avatar/Avatar';
+import { Flex } from '../../../../../basic/Flex';
+import { CopyToClipboardIcon } from '../../../../../buttons';
 
 const StyledFromContainer = styled.div`
   display: flex;
@@ -38,9 +41,20 @@ export const MessageFrom = (props: { sender: string; isSenderAdmin: boolean }) =
   const profileName = useConversationUsername(sender);
   const from = window.i18n('from');
 
+  const isDev = isDevProd();
+
   return (
     <StyledMessageInfoAuthor>
-      <MessageInfoLabel>{from}</MessageInfoLabel>
+      <Flex container={true} justifyContent="flex-start" alignItems="flex-start">
+        <MessageInfoLabel>{from}</MessageInfoLabel>
+        {isDev ? (
+          <CopyToClipboardIcon
+            iconSize={'medium'}
+            copyContent={`${profileName} ${sender}`}
+            margin={'0 0 0 var(--margins-xs)'}
+          />
+        ) : null}
+      </Flex>
       <StyledFromContainer>
         <StyledAvatar>
           <Avatar size={AvatarSize.M} pubkey={sender} onAvatarClick={undefined} />
diff --git a/ts/components/conversation/right-panel/overlay/message-info/components/MessageInfo.tsx b/ts/components/conversation/right-panel/overlay/message-info/components/MessageInfo.tsx
index 746eeff76..d977ea8b8 100644
--- a/ts/components/conversation/right-panel/overlay/message-info/components/MessageInfo.tsx
+++ b/ts/components/conversation/right-panel/overlay/message-info/components/MessageInfo.tsx
@@ -23,6 +23,7 @@ import { isDevProd } from '../../../../../../shared/env_vars';
 import { useSelectedConversationKey } from '../../../../../../state/selectors/selectedConversation';
 import { Flex } from '../../../../../basic/Flex';
 import { SpacerSM } from '../../../../../basic/Text';
+import { CopyToClipboardIcon } from '../../../../../buttons';
 
 export const MessageInfoLabel = styled.label<{ color?: string }>`
   font-size: var(--font-size-lg);
@@ -50,11 +51,22 @@ type LabelWithInfoProps = {
   onClick?: () => void;
 };
 
+const isDev = isDevProd();
+
 export const LabelWithInfo = (props: LabelWithInfoProps) => {
   return (
     <LabelWithInfoContainer title={props.title || undefined} onClick={props.onClick}>
       <MessageInfoLabel color={props.labelColor}>{props.label}</MessageInfoLabel>
-      <MessageInfoData color={props.dataColor}>{props.info}</MessageInfoData>
+      <Flex container={true} justifyContent="flex-start" alignItems="flex-start">
+        <MessageInfoData color={props.dataColor}>{props.info}</MessageInfoData>
+        {isDev ? (
+          <CopyToClipboardIcon
+            iconSize={'medium'}
+            copyContent={props.info}
+            margin={'0 0 0 var(--margins-xs)'}
+          />
+        ) : null}
+      </Flex>
     </LabelWithInfoContainer>
   );
 };
diff --git a/ts/components/dialog/EnterPasswordModal.tsx b/ts/components/dialog/EnterPasswordModal.tsx
index 202ef839a..b5df86494 100644
--- a/ts/components/dialog/EnterPasswordModal.tsx
+++ b/ts/components/dialog/EnterPasswordModal.tsx
@@ -43,12 +43,14 @@ export const EnterPasswordModal = (props: EnterPasswordModalProps) => {
     const passwordValue = passwordInputRef.current?.value;
     if (!passwordValue) {
       ToastUtils.pushToastError('enterPasswordErrorToast', window.i18n('noGivenPassword'));
+
       return;
     }
 
     const isPasswordValid = matchesHash(passwordValue as string, passwordHash);
     if (passwordHash && !isPasswordValid) {
       ToastUtils.pushToastError('enterPasswordErrorToast', window.i18n('invalidPassword'));
+
       return;
     }