vodorod/parcer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: standard proxy and automatic proxy rotation tabs

Browse Source
This commit is contained in:
karishmas6
2024-10-24 18:26:11 +05:30
parent dac5720b4f
commit 1c13845302
1 changed files with 78 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

138
src/components/organisms/ProxyForm.tsx
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { styled } from '@mui/system'; import { styled } from '@mui/system';
import { TextField, Button, Switch, FormControlLabel, Box, Typography } from '@mui/material'; import { TextField, Button, Switch, FormControlLabel, Box, Typography, Tabs, Tab } from '@mui/material';
import { sendProxyConfig } from '../../api/proxy'; import { sendProxyConfig } from '../../api/proxy';
import { useGlobalInfoStore } from '../../context/globalInfo'; import { useGlobalInfoStore } from '../../context/globalInfo';
@@ -27,6 +27,7 @@ const ProxyForm: React.FC = () => {
username: '', username: '',
password: '', password: '',
}); });
const [tabIndex, setTabIndex] = useState(0);
const { notify } = useGlobalInfoStore(); const { notify } = useGlobalInfoStore();
@@ -82,71 +83,88 @@ const ProxyForm: React.FC = () => {
}); });
}; };
const handleTabChange = (event: React.SyntheticEvent, newValue: number) => {
setTabIndex(newValue);
};
return ( return (
<FormContainer> <FormContainer>
<Typography variant="h6" gutterBottom component="div" style={{ marginTop: '20px' }}> <Typography variant="h6" gutterBottom component="div" style={{ marginTop: '20px' }}>
Proxy Configuration Proxy Configuration
</Typography> </Typography>
<Box component="form" onSubmit={handleSubmit} sx={{ maxWidth: 400, width: '100%' }}> <Tabs value={tabIndex} onChange={handleTabChange}>
<FormControl> <Tab label="Standard Proxy" />
<TextField <Tab label="Automatic Proxy Rotation" />
label="Proxy Server URL" </Tabs>
name="server_url" {tabIndex === 0 && (
value={proxyConfig.server_url} <Box component="form" onSubmit={handleSubmit} sx={{ maxWidth: 400, width: '100%' }}>
onChange={handleChange} <FormControl>
<TextField
label="Proxy Server URL"
name="server_url"
value={proxyConfig.server_url}
onChange={handleChange}
fullWidth
required
error={!!errors.server_url}
helperText={errors.server_url || `Proxy to be used for all robots. HTTP and SOCKS proxies are supported.
Example http://myproxy.com:3128 or socks5://myproxy.com:3128.
Short form myproxy.com:3128 is considered an HTTP proxy.`}
/>
</FormControl>
<FormControl>
<FormControlLabel
control={<Switch checked={requiresAuth} onChange={handleAuthToggle} />}
label="Requires Authentication?"
/>
</FormControl>
{requiresAuth && (
<>
<FormControl>
<TextField
label="Username"
name="username"
value={proxyConfig.username}
onChange={handleChange}
fullWidth
required={requiresAuth}
error={!!errors.username}
helperText={errors.username || ''}
/>
</FormControl>
<FormControl>
<TextField
label="Password"
name="password"
value={proxyConfig.password}
onChange={handleChange}
type="password"
fullWidth
required={requiresAuth}
error={!!errors.password}
helperText={errors.password || ''}
/>
</FormControl>
</>
)}
<Button
variant="contained"
color="primary"
type="submit"
fullWidth fullWidth
required disabled={!proxyConfig.server_url || (requiresAuth && (!proxyConfig.username || !proxyConfig.password))}
error={!!errors.server_url} >
helperText={errors.server_url || `Proxy to be used for all robots. HTTP and SOCKS proxies are supported. Add Proxy
Example http://myproxy.com:3128 or socks5://myproxy.com:3128. </Button>
Short form myproxy.com:3128 is considered an HTTP proxy.`} </Box>
/> )}
</FormControl> {tabIndex === 1 && (
<FormControl> <Box sx={{ maxWidth: 400, width: '100%', textAlign: 'center', marginTop: '20px' }}>
<FormControlLabel <Button variant="contained" color="primary">
control={<Switch checked={requiresAuth} onChange={handleAuthToggle} />} Join Our Cloud Waitlist
label="Requires Authentication?" </Button>
/> </Box>
</FormControl> )}
{requiresAuth && (
<>
<FormControl>
<TextField
label="Username"
name="username"
value={proxyConfig.username}
onChange={handleChange}
fullWidth
required={requiresAuth}
error={!!errors.username}
helperText={errors.username || ''}
/>
</FormControl>
<FormControl>
<TextField
label="Password"
name="password"
value={proxyConfig.password}
onChange={handleChange}
type="password"
fullWidth
required={requiresAuth}
error={!!errors.password}
helperText={errors.password || ''}
/>
</FormControl>
</>
)}
<Button
variant="contained"
color="primary"
type="submit"
fullWidth
disabled={!proxyConfig.server_url || (requiresAuth && (!proxyConfig.username || !proxyConfig.password))}
>
Add Proxy
</Button>
</Box>
</FormContainer> </FormContainer>
); );
}; };