diff --git a/src/Popup/Pages/AutofillPage/index.tsx b/src/Popup/Pages/AutofillPage/index.tsx
index 5ecca33..d3f1b41 100644
--- a/src/Popup/Pages/AutofillPage/index.tsx
+++ b/src/Popup/Pages/AutofillPage/index.tsx
@@ -1,4 +1,4 @@
-// import { useState, useEffect } from 'react'
+import { useState, useEffect } from 'react'
// import { Box } from 'theme-ui'
import Page from '../../Components/Page'
import CheckBox from '../../Components/CheckBox'
@@ -7,10 +7,11 @@ import { Box, Label, Select } from 'theme-ui'
interface SystemPageProps {
tab: string
+ reverseGeocoding: any
}
-const AutofillPage = ({ tab }: SystemPageProps) => {
- // const [ip, setIP] = useState(null)
+const AutofillPage = ({ tab, reverseGeocoding }: SystemPageProps) => {
+ const [city, setCity] = useState('')
// const [configuration, setConfiguration] = useState('default')
// useEffect(() => {
@@ -24,6 +25,15 @@ const AutofillPage = ({ tab }: SystemPageProps) => {
// })
// }, [])
+ const changeUserAgent = () => {
+ // if (userAgentType !== 'custom') {
+ // setUserAgentType('custom')
+ // chrome.storage.local.set({
+ // userAgentType: 'custom',
+ // })
+ // }
+ }
+
return (
@@ -43,13 +53,13 @@ const AutofillPage = ({ tab }: SystemPageProps) => {
))} */}
- {/* */}
+ />
)
}
diff --git a/src/Popup/Pages/CurrentPage/index.tsx b/src/Popup/Pages/CurrentPage/index.tsx
index 76253a0..4f08575 100644
--- a/src/Popup/Pages/CurrentPage/index.tsx
+++ b/src/Popup/Pages/CurrentPage/index.tsx
@@ -6,26 +6,26 @@ interface CurrentPageProps {
}
const CurrentPage = ({ tab }: CurrentPageProps) => {
- let options: any
+ // let options: any
- function success(pos: any) {
- var crd = pos.coords
- console.log('Your current position is:')
- console.log(`Latitude : ${crd.latitude}`)
- console.log(`Longitude: ${crd.longitude}`)
- console.log(`More or less ${crd.accuracy} meters.`)
- }
+ // function success(pos: any) {
+ // var crd = pos.coords
+ // console.log('Your current position is:')
+ // console.log(`Latitude : ${crd.latitude}`)
+ // console.log(`Longitude: ${crd.longitude}`)
+ // console.log(`More or less ${crd.accuracy} meters.`)
+ // }
- function error(err: any) {
- console.error(`ERROR(${err.code}): ${err.message}`)
- }
+ // function error(err: any) {
+ // console.error(`ERROR(${err.code}): ${err.message}`)
+ // }
// options = {
// enableHighAccuracy: false,
// timeout: 5000,
// maximumAge: 0,
// }
- navigator.geolocation.watchPosition(success, error)
+ // navigator.geolocation.watchPosition(success, error)
return (
diff --git a/src/Popup/Pages/SystemPage/index.tsx b/src/Popup/Pages/SystemPage/index.tsx
index 43dbcf8..03a41fd 100644
--- a/src/Popup/Pages/SystemPage/index.tsx
+++ b/src/Popup/Pages/SystemPage/index.tsx
@@ -25,7 +25,19 @@ const SystemPage = ({ tab, ipData }: SystemPageProps) => {
chrome.storage.local.get(
['systemType', 'configuration', 'timezone', 'locale', 'lat', 'lon'],
(storage) => {
- if (storage.systemType !== 'default') {
+ console.log(ipData)
+ if (storage.systemType === 'matchIp' && ipData) {
+ setTimezone(ipData.timezone)
+ setLocale(countryLocales[ipData.countryCode].locale)
+ setLatitude(`${ipData.lat}`)
+ setLongitude(`${ipData.lon}`)
+ chrome.storage.local.set({
+ timezone: ipData.timezone,
+ locale: countryLocales[ipData.countryCode].locale,
+ lat: ipData.lat,
+ lon: ipData.lon,
+ })
+ } else if (storage.systemType === 'custom') {
storage.configuration && setConfiguration(storage.configuration)
storage.timezone && setTimezone(storage.timezone)
storage.locale && setLocale(storage.locale)
@@ -37,7 +49,7 @@ const SystemPage = ({ tab, ipData }: SystemPageProps) => {
: setSystemType('default')
}
)
- }, [])
+ }, [ipData])
const changeType = (e: ChangeEvent) => {
detachDebugger()
diff --git a/src/Popup/Pages/UserAgentPage/index.tsx b/src/Popup/Pages/UserAgentPage/index.tsx
index 384a7a3..9a39391 100644
--- a/src/Popup/Pages/UserAgentPage/index.tsx
+++ b/src/Popup/Pages/UserAgentPage/index.tsx
@@ -4,6 +4,7 @@ import DebouncedInput from '../../Components/DebouncedInput'
import userAgents from '../../../utils/userAgents'
import detachDebugger from '../../../utils/detachDebugger'
import Page from '../../Components/Page'
+import CheckBox from '../../Components/CheckBox'
interface UserAgentPageProps {
tab: string
@@ -152,7 +153,9 @@ const UserAgentPage = ({ tab }: UserAgentPageProps) => {
value={userAgent}
setValue={setUserAgent}
onChange={changeUserAgent}
+ mb="12px"
/>
+
)
}
diff --git a/src/Popup/Popup.tsx b/src/Popup/Popup.tsx
index c42e34d..5e9d019 100644
--- a/src/Popup/Popup.tsx
+++ b/src/Popup/Popup.tsx
@@ -19,16 +19,27 @@ import WebRtcPage from './Pages/WebRtcPage'
import CurrentPage from './Pages/CurrentPage'
import { ipData } from '../types'
import getIp from '../utils/getIp'
+import getReverseGeocoding from '../utils/getReverseGeocoding'
import '../assets/global.css'
import OtherOptionsPage from './Pages/OtherOptionsPage'
const Popup = () => {
const [tab, setTab] = useState('autofill')
const [ipData, setIpData] = useState(undefined)
+ const [reverseGeocoding, setReverseGeocoding] = useState(undefined)
useEffect(() => {
- Promise.resolve(getIp()).then((data) => {
- setIpData(data)
+ getIp().then((ipDataRes) => {
+
+ setIpData(ipDataRes)
+ if (ipDataRes.lat && ipDataRes.lon) {
+ getReverseGeocoding(ipDataRes.lat, ipDataRes.lon).then(
+ (reverseGeocodingRes) => {
+ setReverseGeocoding(reverseGeocodingRes)
+ console.log(reverseGeocodingRes)
+ }
+ )
+ }
})
}, [])
@@ -91,7 +102,7 @@ const Popup = () => {
-
+
diff --git a/src/theme.ts b/src/theme.ts
index 2e0e86c..2aa3eea 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -24,6 +24,7 @@ export const theme: Theme = {
forms: {
label: { width: 'auto', alignItems: 'center' },
input: {
+ // border: '2px solid',
p: '2px 8px',
mb: '8px',
borderColor: 'grey',
@@ -33,6 +34,7 @@ export const theme: Theme = {
},
},
select: {
+ // border: '2px solid',
cursor: 'pointer',
p: '2px 8px',
borderColor: 'grey',
diff --git a/src/utils/getIp.ts b/src/utils/getIp.ts
index e13ac1f..cb1852c 100644
--- a/src/utils/getIp.ts
+++ b/src/utils/getIp.ts
@@ -2,6 +2,7 @@ const getIp = () =>
fetch('http://ip-api.com/json/')
.then((response) => response.json())
.then((ipData) => {
+ console.log(ipData)
chrome.storage.local.set({ ipData })
return ipData
})
diff --git a/src/utils/getReverseGeocoding.ts b/src/utils/getReverseGeocoding.ts
new file mode 100644
index 0000000..d45d0f9
--- /dev/null
+++ b/src/utils/getReverseGeocoding.ts
@@ -0,0 +1,12 @@
+const getReverseGeocoding = (lat: number, lon: number) =>
+ fetch(
+ `https://nominatim.openstreetmap.org/reverse?format=geojson&lat=${lat}&lon=${lon}`
+ )
+ .then((response) => response.json())
+ .then((data) => {
+ // chrome.storage.local.set({ ipData })
+ console.log(data)
+ return data.features[0].properties.address
+ })
+
+export default getReverseGeocoding