fix: address search term persistency [DHIS2-15431]

dhis2 · Aug 7, 2023 · 7ddf992 · 7ddf992
1 parent 696c40d
commit 7ddf992
Show file tree

Hide file tree

Showing 12 changed files with 78 additions and 12 deletions.
diff --git a/src/AppWrapper.js b/src/AppWrapper.js
@@ -4,11 +4,14 @@ import { CssVariables } from '@dhis2/ui'
 import React from 'react'
 import App from './App.js'
 import { CurrentUserProvider } from './components/CurrentUserProvider.js'
+import { ReferrerProvider } from './providers/index.js'
 
 const AppWrapper = () => (
     <CurrentUserProvider>
-        <CssVariables spacers colors theme />
-        <App />
+        <ReferrerProvider>
+            <CssVariables spacers colors theme />
+            <App />
+        </ReferrerProvider>
     </CurrentUserProvider>
 )
 

diff --git a/src/components/GroupForm/GroupForm.js b/src/components/GroupForm/GroupForm.js
@@ -3,7 +3,9 @@ import i18n from '@dhis2/d2-i18n'
 import { NoticeBox, FinalForm } from '@dhis2/ui'
 import PropTypes from 'prop-types'
 import React from 'react'
+import { useHistory } from 'react-router-dom'
 import { useCurrentUser } from '../../hooks/useCurrentUser.js'
+import { useReferrerInfo } from '../../providers/index.js'
 import navigateTo from '../../utils/navigateTo.js'
 import Attributes from '../Attributes/index.js'
 import Form, { FormSection } from '../Form.js'
@@ -21,6 +23,8 @@ const GroupForm = ({ submitButtonLabel, group }) => {
     const engine = useDataEngine()
     const { loading, error, userGroupOptions, attributes } = useFormData()
     const currentUser = useCurrentUser()
+    const { referrer } = useReferrerInfo()
+    const history = useHistory()
     const handleSubmit = async (values, form) => {
         try {
             if (group) {
@@ -68,7 +72,11 @@ const GroupForm = ({ submitButtonLabel, group }) => {
             submitButtonLabel={submitButtonLabel}
             onSubmit={handleSubmit}
             onCancel={() => {
-                navigateTo('/user-groups')
+                if (referrer === 'user-groups') {
+                    history.goBack()
+                } else {
+                    navigateTo('/user-groups')
+                }
             }}
         >
             {({ submitError }) => (

diff --git a/src/components/RoleForm/RoleForm.js b/src/components/RoleForm/RoleForm.js
@@ -4,7 +4,9 @@ import { NoticeBox, composeValidators, hasValue, FinalForm } from '@dhis2/ui'
 import { flatMap } from 'lodash-es'
 import PropTypes from 'prop-types'
 import React from 'react'
+import { useHistory } from 'react-router-dom'
 import { useCurrentUser } from '../../hooks/useCurrentUser.js'
+import { useReferrerInfo } from '../../providers/index.js'
 import navigateTo from '../../utils/navigateTo.js'
 import Form, { FormSection, TextField, TransferField } from '../Form.js'
 import { getJsonPatch } from './getJsonPatch.js'
@@ -74,6 +76,8 @@ const RoleForm = ({ submitButtonLabel, role }) => {
             systemAuthorityOptions,
         })
     const currentUser = useCurrentUser()
+    const { referrer } = useReferrerInfo()
+    const history = useHistory()
     const handleSubmit = async (values, form) => {
         const roleData = getRoleData({ values })
 
@@ -125,7 +129,11 @@ const RoleForm = ({ submitButtonLabel, role }) => {
             submitButtonLabel={submitButtonLabel}
             onSubmit={handleSubmit}
             onCancel={() => {
-                navigateTo('/user-roles')
+                if (referrer === 'user-roles') {
+                    history.goBack()
+                } else {
+                    navigateTo('/user-roles')
+                }
             }}
         >
             {({ submitError }) => (

diff --git a/src/components/UserForm/UserForm.js b/src/components/UserForm/UserForm.js
@@ -4,7 +4,9 @@ import { NoticeBox, FinalForm } from '@dhis2/ui'
 import { keyBy } from 'lodash-es'
 import PropTypes from 'prop-types'
 import React, { useState } from 'react'
+import { useHistory } from 'react-router-dom'
 import { useCurrentUser } from '../../hooks/useCurrentUser.js'
+import { useReferrerInfo } from '../../providers/index.js'
 import navigateTo from '../../utils/navigateTo.js'
 import Attributes from '../Attributes/index.js'
 import Form, { FormSection } from '../Form.js'
@@ -44,6 +46,8 @@ const UserForm = ({
         attributes,
     } = useFormData()
     const currentUser = useCurrentUser()
+    const { referrer } = useReferrerInfo()
+    const history = useHistory()
     const handleSubmit = async (values, form) => {
         const userData = getUserData({
             values,
@@ -151,7 +155,11 @@ const UserForm = ({
             }
             onSubmit={handleSubmit}
             onCancel={() => {
-                navigateTo('/users')
+                if (referrer === 'users') {
+                    history.goBack()
+                } else {
+                    navigateTo('/users')
+                }
             }}
         >
             {({ values, submitError }) => (

diff --git a/src/pages/GroupList/ContextMenu/ContextMenu.js b/src/pages/GroupList/ContextMenu/ContextMenu.js
@@ -13,6 +13,7 @@ import {
 import PropTypes from 'prop-types'
 import React, { useState } from 'react'
 import { useCurrentUser } from '../../../hooks/useCurrentUser.js'
+import { useReferrerInfo } from '../../../providers/index.js'
 import navigateTo from '../../../utils/navigateTo.js'
 import DeleteModal from './Modals/DeleteModal.js'
 import JoinModal from './Modals/JoinModal.js'
@@ -37,6 +38,7 @@ const ContextMenu = ({ group, anchorRef, refetchGroups, onClose }) => {
     const currentUserIsMember = currentUser.userGroupIds.includes(group.id)
     const [CurrentModal, setCurrentModal] = useCurrentModal()
     const { access } = group
+    const { setReferrer } = useReferrerInfo()
 
     return (
         <>
@@ -67,9 +69,10 @@ const ContextMenu = ({ group, anchorRef, refetchGroups, onClose }) => {
                             <MenuItem
                                 label={i18n.t('Edit')}
                                 icon={<IconEdit16 color={colors.grey600} />}
-                                onClick={() =>
+                                onClick={() => {
+                                    setReferrer('user-groups')
                                     navigateTo(`/user-groups/edit/${group.id}`)
-                                }
+                                }}
                                 dense
                             />
                         )}

diff --git a/src/pages/RoleList/ContextMenu/ContextMenu.js b/src/pages/RoleList/ContextMenu/ContextMenu.js
@@ -12,6 +12,7 @@ import {
 } from '@dhis2/ui'
 import PropTypes from 'prop-types'
 import React, { useState } from 'react'
+import { useReferrerInfo } from '../../../providers/index.js'
 import navigateTo from '../../../utils/navigateTo.js'
 import DeleteModal from './Modals/DeleteModal.js'
 import SharingSettingsModal from './Modals/SharingSettingsModal.js'
@@ -32,6 +33,7 @@ const useCurrentModal = () => {
 const ContextMenu = ({ role, anchorRef, refetchRoles, onClose }) => {
     const [CurrentModal, setCurrentModal] = useCurrentModal()
     const { access } = role
+    const { setReferrer } = useReferrerInfo()
 
     return (
         <>
@@ -42,9 +44,10 @@ const ContextMenu = ({ role, anchorRef, refetchRoles, onClose }) => {
                             <MenuItem
                                 label={i18n.t('Show details')}
                                 icon={<IconInfo16 color={colors.grey600} />}
-                                onClick={() =>
+                                onClick={() => {
+                                    setReferrer('user-roles')
                                     navigateTo(`/user-roles/view/${role.id}`)
-                                }
+                                }}
                                 dense
                             />
                         )}

diff --git a/src/pages/UserList/ContextMenu/ContextMenu.js b/src/pages/UserList/ContextMenu/ContextMenu.js
@@ -18,6 +18,7 @@ import {
 import PropTypes from 'prop-types'
 import React, { useState } from 'react'
 import { useCurrentUser } from '../../../hooks/useCurrentUser.js'
+import { useReferrerInfo } from '../../../providers/useReferrer.js'
 import navigateTo from '../../../utils/navigateTo.js'
 import DeleteModal from './Modals/DeleteModal.js'
 import Disable2FaModal from './Modals/Disable2FaModal.js'
@@ -67,6 +68,7 @@ const ContextMenu = ({ user, anchorRef, refetchUsers, onClose }) => {
         )
     const canDisable = currentUser.id !== user.id && access.update && !disabled
     const canDelete = currentUser.id !== user.id && access.delete
+    const { setReferrer } = useReferrerInfo()
 
     return (
         <>
@@ -87,9 +89,10 @@ const ContextMenu = ({ user, anchorRef, refetchUsers, onClose }) => {
                             <MenuItem
                                 label={i18n.t('Edit')}
                                 icon={<IconEdit16 color={colors.grey600} />}
-                                onClick={() =>
+                                onClick={() => {
+                                    setReferrer('users')
                                     navigateTo(`/users/edit/${user.id}`)
-                                }
+                                }}
                                 dense
                             />
                         )}

diff --git a/src/providers/ReferrerContext.js b/src/providers/ReferrerContext.js
@@ -0,0 +1,6 @@
+import React from 'react'
+
+export const ReferrerContext = React.createContext({
+    referrer: '',
+    setReferrer: () => {},
+})
diff --git a/src/providers/ReferrerProvider.js b/src/providers/ReferrerProvider.js
@@ -0,0 +1,17 @@
+import PropTypes from 'prop-types'
+import React, { useState } from 'react'
+import { ReferrerContext } from './ReferrerContext.js'
+
+export const ReferrerProvider = ({ children }) => {
+    const [referrer, setReferrer] = useState('')
+    const providerValue = { referrer, setReferrer }
+    return (
+        <ReferrerContext.Provider value={providerValue}>
+            {children}
+        </ReferrerContext.Provider>
+    )
+}
+
+ReferrerProvider.propTypes = {
+    children: PropTypes.node.isRequired,
+}
diff --git a/src/providers/index.js b/src/providers/index.js
@@ -0,0 +1,2 @@
+export { useReferrerInfo } from './useReferrer.js'
+export { ReferrerProvider } from './ReferrerProvider.js'
diff --git a/src/providers/useReferrer.js b/src/providers/useReferrer.js
@@ -0,0 +1,4 @@
+import { useContext } from 'react'
+import { ReferrerContext } from './ReferrerContext.js'
+
+export const useReferrerInfo = () => useContext(ReferrerContext)
diff --git a/src/utils/navigateTo.js b/src/utils/navigateTo.js
@@ -7,7 +7,8 @@ import history from './history.js'
  * @function
  */
 const navigateTo = (path) => {
-    history.push(path)
+    // window.history.pushState({ prevUrl: window.location.href },null)
+    history.push(path, { search: 'bAH!' })
 }
 
 export default navigateTo