From f9316510e18416b4293739d5511da1117cacaba3 Mon Sep 17 00:00:00 2001 From: TurtIeSocks <58572875+TurtIeSocks@users.noreply.github.com> Date: Tue, 22 Mar 2022 23:36:02 -0400 Subject: [PATCH 1/4] Hashes and Consistent Esc Key - Upgrade React Router to v6 - Update syntax for v6 - Add dialog hashes to use the back button, vaguely works - Consistently exit dialogs with the esc key - Shuffles things around a little bit for better rerendering when navigating hashes --- example.env | 1 + package.json | 2 +- public/base-locales/en.json | 1 + server/src/models/Pokemon.js | 16 +-- src/components/App.jsx | 9 +- src/components/ClearStorage.jsx | 4 +- src/components/Config.jsx | 72 +++++++++++ src/components/Container.jsx | 27 +++++ src/components/ReactRouter.jsx | 109 ++++------------- src/components/RouteChangeTracker.jsx | 14 --- src/components/WebhookQuery.jsx | 14 +-- src/components/layout/FloatingBtn.jsx | 20 +++- src/components/layout/Nav.jsx | 26 +++- src/components/layout/auth/Auth.jsx | 24 ++-- src/components/layout/auth/Local.jsx | 4 +- src/components/layout/auth/Login.jsx | 9 +- .../layout/dialogs/ResetFilters.jsx | 4 +- src/components/layout/dialogs/UserProfile.jsx | 2 +- .../layout/dialogs/webhooks/Manage.jsx | 5 +- .../layout/dialogs/webhooks/Webhook.jsx | 9 ++ .../dialogs/webhooks/tiles/TrackedTile.jsx | 1 + src/components/layout/general/Menu.jsx | 24 ++++ src/components/popups/Gym.jsx | 2 +- .../ConfigSettings.jsx => hooks/useConfig.js} | 40 +------ src/hooks/useHash.js | 27 +++++ src/index.jsx | 6 +- yarn.lock | 112 +++++------------- 27 files changed, 316 insertions(+), 268 deletions(-) create mode 100644 src/components/Config.jsx create mode 100644 src/components/Container.jsx delete mode 100644 src/components/RouteChangeTracker.jsx rename src/{components/ConfigSettings.jsx => hooks/useConfig.js} (86%) create mode 100644 src/hooks/useHash.js diff --git a/example.env b/example.env index 6637bc24e..9e75dc1df 100644 --- a/example.env +++ b/example.env @@ -6,3 +6,4 @@ SENTRY_AUTH_TOKEN="" SENTRY_ORG="" SENTRY_PROJECT="" SENTRY_TRACES_SAMPLE_RATE=0.1 +SENTRY_DEBUG= diff --git a/package.json b/package.json index ed0c823da..2080befae 100644 --- a/package.json +++ b/package.json @@ -96,7 +96,7 @@ "react-i18next": "^11.9.0", "react-leaflet": "3.2.2", "react-leaflet-markercluster": "3.0.0-rc1", - "react-router-dom": "^5.2.0", + "react-router-dom": "^6.2.0", "react-telegram-login": "^1.1.2", "react-virtualized-auto-sizer": "^1.0.5", "react-window": "^1.8.6", diff --git a/public/base-locales/en.json b/public/base-locales/en.json index 85216d914..5816e0a7e 100644 --- a/public/base-locales/en.json +++ b/public/base-locales/en.json @@ -493,5 +493,6 @@ "loading": "Loading {{category}}", "loading_icons": "Fetching Icons", "loading_invasions": "Fetching Invasions", + "loading_settings": "Fetching Settings", "pvp_ranking_cap": "Level" } diff --git a/server/src/models/Pokemon.js b/server/src/models/Pokemon.js index d479e47f0..d017adf47 100644 --- a/server/src/models/Pokemon.js +++ b/server/src/models/Pokemon.js @@ -169,6 +169,14 @@ module.exports = class Pokemon extends Model { const generateSql = (queryBase, filter, relevant) => { relevant.forEach(key => { switch (key) { + case 'level': + case 'atk_iv': + case 'def_iv': + case 'sta_iv': + case 'iv': + if (ivs) { + queryBase.andWhereBetween(isMad ? madKeys[key] : key, filter[key]) + } break default: if (pvp) { queryPvp = true @@ -181,14 +189,6 @@ module.exports = class Pokemon extends Model { queryBase.whereNull('pokemon_id') } } break - case 'level': - case 'atk_iv': - case 'def_iv': - case 'sta_iv': - case 'iv': - if (ivs) { - queryBase.andWhereBetween(isMad ? madKeys[key] : key, filter[key]) - } break } }) } diff --git a/src/components/App.jsx b/src/components/App.jsx index d29fdff4b..d63000590 100644 --- a/src/components/App.jsx +++ b/src/components/App.jsx @@ -1,10 +1,12 @@ import '@assets/css/main.css' import React, { Suspense } from 'react' +import { BrowserRouter } from 'react-router-dom' + import { ApolloProvider } from '@apollo/client' import client from '@services/apollo' -import ReactRouter from './ReactRouter' +import Config from './Config' const SetText = () => { const locales = { @@ -31,11 +33,12 @@ const SetText = () => { export default function App() { document.body.classList.add('dark') - return ( }> - + + + ) diff --git a/src/components/ClearStorage.jsx b/src/components/ClearStorage.jsx index 27f0d9789..61b592361 100644 --- a/src/components/ClearStorage.jsx +++ b/src/components/ClearStorage.jsx @@ -1,8 +1,8 @@ import React from 'react' -import { Redirect } from 'react-router-dom' +import { Navigate } from 'react-router-dom' export default function ClearStorage() { localStorage.clear() sessionStorage.clear() - return + return } diff --git a/src/components/Config.jsx b/src/components/Config.jsx new file mode 100644 index 000000000..e50b0db22 --- /dev/null +++ b/src/components/Config.jsx @@ -0,0 +1,72 @@ +import React, { useEffect, useState, useCallback } from 'react' +import { ThemeProvider } from '@material-ui/styles' +import { useTranslation } from 'react-i18next' + +import setTheme from '@assets/mui/theme' +import UIcons from '@services/Icons' +import Fetch from '@services/Fetch' + +import ReactRouter from './ReactRouter' +import HolidayEffects from './HolidayEffects' + +const rootLoading = document.getElementById('loader') +const loadingText = document.getElementById('loading-text') + +export default function Config() { + const { t } = useTranslation() + const [serverSettings, setServerSettings] = useState(null) + + if (rootLoading) { + if (serverSettings) { + rootLoading.style.display = 'none' + } + } + + const getServerSettings = useCallback(async () => { + if (loadingText) { + loadingText.innerHTML = t('loading_settings') + } + const data = await Fetch.getSettings() + const Icons = data.masterfile ? new UIcons(data.config.icons, data.masterfile.questRewardTypes) : null + if (Icons) { + if (loadingText) { + loadingText.innerText = t('loading_icons') + } + await Icons.fetchIcons(data.config.icons.styles) + if (data.config.icons.defaultIcons) { + Icons.setSelection(data.config.icons.defaultIcons) + } + } + if (data.ui?.pokestops?.invasions && data.config?.map.fetchLatestInvasions) { + const invasionCache = JSON.parse(localStorage.getItem('invasions_cache')) + const cacheTime = data.config.map.invasionCacheHrs * 60 * 60 * 1000 + if (invasionCache && invasionCache.lastFetched + cacheTime > Date.now()) { + data.masterfile.invasions = invasionCache + } else { + if (loadingText) { + loadingText.innerText = t('loading_invasions') + } + data.masterfile.invasions = await Fetch.getInvasions(data.masterfile.invasions) + } + } + setServerSettings({ ...data, Icons }) + }, []) + + useEffect(() => { + if (!serverSettings) { + getServerSettings() + } + }, []) + + if (!serverSettings) { + return
+ } + + return ( + + + + + + ) +} diff --git a/src/components/Container.jsx b/src/components/Container.jsx new file mode 100644 index 000000000..bd3d3d77f --- /dev/null +++ b/src/components/Container.jsx @@ -0,0 +1,27 @@ +import React from 'react' +import { MapContainer } from 'react-leaflet' +import { useStore } from '@hooks/useStore' + +import Map from './Map' + +export default function Container({ serverSettings, params }) { + const location = useStore(state => state.location) + const zoom = useStore(state => state.zoom) + + return ( + + {(serverSettings.user && serverSettings.user.perms.map) && ( + + )} + + ) +} diff --git a/src/components/ReactRouter.jsx b/src/components/ReactRouter.jsx index dc4d19f20..ae0a617b9 100644 --- a/src/components/ReactRouter.jsx +++ b/src/components/ReactRouter.jsx @@ -1,95 +1,36 @@ -import React, { useEffect, useState, useCallback } from 'react' -import { BrowserRouter as Router, Route, Switch } from 'react-router-dom' -import { useTranslation } from 'react-i18next' -import { ThemeProvider } from '@material-ui/styles' - -import setTheme from '@assets/mui/theme' -import UIcons from '@services/Icons' -import Fetch from '@services/Fetch' +import React from 'react' +import { Route, Routes } from 'react-router-dom' +import useConfig from '@hooks/useConfig' import Auth from './layout/auth/Auth' import Login from './layout/auth/Login' -import RouteChangeTracker from './RouteChangeTracker' import Errors from './Errors' import ClearStorage from './ClearStorage' -import HolidayEffects from './HolidayEffects' - -const rootLoading = document.getElementById('loader') -const loadingText = document.getElementById('loading-text') - -export default function ReactRouter() { - const { t } = useTranslation() - const [serverSettings, setServerSettings] = useState(null) - - if (rootLoading) { - if (serverSettings) { - rootLoading.style.display = 'none' - } - } - const getServerSettings = useCallback(async () => { - const data = await Fetch.getSettings() - const Icons = data.masterfile ? new UIcons(data.config.icons, data.masterfile.questRewardTypes) : null - if (Icons) { - if (loadingText) { - loadingText.innerText = t('loading_icons') - } - await Icons.fetchIcons(data.config.icons.styles) - if (data.config.icons.defaultIcons) { - Icons.setSelection(data.config.icons.defaultIcons) - } - } - if (data.ui?.pokestops?.invasions && data.config?.map.fetchLatestInvasions) { - const invasionCache = JSON.parse(localStorage.getItem('invasions_cache')) - const cacheTime = data.config.map.invasionCacheHrs * 60 * 60 * 1000 - if (invasionCache && invasionCache.lastFetched + cacheTime > Date.now()) { - data.masterfile.invasions = invasionCache - } else { - if (loadingText) { - loadingText.innerText = t('loading_invasions') - } - data.masterfile.invasions = await Fetch.getInvasions(data.masterfile.invasions) - } - } - setServerSettings({ ...data, Icons }) - }, []) +export default function ReactRouter({ serverSettings, getServerSettings }) { + useConfig(serverSettings) - useEffect(() => { - if (!serverSettings) { - getServerSettings() - } - }, []) + const authRoute = return ( - - - {(inject.GOOGLE_ANALYTICS_ID) && } - - - - - - {serverSettings && } - - - {serverSettings && ( - - )} - - - {serverSettings && } - - - {serverSettings && } - - - - - - + + + } /> + + )} + /> + + + + + } /> + ) } diff --git a/src/components/RouteChangeTracker.jsx b/src/components/RouteChangeTracker.jsx deleted file mode 100644 index 8bd40378c..000000000 --- a/src/components/RouteChangeTracker.jsx +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react' -import { withRouter } from 'react-router-dom' -import ReactGA from 'react-ga' - -const RouteChangeTracker = ({ history }) => { - history.listen((location) => { - ReactGA.set({ page: location.pathname }) - ReactGA.pageview(location.pathname) - }) - - return
-} - -export default withRouter(RouteChangeTracker) diff --git a/src/components/WebhookQuery.jsx b/src/components/WebhookQuery.jsx index 9bbef6b8b..52b4aa1dc 100644 --- a/src/components/WebhookQuery.jsx +++ b/src/components/WebhookQuery.jsx @@ -2,10 +2,10 @@ import React from 'react' import { useQuery } from '@apollo/client' import Query from '@services/Query' -import ConfigSettings from './ConfigSettings' +import ConfigSettings from './Container' -export default function WebhookQuery({ match, serverSettings }) { - let lowercase = match.params.category.toLowerCase() +export default function WebhookQuery({ params, serverSettings }) { + let lowercase = params.category.toLowerCase() if (lowercase === 'invasions' || lowercase === 'lures' || lowercase === 'quests') { @@ -16,8 +16,8 @@ export default function WebhookQuery({ match, serverSettings }) { } const { data } = useQuery(Query[lowercase]('id'), { variables: { - id: match.params.id, - perm: match.params.category.toLowerCase(), + id: params.id, + perm: params.category.toLowerCase(), }, }) return data ? ( @@ -25,8 +25,8 @@ export default function WebhookQuery({ match, serverSettings }) { paramLocation={data[`${lowercase}Single`] ? [data[`${lowercase}Single`].lat, data[`${lowercase}Single`].lon] : null} - paramZoom={match.params.zoom} - match={match} + paramZoom={params.zoom} + params={params} serverSettings={serverSettings} /> ) : null diff --git a/src/components/layout/FloatingBtn.jsx b/src/components/layout/FloatingBtn.jsx index 364229924..7a7e952d0 100644 --- a/src/components/layout/FloatingBtn.jsx +++ b/src/components/layout/FloatingBtn.jsx @@ -10,6 +10,7 @@ import L from 'leaflet' import useStyles from '@hooks/useStyles' import useLocation from '@hooks/useLocation' import { useStore, useStatic } from '@hooks/useStore' +import useHash from '@hooks/useHash' const DonationIcons = { dollar: AttachMoney, @@ -24,6 +25,8 @@ export default function FloatingButtons({ setUserProfile, }) { const { t } = useTranslation() + const [isOpen, toggleHash, hash] = useHash() + const { map: { enableFloatingProfileButton } } = useStatic(state => state.config) const { loggedIn } = useStatic(state => state.auth) const map = useMap() @@ -42,6 +45,12 @@ export default function FloatingButtons({ const DonorIcon = showDonorPage ? DonationIcons[donationPage.fabIcon || 'card'] : null + useEffect(() => { + if (hash.includes(`#${selectedWebhook}`)) { + setWebhookMode(isOpen ? 'open' : false) + } + }, [isOpen]) + return ( - setWebhookMode('open')} title={selectedWebhook} disabled={Boolean(webhookMode)}> + { + toggleHash(true, [selectedWebhook]) + setWebhookMode('open') + }} + title={selectedWebhook} + disabled={Boolean(webhookMode)} + > diff --git a/src/components/layout/Nav.jsx b/src/components/layout/Nav.jsx index 9ee29352f..faf7d8061 100644 --- a/src/components/layout/Nav.jsx +++ b/src/components/layout/Nav.jsx @@ -1,10 +1,11 @@ -import React, { useState } from 'react' +import React, { useState, useEffect } from 'react' import { Dialog, Snackbar } from '@material-ui/core' import { Alert } from '@material-ui/lab' import Utility from '@services/Utility' import useStyles from '@hooks/useStyles' import { useStore, useStatic } from '@hooks/useStore' +import useHash from '@hooks/useHash' import SlideTransition from '@assets/mui/SlideTransition' import FloatingBtn from './FloatingBtn' @@ -27,6 +28,8 @@ export default function Nav({ isMobile, isTablet, }) { const classes = useStyles() + const [isOpen, toggleHash] = useHash() + const [isDrawerOpen, toggleDrawerHash, drawerHash] = useHash() const { perms } = useStatic(state => state.auth) const webhookAlert = useStatic(state => state.webhookAlert) @@ -37,6 +40,7 @@ export default function Nav({ const feedback = useStatic(state => state.feedback) const setFeedback = useStatic(state => state.setFeedback) const resetFilters = useStatic(state => state.resetFilters) + const setResetFilters = useStatic(state => state.setResetFilters) const filters = useStore(state => state.filters) const setFilters = useStore(state => state.setFilters) @@ -67,6 +71,7 @@ export default function Nav({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } + toggleDrawerHash(open, ['drawer']) setDrawer(open) } @@ -82,8 +87,8 @@ export default function Nav({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } + toggleHash(open, [type, category], true) setDialog({ open, category, type }) - if (filter && type === 'search') { setManualParams({ id: filter.id }) map.flyTo([filter.lat, filter.lon], 16) @@ -96,6 +101,14 @@ export default function Nav({ } } + useEffect(() => { + setDialog({ ...dialog, open: isOpen }) + }, [isOpen]) + + useEffect(() => { + setDrawer(isDrawerOpen && drawerHash.includes('#drawer')) + }, [isDrawerOpen]) + return ( <> {drawer ? ( @@ -127,6 +140,7 @@ export default function Nav({ open={userProfile} fullScreen={isMobile} fullWidth={!isMobile} + onClose={() => setUserProfile(false)} > setTutorial(false)} > setDonorPage(false)} > setFeedback(false)} > setResetFilters(false)} > diff --git a/src/components/layout/auth/Auth.jsx b/src/components/layout/auth/Auth.jsx index b1db329a6..b5317388c 100644 --- a/src/components/layout/auth/Auth.jsx +++ b/src/components/layout/auth/Auth.jsx @@ -1,21 +1,23 @@ import React from 'react' -import { Redirect, withRouter } from 'react-router-dom' +import { Navigate, useParams } from 'react-router-dom' -import ConfigSettings from '../../ConfigSettings' +import ConfigSettings from '../../Container' import Login from './Login' import WebhookQuery from '../../WebhookQuery' -const Auth = ({ serverSettings, getServerSettings, match }) => { +export default function Auth({ serverSettings, getServerSettings }) { + const params = useParams() + if (serverSettings.error) { return ( - + ) } if ((serverSettings.authMethods.length && !serverSettings.user) || (serverSettings.user && !serverSettings.user?.perms?.map)) { - if (match.params.category || match.params.lat) { - localStorage.setItem('params', JSON.stringify(match.params)) + if (params.category || params.lat) { + localStorage.setItem('params', JSON.stringify(params)) } return } @@ -25,19 +27,17 @@ const Auth = ({ serverSettings, getServerSettings, match }) => { const url = cachedParams.category ? `/id/${cachedParams.category}/${cachedParams.id}/${cachedParams.zoom || 18}` : `/@/${cachedParams.lat}/${cachedParams.lon}/${cachedParams.zoom || 18}` - return + return } - if (match.params.category) { + if (params.category) { return ( ) } return ( - + ) } - -export default withRouter(Auth) diff --git a/src/components/layout/auth/Local.jsx b/src/components/layout/auth/Local.jsx index 9f3ff49a6..999f1b665 100644 --- a/src/components/layout/auth/Local.jsx +++ b/src/components/layout/auth/Local.jsx @@ -1,5 +1,5 @@ import React, { useState } from 'react' -import { Redirect } from 'react-router-dom' +import { Navigate } from 'react-router-dom' import { Grid, Typography, Button, OutlinedInput, InputLabel, FormControl, InputAdornment, IconButton, } from '@material-ui/core' @@ -47,7 +47,7 @@ export default function LocalLogin({ href, serverSettings, getServerSettings }) } if (redirect) { - return + return } return ( diff --git a/src/components/layout/auth/Login.jsx b/src/components/layout/auth/Login.jsx index 0eb94dc40..331d6532c 100644 --- a/src/components/layout/auth/Login.jsx +++ b/src/components/layout/auth/Login.jsx @@ -1,6 +1,6 @@ /* eslint-disable react/no-array-index-key */ import React from 'react' -import { withRouter } from 'react-router-dom' +import { useLocation } from 'react-router-dom' import { useTranslation } from 'react-i18next' import { Grid, Typography, useMediaQuery } from '@material-ui/core' import { useTheme } from '@material-ui/styles' @@ -11,12 +11,13 @@ import DiscordLogin from './Discord' import TelegramLogin from './Telegram' import CustomTile from '../custom/CustomTile' -const Login = ({ clickedTwice, location, serverSettings, getServerSettings }) => { +export default function Login({ clickedTwice, serverSettings, getServerSettings }) { + const location = useLocation() const { t } = useTranslation() const theme = useTheme() const isMobile = useMediaQuery(theme.breakpoints.only('xs')) - const { settings, components } = serverSettings.config.map.loginPage + return components.length ? ( ) } - -export default withRouter(Login) diff --git a/src/components/layout/dialogs/ResetFilters.jsx b/src/components/layout/dialogs/ResetFilters.jsx index 3535236f1..e51207bd0 100644 --- a/src/components/layout/dialogs/ResetFilters.jsx +++ b/src/components/layout/dialogs/ResetFilters.jsx @@ -2,7 +2,7 @@ import React, { useState } from 'react' import { Button, Typography, DialogContent, } from '@material-ui/core' -import { Redirect } from 'react-router-dom' +import { Navigate } from 'react-router-dom' import { useTranslation } from 'react-i18next' import { useStatic } from '@hooks/useStore' @@ -16,7 +16,7 @@ export default function ResetFilters() { const setResetFilters = useStatic(state => state.setResetFilters) if (redirect) { - return + return } return ( <> diff --git a/src/components/layout/dialogs/UserProfile.jsx b/src/components/layout/dialogs/UserProfile.jsx index 809ba41c5..ed2473021 100644 --- a/src/components/layout/dialogs/UserProfile.jsx +++ b/src/components/layout/dialogs/UserProfile.jsx @@ -337,7 +337,7 @@ const BadgeTile = ({ data, rowIndex, columnIndex, style }) => { {item.name || t('unknown_gym')} - + setBadgeMenu(false)}> setWebhookMode(false), icon: 'Close', color: 'primary' }, + { name: 'close', action: handleWebhookClose, icon: 'Close', color: 'primary' }, ] if (map.feedbackLink) { @@ -127,7 +128,7 @@ export default function Manage({ return ( <> -
setWebhookMode(false)} titles={['manage_webhook']} /> +
s.selectedWebhook) const setSelectedWebhook = useStore(s => s.setSelectedWebhook) + const handleWebhookClose = () => { + toggleHash(false, [selectedWebhook]) + setWebhookMode(false) + } + return ( <> {webhookMode === 'location' && ( diff --git a/src/components/layout/dialogs/webhooks/tiles/TrackedTile.jsx b/src/components/layout/dialogs/webhooks/tiles/TrackedTile.jsx index b1a815075..cdcf68551 100644 --- a/src/components/layout/dialogs/webhooks/tiles/TrackedTile.jsx +++ b/src/components/layout/dialogs/webhooks/tiles/TrackedTile.jsx @@ -104,6 +104,7 @@ export default function PokemonTile({ data, rowIndex, columnIndex, style }) { open={editDialog} fullWidth={!isMobile} fullScreen={isMobile} + onClose={() => setEditDialog(false)} > state.menus) const setMenus = useStore(state => state.setMenus) const advMenu = useStore(state => state.advMenu) @@ -75,6 +78,7 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } + toggleHash(open, ['adv-drawer'], true) setFilterDrawer(open) } @@ -82,6 +86,7 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } + toggleHash(open, ['advanced', id], true) if (open) { setAdvancedFilter({ open, @@ -112,6 +117,7 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } + toggleHash(open, ['webhook', category, id], true) if (id === 'global' && !open && newFilters) { const wildCards = (() => { switch (webhookCategory) { @@ -144,6 +150,7 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } + toggleHash(open, [id, 'slots'], true) if (open) { setSlotsMenu({ open, @@ -195,6 +202,21 @@ export default function Menu({ ...extraButtons, ] + React.useEffect(() => { + if (hash.includes('advanced')) { + setAdvancedFilter({ ...advancedFilter, open: isOpen }) + } + if (hash.includes('slots')) { + setSlotsMenu({ ...slotsMenu, open: isOpen }) + } + if (hash.includes('adv-drawer')) { + setFilterDrawer(isOpen) + } + if (hash.includes('webhook')) { + setWebhook({ ...webhook, open: isOpen }) + } + }, [isOpen]) + return ( <>
setHelpDialog(false)} > setHelpDialog(!helpDialog)} @@ -294,6 +317,7 @@ export default function Menu({ open={webhook.open} fullWidth={!isMobile} fullScreen={isMobile} + onClose={toggleWebhook(false)} > - + state.setUserSettings) const setSettings = useStore(state => state.setSettings) const setFilters = useStore(state => state.setFilters) @@ -136,39 +132,13 @@ export default function ConfigSettings({ if (paramLocation && paramLocation[0] !== null) { return paramLocation } - if (match.params.lat) { - return [match.params.lat, match.params.lon] + if (params.lat) { + return [params.lat, params.lon] } return updatePositionState([serverSettings.config.map.startLat, serverSettings.config.map.startLon], 'location') } setZoom(updatePositionState(serverSettings.config.map.startZoom, 'zoom')) - const getStartZoom = () => { - if (paramZoom) { - return paramZoom - } - if (match.params.zoom) { - return match.params.zoom || 15 - } - return updatePositionState(serverSettings.config.map.startZoom, 'zoom') - } setIsNight(Utility.nightCheck(...getStartLocation())) - - return ( - - {(serverSettings.user && serverSettings.user.perms.map) && ( - - )} - - ) } diff --git a/src/hooks/useHash.js b/src/hooks/useHash.js new file mode 100644 index 000000000..645ea7e80 --- /dev/null +++ b/src/hooks/useHash.js @@ -0,0 +1,27 @@ +import { useEffect, useState } from 'react' + +export default function useHash() { + const [isOpen, setIsOpen] = useState(false) + const [modalHash, setModalHash] = useState('') + + const toggleHash = (open, hash, child = false) => { + if (open) { + const merged = `#${hash.map(item => item || null).filter(Boolean).join('-')}` + window.location.assign(child ? `${window.location.hash}${merged}` : merged) + setModalHash(merged) + } else { + window.location.replace(child ? window.location.hash.replace(modalHash, '#') : '#') + setModalHash('#') + } + } + + useEffect(() => { + const handleOnHashChange = () => { + setIsOpen(window.location.hash.includes(modalHash)) + } + window.addEventListener('hashchange', handleOnHashChange) + return () => window.removeEventListener('hashchange', handleOnHashChange) + }, [modalHash]) + + return [isOpen, toggleHash, modalHash] +} diff --git a/src/index.jsx b/src/index.jsx index cfda90162..b4b727930 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -9,8 +9,8 @@ import './services/i18n' if (inject) { const { - GOOGLE_ANALYTICS_ID, ANALYTICS_DEBUG_MODE, TITLE, VERSION, - SENTRY_DSN, SENTRY_TRACES_SAMPLE_RATE, DEVELOPMENT, CUSTOM, + GOOGLE_ANALYTICS_ID, ANALYTICS_DEBUG_MODE, TITLE, VERSION, CUSTOM, + SENTRY_DSN, SENTRY_TRACES_SAMPLE_RATE, DEVELOPMENT, SENTRY_DEBUG, } = inject if (GOOGLE_ANALYTICS_ID) { ReactGA.initialize(GOOGLE_ANALYTICS_ID, { debug: ANALYTICS_DEBUG_MODE }) @@ -24,7 +24,7 @@ if (inject) { tracesSampleRate: SENTRY_TRACES_SAMPLE_RATE ? +SENTRY_TRACES_SAMPLE_RATE : 0.1, release: VERSION, environment: DEVELOPMENT ? 'development' : 'production', - debug: DEVELOPMENT, + debug: SENTRY_DEBUG, beforeSend(event) { return CUSTOM ? null : event }, diff --git a/yarn.lock b/yarn.lock index 2c9a675c4..cb0b26275 100644 --- a/yarn.lock +++ b/yarn.lock @@ -67,14 +67,7 @@ dependencies: regenerator-runtime "^0.13.4" -"@babel/runtime@^7.1.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.3.1", "@babel/runtime@^7.8.3": - version "7.13.10" - resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.13.10.tgz#47d42a57b6095f4468da440388fdbad8bebf0d7d" - integrity sha512-4QPkjJq6Ns3V/RgpEahRk+AGfL0eO6RHHtTWoNNr5mO49G6B5+X6d6THgWEAvTrznU5xYpbAlVKRYcsCgh/Akw== - dependencies: - regenerator-runtime "^0.13.4" - -"@babel/runtime@^7.10.2", "@babel/runtime@^7.16.3": +"@babel/runtime@^7.10.2", "@babel/runtime@^7.16.3", "@babel/runtime@^7.7.6": version "7.17.2" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.2.tgz#66f68591605e59da47523c631416b18508779941" integrity sha512-hzeyJyMA1YGdJTuWU0e/j4wKXrU4OMFvY2MSlaI9B7VQb0r5cxTE3EAIS2Q7Tn2RIcDkRvTA/v2JsAEhxe99uw== @@ -88,6 +81,13 @@ dependencies: regenerator-runtime "^0.13.4" +"@babel/runtime@^7.3.1", "@babel/runtime@^7.8.3": + version "7.13.10" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.13.10.tgz#47d42a57b6095f4468da440388fdbad8bebf0d7d" + integrity sha512-4QPkjJq6Ns3V/RgpEahRk+AGfL0eO6RHHtTWoNNr5mO49G6B5+X6d6THgWEAvTrznU5xYpbAlVKRYcsCgh/Akw== + dependencies: + regenerator-runtime "^0.13.4" + "@babel/runtime@^7.4.4", "@babel/runtime@^7.5.5", "@babel/runtime@^7.8.7": version "7.14.6" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.6.tgz#535203bc0892efc7dec60bdc27b2ecf6e409062d" @@ -2429,19 +2429,14 @@ has@^1.0.3: dependencies: function-bind "^1.1.1" -history@^4.9.0: - version "4.10.1" - resolved "https://registry.yarnpkg.com/history/-/history-4.10.1.tgz#33371a65e3a83b267434e2b3f3b1b4c58aad4cf3" - integrity sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew== +history@^5.2.0: + version "5.3.0" + resolved "https://registry.yarnpkg.com/history/-/history-5.3.0.tgz#1548abaa245ba47992f063a0783db91ef201c73b" + integrity sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ== dependencies: - "@babel/runtime" "^7.1.2" - loose-envify "^1.2.0" - resolve-pathname "^3.0.0" - tiny-invariant "^1.0.2" - tiny-warning "^1.0.0" - value-equal "^1.0.1" + "@babel/runtime" "^7.7.6" -hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.2: +hoist-non-react-statics@^3.3.2: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== @@ -2828,11 +2823,6 @@ is-yarn-global@^0.3.0: resolved "https://registry.yarnpkg.com/is-yarn-global/-/is-yarn-global-0.3.0.tgz#d502d3382590ea3004893746754c89139973e232" integrity sha512-VjSeb/lHmkoyd8ryPVIKvOCn4D1koMqY+vqyjjUfc3xyKtP4dYOxM44sZrnqQSzSds3xyOrUTLTC9LVCVgLngw== -isarray@0.0.1: - version "0.0.1" - resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf" - integrity sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8= - isarray@~1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11" @@ -3130,7 +3120,7 @@ long@^4.0.0: resolved "https://registry.yarnpkg.com/long/-/long-4.0.0.tgz#9a7b71cfb7d361a194ea555241c92f7468d5bf28" integrity sha512-XsP+KhQif4bjX1kbuSiySJFNAehNxgLb6hPRGJ9QsUr8ajHkuXGdrHmFUTUUXhDwVX2R5bY4JNZEwbUiMhV+MA== -loose-envify@^1.1.0, loose-envify@^1.2.0, loose-envify@^1.3.1, loose-envify@^1.4.0: +loose-envify@^1.1.0, loose-envify@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf" integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q== @@ -3223,14 +3213,6 @@ mimic-response@^1.0.0, mimic-response@^1.0.1: resolved "https://registry.yarnpkg.com/mimic-response/-/mimic-response-1.0.1.tgz#4923538878eef42063cb8a3e3b0798781487ab1b" integrity sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ== -mini-create-react-context@^0.4.0: - version "0.4.1" - resolved "https://registry.yarnpkg.com/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz#072171561bfdc922da08a60c2197a497cc2d1d5e" - integrity sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ== - dependencies: - "@babel/runtime" "^7.12.1" - tiny-warning "^1.0.3" - minimatch@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083" @@ -3704,13 +3686,6 @@ path-to-regexp@0.1.7: resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-0.1.7.tgz#df604178005f522f15eb4490e7247a1bfaa67f8c" integrity sha1-32BBeABfUi8V60SQ5yR6G/qmf4w= -path-to-regexp@^1.7.0: - version "1.8.0" - resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.8.0.tgz#887b3ba9d84393e87a0a0b9f4cb756198b53548a" - integrity sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA== - dependencies: - isarray "0.0.1" - pause@0.0.1: version "0.0.1" resolved "https://registry.yarnpkg.com/pause/-/pause-0.0.1.tgz#1d408b3fdb76923b9543d96fb4c9dfd535d9cb5d" @@ -3914,7 +3889,7 @@ react-i18next@^11.9.0: "@babel/runtime" "^7.13.6" html-parse-stringify "^3.0.1" -react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1: +react-is@^16.7.0, react-is@^16.8.1: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== @@ -3948,34 +3923,20 @@ react-leaflet@^3.0.0: dependencies: "@react-leaflet/core" "^1.0.2" -react-router-dom@^5.2.0: - version "5.2.0" - resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-5.2.0.tgz#9e65a4d0c45e13289e66c7b17c7e175d0ea15662" - integrity sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA== +react-router-dom@^6.2.0: + version "6.2.2" + resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.2.2.tgz#f1a2c88365593c76b9612ae80154a13fcb72e442" + integrity sha512-AtYEsAST7bDD4dLSQHDnk/qxWLJdad5t1HFa1qJyUrCeGgEuCSw0VB/27ARbF9Fi/W5598ujvJOm3ujUCVzuYQ== dependencies: - "@babel/runtime" "^7.1.2" - history "^4.9.0" - loose-envify "^1.3.1" - prop-types "^15.6.2" - react-router "5.2.0" - tiny-invariant "^1.0.2" - tiny-warning "^1.0.0" + history "^5.2.0" + react-router "6.2.2" -react-router@5.2.0: - version "5.2.0" - resolved "https://registry.yarnpkg.com/react-router/-/react-router-5.2.0.tgz#424e75641ca8747fbf76e5ecca69781aa37ea293" - integrity sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw== - dependencies: - "@babel/runtime" "^7.1.2" - history "^4.9.0" - hoist-non-react-statics "^3.1.0" - loose-envify "^1.3.1" - mini-create-react-context "^0.4.0" - path-to-regexp "^1.7.0" - prop-types "^15.6.2" - react-is "^16.6.0" - tiny-invariant "^1.0.2" - tiny-warning "^1.0.0" +react-router@6.2.2: + version "6.2.2" + resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.2.2.tgz#495e683a0c04461eeb3d705fe445d6cf42f0c249" + integrity sha512-/MbxyLzd7Q7amp4gDOGaYvXwhEojkJD5BtExkuKmj39VEE0m3l/zipf6h2WIB2jyAO0lI6NGETh4RDcktRm4AQ== + dependencies: + history "^5.2.0" react-telegram-login@^1.1.2: version "1.1.2" @@ -4107,11 +4068,6 @@ resolve-from@^5.0.0: resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-5.0.0.tgz#c35225843df8f776df21c57557bc087e9dfdfc69" integrity sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw== -resolve-pathname@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/resolve-pathname/-/resolve-pathname-3.0.0.tgz#99d02224d3cf263689becbb393bc560313025dcd" - integrity sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng== - resolve@^1.20.0: version "1.22.0" resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.0.tgz#5e0b8c67c15df57a89bdbabe603a002f21731198" @@ -4517,12 +4473,7 @@ tildify@2.0.0: resolved "https://registry.yarnpkg.com/tildify/-/tildify-2.0.0.tgz#f205f3674d677ce698b7067a99e949ce03b4754a" integrity sha512-Cc+OraorugtXNfs50hU9KS369rFXCfgGLpfCfvlc+Ud5u6VWmUQsOAa9HbTvheQdYnrdJqqv1e5oIqXppMYnSw== -tiny-invariant@^1.0.2: - version "1.1.0" - resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.1.0.tgz#634c5f8efdc27714b7f386c35e6760991d230875" - integrity sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw== - -tiny-warning@^1.0.0, tiny-warning@^1.0.2, tiny-warning@^1.0.3: +tiny-warning@^1.0.2: version "1.0.3" resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754" integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA== @@ -4759,11 +4710,6 @@ v8-compile-cache@^2.0.3: resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee" integrity sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA== -value-equal@^1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/value-equal/-/value-equal-1.0.1.tgz#1e0b794c734c5c0cade179c437d356d931a34d6c" - integrity sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw== - value-or-promise@1.0.11: version "1.0.11" resolved "https://registry.yarnpkg.com/value-or-promise/-/value-or-promise-1.0.11.tgz#3e90299af31dd014fe843fe309cefa7c1d94b140" From 312cefa59ed3f7cc753c8317f86849ae70da585f Mon Sep 17 00:00:00 2001 From: TurtIeSocks <58572875+TurtIeSocks@users.noreply.github.com> Date: Thu, 14 Apr 2022 09:10:58 -0400 Subject: [PATCH 2/4] Update Config.jsx --- src/components/Config.jsx | 28 +++++++++------------------- 1 file changed, 9 insertions(+), 19 deletions(-) diff --git a/src/components/Config.jsx b/src/components/Config.jsx index e50b0db22..af3ba5ed7 100644 --- a/src/components/Config.jsx +++ b/src/components/Config.jsx @@ -22,38 +22,28 @@ export default function Config() { } } - const getServerSettings = useCallback(async () => { - if (loadingText) { - loadingText.innerHTML = t('loading_settings') + if (rootLoading) { + if (serverSettings) { + rootLoading.style.display = 'none' } + } + const getServerSettings = useCallback(async () => { const data = await Fetch.getSettings() const Icons = data.masterfile ? new UIcons(data.config.icons, data.masterfile.questRewardTypes) : null if (Icons) { - if (loadingText) { - loadingText.innerText = t('loading_icons') - } - await Icons.fetchIcons(data.config.icons.styles) + Icons.build(data.config.icons.styles) if (data.config.icons.defaultIcons) { Icons.setSelection(data.config.icons.defaultIcons) } } - if (data.ui?.pokestops?.invasions && data.config?.map.fetchLatestInvasions) { - const invasionCache = JSON.parse(localStorage.getItem('invasions_cache')) - const cacheTime = data.config.map.invasionCacheHrs * 60 * 60 * 1000 - if (invasionCache && invasionCache.lastFetched + cacheTime > Date.now()) { - data.masterfile.invasions = invasionCache - } else { - if (loadingText) { - loadingText.innerText = t('loading_invasions') - } - data.masterfile.invasions = await Fetch.getInvasions(data.masterfile.invasions) - } - } setServerSettings({ ...data, Icons }) }, []) useEffect(() => { if (!serverSettings) { + if (loadingText) { + loadingText.innerText = t('loading_settings') + } getServerSettings() } }, []) From 105ded0bfff92f87d7a35c2721b48f7c5d72d8f4 Mon Sep 17 00:00:00 2001 From: TurtIeSocks <58572875+TurtIeSocks@users.noreply.github.com> Date: Sat, 30 Apr 2022 21:47:37 -0400 Subject: [PATCH 3/4] Remove Modal Hashing Can't get this to work very well and I want to merge this PR in --- src/components/layout/FloatingBtn.jsx | 13 +-------- src/components/layout/Nav.jsx | 16 +---------- .../layout/dialogs/webhooks/Webhook.jsx | 11 ++------ src/components/layout/general/Menu.jsx | 22 --------------- src/hooks/useHash.js | 27 ------------------- 5 files changed, 4 insertions(+), 85 deletions(-) delete mode 100644 src/hooks/useHash.js diff --git a/src/components/layout/FloatingBtn.jsx b/src/components/layout/FloatingBtn.jsx index 06d10e207..25362001c 100644 --- a/src/components/layout/FloatingBtn.jsx +++ b/src/components/layout/FloatingBtn.jsx @@ -11,7 +11,6 @@ import L from 'leaflet' import useStyles from '@hooks/useStyles' import useLocation from '@hooks/useLocation' import { useStore, useStatic } from '@hooks/useStore' -import useHash from '@hooks/useHash' const DonationIcons = { dollar: AttachMoney, @@ -27,7 +26,6 @@ export default function FloatingButtons({ scanZoneMode, setScanZoneMode, }) { const { t } = useTranslation() - const [isOpen, toggleHash, hash] = useHash() const { map: { enableFloatingProfileButton }, scanner: { scannerType, enableScanNext, enableScanZone } } = useStatic(state => state.config) @@ -50,12 +48,6 @@ export default function FloatingButtons({ const DonorIcon = showDonorPage ? DonationIcons[donationPage.fabIcon || 'card'] : null - useEffect(() => { - if (hash.includes(`#${selectedWebhook}`)) { - setWebhookMode(isOpen ? 'open' : false) - } - }, [isOpen]) - return ( { - toggleHash(true, [selectedWebhook]) - setWebhookMode('open') - }} + onClick={() => setWebhookMode('open')} title={selectedWebhook} disabled={Boolean(webhookMode) || Boolean(scanNextMode) || Boolean(scanZoneMode)} > diff --git a/src/components/layout/Nav.jsx b/src/components/layout/Nav.jsx index 2fee6b8f7..9b63754c1 100644 --- a/src/components/layout/Nav.jsx +++ b/src/components/layout/Nav.jsx @@ -1,11 +1,10 @@ -import React, { useState, useEffect } from 'react' +import React, { useState } from 'react' import { Dialog, Snackbar } from '@material-ui/core' import { Alert } from '@material-ui/lab' import Utility from '@services/Utility' import useStyles from '@hooks/useStyles' import { useStore, useStatic } from '@hooks/useStore' -import useHash from '@hooks/useHash' import SlideTransition from '@assets/mui/SlideTransition' import FloatingBtn from './FloatingBtn' @@ -29,9 +28,6 @@ export default function Nav({ isMobile, isTablet, }) { const classes = useStyles() - const [isOpen, toggleHash] = useHash() - const [isDrawerOpen, toggleDrawerHash, drawerHash] = useHash() - const { perms } = useStatic(state => state.auth) const webhookAlert = useStatic(state => state.webhookAlert) const setWebhookAlert = useStatic(state => state.setWebhookAlert) @@ -72,7 +68,6 @@ export default function Nav({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } - toggleDrawerHash(open, ['drawer']) setDrawer(open) } @@ -88,7 +83,6 @@ export default function Nav({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } - toggleHash(open, [type, category], true) setDialog({ open, category, type }) if (filter && type === 'search') { setManualParams({ id: filter.id }) @@ -102,14 +96,6 @@ export default function Nav({ } } - useEffect(() => { - setDialog({ ...dialog, open: isOpen }) - }, [isOpen]) - - useEffect(() => { - setDrawer(isDrawerOpen && drawerHash.includes('#drawer')) - }, [isDrawerOpen]) - return ( <> {drawer ? ( diff --git a/src/components/layout/dialogs/webhooks/Webhook.jsx b/src/components/layout/dialogs/webhooks/Webhook.jsx index a25c3eed2..b395bb046 100644 --- a/src/components/layout/dialogs/webhooks/Webhook.jsx +++ b/src/components/layout/dialogs/webhooks/Webhook.jsx @@ -6,7 +6,6 @@ import { useTheme } from '@material-ui/core/styles' import useStyles from '@hooks/useStyles' import { useStore, useStatic } from '@hooks/useStore' -import useHash from '@hooks/useHash' import DraggableMarker from './Draggable' import Manage from './Manage' @@ -17,7 +16,6 @@ export default function Main({ }) { const theme = useTheme() const classes = useStyles() - const [, toggleHash] = useHash() const isMobile = useMediaQuery(theme.breakpoints.only('xs')) const isTablet = useMediaQuery(theme.breakpoints.only('sm')) @@ -30,11 +28,6 @@ export default function Main({ const selectedWebhook = useStore(s => s.selectedWebhook) const setSelectedWebhook = useStore(s => s.setSelectedWebhook) - const handleWebhookClose = () => { - toggleHash(false, [selectedWebhook]) - setWebhookMode(false) - } - return ( <> setWebhookMode(false)} > setWebhookMode(false)} /> {webhookMode === 'location' && ( diff --git a/src/components/layout/general/Menu.jsx b/src/components/layout/general/Menu.jsx index a7ec2fa8f..ae9ee8dd4 100644 --- a/src/components/layout/general/Menu.jsx +++ b/src/components/layout/general/Menu.jsx @@ -11,7 +11,6 @@ import { useTranslation } from 'react-i18next' import Utility from '@services/Utility' import { useStore } from '@hooks/useStore' import useFilter from '@hooks/useFilter' -import useHash from '@hooks/useHash' import ReactWindow from '@components/layout/general/ReactWindow' import Header from '@components/layout/general/Header' @@ -30,8 +29,6 @@ export default function Menu({ }) { Utility.analytics(`/advanced/${category}`) - const [isOpen, toggleHash, hash] = useHash() - const menus = useStore(state => state.menus) const setMenus = useStore(state => state.setMenus) const advMenu = useStore(state => state.advMenu) @@ -78,7 +75,6 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } - toggleHash(open, ['adv-drawer'], true) setFilterDrawer(open) } @@ -86,7 +82,6 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } - toggleHash(open, ['advanced', id], true) if (open) { setAdvancedFilter({ open, @@ -117,7 +112,6 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } - toggleHash(open, ['webhook', category, id], true) if (id === 'global' && !open && newFilters) { const wildCards = (() => { switch (webhookCategory) { @@ -150,7 +144,6 @@ export default function Menu({ if (event.type === 'keydown' && (event.key === 'Tab' || event.key === 'Shift')) { return } - toggleHash(open, [id, 'slots'], true) if (open) { setSlotsMenu({ open, @@ -202,21 +195,6 @@ export default function Menu({ ...extraButtons, ] - React.useEffect(() => { - if (hash.includes('advanced')) { - setAdvancedFilter({ ...advancedFilter, open: isOpen }) - } - if (hash.includes('slots')) { - setSlotsMenu({ ...slotsMenu, open: isOpen }) - } - if (hash.includes('adv-drawer')) { - setFilterDrawer(isOpen) - } - if (hash.includes('webhook')) { - setWebhook({ ...webhook, open: isOpen }) - } - }, [isOpen]) - return ( <>
{ - if (open) { - const merged = `#${hash.map(item => item || null).filter(Boolean).join('-')}` - window.location.assign(child ? `${window.location.hash}${merged}` : merged) - setModalHash(merged) - } else { - window.location.replace(child ? window.location.hash.replace(modalHash, '#') : '#') - setModalHash('#') - } - } - - useEffect(() => { - const handleOnHashChange = () => { - setIsOpen(window.location.hash.includes(modalHash)) - } - window.addEventListener('hashchange', handleOnHashChange) - return () => window.removeEventListener('hashchange', handleOnHashChange) - }, [modalHash]) - - return [isOpen, toggleHash, modalHash] -} From 32cd0d3128cd57d48d04b56608fe8f2ee7409cd5 Mon Sep 17 00:00:00 2001 From: TurtIeSocks <58572875+TurtIeSocks@users.noreply.github.com> Date: Sat, 30 Apr 2022 21:49:31 -0400 Subject: [PATCH 4/4] Update esbuild.config.mjs --- esbuild.config.mjs | 1 + 1 file changed, 1 insertion(+) diff --git a/esbuild.config.mjs b/esbuild.config.mjs index d0a1eec87..0de6574f4 100644 --- a/esbuild.config.mjs +++ b/esbuild.config.mjs @@ -146,6 +146,7 @@ const esbuild = { TITLE: env.parsed.TITLE || env.parsed.MAP_GENERAL_TITLE || '', SENTRY_DSN: env.parsed.SENTRY_DSN || '', SENTRY_TRACES_SAMPLE_RATE: env.parsed.SENTRY_TRACES_SAMPLE_RATE || 0.1, + SENTRY_DEBUG: env.parsed.SENTRY_DEBUG || false, VERSION: version, DEVELOPMENT: isDevelopment, CUSTOM: hasCustom,