mirror of
https://github.com/RoboSats/robosats.git
synced 2025-07-17 16:23:13 +00:00
Merge pull request #2061 from RoboSats/load-json-map-on-demand
Loan JSON map on demand
This commit is contained in:
@ -1,11 +1,14 @@
|
||||
import React, { useContext } from 'react';
|
||||
import React, { useContext, useEffect, useState } from 'react';
|
||||
import { MapContainer, GeoJSON, useMapEvents, TileLayer, Tooltip, Marker } from 'react-leaflet';
|
||||
import { useTheme, LinearProgress } from '@mui/material';
|
||||
import { type GeoJsonObject } from 'geojson';
|
||||
import { DivIcon, type LeafletMouseEvent } from 'leaflet';
|
||||
import { type PublicOrder } from '../../models';
|
||||
import OrderTooltip from '../Charts/helpers/OrderTooltip';
|
||||
import MarkerClusterGroup from 'react-leaflet-markercluster';
|
||||
import { AppContext, type UseAppStoreType } from '../../contexts/AppContext';
|
||||
import getWorldmapGeojson from '../../geo/Web';
|
||||
import { apiClient } from '../../services/api';
|
||||
|
||||
interface MapPinProps {
|
||||
fillColor: string;
|
||||
@ -41,7 +44,18 @@ const Map = ({
|
||||
interactive = false,
|
||||
}: Props): React.JSX.Element => {
|
||||
const theme = useTheme();
|
||||
const { worldmap } = useContext<UseAppStoreType>(AppContext);
|
||||
const { hostUrl } = useContext<UseAppStoreType>(AppContext);
|
||||
const [worldmap, setWorldmap] = useState<GeoJsonObject>();
|
||||
|
||||
useEffect(() => {
|
||||
getWorldmapGeojson(apiClient, hostUrl)
|
||||
.then((data) => {
|
||||
setWorldmap(data);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Error:', error);
|
||||
});
|
||||
}, []);
|
||||
|
||||
const RobotMarker = (
|
||||
key: string | number,
|
||||
@ -112,8 +126,8 @@ const Map = ({
|
||||
attributionControl={false}
|
||||
style={{ height: '100%', width: '100%', backgroundColor: theme.palette.background.paper }}
|
||||
>
|
||||
{!useTiles && worldmap == null && <LinearProgress />}
|
||||
{!useTiles && worldmap != null && (
|
||||
{!useTiles && !worldmap && <LinearProgress />}
|
||||
{!useTiles && worldmap && (
|
||||
<GeoJSON
|
||||
data={worldmap}
|
||||
style={{
|
||||
|
@ -9,7 +9,6 @@ import React, {
|
||||
import { type Page } from '../basic/NavBar';
|
||||
import { type OpenDialogs } from '../basic/MainDialogs';
|
||||
import { ThemeProvider } from '@mui/material';
|
||||
import { type GeoJsonObject } from 'geojson';
|
||||
|
||||
import { Settings, type Version, type Origin, type Favorites } from '../models';
|
||||
|
||||
@ -18,8 +17,6 @@ import { getClientVersion, getHost } from '../utils';
|
||||
import defaultFederation from '../../static/federation.json';
|
||||
import { createTheme, type Theme } from '@mui/material/styles';
|
||||
import i18n from '../i18n/Web';
|
||||
import getWorldmapGeojson from '../geo/Web';
|
||||
import { apiClient } from '../services/api';
|
||||
import SettingsSelfhosted from '../models/Settings.default.basic.selfhosted';
|
||||
import SettingsSelfhostedPro from '../models/Settings.default.pro.selfhosted';
|
||||
import SettingsPro from '../models/Settings.default.pro';
|
||||
@ -156,7 +153,6 @@ export interface UseAppStoreType {
|
||||
hostUrl: string;
|
||||
fav: Favorites;
|
||||
setFav: Dispatch<SetStateAction<Favorites>>;
|
||||
worldmap?: GeoJsonObject;
|
||||
client: 'mobile' | 'web' | 'desktop' | string;
|
||||
view: 'basic' | 'pro' | string;
|
||||
}
|
||||
@ -219,7 +215,6 @@ export const AppContextProvider = ({ children }: AppContextProviderProps): React
|
||||
const [acknowledgedWarning, setAcknowledgedWarning] = useState<boolean>(
|
||||
initialAppContext.acknowledgedWarning,
|
||||
);
|
||||
const [worldmap, setWorldmap] = useState<GeoJsonObject>();
|
||||
|
||||
useEffect(() => {
|
||||
setTheme(makeTheme(settings));
|
||||
@ -251,18 +246,6 @@ export const AppContextProvider = ({ children }: AppContextProviderProps): React
|
||||
};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (['offers', 'create'].includes(page) && !worldmap) {
|
||||
getWorldmapGeojson(apiClient, hostUrl)
|
||||
.then((data) => {
|
||||
setWorldmap(data);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Error:', error);
|
||||
});
|
||||
}
|
||||
}, [page]);
|
||||
|
||||
useEffect(() => {
|
||||
setWindowSize(getWindowSize(theme.typography.fontSize));
|
||||
}, [theme.typography.fontSize]);
|
||||
@ -293,7 +276,6 @@ export const AppContextProvider = ({ children }: AppContextProviderProps): React
|
||||
origin,
|
||||
fav,
|
||||
setFav,
|
||||
worldmap,
|
||||
client,
|
||||
view,
|
||||
}}
|
||||
|
Reference in New Issue
Block a user