[WiP]

src/components/Inbox/Message.tsx

@@ -6,6 +6,7 @@ import DialogAvatar from './DialogAvatar'
 import type { Message, ChatMember } from '../../graphql/types.gen'
 import formattedTime from '../../utils/formatDateTime'
 import { Icon } from '../_shared/Icon'
+import { MessageActionsPopup } from './MessageActionsPopup'
 
 type Props = {
   content: Message
@@ -35,14 +36,11 @@ const Message = (props: Props) => {
             <div onClick={props.replyClick}>
               <Icon name="chat-reply" class={styles.reply} />
             </div>
-            <Icon name="menu" />
+            <MessageActionsPopup trigger={<Icon name="menu" />} />
           </div>
           <div innerHTML={md.render(props.content.body)} />
         </div>
       </div>
-      <Show when={props.content.replyTo}>
-        <small>Repl to {props.content.replyTo}</small>
-      </Show>
       <div class={styles.time}>{formattedTime(props.content.createdAt)}</div>
     </div>
   )

src/components/Inbox/MessageActionsPopup.tsx

@@ -0,0 +1,19 @@
+import type { PopupProps } from '../_shared/Popup'
+import { Popup } from '../_shared/Popup'
+
+type MessageActionsPopup = Omit<PopupProps, 'children'>
+
+export const MessageActionsPopup = (props: MessageActionsPopup) => {
+  return (
+    <Popup {...props}>
+      <ul class="nodash">
+        <li>Ответить</li>
+        <li>Скопировать</li>
+        <li>Закрепить</li>
+        <li>Переслать</li>
+        <li>Выбрать</li>
+        <li>Удалить</li>
+      </ul>
+    </Popup>
+  )
+}

src/components/Views/Inbox.tsx

@@ -57,6 +57,7 @@ export const InboxView = () => {
     changeSearchParam('chat', `${chat.id}`)
     try {
       const response = await loadMessages({ chat: chat.id })
+      console.log('!!! response:', response)
       setMessages(response as unknown as MessageType[])
       // TODO: one client recreating
     } catch (error) {