Feature/ Prompt Message: only the last message is displayed

client/globals.js

@@ -114,102 +114,6 @@ window.translateErrorMessage = function (error) {
   }
 }
 
-// Flash Alert Functions (main.js)
-var flashMessageTimer
-window.generalPrompt = function (type, content, options) {
-  var defaults = {
-    html: false,
-    noTimeout: false,
-    scrollToTop: true,
-    overlay: true,
-  }
-  options = _.assign(defaults, options)
-
-  var $outer = $('#flash-message-container')
-  $outer.hide()
-  if (type === 'error') {
-    $outer.removeClass('alert-success alert-warning').addClass('alert-danger')
-  } else if (type === 'message') {
-    $outer.removeClass('alert-danger alert-warning').addClass('alert-success')
-  } else if (type === 'info') {
-    $outer.removeClass('alert-danger alert-success').addClass('alert-warning')
-  }
-
-  if (options.overlay) {
-    $outer.addClass('fixed-overlay')
-  } else {
-    $outer.removeClass('fixed-overlay')
-  }
-
-  clearTimeout(flashMessageTimer)
-
-  var msgHtml
-  if (options.html) {
-    msgHtml = content
-  } else if (type === 'error') {
-    var errorLabel = options.hideErrorLabel ? null : '<strong>Error: </strong>'
-    msgHtml = _.flatten([errorLabel, translateErrorMessage(content)])
-  } else {
-    msgHtml = view.iMess(content)
-  }
-  $outer.find('.alert-content').empty()
-  $outer.find('.alert-content').append(msgHtml)
-  $outer.slideDown()
-
-  if (options.scrollToTop && window.scrollY > 0) {
-    $('html, body').animate({ scrollTop: 0 }, 400)
-  }
-
-  if (!options.noTimeout) {
-    flashMessageTimer = setTimeout(function () {
-      $outer.slideUp()
-    }, options.timeout ?? 8000)
-  }
-}
-
-window.promptError = function (error, options) {
-  generalPrompt('error', error, options)
-}
-
-window.promptMessage = function (message, options) {
-  generalPrompt('message', message, options)
-}
-
-window.promptLogin = function (user) {
-  var redirectParam = window.legacyScripts
-    ? ''
-    : '?redirect=' +
-      encodeURIComponent(
-        window.location.pathname + window.location.search + window.location.hash
-      )
-
-  if (_.isEmpty(user) || _.startsWith(user.id, 'guest_')) {
-    generalPrompt(
-      'message',
-      '<span class="important_message">Please <a href="/login' +
-        redirectParam +
-        '">Login</a> to proceed</span>',
-      { html: true }
-    )
-  } else {
-    generalPrompt(
-      'message',
-      '<span class="important_message">Please <a href="/logout">Login as a different user</a> to proceed</span>',
-      { html: true }
-    )
-  }
-}
-
-window.clearMessage = function () {
-  $('#flash-message-container').slideUp()
-}
-
-// Global Event Handlers (index.js)
-// Flash message bar
-$('#flash-message-container button.close').on('click', function () {
-  $('#flash-message-container').slideUp()
-})
-
 // Dropdowns
 $(document).on('click', function (event) {
   if (!$(event.target).closest('.dropdown').length) {

client/webfield-v2.js

@@ -668,9 +668,7 @@ module.exports = (function () {
           }
 
           $('#message-reviewers-modal').modal('hide')
-          promptMessage('A reminder email has been sent to ' + view.prettyId(userId), {
-            overlay: true,
-          })
+          promptMessage('A reminder email has been sent to ' + view.prettyId(userId))
           postReviewerEmails(postData)
           $link.after(' (Last sent: ' + new Date().toLocaleDateString() + ')')
 
@@ -700,7 +698,7 @@ module.exports = (function () {
         var name = $link.data('userName')
 
         if (!options.preferredEmailsInvitationId) {
-          promptError('Email is not available.', { scrollToTop: false })
+          promptError('Email is not available.')
           return
         }
 
@@ -709,14 +707,14 @@ module.exports = (function () {
             var email = result.edges?.[0]?.tail
 
             if (!email) {
-              promptError('Email is not available.', { scrollToTop: false })
+              promptError('Email is not available.')
               return
             }
             copy(`${name} <${email}>`)
-            promptMessage(`${email} copied to clipboard`, { scrollToTop: false })
+            promptMessage(`${email} copied to clipboard`)
           },
           function () {
-            promptError('Email is not available.', { scrollToTop: false })
+            promptError('Email is not available.')
           }
         )
         return false

components/BasicModal.js

@@ -1,4 +1,4 @@
-/* globals $: false */
+/* globals $,clearMessage: false */
 
 import { useEffect, useRef } from 'react'
 import SpinnerButton from './SpinnerButton'
@@ -25,6 +25,7 @@ export default function BasicModal({
       }
     })
     $(modalRef.current).on('show.bs.modal', (e) => {
+      clearMessage()
       if (typeof onOpen === 'function') {
         onOpen(e.relatedTarget)
       }

components/DblpImportModal.js

@@ -1,4 +1,4 @@
-/* globals $: false */
+/* globals $,clearMessage: false */
 
 import { useState, useRef, useEffect, useContext } from 'react'
 import { nanoid } from 'nanoid'
@@ -231,6 +231,7 @@ export default function DblpImportModal({ profileId, profileNames, updateDBLPUrl
 
   useEffect(() => {
     $(modalEl.current).on('show.bs.modal', () => {
+      clearMessage()
       // read current dblp url from input
       let dblpInputVal = $('#dblp_url').val().trim()
       if (dblpInputVal.endsWith('.html')) dblpInputVal = dblpInputVal.slice(0, -5)

components/EditorComponents/FileUploadWidget.js

@@ -52,7 +52,7 @@ const FileUploadWidget = () => {
         )
       }
     } catch (apiError) {
-      promptError(apiError.message, { scrollToTop: false })
+      promptError(apiError.message)
       fileInputRef.current.value = ''
     }
   }
@@ -86,7 +86,7 @@ const FileUploadWidget = () => {
       await sendChunksPromises
       setFileName(file.name)
     } catch (apiError) {
-      promptError(apiError.message, { scrollToTop: false })
+      promptError(apiError.message)
       fileInputRef.current.value = ''
     }
 

components/Layout.js

@@ -2,11 +2,11 @@ import Head from 'next/head'
 import Nav from './Nav'
 import Banner from './Banner'
 import EditBanner from './EditBanner'
-import FlashAlert from './FlashAlert'
 import Footer from './Footer'
 import FooterMinimal from './FooterMinimal'
 import FeedbackModal from './FeedbackModal'
 import BibtexModal from './BibtexModal'
+import usePrompt from '../hooks/usePrompt'
 
 export default function Layout({
   children,
@@ -17,6 +17,9 @@ export default function Layout({
   fullWidth,
   minimalFooter,
 }) {
+  const promptFunctions = usePrompt()
+  Object.assign(global, promptFunctions)
+
   return (
     <>
       <Head>
@@ -70,7 +73,6 @@ gtag('config', '${process.env.GA_PROPERTY_ID}', {
 
       <Banner hidden={bannerHidden}>{bannerContent}</Banner>
       <EditBanner>{editBannerContent}</EditBanner>
-      <FlashAlert />
 
       <div className={`container${fullWidth ? '-fluid' : ''}`}>
         <div className="row">

components/NoteEditor.js

@@ -174,9 +174,7 @@ const NoteEditor = ({
   const useCheckboxWidget = true
 
   const displayError =
-    typeof setErrorAlertMessage === 'function'
-      ? setErrorAlertMessage
-      : (p) => promptError(p, { scrollToTop: false })
+    typeof setErrorAlertMessage === 'function' ? setErrorAlertMessage : (p) => promptError(p)
 
   const saveDraft = useCallback(
     throttle((fieldName, value) => {
@@ -457,7 +455,7 @@ const NoteEditor = ({
     const invitationEditReaderValues =
       invitation.edit.readers?.param?.enum ??
       invitation.edit.readers?.param?.items?.map((p) =>
-        p.value ?? p.prefix?.endsWith('*') ? p.prefix : `${p.prefix}.*`
+        (p.value ?? p.prefix?.endsWith('*')) ? p.prefix : `${p.prefix}.*`
       )
 
     return addMissingReaders(

components/NoteEditorForm.js

@@ -54,12 +54,13 @@ export default function NoteEditorForm({
 
   const handleError = (errors) => {
     setLoading(false)
+    console.log('errors is ', errors)
 
     const err = errors?.[0]
     if (err === 'You do not have permission to create a note' || !user) {
       promptLogin(user)
     } else if (err) {
-      promptError(err, { scrollToTop: false })
+      promptError(err)
     } else {
       promptError('An unknown error occurred. Please refresh the page and try again.')
     }

components/browser/ProfileEntity.js

@@ -161,9 +161,9 @@ export default function ProfileEntity(props) {
       const email = result.edges?.[0]?.tail
       if (!email) throw new Error('Email is not available.')
       copy(`${content.name.fullname} <${email}>`)
-      promptMessage(`${email} copied to clipboard`, { scrollToTop: false })
+      promptMessage(`${email} copied to clipboard`)
     } catch (error) {
-      promptError(error.message, { scrollToTop: false })
+      promptError(error.message)
     }
   }
 

components/forum/ChatEditorForm.js

@@ -73,7 +73,7 @@ export default function ChatEditorForm({
       setSignatureOptions(sigOptions)
       setSignature(sigOptions[0]?.value)
     } catch (err) {
-      promptError(err.message, { scrollToTop: false })
+      promptError(err.message)
     }
   }
 
@@ -134,7 +134,7 @@ export default function ChatEditorForm({
           })
       })
       .catch((err) => {
-        promptError(err.message, { scrollToTop: false })
+        promptError(err.message)
         setLoading(false)
       })
   }
@@ -175,9 +175,11 @@ export default function ChatEditorForm({
     >
       {replyToNote && (
         <div className="parent-info disable-tex-rendering">
-          <h5 onClick={() => {
-            scrollToNote(replyToNote.id)
-          }}>
+          <h5
+            onClick={() => {
+              scrollToNote(replyToNote.id)
+            }}
+          >
             {/* <Icon name="share-alt" />{' '} */}
             <span>Replying to {prettyId(replyToNote.signatures[0], true)}</span>
             {' – '}
@@ -341,8 +343,7 @@ export default function ChatEditorForm({
             className="btn btn-sm btn-primary"
             disabled={!message || !message.trim() || loading}
           >
-            Send{' '}
-            <Icon name="send" />
+            Send <Icon name="send" />
           </button>
         </div>
       </div>

components/forum/ChatReply.js

@@ -102,7 +102,7 @@ const ChatReply = ({
         setLoading(false)
       })
       .catch((err) => {
-        promptError(err.message, { scrollToTop: false })
+        promptError(err.message)
         setLoading(false)
       })
 
@@ -138,7 +138,7 @@ const ChatReply = ({
         setLoading(false)
       })
       .catch((err) => {
-        promptError(err.message, { scrollToTop: false })
+        promptError(err.message)
         setLoading(false)
       })
   }
@@ -149,7 +149,7 @@ const ChatReply = ({
     copy(
       `${window.location.origin}${window.location.pathname}?id=${note.forum}&noteId=${note.id}${window.location.hash}`
     )
-    promptMessage('Reply URL copied to clipboard', { scrollToTop: false })
+    promptMessage('Reply URL copied to clipboard')
   }
 
   useEffect(() => {

components/forum/FilterForm.js

@@ -85,7 +85,7 @@ export default function FilterForm({
         urlParams
       )}`
     )
-    promptMessage('Forum URL copied to clipboard', { scrollToTop: false })
+    promptMessage('Forum URL copied to clipboard')
   }
 
   return (

components/forum/ForumReply.js

@@ -457,7 +457,7 @@ function CopyLinkButton({ forumId, noteId }) {
     if (!window.location) return
 
     copy(`${window.location.origin}${window.location.pathname}?id=${forumId}&noteId=${noteId}`)
-    promptMessage('Reply URL copied to clipboard', { scrollToTop: false })
+    promptMessage('Reply URL copied to clipboard')
   }
 
   return (

components/group/GroupContent.js

@@ -35,7 +35,7 @@ export default function GroupContent({ group, accessToken, profileId, reloadGrou
         invitation: group.domain ? `${group.domain}/-/Edit` : group.invitations[0],
       }
       await api.post('/groups/edits', requestBody, { accessToken })
-      promptMessage(`Content object for ${group.id} has been updated`, { scrollToTop: false })
+      promptMessage(`Content object for ${group.id} has been updated`)
       reloadGroup()
     } catch (error) {
       let { message } = error