You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
154 lines
5.9 KiB
154 lines
5.9 KiB
'use client';
|
|
|
|
import { useState, useEffect } from 'react';
|
|
import { useNotification } from '@/app/context/NotificationContext';
|
|
|
|
export default function ConfigurePage() {
|
|
const [config, setConfig] = useState('');
|
|
const { showNotification } = useNotification();
|
|
const [showDialog, setShowDialog] = useState(false);
|
|
const [username, setUsername] = useState('');
|
|
const [password, setPassword] = useState('');
|
|
|
|
// Function to fetch the DHCP configuration
|
|
const fetchConfig = async () => {
|
|
try {
|
|
const response = await fetch('/api/dhcp/config');
|
|
const data = await response.json();
|
|
if (response.ok) {
|
|
setConfig(data.config);
|
|
showNotification('DHCP configuration loaded successfully.', 'success');
|
|
} else {
|
|
showNotification(data.error, 'error');
|
|
}
|
|
} catch (error) {
|
|
showNotification('Error loading DHCP configuration', 'error');
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
// Initial load of the DHCP configuration
|
|
fetchConfig();
|
|
}, []);
|
|
|
|
const handleConfigChange = (event) => {
|
|
setConfig(event.target.value);
|
|
};
|
|
|
|
const handleSave = async () => {
|
|
try {
|
|
const response = await fetch('/api/dhcp/config', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ config }),
|
|
});
|
|
const data = await response.json();
|
|
if (response.ok) {
|
|
showNotification('DHCP configuration updated and server restarted successfully.', 'success');
|
|
} else {
|
|
showNotification(data.error, 'error');
|
|
}
|
|
} catch (error) {
|
|
showNotification('Error updating configuration or restarting server', 'error');
|
|
}
|
|
};
|
|
|
|
// automatically add webserver to sudo
|
|
const openDialog = () => {
|
|
setShowDialog(true);
|
|
};
|
|
|
|
const closeDialog = () => {
|
|
setShowDialog(false);
|
|
};
|
|
|
|
const handleGrantSudoRights = async () => {
|
|
try {
|
|
const response = await fetch('/api/grant-sudo', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ username, password }),
|
|
});
|
|
const data = await response.json();
|
|
if (response.ok) {
|
|
showNotification('Sudo rights granted successfully.', 'success');
|
|
} else {
|
|
showNotification(data.error, 'error');
|
|
}
|
|
closeDialog();
|
|
} catch (error) {
|
|
showNotification('Error granting sudo rights', 'error');
|
|
}
|
|
};
|
|
|
|
|
|
return (
|
|
<div className="container mt-5">
|
|
<h1 className="mb-4">Configure DHCP Options</h1>
|
|
<div className="form-group">
|
|
<label htmlFor="dhcpConfig">DHCP Configuration</label>
|
|
<textarea
|
|
id="dhcpConfig"
|
|
className="form-control"
|
|
rows="20"
|
|
value={config}
|
|
onChange={handleConfigChange}
|
|
/>
|
|
</div>
|
|
<button className="btn btn-secondary mt-3 mr-2" onClick={fetchConfig}>
|
|
Refresh
|
|
</button>
|
|
<button className="btn btn-primary mt-3" onClick={handleSave}>
|
|
Save and Restart DHCP Server
|
|
</button>
|
|
<button className="btn btn-warning mt-3 ml-2" onClick={openDialog}>
|
|
Grant Sudo Rights
|
|
</button>
|
|
|
|
{showDialog && (
|
|
<div className="modal show" style={{display: 'block'}}>
|
|
<div className="modal-dialog">
|
|
<div className="modal-content">
|
|
<div className="modal-header">
|
|
<h5 className="modal-title">Grant Sudo Rights</h5>
|
|
<button type="button" className="btn-close" aria-label="Close"
|
|
onClick={closeDialog}></button>
|
|
</div>
|
|
<div className="modal-body">
|
|
<div className="form-group">
|
|
<label htmlFor="username">Username</label>
|
|
<input
|
|
type="text"
|
|
className="form-control"
|
|
id="username"
|
|
value={username}
|
|
onChange={(e) => setUsername(e.target.value)}
|
|
/>
|
|
</div>
|
|
<div className="form-group">
|
|
<label htmlFor="password">Password</label>
|
|
<input
|
|
type="password"
|
|
className="form-control"
|
|
id="password"
|
|
value={password}
|
|
onChange={(e) => setPassword(e.target.value)}
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div className="modal-footer">
|
|
<button type="button" className="btn btn-secondary" onClick={closeDialog}>
|
|
Cancel
|
|
</button>
|
|
<button type="button" className="btn btn-primary" onClick={handleGrantSudoRights}>
|
|
Grant Sudo Rights
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|