Added component for profile select

This commit is contained in:
z0ccc 2022-05-10 18:59:57 -04:00
parent dde302a4bd
commit 564029eb55
5 changed files with 76 additions and 75 deletions

View file

@ -24,11 +24,6 @@ const attachTab = (tabId) => {
) {
chrome.debugger.attach({ tabId: tabId }, '1.3', () => {
if (!chrome.runtime.lastError) {
// chrome.debugger.sendCommand(
// { tabId: tabId },
// 'Emulation.clearTimezoneOverride'
// )
if (result.timezone) {
chrome.debugger.sendCommand(
{ tabId: tabId },

View file

@ -45,14 +45,10 @@ const DebugSettings = ({ type, title, ip, profile, setProfile }) => {
value={value}
onChange={changeTextValue}
style={{
width: '200px',
width: '206px',
}}
/>
<label>{title}</label>
{/* <label>
<input type="checkbox" checked={matchIP} onChange={toggleMatchIP} />
Match IP
</label> */}
</div>
)
}

View file

@ -1,8 +1,8 @@
import React, { useState, useEffect } from 'react'
import Navbar from './Navbar'
import IpSettings from './IpSettings'
import ProfileSelect from './ProfileSelect'
import DebugSettings from './DebugSettings'
import detachDebugger from '../../utils/detachDebugger'
import UserAgentSettings from './UserAgentSettings'
const getIP = () =>
@ -28,14 +28,6 @@ const Popup = () => {
})
}, [])
const changeProfile = (e) => {
detachDebugger()
chrome.storage.sync.set({
profile: e.target.value,
})
setProfile(e.target.value)
}
return (
<div className="App">
<Navbar />
@ -45,60 +37,7 @@ const Popup = () => {
}}
>
<IpSettings ip={ip} getIP={getIP} setIP={setIP} />
<div
style={{
display: 'flex',
justifyContent: 'space-between',
margin: '12px 0 0 0',
}}
>
<select
name="profile"
id="profile"
value={profile}
onChange={changeProfile}
style={{
width: '208px',
}}
>
<option value="none">None</option>
<option value="match">Match IP</option>
<option value="custom">Custom</option>
<optgroup label="Locations">
<option value="baghdad">Baghdad</option>
<option value="bangkok">Bangkok</option>
<option value="berlin">Berlin</option>
<option value="cairo">Cairo</option>
<option value="delhi">Delhi</option>
<option value="dubai">Dubai</option>
<option value="hongKong">Hong Kong</option>
<option value="houston">Houston</option>
<option value="istanbul">Istanbul</option>
<option value="jerusalem">Jerusalem</option>
<option value="kyiv">Kyiv</option>
<option value="lagos">Lagos</option>
<option value="london">London</option>
<option value="mecca">Mecca</option>
<option value="mexicoCity">Mexico City</option>
<option value="moscow">Moscow</option>
<option value="mumbai">Mumbai</option>
<option value="newYork">New York</option>
<option value="paris">Paris</option>
<option value="rome">Rome</option>
<option value="sanFrancisco">San Francisco</option>
<option value="saoPaulo">São Paulo</option>
<option value="seoul">Seoul</option>
<option value="shanghai">Shanghai</option>
<option value="singapore">Singapore</option>
<option value="sydney">Sydney</option>
<option value="tehran">Tehran</option>
<option value="tokyo">Tokyo</option>
<option value="toronto">Toronto</option>
</optgroup>
</select>
<label>Profile</label>
</div>
<ProfileSelect profile={profile} setProfile={setProfile} />
<DebugSettings
type="timezone"
title="Timezone"

View file

@ -0,0 +1,71 @@
import React from 'react'
import detachDebugger from '../../utils/detachDebugger'
const ProfileSelect = ({ profile, setProfile }) => {
const changeProfile = (e) => {
detachDebugger()
chrome.storage.sync.set({
profile: e.target.value,
})
setProfile(e.target.value)
}
return (
<div
style={{
display: 'flex',
justifyContent: 'space-between',
margin: '12px 0 0 0',
}}
>
<select
name="profile"
id="profile"
value={profile}
onChange={changeProfile}
style={{
width: '208px',
}}
>
<option value="none">None</option>
<option value="match">Match IP</option>
<option value="custom">Custom</option>
<optgroup label="Locations">
<option value="baghdad">Baghdad</option>
<option value="bangkok">Bangkok</option>
<option value="berlin">Berlin</option>
<option value="cairo">Cairo</option>
<option value="delhi">Delhi</option>
<option value="dubai">Dubai</option>
<option value="hongKong">Hong Kong</option>
<option value="houston">Houston</option>
<option value="istanbul">Istanbul</option>
<option value="jerusalem">Jerusalem</option>
<option value="kyiv">Kyiv</option>
<option value="lagos">Lagos</option>
<option value="london">London</option>
<option value="mecca">Mecca</option>
<option value="mexicoCity">Mexico City</option>
<option value="moscow">Moscow</option>
<option value="mumbai">Mumbai</option>
<option value="newYork">New York</option>
<option value="paris">Paris</option>
<option value="rome">Rome</option>
<option value="sanFrancisco">San Francisco</option>
<option value="saoPaulo">São Paulo</option>
<option value="seoul">Seoul</option>
<option value="shanghai">Shanghai</option>
<option value="singapore">Singapore</option>
<option value="sydney">Sydney</option>
<option value="tehran">Tehran</option>
<option value="tokyo">Tokyo</option>
<option value="toronto">Toronto</option>
</optgroup>
</select>
<label>Profile</label>
</div>
)
}
export default ProfileSelect

View file

@ -85,11 +85,11 @@ const UserAgentSettings = () => {
</label>
<label>
<input
type="text"
type="number"
value={interval}
onChange={changeInterval}
style={{
width: '24px',
width: '30px',
margin: '0 4px 0 0',
}}
/>