Run yarn format.

ui/src/components/Header.tsx

@@ -72,13 +72,13 @@ class Header extends Component<IProps, IState> {
     if (!oidc.getEnabled() || oidc.getLogoutUrl() === "") {
       SessionStore.logout(true, () => {
         this.props.history.push("/login");
-      }); 
+      });
     } else {
       SessionStore.logout(false, () => {
         window.location.assign(oidc.getLogoutUrl());
       });
     }
-  }
+  };
 
   render() {
     if (this.state.settings === undefined) {
@@ -94,9 +94,7 @@ class Header extends Component<IProps, IState> {
             <Link to={`/users/${this.props.user.getId()}/password`}>Change password</Link>
           </Menu.Item>
         )}
-        <Menu.Item onClick={this.onLogout}>
+        <Menu.Item onClick={this.onLogout}>Logout</Menu.Item>
-          Logout
-        </Menu.Item>
       </Menu>
     );
 

ui/src/components/Menu.tsx

@@ -186,9 +186,7 @@ class SideMenu extends Component<RouteComponentProps, IState> {
         key: "ns",
         label: "Network Server",
         icon: <CloudOutlined />,
-        children: [
+        children: [{ key: "ns-regions", icon: <CompassOutlined />, label: <Link to="/regions">Regions</Link> }],
-          { key: "ns-regions", icon: <CompassOutlined />, label: <Link to="/regions">Regions</Link> },
-        ],
       });
     }
 

ui/src/stores/InternalStore.ts

@@ -211,7 +211,7 @@ class InternalStore extends EventEmitter {
 
       callbackFunc(resp);
     });
-  }
+  };
 
   getRegion = (req: GetRegionRequest, callbackFunc: (resp: GetRegionResponse) => void) => {
     this.client.getRegion(req, SessionStore.getMetadata(), (err, resp) => {
@@ -222,7 +222,7 @@ class InternalStore extends EventEmitter {
 
       callbackFunc(resp);
     });
-  }
+  };
 }
 
 const internalStore = new InternalStore();

ui/src/views/regions/ListRegions.tsx

@@ -4,10 +4,7 @@ import { Link } from "react-router-dom";
 import { Space, Breadcrumb, PageHeader, Table } from "antd";
 
 import { Region } from "@chirpstack/chirpstack-api-grpc-web/common/common_pb";
-import {
+import { ListRegionsResponse, RegionListItem } from "@chirpstack/chirpstack-api-grpc-web/api/internal_pb";
-  ListRegionsResponse,
-  RegionListItem,
-} from "@chirpstack/chirpstack-api-grpc-web/api/internal_pb";
 
 import { getEnumName } from "../helpers";
 import InternalStore from "../../stores/InternalStore";
@@ -18,7 +15,6 @@ interface IState {
   regions?: ListRegionsResponse;
 }
 
-
 class ListRegions extends Component<IProps, IState> {
   constructor(props: IProps) {
     super(props);
@@ -65,9 +61,7 @@ class ListRegions extends Component<IProps, IState> {
               title: "Name",
               dataIndex: "name",
               key: "name",
-              render: (text, record) => (
+              render: (text, record) => <Link to={`/regions/${text}`}>{text}</Link>,
-                <Link to={`/regions/${text}`}>{text}</Link>
-              ),
             },
             {
               title: "Region",

ui/src/views/regions/RegionDetails.tsx

@@ -6,10 +6,7 @@ import { Space, Breadcrumb, PageHeader, Card, Row, Col, List, Typography } from
 import ReactMarkdown from "react-markdown";
 
 import { Region } from "@chirpstack/chirpstack-api-grpc-web/common/common_pb";
-import {
+import { GetRegionRequest, GetRegionResponse } from "@chirpstack/chirpstack-api-grpc-web/api/internal_pb";
-  GetRegionRequest,
-  GetRegionResponse,
-} from "@chirpstack/chirpstack-api-grpc-web/api/internal_pb";
 
 import { getEnumName } from "../helpers";
 import InternalStore from "../../stores/InternalStore";
@@ -19,7 +16,7 @@ interface MatchParams {
 }
 
 interface IState {
-  region?: GetRegionResponse,
+  region?: GetRegionResponse;
 }
 
 interface IProps extends RouteComponentProps<MatchParams> {}
@@ -56,7 +53,9 @@ class RegionDetails extends Component<IProps, IState> {
                 <span>Network Server</span>
               </Breadcrumb.Item>
               <Breadcrumb.Item>
-                <span><Link to="/regions">Regions</Link></span>
+                <span>
+                  <Link to="/regions">Regions</Link>
+                </span>
               </Breadcrumb.Item>
               <Breadcrumb.Item>
                 <span>{this.props.match.params.name}</span>
@@ -66,14 +65,14 @@ class RegionDetails extends Component<IProps, IState> {
           title={this.props.match.params.name}
           subTitle={`common-name: ${getEnumName(Region, this.state.region.getRegion())}`}
         />
-        {this.state.region.getUserInfo() !== "" && <Card>
+        {this.state.region.getUserInfo() !== "" && (
-          <ReactMarkdown>
+          <Card>
-            {this.state.region.getUserInfo()}
+            <ReactMarkdown>{this.state.region.getUserInfo()}</ReactMarkdown>
-          </ReactMarkdown>
+          </Card>
-        </Card>}
+        )}
         <Row gutter={24}>
           <Col span={12}>
-            <Space direction="vertical" style={{width: "100%"}} size="large">
+            <Space direction="vertical" style={{ width: "100%" }} size="large">
               <Card title="Uplink channels">
                 <List
                   itemLayout="horizontal"
@@ -91,7 +90,7 @@ class RegionDetails extends Component<IProps, IState> {
             </Space>
           </Col>
           <Col span={12}>
-            <Space direction="vertical" style={{width: "100%"}} size="large">
+            <Space direction="vertical" style={{ width: "100%" }} size="large">
               <Card title="Downlink">
                 <List
                   dataSource={[
@@ -100,16 +99,35 @@ class RegionDetails extends Component<IProps, IState> {
                     ["RX2 DR", this.state.region.getRx2Dr()],
                     ["RX2 frequency", `${this.state.region.getRx2Frequency()} Hz`],
                   ]}
-                  renderItem={item => <List.Item><Typography.Text strong style={{width: "175px", display: "block", float: "left"}}>{item[0]}:</Typography.Text> {item[1]}</List.Item>}
+                  renderItem={item => (
+                    <List.Item>
+                      <Typography.Text strong style={{ width: "175px", display: "block", float: "left" }}>
+                        {item[0]}:
+                      </Typography.Text>{" "}
+                      {item[1]}
+                    </List.Item>
+                  )}
                 />
               </Card>
               <Card title="Class-B">
                 <List
                   dataSource={[
                     ["Ping-slot DR", this.state.region.getClassBPingSlotDr()],
-                    ["Ping-slot frequency", this.state.region.getClassBPingSlotFrequency() === 0 ? "default frequency or frequency hopping" : `${this.state.region.getClassBPingSlotFrequency()} Hz`],
+                    [
+                      "Ping-slot frequency",
+                      this.state.region.getClassBPingSlotFrequency() === 0
+                        ? "default frequency or frequency hopping"
+                        : `${this.state.region.getClassBPingSlotFrequency()} Hz`,
+                    ],
                   ]}
-                  renderItem={item => <List.Item><Typography.Text strong style={{width: "175px", display: "block", float: "left"}}>{item[0]}:</Typography.Text> {item[1]}</List.Item>}
+                  renderItem={item => (
+                    <List.Item>
+                      <Typography.Text strong style={{ width: "175px", display: "block", float: "left" }}>
+                        {item[0]}:
+                      </Typography.Text>{" "}
+                      {item[1]}
+                    </List.Item>
+                  )}
                 />
               </Card>
             </Space>