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

feat: use radio for proxy type + style improvements

Browse Source
This commit is contained in:
karishmas6
2024-09-30 23:27:59 +05:30
parent 15ac55b44a
commit 83adb99b04
1 changed files with 47 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,32 +1,24 @@
import React, { useState } from 'react';
import { TextField, Button, MenuItem, Box } from '@mui/material';
import { TextField, Button, RadioGroup, FormControlLabel, Radio, Box } from '@mui/material';
import { styled } from '@mui/system';
import axios from 'axios';
const proxyTypes = [
{ label: 'HTTP', value: 'http' },
{ label: 'HTTPS', value: 'https' },
{ label: 'SOCKS5', value: 'socks5' },
];
const FormContainer = styled(Box)({
display: 'flex',
flexDirection: 'column',
gap: '20px',
width: '400px',
margin: '0 auto',
gap: '16px',
padding: '20px',
backgroundColor: '#f9f9f9',
borderRadius: '8px',
});
const FormControl = styled(Box)({
marginBottom: '10px',
marginBottom: '16px',
});
const ProxyForm: React.FC = () => {
const [proxyConfig, setProxyConfig] = useState({
type: '',
type: 'http',
server: '',
username: '',
password: '',
@@ -41,7 +33,7 @@ const ProxyForm: React.FC = () => {
e.preventDefault();
try {
const response = await axios.post('/api/proxy', proxyConfig);
alert(`Successfully added the proxy`);
alert(`Success!`);
} catch (error) {
alert('Error submitting proxy configuration');
}
@@ -50,48 +42,51 @@ const ProxyForm: React.FC = () => {
return (
<FormContainer>
<form onSubmit={handleSubmit}>
<TextField
select
label="Proxy Type"
name="type"
value={proxyConfig.type}
onChange={handleChange}
fullWidth
required
>
{proxyTypes.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</TextField>
<FormControl>
<RadioGroup
name="type"
value={proxyConfig.type}
onChange={handleChange}
row
>
<FormControlLabel value="http" control={<Radio />} label="HTTP" />
<FormControlLabel value="https" control={<Radio />} label="HTTPS" />
<FormControlLabel value="socks5" control={<Radio />} label="SOCKS5" />
</RadioGroup>
</FormControl>
<TextField
label="Proxy Server URL"
name="server"
value={proxyConfig.server}
onChange={handleChange}
fullWidth
required
helperText="e.g., http://proxy-server.com:8080"
/>
<FormControl>
<TextField
label="Proxy Server URL"
name="server"
value={proxyConfig.server}
onChange={handleChange}
fullWidth
required
helperText="e.g., http://proxy-server.com:8080"
/>
</FormControl>
<TextField
label="Username (Optional)"
name="username"
value={proxyConfig.username}
onChange={handleChange}
fullWidth
/>
<FormControl>
<TextField
label="Username (Optional)"
name="username"
value={proxyConfig.username}
onChange={handleChange}
fullWidth
/>
</FormControl>
<TextField
label="Password (Optional)"
name="password"
value={proxyConfig.password}
onChange={handleChange}
type="password"
fullWidth
/>
<FormControl>
<TextField
label="Password (Optional)"
name="password"
value={proxyConfig.password}
onChange={handleChange}
type="password"
fullWidth
/>
</FormControl>
<Button variant="contained" color="primary" type="submit" fullWidth>
Submit Proxy