1 files changed, 37 insertions, 0 deletions
diff --git a/modern/src/common/components/AddressValue.jsx b/modern/src/common/components/AddressValue.jsx
new file mode 100644
index 00000000..827a71de
--- /dev/null
+++ b/modern/src/common/components/AddressValue.jsx
@@ -0,0 +1,37 @@
+import React, { useEffect, useState } from 'react';
+import { useSelector } from 'react-redux';
+import { Link } from '@mui/material';
+import { useTranslation } from './LocalizationProvider';
+import { useCatch } from '../../reactHelper';
+
+const AddressValue = ({ latitude, longitude, originalAddress }) => {
+  const t = useTranslation();
+
+  const addressEnabled = useSelector((state) => state.session.server.geocoderEnabled);
+
+  const [address, setAddress] = useState();
+
+  useEffect(() => {
+    setAddress(originalAddress);
+  }, [latitude, longitude, originalAddress]);
+
+  const showAddress = useCatch(async () => {
+    const query = new URLSearchParams({ latitude, longitude });
+    const response = await fetch(`/api/server/geocode?${query.toString()}`);
+    if (response.ok) {
+      setAddress(await response.text());
+    } else {
+      throw Error(await response.text());
+    }
+  });
+
+  if (address) {
+    return address;
+  }
+  if (addressEnabled) {
+    return (<Link href="#" onClick={showAddress}>{t('sharedShowAddress')}</Link>);
+  }
+  return '';
+};
+
+export default AddressValue;