diff --git a/package.json b/package.json
index dd21067..49ef7a1 100755
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
"@hot-loader/react-dom": "^17.0.2",
"@mdx-js/react": "^2.1.2",
"@types/webpack-env": "^1.18.0",
+ "@types/webrtc": "^0.0.33",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-feather": "^2.0.10",
diff --git a/src/Popup/Components/CheckBox.tsx b/src/Popup/Components/CheckBox.tsx
new file mode 100644
index 0000000..c2067bd
--- /dev/null
+++ b/src/Popup/Components/CheckBox.tsx
@@ -0,0 +1,18 @@
+import { Label, Checkbox } from 'theme-ui'
+
+interface LocationPageProps {
+ title: string
+ onChange?: () => void
+ checked?: boolean
+}
+
+const CheckBox = ({ title, onChange, checked }: LocationPageProps) => {
+ return (
+
+ )
+}
+
+export default CheckBox
diff --git a/src/Popup/Pages/AddressAutofillPage/index.tsx b/src/Popup/Pages/AddressAutofillPage/index.tsx
new file mode 100644
index 0000000..de1713d
--- /dev/null
+++ b/src/Popup/Pages/AddressAutofillPage/index.tsx
@@ -0,0 +1,36 @@
+import { useState, useEffect } from 'react'
+import { Box } from 'theme-ui'
+
+import getIP from '../../../utils/getIP'
+
+interface LocationPageProps {
+ tab: string
+}
+
+const AddressAutofillPage = ({ tab }: LocationPageProps) => {
+ const [ip, setIP] = useState(null)
+ const [configuration, setConfiguration] = useState('default')
+
+ useEffect(() => {
+ chrome.storage.sync.get(['configuration', 'ipData'], (storage) => {
+ storage.configuration && setConfiguration(storage.configuration)
+ if (storage.ipData) {
+ setIP(storage.ipData)
+ } else {
+ Promise.resolve(getIP()).then((ipData) => setIP(ipData))
+ }
+ })
+ }, [])
+
+ return (
+
+ Address Autofill
+
+ )
+}
+
+export default AddressAutofillPage
diff --git a/src/Popup/Pages/LocationPage/index.tsx b/src/Popup/Pages/LocationPage/index.tsx
index e835fed..feae6e8 100644
--- a/src/Popup/Pages/LocationPage/index.tsx
+++ b/src/Popup/Pages/LocationPage/index.tsx
@@ -30,7 +30,7 @@ const LocationPage = ({ tab }: LocationPageProps) => {
display: tab === 'location' ? 'block' : 'none',
}}
>
- Location
+ Location Data
{
}}
>
Settings
-
+ /> */}
diff --git a/src/Popup/Pages/UserAgentPage/index.tsx b/src/Popup/Pages/UserAgentPage/index.tsx
index 196d318..dc960ee 100644
--- a/src/Popup/Pages/UserAgentPage/index.tsx
+++ b/src/Popup/Pages/UserAgentPage/index.tsx
@@ -65,7 +65,7 @@ const UserAgentPage = ({ tab }: UserAgentPageProps) => {
display: tab === 'useragent' ? 'block' : 'none',
}}
>
- User Agent
+ Other Options
{
+ // if (navigator.getUserMedia) {
+ const ipRegex =
+ /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/
+
+ // compatibility for firefox and chrome
+ let RTCPeerConnection = window.RTCPeerConnection
+
+ // minimal requirements for data connection
+ const mediaConstraints = {
+ optional: [{ RtpDataChannels: true }],
+ }
+
+ const servers = { iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] }
+
+ // construct a new RTCPeerConnection
+ const pc = new RTCPeerConnection(servers, mediaConstraints)
+
+ let ips: any = []
+
+ // listen for candidate events
+ pc.onicecandidate = (ice) => {
+ // skip non-candidate events
+ if (ice.candidate) {
+ const ip = ipRegex.exec(ice.candidate.candidate)
+ if (ip !== null && ip.length > 1) {
+ ips.push(ip[1])
+ }
+ }
+ }
+
+ // create a bogus data channel
+ pc.createDataChannel('')
+
+ // create an offer sdp
+ pc.createOffer(
+ (result) => {
+ // trigger the stun server request
+ pc.setLocalDescription(
+ result,
+ () => {},
+ () => {}
+ )
+ },
+ () => {}
+ )
+
+ const waitForElement = async () => {
+ if (pc.localDescription) {
+ const lines = pc.localDescription.sdp.split('\n')
+ lines.forEach((line) => {
+ if (line.indexOf('a=candidate:') === 0) {
+ const ip = ipRegex.exec(line)
+ if (ip !== null && ip.length > 1) {
+ ips.push(ip[1])
+ }
+ }
+ })
+ ips = [...new Set(ips)]
+ console.log(ips)
+ setWebRtcIp(await Promise.all(ips))
+ } else {
+ setTimeout(waitForElement, 1000)
+ }
+ }
+
+ waitForElement()
+ // } else {
+ // setWebRTCData([])
+ // }
+}
+
+export default getWebRTC
diff --git a/src/Popup/Pages/WebRtcPage/handleWebRtcPolicy.ts b/src/Popup/Pages/WebRtcPage/handleWebRtcPolicy.ts
new file mode 100644
index 0000000..56edb56
--- /dev/null
+++ b/src/Popup/Pages/WebRtcPage/handleWebRtcPolicy.ts
@@ -0,0 +1,17 @@
+const handleWebRtcPolicy = (value: string) => {
+ console.log(value)
+ chrome.privacy.network.webRTCIPHandlingPolicy.clear({}, () => {
+ chrome.privacy.network.webRTCIPHandlingPolicy.set(
+ {
+ value,
+ },
+ () => {
+ chrome.storage.sync.set({
+ webRtcPolicy: value,
+ })
+ }
+ )
+ })
+}
+
+export default handleWebRtcPolicy
diff --git a/src/Popup/Pages/WebRtcPage/index.tsx b/src/Popup/Pages/WebRtcPage/index.tsx
new file mode 100644
index 0000000..2a22e1c
--- /dev/null
+++ b/src/Popup/Pages/WebRtcPage/index.tsx
@@ -0,0 +1,67 @@
+import { useState, useEffect } from 'react'
+import { Box, Button, Select } from 'theme-ui'
+import getWebRTCData from './getWebRTCData'
+import handleWebRtcPolicy from './handleWebRtcPolicy'
+
+interface LocationPageProps {
+ tab: string
+}
+
+const WebRtcPage = ({ tab }: LocationPageProps) => {
+ const [webRtcPolicy, setWebRtcPolicy] = useState('default')
+ const [webRtcIp, setWebRtcIp] = useState([])
+
+ useEffect(() => {
+ chrome.storage.sync.get(['webRtcPolicy'], (storage) => {
+ storage.webRtcPolicy && setWebRtcPolicy(storage.webRtcPolicy)
+ })
+ }, [])
+
+ chrome.privacy.network.webRTCIPHandlingPolicy.onChange.addListener(function (
+ details
+ ) {
+ console.log(details)
+ setWebRtcPolicy(details.value)
+ })
+
+ return (
+
+ WebRTC
+
+
+ IP: {JSON.stringify(webRtcIp)}
+
+
+
+ )
+}
+
+export default WebRtcPage
diff --git a/src/Popup/Popup.tsx b/src/Popup/Popup.tsx
index b416664..a0c2f88 100644
--- a/src/Popup/Popup.tsx
+++ b/src/Popup/Popup.tsx
@@ -14,9 +14,11 @@ import TabItem from './TabItem'
import LocationPage from './Pages/LocationPage'
import UserAgentPage from './Pages/UserAgentPage'
import SettingsPage from './Pages/SettingsPage'
+import AddressAutofillPage from './Pages/AddressAutofillPage'
+import WebRtcPage from './Pages/WebRtcPage'
const Popup = () => {
- const [tab, setTab] = useState('settings')
+ const [tab, setTab] = useState('webRtc')
return (
@@ -41,13 +43,13 @@ const Popup = () => {
/>
setTab('AdressAutofill')}
+ active={tab === 'addressAutofill'}
+ onClick={() => setTab('addressAutofill')}
/>
setTab('WebRTC')}
+ active={tab === 'webRtc'}
+ onClick={() => setTab('webRtc')}
/>
{
+
+
{/* {
- chrome.storage.sync.get(['isWebRtcDisabled'], (storage) => {
- const value = storage.isWebRtcDisabled
- ? 'default'
- : 'disable_non_proxied_udp'
-
- chrome.privacy.network.webRTCIPHandlingPolicy.clear({}, () => {
- chrome.privacy.network.webRTCIPHandlingPolicy.set(
- {
- value,
- },
- () => {
- chrome.storage.sync.set({
- isWebRtcDisabled: !storage.isWebRtcDisabled,
- })
- }
- )
- })
- })
-}
-
-export default setWebRtcPolicy
diff --git a/tsconfig.json b/tsconfig.json
index ed3cf46..f709e41 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,6 +1,6 @@
{
"compilerOptions": {
- "target": "es5",
+ "target": "es6",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": false,
"skipLibCheck": true,
@@ -15,7 +15,6 @@
"noEmit": false,
"jsx": "react-jsx",
"jsxImportSource": "theme-ui"
-
},
"include": ["src"],
"exclude": ["build", "node_modules"]
diff --git a/yarn.lock b/yarn.lock
index ad667e0..996df06 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1645,6 +1645,11 @@
resolved "https://registry.yarnpkg.com/@types/webpack-env/-/webpack-env-1.18.0.tgz#ed6ecaa8e5ed5dfe8b2b3d00181702c9925f13fb"
integrity sha512-56/MAlX5WMsPVbOg7tAxnYvNYMMWr/QJiIp6BxVSW3JJXUVzzOn64qW8TzQyMSqSUFM2+PVI4aUHcHOzIz/1tg==
+"@types/webrtc@^0.0.33":
+ version "0.0.33"
+ resolved "https://registry.yarnpkg.com/@types/webrtc/-/webrtc-0.0.33.tgz#8d5c64320741c9b0bd1cdd2890f12d9e6b5ae210"
+ integrity sha512-xjN6BelzkY3lzXjIjXGqJVDS6XDleEsvp1bVIyNccXCcMoTH3wvUXFew4/qflwJdNqjmq98Zc5VcALV+XBKBvg==
+
"@types/ws@^8.5.1":
version "8.5.3"
resolved "https://registry.yarnpkg.com/@types/ws/-/ws-8.5.3.tgz#7d25a1ffbecd3c4f2d35068d0b283c037003274d"