Create a widget to define priority

This commit is contained in:
Pierre HUBERT 2024-01-04 15:38:58 +01:00
parent 3eab3ba4b5
commit 2649bfbd25
3 changed files with 33 additions and 14 deletions

View File

@ -0,0 +1,21 @@
import { ServerApi } from "../../api/ServerApi";
import { TextInput } from "./TextInput";
export function NWFilterPriorityInput(p: {
editable: boolean;
label: string;
value?: number;
onChange: (priority?: number) => void;
}): React.ReactElement {
return (
<TextInput
{...p}
value={p.value?.toString()}
type="number"
onValueChange={(v) => {
p.onChange?.(v && v !== "" ? Number(v) : undefined);
}}
size={ServerApi.Config.constraints.nwfilter_priority}
/>
);
}

View File

@ -26,6 +26,7 @@ import { MACInput } from "./MACInput";
import { PortInput } from "./PortInput"; import { PortInput } from "./PortInput";
import { SelectInput } from "./SelectInput"; import { SelectInput } from "./SelectInput";
import { TextInput } from "./TextInput"; import { TextInput } from "./TextInput";
import { NWFilterPriorityInput } from "./NWFilterPriorityInput";
export function NWFilterRules(p: { export function NWFilterRules(p: {
editable: boolean; editable: boolean;
@ -133,16 +134,14 @@ function NWRuleEdit(p: {
]} ]}
/> />
<span style={{ width: "20px" }}></span> <span style={{ width: "20px" }}></span>
<TextInput <NWFilterPriorityInput
{...p}
label="Priority" label="Priority"
editable={p.editable} value={p.rule.priority}
value={p.rule.priority?.toString()} onChange={(v) => {
type="number" p.rule.priority = v;
onValueChange={(v) => {
p.rule.priority = v && v !== "" ? Number(v) : undefined;
p.onChange?.(); p.onChange?.();
}} }}
size={ServerApi.Config.constraints.nwfilter_priority}
/> />
</div> </div>

View File

@ -18,6 +18,7 @@ import { ServerApi } from "../../api/ServerApi";
import { SelectInput } from "../forms/SelectInput"; import { SelectInput } from "../forms/SelectInput";
import { NWFSelectReferencedFilters } from "../forms/NWFSelectReferencedFilters"; import { NWFSelectReferencedFilters } from "../forms/NWFSelectReferencedFilters";
import { NWFilterRules } from "../forms/NWFilterRules"; import { NWFilterRules } from "../forms/NWFilterRules";
import { NWFilterPriorityInput } from "../forms/NWFilterPriorityInput";
interface DetailsProps { interface DetailsProps {
nwfilter: NWFilter; nwfilter: NWFilter;
@ -133,16 +134,14 @@ function NetworkFilterDetailsTabGeneral(
})} })}
/> />
<TextInput <NWFilterPriorityInput
{...p}
label="Priority" label="Priority"
editable={p.editable} value={p.nwfilter.priority}
value={p.nwfilter.priority?.toString()} onChange={(pri) => {
type="number" p.nwfilter.priority = pri;
onValueChange={(v) => {
p.nwfilter.priority = v && v !== "" ? Number(v) : undefined;
p.onChange?.(); p.onChange?.();
}} }}
size={ServerApi.Config.constraints.nwfilter_priority}
/> />
</EditSection> </EditSection>