Add version information
parent
f853605898
commit
d1239a3ec0
89
src/app.tsx
89
src/app.tsx
|
@ -1,6 +1,6 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import { TailscaleBackendState, TailscalePeer, TailscaleStatus, TailscaleUp } from './types';
|
import { TailscaleBackendState, TailscalePeer, TailscaleStatus, TailscaleUp, TailscaleVersion } from './types';
|
||||||
import { Icon } from '@patternfly/react-core';
|
import { Icon } from '@patternfly/react-core';
|
||||||
import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
|
import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
|
||||||
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
|
import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
|
||||||
|
@ -16,21 +16,31 @@ type ApplicationProps = {
|
||||||
|
|
||||||
type ApplicationState = {
|
type ApplicationState = {
|
||||||
Status: TailscaleStatus
|
Status: TailscaleStatus
|
||||||
|
Version: TailscaleVersion
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
export class Application extends React.Component<ApplicationProps, ApplicationState> {
|
export class Application extends React.Component<ApplicationProps, ApplicationState> {
|
||||||
state: ApplicationState = {
|
state: ApplicationState = {
|
||||||
Status: null
|
Status: null,
|
||||||
|
Version: null
|
||||||
}
|
}
|
||||||
|
|
||||||
constructor(props: ApplicationProps) {
|
constructor(props: ApplicationProps) {
|
||||||
super(props);
|
super(props);
|
||||||
|
|
||||||
cockpit.spawn(['tailscale', 'status', '--json']).done(content => {
|
cockpit
|
||||||
const status: TailscaleStatus = JSON.parse(content)
|
.spawn(['tailscale', 'version', '--json'])
|
||||||
this.setState(state => ({ Status: status }));
|
.done(content => {
|
||||||
});
|
const version: TailscaleVersion = JSON.parse(content)
|
||||||
|
this.setState(state => ({ Version: version }));
|
||||||
|
});
|
||||||
|
|
||||||
|
cockpit
|
||||||
|
.spawn(['tailscale', 'status', '--json'])
|
||||||
|
.done(content => {
|
||||||
|
const status: TailscaleStatus = JSON.parse(content)
|
||||||
|
this.setState(state => ({ Status: status }));
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
@ -43,36 +53,41 @@ export class Application extends React.Component<ApplicationProps, ApplicationSt
|
||||||
<>
|
<>
|
||||||
{
|
{
|
||||||
this.state.Status != null
|
this.state.Status != null
|
||||||
? <Table
|
? <div>
|
||||||
aria-label="Tailscale peers"
|
<Table
|
||||||
variant='compact' borders={false}>
|
aria-label="Tailscale peers"
|
||||||
<Caption>Tailscale peers</Caption>
|
variant='compact' borders={false}>
|
||||||
<Thead>
|
<Caption>Tailscale peers</Caption>
|
||||||
<Tr>
|
<Thead>
|
||||||
<Th></Th>
|
<Tr>
|
||||||
<Th>IP</Th>
|
<Th></Th>
|
||||||
<Th>Hostname</Th>
|
<Th>IP</Th>
|
||||||
<Th>Network</Th>
|
<Th>Hostname</Th>
|
||||||
<Th>Tags</Th>
|
<Th>Network</Th>
|
||||||
<Th>State</Th>
|
<Th>Tags</Th>
|
||||||
<Th>Exit node</Th>
|
<Th>State</Th>
|
||||||
<Th>OS</Th>
|
<Th>Exit node</Th>
|
||||||
<Th>Traffic</Th>
|
<Th>OS</Th>
|
||||||
</Tr>
|
<Th>Traffic</Th>
|
||||||
</Thead>
|
</Tr>
|
||||||
<Tbody>
|
</Thead>
|
||||||
{ this.state.Status.Self.Self = true }
|
<Tbody>
|
||||||
<Peer {...this.state.Status.Self} />
|
{this.state.Status.Self.Self = true}
|
||||||
{
|
<Peer {...this.state.Status.Self} />
|
||||||
Object.values(this.state.Status.Peer)
|
{
|
||||||
.filter(isNotSharee)
|
Object.values(this.state.Status.Peer)
|
||||||
.map(peer => {
|
.filter(isNotSharee)
|
||||||
return <Peer {...peer} />
|
.map(peer => {
|
||||||
}
|
return <Peer {...peer} />
|
||||||
)
|
}
|
||||||
}
|
)
|
||||||
</Tbody>
|
}
|
||||||
</Table>
|
</Tbody>
|
||||||
|
</Table>
|
||||||
|
|
||||||
|
<div>Tailscale {this.state.Version.majorMinorPatch}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
: <p>Loading...</p>
|
: <p>Loading...</p>
|
||||||
}
|
}
|
||||||
</>
|
</>
|
||||||
|
|
|
@ -9,6 +9,15 @@ export type TailscaleBackendState =
|
||||||
| 'Starting'
|
| 'Starting'
|
||||||
| 'Running';
|
| 'Running';
|
||||||
|
|
||||||
|
export type TailscaleVersion = {
|
||||||
|
majorMinorPatch: string;
|
||||||
|
short: string;
|
||||||
|
long: string;
|
||||||
|
gitCommit: string;
|
||||||
|
extraGitCommit: string;
|
||||||
|
cap: number;
|
||||||
|
}
|
||||||
|
|
||||||
export enum OS {
|
export enum OS {
|
||||||
Android = "android",
|
Android = "android",
|
||||||
IOS = "iOS",
|
IOS = "iOS",
|
||||||
|
|
Loading…
Reference in New Issue