From 6c6810307137aa5ccd901e1392f7641e97f58e4b Mon Sep 17 00:00:00 2001 From: bndw Date: Sat, 24 Jan 2026 21:42:23 -0800 Subject: Remove hash params feature The hash params implementation was buggy and auto-polluting the URL bar with all settings on every render. Removing it entirely for now until a cleaner approach is designed. --- src/App.js | 113 +++++------------------------------------ src/components/useHashParam.js | 48 ----------------- 2 files changed, 13 insertions(+), 148 deletions(-) delete mode 100644 src/components/useHashParam.js (limited to 'src') diff --git a/src/App.js b/src/App.js index 94a3e97..9bde98d 100644 --- a/src/App.js +++ b/src/App.js @@ -1,103 +1,29 @@ import { Button, Heading, Link, Pane, Paragraph } from 'evergreen-ui'; -import React, { useEffect, useRef, useState, useCallback } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; import logo from '../src/images/wifi.png'; import { Settings } from './components/Settings'; import { WifiCard } from './components/WifiCard'; import './style.css'; import { Translations } from './translations'; -import useHashParam from './components/useHashParam'; function App() { - const getHashSearchParams = (location) => { - const hash = location.hash.slice(1); - const [prefix, query] = hash.split('?'); - - return [prefix, new URLSearchParams(query)]; - }; - const getHashParam = (key, location = window.location) => { - const [_, searchParams] = getHashSearchParams(location); - return searchParams.get(key); - }; - const setHashParam = (key, value, location = window.location) => { - const [prefix, searchParams] = getHashSearchParams(location); - - if (typeof value === 'undefined') { - searchParams.delete(key); - } else { - searchParams.set(key, value); - } - - const search = searchParams.toString(); - location.hash = search ? `${prefix}?${search}` : prefix; - }; - - let pssid = getHashParam('ssid'); //params.get('ssid') || ''; - let ppassword = getHashParam('password') || ''; - let pencryptionMode = - getHashParam('encryptionMode') !== null - ? getHashParam('encryptionMode') - : 'WPA'; - let peapMethod = getHashParam('eapMethod') || 'PWD'; - let peapIdentity = getHashParam('eapIdentity') || ''; - let phidePassword = - getHashParam('hidePassword') === null - ? false - : getHashParam('hidePassword').toLowerCase() === 'true' - ? true - : false; - let phiddenSSID = - getHashParam('hiddenSSID') === null - ? false - : getHashParam('hiddenSSID').toLowerCase() === 'true' - ? true - : false; - let pportrait = - getHashParam('portrait') === null - ? false - : getHashParam('portrait').toLowerCase() === 'true' - ? true - : false || false; - let padditionalCards = getHashParam('additionalCards') || 1; - let phideTip = - getHashParam('hideTip') === null - ? false - : getHashParam('hideTip').toLowerCase() === 'true' - ? true - : false; - let planguage = - getHashParam('lng') === null || getHashParam('lng').toLowerCase() === '' - ? 'en-US' - : getHashParam('lng'); - - // ######################## const html = document.querySelector('html'); const { t, i18n } = useTranslation(); const firstLoad = useRef(true); const [settings, setSettings] = useState({ - // Network SSID name - ssid: pssid, - // Network password - password: ppassword, - // Settings: Network encryption mode - encryptionMode: pencryptionMode, - // Settings: EAP Method - eapMethod: peapMethod, - // Settings: EAP identity - eapIdentity: peapIdentity, - // Settings: Hide password on the printed card - hidePassword: phidePassword, - // Settings: Mark your network as hidden SSID - hiddenSSID: phiddenSSID, - // Settings: Portrait orientation - portrait: pportrait, - // Settings: Additional cards - additionalCards: padditionalCards, - // Settings: Show tip (legend) on card - hideTip: phideTip, - // Display language - lng: planguage, + ssid: '', + password: '', + encryptionMode: 'WPA', + eapMethod: 'PWD', + eapIdentity: '', + hidePassword: false, + hiddenSSID: false, + portrait: false, + additionalCards: 1, + hideTip: false, + lng: 'en-US', }); const [errors, setErrors] = useState({ @@ -205,28 +131,15 @@ function App() { firstLoad.current = false; }; - const generateUrl = () => { - Object.entries(settings).map(([key, value]) => { - //console.log(key+" = " + value) - setHashParam(key, value); - if (key === 'ssid') setName(value); - return true; - }); - }; - const [name, setName] = useHashParam('name'); - useEffect(() => { // Ensure the page direction is set properly on first load if (htmlDirection() === 'rtl') { html.style.direction = 'rtl'; } - generateUrl(); - }); + }, []); return ( - Hello{' '} - {name ? name + '! You name is stored in hash params #️⃣' : 'visitor!'} icon diff --git a/src/components/useHashParam.js b/src/components/useHashParam.js deleted file mode 100644 index e43e1e4..0000000 --- a/src/components/useHashParam.js +++ /dev/null @@ -1,48 +0,0 @@ -import { useState, useEffect, useCallback } from 'react'; - -const getHashSearchParams = (location) => { - const hash = location.hash.slice(1); - const [prefix, query] = hash.split('?'); - - return [prefix, new URLSearchParams(query)]; -}; - -const getHashParam = (key, location = window.location) => { - const [_, searchParams] = getHashSearchParams(location); - return searchParams.get(key); -}; - -const setHashParam = (key, value, location = window.location) => { - const [prefix, searchParams] = getHashSearchParams(location); - - if (typeof value === 'undefined') { - searchParams.delete(key); - } else { - searchParams.set(key, value); - } - - const search = searchParams.toString(); - location.hash = search ? `${prefix}?${search}` : prefix; -}; - -const useHashParam = (key) => { - const [innerValue, setInnerValue] = useState(); - - useEffect(() => { - const handleHashChange = () => setInnerValue(getHashParam(key)); - handleHashChange(); - window.addEventListener('hashchange', handleHashChange); - return () => window.removeEventListener('hashchange', handleHashChange); - }, [key]); - - const setValue = useCallback( - (value) => { - setHashParam(key, value); - }, - [key] - ); - - return [innerValue, setValue]; -}; - -export default useHashParam; -- cgit v1.2.3