diff --git a/public/img/uptime.png b/public/img/uptime.png index a6b3c9df..ea76141b 100644 Binary files a/public/img/uptime.png and b/public/img/uptime.png differ diff --git a/public/locales/cs/common.json b/public/locales/cs/common.json index ecc0fb82..92c2672f 100644 --- a/public/locales/cs/common.json +++ b/public/locales/cs/common.json @@ -15,6 +15,7 @@ "osm-wiki": "OSM Wiki", "email": "E-mail", "copyright": "Copyright © {{year}} MapSwipe", + "uptime-pretext": "", "privacy": "Soukromí", "mapswipe-logo": "Mapswipe Logo", "didnot-find-language": "Přidat chybějící jazyk", diff --git a/public/locales/de/common.json b/public/locales/de/common.json index 10a15ce5..c8abd652 100644 --- a/public/locales/de/common.json +++ b/public/locales/de/common.json @@ -15,6 +15,7 @@ "osm-wiki": "OSM Wiki", "email": "Email", "copyright": "Copyright © {{year}} MapSwipe", + "uptime-pretext": "", "privacy": "Datenschutz", "mapswipe-logo": "Mapswipe Logo", "didnot-find-language": "Fehlende Sprache hinzufügen", diff --git a/public/locales/en/common.json b/public/locales/en/common.json index 67215c6e..577b18a5 100644 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -15,6 +15,7 @@ "osm-wiki": "OSM Wiki", "email": "Email", "copyright": "Copyright © {{year}} MapSwipe", + "uptime-pretext": "System status monitored by", "privacy": "Privacy", "mapswipe-logo": "Mapswipe Logo", "didnot-find-language": "Add missing language", diff --git a/public/locales/hu/common.json b/public/locales/hu/common.json index 168f1583..3e27e87c 100644 --- a/public/locales/hu/common.json +++ b/public/locales/hu/common.json @@ -15,6 +15,7 @@ "osm-wiki": "OSM Wiki", "email": "E-mail", "copyright": "Copyright © {{year}} MapSwipe", + "uptime-pretext": "", "privacy": "Adatvédelem", "mapswipe-logo": "Mapswipe logo", "didnot-find-language": "Hiányzó nyelv hozzáadása", diff --git a/public/locales/ne/common.json b/public/locales/ne/common.json index 299499e7..1f993929 100644 --- a/public/locales/ne/common.json +++ b/public/locales/ne/common.json @@ -15,6 +15,7 @@ "osm-wiki": "OSM Wiki", "email": "इमेल", "copyright": "प्रतिलिपि अधिकार © {{year}} MapSwipe", + "uptime-pretext": "", "privacy": "गोपनीयता", "mapswipe-logo": "Mapswipe लोगो", "didnot-find-language": "छुटेको भाषा थप्नुहोस्", diff --git a/public/locales/pt/common.json b/public/locales/pt/common.json index 0b88f6cb..f3ead0bf 100644 --- a/public/locales/pt/common.json +++ b/public/locales/pt/common.json @@ -15,6 +15,7 @@ "osm-wiki": "Wiki OSM", "email": "Email", "copyright": "Direitos de autor © {{year}} MapSwipe", + "uptime-pretext": "", "privacy": "Privacidade", "mapswipe-logo": "Logótipo Mapswipe", "didnot-find-language": "Adicionar idioma em falta", diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx index bf03c275..c0c4e4ff 100644 --- a/src/components/Footer/index.tsx +++ b/src/components/Footer/index.tsx @@ -14,6 +14,7 @@ import { } from 'react-icons/io5'; import Heading from 'components/Heading'; +import ImageWrapper from 'components/ImageWrapper'; import styles from './styles.module.css'; @@ -143,6 +144,19 @@ function Footer(props: Props) {
{t('copyright', { year: currentYear })}
+
+ {t('uptime-pretext')} + + + +
| undefined { + if (!aoi) { + return undefined; + } + return ({ + type: 'FeatureCollection', + features: [{ + geometry: { + type: 'Polygon', + coordinates: aoi.bbox, + }, + type: 'Feature', + properties: {}, + }], + }); +} + async function getProjectData(id: string) { const projects = ( data as AllDataQuery @@ -125,12 +150,12 @@ function Project(props: Props) { exportModerateToHighAgreementYesMaybeGeometries, numberOfContributorUsers, aoiGeometry, + firebaseId, id: projectId, } = props; const svgContainerRef = React.useRef(null); const svgBounds = useSizeTracking(svgContainerRef); - const [projectGeoJSON, setProjectGeoJSON] = useState(null); const [projectHistory, setProjectHistory] = useState<{ timestamp: number; progress: number }[] | undefined>(); @@ -138,11 +163,6 @@ function Project(props: Props) { useEffect(() => { async function fetchData() { try { - if (exportAreaOfInterest?.file?.url) { - const res = await fetch(exportAreaOfInterest.file.url); - setProjectGeoJSON(await res.json()); - } - if (exportHistory?.file?.url) { const history = await getProjectHistory(projectId, exportHistory.file.url); setProjectHistory(history); @@ -153,7 +173,7 @@ function Project(props: Props) { } } fetchData(); - }, [exportAreaOfInterest, exportHistory, projectId]); + }, [exportHistory, projectId]); const [ chartPoints, @@ -302,6 +322,35 @@ function Project(props: Props) { const roundedTotalArea = Math.round(aoiGeometry?.totalArea ?? 0); + const aoiGeometryFeature = useMemo(() => ( + transformAoiToGeoJson(aoiGeometry) + ), [aoiGeometry]); + + const aoiGeometryBlob = useMemo(() => { + if (!aoiGeometryFeature) { + return undefined; + } + const blob = new Blob( + [JSON.stringify(aoiGeometryFeature, null, 2)], + { type: 'application/geo+json' }, + ); + return blob; + }, [aoiGeometryFeature]); + + const onAoiDownloadClick = useCallback(() => { + if (!aoiGeometryBlob) { + return; + } + const url = URL.createObjectURL(aoiGeometryBlob); + + const a = document.createElement('a'); + a.href = url; + a.download = `area_of_interest_${firebaseId}.geojson`; + a.click(); + + URL.revokeObjectURL(url); + }, [aoiGeometryBlob, firebaseId]); + return ( - {projectGeoJSON && ( + {aoiGeometryFeature && (
)} @@ -747,7 +796,44 @@ function Project(props: Props) { )} - {exportAreaOfInterest && ( + {aoiGeometry && ( + +
+ GEOJSON +
+ {t('download-size', { + size: getFileSizeProperties( + aoiGeometryBlob?.size ?? 0, + ).size, + formatParams: { + size: { + style: 'unit', + unit: getFileSizeProperties( + aoiGeometryBlob?.size ?? 0, + ).unit, + maximumFractionDigits: 1, + }, + }, + })} +
+
+ +
+ )} + {/* NOTE: If in case there is no aoiGeometry, + we show exportAreaOfInterest if present */} + {!aoiGeometry && exportAreaOfInterest && (