mirror of https://github.com/jetkvm/kvm.git
feat(ui): enhance DHCP lease management with renewal confirmation and improved dialog
This commit is contained in:
parent
47c47b0501
commit
750d21ad81
|
@ -97,6 +97,7 @@ export function ConfirmDialog({
|
|||
)}
|
||||
<Button
|
||||
size="SM"
|
||||
type="button"
|
||||
theme={buttonTheme}
|
||||
text={isConfirming ? `${confirmText}...` : confirmText}
|
||||
onClick={onConfirm}
|
||||
|
|
|
@ -29,10 +29,24 @@ export default function DhcpLeaseCard({
|
|||
<GridCard>
|
||||
<div className="animate-fadeIn p-4 text-black opacity-0 animation-duration-500 dark:text-white">
|
||||
<div className="space-y-3">
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-base font-bold text-slate-900 dark:text-white">
|
||||
DHCP Lease Information
|
||||
</h3>
|
||||
|
||||
<div>
|
||||
<Button
|
||||
size="XS"
|
||||
theme="light"
|
||||
type="button"
|
||||
className="text-red-500"
|
||||
text="Renew DHCP Lease"
|
||||
LeadingIcon={LuRefreshCcw}
|
||||
onClick={() => setShowRenewLeaseConfirm(true)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex gap-x-6 gap-y-2">
|
||||
<div className="flex-1 space-y-2">
|
||||
{networkState?.dhcp_lease?.ip && (
|
||||
|
@ -209,17 +223,6 @@ export default function DhcpLeaseCard({
|
|||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Button
|
||||
size="SM"
|
||||
theme="light"
|
||||
className="text-red-500"
|
||||
text="Renew DHCP Lease"
|
||||
LeadingIcon={LuRefreshCcw}
|
||||
onClick={() => setShowRenewLeaseConfirm(true)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</GridCard>
|
||||
|
|
|
@ -206,6 +206,16 @@ export default function SettingsNetworkRoute() {
|
|||
const ipv4mode = watch("ipv4_mode");
|
||||
const ipv6mode = watch("ipv6_mode");
|
||||
|
||||
const onDhcpLeaseRenew = () => {
|
||||
send("renewDHCPLease", {}, resp => {
|
||||
if ("error" in resp) {
|
||||
notifications.error("Failed to renew lease: " + resp.error.message);
|
||||
} else {
|
||||
notifications.success("DHCP lease renewed");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<FormProvider {...formMethods}>
|
||||
|
@ -496,15 +506,24 @@ export default function SettingsNetworkRoute() {
|
|||
</div>
|
||||
}
|
||||
/>
|
||||
|
||||
<ConfirmDialog
|
||||
open={showRenewLeaseConfirm}
|
||||
title="Renew DHCP lease"
|
||||
title="Renew DHCP Lease"
|
||||
variant="warning"
|
||||
confirmText="Renew lease"
|
||||
description="The device may briefly disconnect while requesting a new lease."
|
||||
confirmText="Renew Lease"
|
||||
description={
|
||||
<p>
|
||||
This will request a new IP address from your router. The device may briefly
|
||||
disconnect during the renewal process.
|
||||
<br />
|
||||
<br />
|
||||
If you receive a new IP address,{" "}
|
||||
<strong>you may need to reconnect using the new address</strong>.
|
||||
</p>
|
||||
}
|
||||
onConfirm={() => {
|
||||
setShowRenewLeaseConfirm(false);
|
||||
onDhcpLeaseRenew();
|
||||
}}
|
||||
onClose={() => setShowRenewLeaseConfirm(false)}
|
||||
/>
|
||||
|
|
Loading…
Reference in New Issue