Add last_message_id param to API

app/soapbox/features/chats/components/chat-box.tsx

@@ -56,12 +56,6 @@ const ChatBox: React.FC<IChatBox> = ({ chat, onSetInputRef, autosize, inputRef }
 
   const isSubmitDisabled = content.length === 0 && !attachment;
 
-  const markAsRead = useMutation(() => markChatAsRead(), {
-    onSuccess: () => {
-      queryClient.invalidateQueries(['chats']);
-    },
-  });
-
   const submitMessage = useMutation(({ chatId, content }: any) => {
     return createChatMessage(chatId, content);
   }, {

app/soapbox/features/chats/components/chat-message-list.tsx

@@ -347,7 +347,11 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chat, autosize }) => {
   }, [formattedChatMessages.length]);
 
   useEffect(() => {
-    markChatAsRead();
+    const lastMessageId = formattedChatMessages.pop()?.id;
+
+    if (lastMessageId) {
+      markChatAsRead(lastMessageId);
+    }
   }, [formattedChatMessages.length]);
 
   useEffect(() => {

app/soapbox/queries/chats.ts

@@ -135,7 +135,11 @@ const useChat = (chatId: string) => {
   const api = useApi();
   const { setChat, setEditing } = useChatContext();
 
-  const markChatAsRead = () => api.post<IChat>(`/api/v1/pleroma/chats/${chatId}/read`);
+  const markChatAsRead = (lastReadId: string) => {
+    api.post<IChat>(`/api/v1/pleroma/chats/${chatId}/read`, { last_read_id: lastReadId })
+      .then(() => queryClient.invalidateQueries(['chats']))
+      .catch(() => null);
+  };
 
   const createChatMessage = (chatId: string, content: string) => {
     return api.post<IChat>(`/api/v1/pleroma/chats/${chatId}/messages`, { content });