Merge pull request #286 from systemli/fix-message-delete-modal-close

🐛 Fix closing modal after message deleted

src/api/Message.ts

@@ -53,14 +53,14 @@ export function useMessageApi(token: string) {
     }).then(response => response.json())
   }
 
-  const deleteMessage = (
-    ticker: string,
-    message: string
-  ): Promise<Response<any>> => {
-    return fetch(`${ApiUrl}/admin/tickers/${ticker}/messages/${message}`, {
-      headers: headers,
-      method: 'delete',
-    }).then(response => response.json())
+  const deleteMessage = (message: Message): Promise<Response<any>> => {
+    return fetch(
+      `${ApiUrl}/admin/tickers/${message.ticker}/messages/${message.id}`,
+      {
+        headers: headers,
+        method: 'delete',
+      }
+    ).then(response => response.json())
   }
 
   return { deleteMessage, getMessages, postMessage }

src/components/MessageModalDelete.tsx

@@ -14,18 +14,21 @@ const MessageModalDelete: FC<Props> = props => {
   const { deleteMessage } = useMessageApi(token)
   const [open, setOpen] = useState<boolean>(false)
   const queryClient = useQueryClient()
-  const tickerId = props.message.ticker.toString()
-  const messageId = props.message.id.toString()
+  const message = props.message
 
   const handleCancel = useCallback(() => {
     setOpen(false)
   }, [])
 
   const handleConfirm = useCallback(() => {
-    deleteMessage(tickerId, messageId).finally(() => {
-      queryClient.invalidateQueries(['messages', tickerId])
-    })
-  }, [deleteMessage, tickerId, messageId, queryClient])
+    deleteMessage(message)
+      .then(() => {
+        queryClient.invalidateQueries(['messages', message.ticker])
+      })
+      .finally(() => {
+        setOpen(false)
+      })
+  }, [deleteMessage, message, queryClient])
 
   const handleOpen = useCallback(() => {
     setOpen(true)