diff --git a/src/components/connect/ConnectSearchParams.js b/src/components/connect/ConnectSearchParams.js
new file mode 100644
index 00000000..9eb94bae
--- /dev/null
+++ b/src/components/connect/ConnectSearchParams.js
@@ -0,0 +1,62 @@
+/* eslint-disable jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */
+import i18n from 'i18next'
+import { useEffect } from 'react'
+import { useLocation } from 'react-router-dom'
+import { toast } from 'react-toastify'
+
+import { useAppHistory } from '../../utils/useAppHistory'
+
+const ConnectSearchParams = () => {
+ const location = useLocation()
+ const history = useAppHistory()
+ const searchParams = new URLSearchParams(location.search)
+ const i18nViz = searchParams.get('i18n_viz')
+
+ useEffect(() => {
+ if (i18nViz) {
+ const originalT = i18n.t.bind(i18n)
+ i18n.t = (key, options) => {
+ let translation = originalT(key, options)
+ if (
+ [
+ 'type',
+ 'glossary.address',
+ 'locations.form.comments_subtext',
+ ].includes(key)
+ ) {
+ return `Localised text, key: ${key}, value: ${translation}`
+ }
+ if (i18nViz === 'keys') {
+ const x = translation
+ translation = key
+ key = x
+ }
+
+ if (key.endsWith('_html')) {
+ return `${translation}`
+ }
+ return (
+ {
+ navigator.clipboard.writeText(key)
+ toast.info(`Copied to clipboard: ${key}`)
+ }}
+ >
+ {translation}
+
+ )
+ }
+ history.removeParam('i18n_viz')
+ }
+ }, [i18nViz]) //eslint-disable-line
+
+ return null
+}
+
+export default ConnectSearchParams
diff --git a/src/components/connect/connectRoutes.js b/src/components/connect/connectRoutes.js
index b2af271c..006a146e 100644
--- a/src/components/connect/connectRoutes.js
+++ b/src/components/connect/connectRoutes.js
@@ -8,6 +8,7 @@ import ConnectNewLocation from './ConnectNewLocation'
import ConnectOverscroll from './ConnectOverscroll'
import ConnectPath from './ConnectPath'
import ConnectReview from './ConnectReview'
+import ConnectSearchParams from './ConnectSearchParams'
import ConnectTypes from './ConnectTypes'
import DisconnectInitLocation from './DisconnectInitLocation'
import DisconnectLocation from './DisconnectLocation'
@@ -201,6 +202,16 @@ const connectRoutes = [
,
+
+ /*
+ * ConnectSearchParams
+ * why: ?i18n_viz=keys and ?i18n_viz=values should trigger translation mode
+ *
+ * action: monkeypatch the i18n function to add background, title, and click handler
+ */
+
+
+ ,
]
export default connectRoutes
diff --git a/src/utils/useAppHistory.js b/src/utils/useAppHistory.js
index c79b77b5..0d988d0f 100644
--- a/src/utils/useAppHistory.js
+++ b/src/utils/useAppHistory.js
@@ -1,4 +1,4 @@
-import { useHistory } from 'react-router-dom'
+import { useHistory, useLocation } from 'react-router-dom'
import { currentPathWithView, pathWithCurrentView } from './appUrl'
@@ -8,6 +8,7 @@ import { currentPathWithView, pathWithCurrentView } from './appUrl'
*/
export const useAppHistory = () => {
const history = useHistory()
+ const location = useLocation()
const pushWithMapState = (to, state) => {
let newTo
@@ -27,5 +28,13 @@ export const useAppHistory = () => {
history.push(newUrl, state)
}
- return { ...history, push: pushWithMapState, changeView }
+ const removeParam = (paramName) => {
+ const searchParams = new URLSearchParams(location.search)
+ searchParams.delete(paramName)
+ const newSearch = searchParams.toString()
+ const newPath = `${location.pathname}${newSearch ? `?${newSearch}` : ''}`
+ history.replace(newPath)
+ }
+
+ return { ...history, push: pushWithMapState, changeView, removeParam }
}