Fix Chatroom Guest posts. Sorry it was broken for 2 months there !

clevertree · Mar 14, 2024 · ee2b3b7 · ee2b3b7
1 parent e1440ff
commit ee2b3b7
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 45 deletions.
diff --git a/.env b/.env
@@ -1,5 +1,5 @@
 NEXT_PUBLIC_METADATA_URL=https://paradigmthreat.net
-NEXT_PUBLIC_API=https://api.paradigmthreat.com
+NEXT_PUBLIC_API=https://api.paradigmthreat.net
 NEXT_PUBLIC_ASSET_PATH=app
 NEXT_PUBLIC_ASSET_BUILD=dist
 NEXT_PUBLIC_ASSET_NAV_IGNORE_FILE=.navignore

diff --git a/components/ChatRoom/ChatRoom.js b/components/ChatRoom/ChatRoom.js
@@ -5,6 +5,7 @@ import Markdown from 'markdown-to-jsx'
 
 import styles from './ChatRoom.module.scss'
 import { ErrorBoundary } from '@client'
+
 const API_URL = process.env.NEXT_PUBLIC_API
 
 export default function ChatRoom ({ channel, title, className }) {
@@ -22,9 +23,9 @@ export default function ChatRoom ({ channel, title, className }) {
           setChannelInfo(channelInfo)
         }
       }).catch(error => {
-        console.error(error.message)
-        setError(error.message)
-      })
+      console.error(error)
+      setError(error.message)
+    })
   }, [channel])
 
   async function onKeyDown (event) {
@@ -36,83 +37,90 @@ export default function ChatRoom ({ channel, title, className }) {
 
   async function onSubmit (event) {
     event.preventDefault()
+    try {
 
-    const formElm = event.target.form || event.target
-    const formData = new FormData(formElm)
-    const formDataObject = Object.fromEntries(formData.entries())
-    if (!formDataObject.username) { formDataObject.username = 'guest' }
-    formElm.elements.message.value = ''
-    formElm.elements.message.disabled = true
-    const response = await fetch(`/api/chat/channel/${channel}/createGuestPost`, {
-      headers: {
-        'Content-Type': 'application/json',
-        Accept: 'application/json'
-      },
-      method: 'POST',
-      body: JSON.stringify(formDataObject)
-    })
+      const formElm = event.target.form || event.target
+      const formData = new FormData(formElm)
+      const formDataObject = Object.fromEntries(formData.entries())
+      if (!formDataObject.username) { formDataObject.username = 'guest' }
+      formElm.elements.message.value = ''
+      formElm.elements.message.disabled = true
+      const response = await fetch(`${API_URL}/api/chat/channel/${channel}/createGuestPost`, {
+        headers: {
+          'Content-Type': 'application/json',
+          Accept: 'application/json'
+        },
+        method: 'POST',
+        body: JSON.stringify(formDataObject)
+      })
 
-    const { message, username } = await response.json()
-    setChannelInfo({
-      ...channelInfo,
-      posts: [
-        ...channelInfo.posts,
-        {
-          username,
-          message
-        }
-      ]
-    })
-    formElm.elements.message.disabled = false
+      const { message, username } = await response.json()
+      setChannelInfo({
+        ...channelInfo,
+        posts: [
+          ...channelInfo.posts,
+          {
+            username,
+            message
+          }
+        ]
+      })
+      formElm.elements.message.disabled = false
+    } catch (error) {
+      const errorMessage = `Error submitting message: ${error.message}`
+      console.error(error)
+      setError(errorMessage)
+    }
   }
+
   // console.log('error', error)
   return (
     <ErrorBoundary>
       <div className={`${styles.container} ${className}`}>
         <div className={styles.channelTitle}>
           <a
-            href={`https://chat.paradigmthreat.net/paradigm-threat/channels/${channel}`} target=' _blank'
-            rel='noreferrer'
+            href={`https://chat.paradigmthreat.net/paradigm-threat/channels/${channel}`} target=" _blank"
+            rel="noreferrer"
           >
             {title || channel}
           </a>
         </div>
         <div className={styles.channel}>
-          {channelInfo?.posts?.map(({ username, message }, index) => (
-            <div key={index} className={styles.post}>
+          {channelInfo?.posts?.map(({ username, message, create_at }, index) => (
+            <div key={index} className={styles.post} title={`Created at ${new Date(create_at).toLocaleString()}`}>
               <span className={styles.username}>{username}</span>
               <span className={styles.message}><Markdown>{message}</Markdown></span>
             </div>
           ))}
           {error && <div className={`${styles.post} ${styles.error}`}>Could not load chatroom: {error}</div>}
         </div>
         <div>
-          <form className='flex' onSubmit={onSubmit}>
+          <form className="flex" onSubmit={onSubmit}>
             <input
-              type='text' name='username' className={`${styles.input} w-24 text-center italic`}
-              placeholder='guest' title='Type your guest name here'
+              type="text" name="username" className={`${styles.input} w-24 text-center italic`}
+              placeholder="guest" title="Type your guest name here"
             />
             <input
-              type='text'
-              name='message'
+              type="text"
+              name="message"
               className={`${styles.input} w-full`}
               onKeyDown={onKeyDown}
               required
-              title='Send a message to the channel'
-              placeholder='got something to say? type it here and hit the enter key to send to the channel'
+              title="Send a message to the channel"
+              placeholder="got something to say? type it here and hit the enter key to send to the channel"
             />
             <button
-              type='submit' className={`${styles.input} ${styles.submit} w-24`} value='Submit'
+              type="submit" className={`${styles.input} ${styles.submit} w-24`} value="Submit"
             >Send
             </button>
           </form>
         </div>
         <div className={styles.channelFooter}>
           <a
-            href={`https://chat.paradigmthreat.net/paradigm-threat/channels/${channel}`} target=' _blank'
-            rel='noreferrer'
+            href={`https://chat.paradigmthreat.net/paradigm-threat/channels/${channel}`} target=" _blank"
+            rel="noreferrer"
           >
-            Open {title || channel} in new window
+            Visit {title || channel} in new window
           </a>
         </div>
       </div>