ui: Run code formatter.

This commit is contained in:
Orne Brocaar 2024-03-19 14:14:18 +00:00
parent 8cde912fdf
commit 54b10cb693
30 changed files with 236 additions and 78 deletions

View File

@ -92,23 +92,23 @@ function Header({ user }: { user: User }) {
label: any;
options: any[];
}[] = [
{
label: renderTitle("Tenants"),
options: [],
},
{
label: renderTitle("Gateways"),
options: [],
},
{
label: renderTitle("Applications"),
options: [],
},
{
label: renderTitle("Devices"),
options: [],
},
];
{
label: renderTitle("Tenants"),
options: [],
},
{
label: renderTitle("Gateways"),
options: [],
},
{
label: renderTitle("Applications"),
options: [],
},
{
label: renderTitle("Devices"),
options: [],
},
];
if (searchResult !== undefined) {
for (const res of searchResult.getResultList()) {

View File

@ -22,7 +22,7 @@
float: right;
}
.layout-header .actions>div {
.layout-header .actions > div {
display: inline;
padding-left: 24px;
}
@ -46,7 +46,7 @@
margin-top: 65px;
}
.layout-content .content-header>* {
.layout-content .content-header > * {
float: right;
}
@ -74,11 +74,11 @@ pre {
display: block;
}
.chart-doughnut>canvas {
.chart-doughnut > canvas {
width: 100vh;
}
.dashboard-chart>.ant-card-body {
.dashboard-chart > .ant-card-body {
height: 300px;
}
@ -127,4 +127,4 @@ pre {
.input-code input {
font-family: monospace !important;
}
}

View File

@ -24,7 +24,7 @@ class SessionStore extends EventEmitter {
this.client = new InternalServiceClient("");
this.tenants = [];
this.fetchProfile(() => { });
this.fetchProfile(() => {});
}
login = (email: string, password: string, callbackFunc: any) => {

View File

@ -17,7 +17,12 @@ function ApiKeyForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item label="Name" name="name" rules={[{ required: true, message: "Please enter a name!" }]}>
<Input />
</Form.Item>

View File

@ -29,7 +29,12 @@ function ApplicationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Tabs>
<Tabs.TabPane tab="General" key="1">
<Form.Item label="Name" name="name" rules={[{ required: true, message: "Please enter a name!" }]}>

View File

@ -23,7 +23,12 @@ function AzureServiceBusIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="Payload encoding"
name="encoding"

View File

@ -24,7 +24,12 @@ function GcpPubSubIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="Payload encoding"
name="encoding"

View File

@ -28,7 +28,12 @@ function HttpIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="Payload encoding"
name="encoding"

View File

@ -43,7 +43,12 @@ function IftttIntegrationForm(props: IProps) {
});
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="Key"
name="key"

View File

@ -46,7 +46,12 @@ function InfluxDbIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="InfluxDB version"
name="version"

View File

@ -87,7 +87,12 @@ function LoRaCloudIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Tabs>
<Tabs.TabPane tab="Modem & Geolocation Services" key="1">
<Form.Item

View File

@ -38,7 +38,12 @@ function MyDevicesIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="Select myDevices endpoint"
name="endpoint"

View File

@ -22,7 +22,12 @@ function PilotThingsIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="Pilot Things server"
name="server"

View File

@ -21,7 +21,12 @@ function ThingsBoardIntegrationForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="ThingsBoard server"
name="server"

View File

@ -119,7 +119,11 @@ function DevicesActiveInactive({ summary }: { summary?: GetDevicesSummaryRespons
maintainAspectRatio: false,
};
return <div className="chart-doughnut"><Doughnut data={data} options={options} /></div>;
return (
<div className="chart-doughnut">
<Doughnut data={data} options={options} />
</div>
);
}
function GatewaysActiveInactive({ summary }: { summary?: GetGatewaysSummaryResponse }) {
@ -150,7 +154,11 @@ function GatewaysActiveInactive({ summary }: { summary?: GetGatewaysSummaryRespo
maintainAspectRatio: false,
};
return <div className="chart-doughnut"><Doughnut data={data} options={options} /></div>;
return (
<div className="chart-doughnut">
<Doughnut data={data} options={options} />
</div>
);
}
function DevicesDataRates({ summary }: { summary?: GetDevicesSummaryResponse }) {
@ -210,7 +218,11 @@ function DevicesDataRates({ summary }: { summary?: GetDevicesSummaryResponse })
maintainAspectRatio: false,
};
return <div className="chart-doughnut"><Doughnut data={data} options={options} /></div>;
return (
<div className="chart-doughnut">
<Doughnut data={data} options={options} />
</div>
);
}
function Dashboard() {

View File

@ -118,7 +118,13 @@ function DeviceProfileTemplateForm(props: IProps) {
const adrOptions = adrAlgorithms.map(v => <Select.Option value={v[0]}>{v[1]}</Select.Option>);
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<Tabs>
<Tabs.TabPane tab="General" key="1">
<Form.Item

View File

@ -404,7 +404,13 @@ function DeviceProfileForm(props: IProps) {
);
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<TemplateModal visible={templateModalVisible} onOk={onTemplateModalOk} onCancel={onTemplateModalCancel} />
<Tabs tabBarExtraContent={operations} activeKey={tabActive} onChange={onTabChange}>
<Tabs.TabPane tab="General" key="1" forceRender>
@ -1136,11 +1142,7 @@ function DeviceProfileForm(props: IProps) {
</Form.Item>
</Col>
<Col span={10}>
<Form.Item
{...restField}
name={[name, 1, "name"]}
fieldKey={[name, 1, "name"]}
>
<Form.Item {...restField} name={[name, 1, "name"]} fieldKey={[name, 1, "name"]}>
<Input placeholder="Measurement name" disabled={props.disabled} />
</Form.Item>
</Col>

View File

@ -48,7 +48,13 @@ function LW10DeviceActivationForm(props: FormProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<DevAddrInput
label="Device address"
name="devAddr"
@ -109,7 +115,13 @@ function LW11DeviceActivationForm(props: FormProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<DevAddrInput
label="Device address"
name="devAddr"

View File

@ -80,7 +80,13 @@ function DeviceForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<Tabs>
<Tabs.TabPane tab="Device" key="1">
<Form.Item label="Name" name="name" rules={[{ required: true, message: "Please enter a name!" }]}>

View File

@ -71,7 +71,7 @@ function DeviceLayout(props: IProps) {
setDeviceProfile(resp.getDeviceProfile());
});
});
}
};
const deleteDevice = () => {
let req = new DeleteDeviceRequest();

View File

@ -175,7 +175,13 @@ function DeviceQueue(props: IProps) {
return (
<Space direction="vertical" style={{ width: "100%" }} size="large">
<Card title="Enqueue">
<Form layout="horizontal" onFinish={onEnqueue} onFinishFailed={onFinishFailed} form={form} initialValues={{ fPort: 1 }}>
<Form
layout="horizontal"
onFinish={onEnqueue}
onFinishFailed={onFinishFailed}
form={form}
initialValues={{ fPort: 1 }}
>
<Row>
<Space direction="horizontal" style={{ width: "100%" }} size="large">
<Form.Item name="confirmed" label="Confirmed" valuePropName="checked">
@ -192,13 +198,15 @@ function DeviceQueue(props: IProps) {
>
<Switch onChange={setIsEncrypted} />
</Form.Item>
{isEncrypted && (<Form.Item
name="fCntDown"
label="Downlink frame-counter used for encryption"
rules={[{ required: true, message: "Please enter a downlink frame-counter!" }]}
>
<InputNumber min={0} />
</Form.Item>)}
{isEncrypted && (
<Form.Item
name="fCntDown"
label="Downlink frame-counter used for encryption"
rules={[{ required: true, message: "Please enter a downlink frame-counter!" }]}
>
<InputNumber min={0} />
</Form.Item>
)}
</Space>
</Row>
<Tabs defaultActiveKey="1">

View File

@ -42,7 +42,13 @@ function LW10DeviceKeysForm(props: FormProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<AesKeyInput
label="Application key"
name="nwkKey"
@ -74,7 +80,13 @@ function LW11DeviceKeysForm(props: FormProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<AesKeyInput
label="Application key"
tooltip="For LoRaWAN 1.1 devices. In case your device does not support LoRaWAN 1.1, update the device-profile first."
@ -152,7 +164,7 @@ function SetDeviceKeys(props: IProps) {
const flushDevNonces = () => {
let req = new FlushDevNoncesRequest();
req.setDevEui(props.device.getDevEui());
DeviceStore.flushDevNonces(req, () => { });
DeviceStore.flushDevNonces(req, () => {});
};
if (!deviceKeysRequested) {

View File

@ -91,7 +91,13 @@ function GatewayForm(props: IProps) {
const location: [number, number] = [latValue, lonValue];
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<Tabs>
<Tabs.TabPane tab="General" key="1">
<Form.Item label="Name" name="name" rules={[{ required: true, message: "Please enter a name!" }]}>

View File

@ -58,4 +58,4 @@ export function onFinishFailed() {
description: "Please inspect input fields for errors",
duration: 3,
});
};
}

View File

@ -63,7 +63,13 @@ function MulticastGroupForm(props: IProps) {
.map(v => <Select.Option value={v}>{getEnumName(Region, v).replace("_", "-")}</Select.Option>);
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed} form={form}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<Form.Item label="Multicast-group name" name="name" rules={[{ required: true, message: "Please enter a name!" }]}>
<Input disabled={props.disabled} />
</Form.Item>

View File

@ -124,7 +124,11 @@ function GatewaysActiveInactive(props: GatewayProps) {
maintainAspectRatio: false,
};
return <div className="chart-doughnut"><Doughnut data={data} options={options} /></div>;
return (
<div className="chart-doughnut">
<Doughnut data={data} options={options} />
</div>
);
}
interface DeviceProps {
@ -161,7 +165,11 @@ function DevicesActiveInactive(props: DeviceProps) {
maintainAspectRatio: false,
};
return <div className="chart-doughnut"><Doughnut data={data} options={options} /></div>;
return (
<div className="chart-doughnut">
<Doughnut data={data} options={options} />
</div>
);
}
function DevicesDataRates(props: DeviceProps) {
@ -221,7 +229,11 @@ function DevicesDataRates(props: DeviceProps) {
maintainAspectRatio: false,
};
return <div className="chart-doughnut"><Doughnut data={data} options={options} /></div>;
return (
<div className="chart-doughnut">
<Doughnut data={data} options={options} />
</div>
);
}
function TenantDashboard({ tenant }: { tenant: Tenant }) {

View File

@ -34,7 +34,12 @@ function TenantForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Tabs>
<Tabs.TabPane tab="General" key="1">
<Form.Item label="Name" name="name" rules={[{ required: true, message: "Please enter a name!" }]}>
@ -123,17 +128,20 @@ function TenantForm(props: IProps) {
<Input placeholder="Value" disabled={props.disabled} />
</Form.Item>
</Col>
{!props.disabled &&
{!props.disabled && (
<Col span={2}>
<MinusCircleOutlined onClick={() => remove(name)} />
</Col>}
</Col>
)}
</Row>
))}
{!props.disabled && <Form.Item>
<Button type="dashed" onClick={() => add()} block icon={<PlusOutlined />}>
Add tag
</Button>
</Form.Item>}
{!props.disabled && (
<Form.Item>
<Button type="dashed" onClick={() => add()} block icon={<PlusOutlined />}>
Add tag
</Button>
</Form.Item>
)}
</>
)}
</Form.List>

View File

@ -38,7 +38,12 @@ function TenantUserForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item
label="Email (of existing user)"
tooltip="An user without additional permissions will be able to see all resources under this tenant and will be able to send and receive device payloads."

View File

@ -4,7 +4,11 @@ import { useLocation, useNavigate } from "react-router-dom";
import { Row, Col, Card } from "antd";
import { Form, Input, Button } from "antd";
import { SettingsResponse, OpenIdConnectLoginRequest, OAuth2LoginRequest } from "@chirpstack/chirpstack-api-grpc-web/api/internal_pb";
import {
SettingsResponse,
OpenIdConnectLoginRequest,
OAuth2LoginRequest,
} from "@chirpstack/chirpstack-api-grpc-web/api/internal_pb";
import SessionStore from "../../stores/SessionStore";
import InternalStore from "../../stores/InternalStore";
@ -54,7 +58,6 @@ function OidcLogin({ loginUrl, loginLabel }: OidcLoginProps) {
);
}
function OAuth2Login({ loginUrl, loginLabel }: OAuth2LoginProps) {
return (
<Row style={{ marginTop: "200px" }}>
@ -134,7 +137,7 @@ function Login() {
const [oAuth2LoginUrl, setOAuth2LoginUrl] = useState<string>("");
useEffect(() => {
SessionStore.logout(true, () => { });
SessionStore.logout(true, () => {});
InternalStore.settings((resp: SettingsResponse) => {
const oidc = resp.getOpenidConnect()!;

View File

@ -29,7 +29,12 @@ function UserForm(props: IProps) {
};
return (
<Form layout="vertical" initialValues={props.initialValues.toObject()} onFinish={onFinish} onFinishFailed={onFinishFailed}>
<Form
layout="vertical"
initialValues={props.initialValues.toObject()}
onFinish={onFinish}
onFinishFailed={onFinishFailed}
>
<Form.Item label="Email" name="email" rules={[{ required: true, message: "Please enter an email address!" }]}>
<Input />
</Form.Item>