Chat list [WiP]

src/components/Inbox/DialogCard.tsx

@@ -1,6 +1,6 @@
 import styles from './DialogCard.module.scss'
 import DialogAvatar from './DialogAvatar'
-import type { Author } from '../../graphql/types.gen'
+import type { Author, User } from '../../graphql/types.gen'
 import { apiClient } from '../../utils/apiClient'
 import { t } from '../../utils/intl'
 import { useInbox } from '../../context/inbox'
@@ -9,19 +9,21 @@ type DialogProps = {
   online?: boolean
   message?: string
   counter?: number
-  author?: Author
-  ownSlug: Author['slug']
+  users: User[]
+  ownSlug: User['slug']
 }
 
 const DialogCard = (props: DialogProps) => {
+  // @ts-ignore
+  const participants = props.users.filter((user) => user !== props.ownSlug)
+  console.log('!!! participants:', participants)
+  // @ts-ignore
   return (
     //DialogCardView - подумать
     <div class={styles.DialogCard}>
-      <div class={styles.avatar}>
-        <DialogAvatar name={props.author.name} url={props.author.userpic} online={props.online} />
-      </div>
+      <div class={styles.avatar}>{/*<DialogAvatar name={participants[0]} online={props.online} />*/}</div>
       <div class={styles.row}>
-        <div class={styles.name}>{props.author.name}</div>
+        {/*<div class={styles.name}>{participants[0]}</div>*/}
         <div class={styles.message}>
           Указать предпочтительные языки для результатов поиска можно в разделе
         </div>

src/components/Views/Inbox.tsx

@@ -1,5 +1,5 @@
 import { For, createSignal, Show, onMount, createEffect, createMemo } from 'solid-js'
-import type { Author } from '../../graphql/types.gen'
+import type { Author, Chat } from '../../graphql/types.gen'
 import { AuthorCard } from '../Author/Card'
 import { Icon } from '../_shared/Icon'
 import { Loading } from '../Loading'
@@ -58,18 +58,10 @@ const postMessage = async (msg: string) => {
   return response.data.createComment
 }
 
-const handleGetChats = async () => {
-  try {
-    const response = await loadChats()
-    console.log('!!! handleGetChats:', response)
-  } catch (error) {
-    console.log(error)
-  }
-}
-
 export const InboxView = () => {
   const [messages, setMessages] = createSignal([])
   const [recipients, setRecipients] = createSignal<Author[]>([])
+  const [chats, setChats] = createSignal<Chat[]>([])
   const [cashedRecipients, setCashedRecipients] = createSignal<Author[]>([])
   const [postMessageText, setPostMessageText] = createSignal('')
   const [loading, setLoading] = createSignal<boolean>(false)
@@ -116,6 +108,13 @@ export const InboxView = () => {
     } catch (error) {
       console.log(error)
     }
+
+    try {
+      const response = await loadChats()
+      setChats(response as unknown as Chat[])
+    } catch (error) {
+      console.log(error)
+    }
   })
 
   const handleSubmit = async () => {
@@ -129,18 +128,19 @@ export const InboxView = () => {
     }
   }
 
-  let formParent // autoresize ghost element
+  let textareaParent // textarea autoresize ghost element
   const handleChangeMessage = (event) => {
     setPostMessageText(event.target.value)
   }
   createEffect(() => {
-    formParent.dataset.replicatedValue = postMessageText()
+    textareaParent.dataset.replicatedValue = postMessageText()
   })
 
   const handleOpenInviteModal = (event: Event) => {
     event.preventDefault()
     showModal('inviteToChat')
   }
+
   return (
     <div class="messages container">
       <Modal variant="narrow" name="inviteToChat">
@@ -160,14 +160,14 @@ export const InboxView = () => {
               <li>
                 <strong>{t('All')}</strong>
               </li>
-              <li onClick={handleGetChats}>{t('Personal')}</li>
+              <li>{t('Personal')}</li>
               <li>{t('Groups')}</li>
             </ul>
           </div>
           <div class="holder">
             <div class="dialogs">
-              <For each={recipients()}>
-                {(author) => <DialogCard ownSlug={currentSlug()} author={author} online={true} />}
+              <For each={chats()}>
+                {(chat) => <DialogCard users={chat.users} ownSlug={currentSlug()} />}
               </For>
             </div>
           </div>
@@ -198,7 +198,7 @@ export const InboxView = () => {
 
           <div class="message-form">
             <div class="wrapper">
-              <div class="grow-wrap" ref={formParent}>
+              <div class="grow-wrap" ref={textareaParent}>
                 <textarea
                   value={postMessageText()}
                   rows={1}

src/utils/apiClient.ts

@@ -272,8 +272,7 @@ export const apiClient = {
   // inbox
   getChats: async (options: QueryLoadChatsArgs) => {
     const resp = await privateGraphQLClient.query(myChats, options).toPromise()
-    console.debug('[loadChats]', resp)
-    return resp.data.loadChats
+    return resp.data.loadChats.chats
   },
 
   createChat: async (options: MutationCreateChatArgs) => {