forked from cerc-io/laconic-console
Sorting.
This commit is contained in:
parent
e71d51eb7f
commit
24e59cec11
@ -40,6 +40,14 @@ const useStyles = makeStyles((theme) => ({
|
|||||||
flex: 1,
|
flex: 1,
|
||||||
textAlign: 'center'
|
textAlign: 'center'
|
||||||
},
|
},
|
||||||
|
info: {
|
||||||
|
display: 'flex',
|
||||||
|
fontFamily: 'monospace',
|
||||||
|
fontSize: 'large',
|
||||||
|
'& div': {
|
||||||
|
margin: 4
|
||||||
|
}
|
||||||
|
},
|
||||||
icon: {
|
icon: {
|
||||||
margin: '0 2px'
|
margin: '0 2px'
|
||||||
},
|
},
|
||||||
@ -54,12 +62,6 @@ const useStyles = makeStyles((theme) => ({
|
|||||||
},
|
},
|
||||||
loading: {
|
loading: {
|
||||||
color: theme.palette.primary.dark
|
color: theme.palette.primary.dark
|
||||||
},
|
|
||||||
info: {
|
|
||||||
display: 'flex',
|
|
||||||
'& div': {
|
|
||||||
margin: 4
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
@ -45,9 +45,7 @@ const VersionCheck = () => {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
if (latest !== current) {
|
setUpgrade({ current, latest: latest !== current ? latest : undefined });
|
||||||
setUpgrade({ current, latest });
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}, [status, data]);
|
}, [status, data]);
|
||||||
|
|
||||||
|
@ -18,10 +18,11 @@ import { getServiceUrl } from '../../../util/config';
|
|||||||
|
|
||||||
import Table from '../../../components/Table';
|
import Table from '../../../components/Table';
|
||||||
import TableCell from '../../../components/TableCell';
|
import TableCell from '../../../components/TableCell';
|
||||||
|
import moment from 'moment';
|
||||||
|
|
||||||
const AppRecords = () => {
|
const AppRecords = () => {
|
||||||
const { config } = useContext(ConsoleContext);
|
const { config } = useContext(ConsoleContext);
|
||||||
const [sorter, sortBy] = useSorter('id');
|
const [sorter, sortBy] = useSorter('createTime', false);
|
||||||
const data = useQueryStatusReducer(useQuery(WNS_RECORDS, {
|
const data = useQueryStatusReducer(useQuery(WNS_RECORDS, {
|
||||||
pollInterval: config.api.pollInterval,
|
pollInterval: config.api.pollInterval,
|
||||||
variables: { type: 'wrn:app' }
|
variables: { type: 'wrn:app' }
|
||||||
@ -54,20 +55,22 @@ const AppRecords = () => {
|
|||||||
<Table>
|
<Table>
|
||||||
<TableHead>
|
<TableHead>
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell onClick={sortBy('name')}>ID</TableCell>
|
<TableCell onClick={sortBy('name')}>Identifier</TableCell>
|
||||||
<TableCell onClick={sortBy('version')} size="small">Version</TableCell>
|
<TableCell onClick={sortBy('version')} size="small">Version</TableCell>
|
||||||
|
<TableCell onClick={sortBy('createTime')} size="small">Created</TableCell>
|
||||||
<TableCell onClick={sortBy('attributes.displayName')}>Name</TableCell>
|
<TableCell onClick={sortBy('attributes.displayName')}>Name</TableCell>
|
||||||
<TableCell>Link</TableCell>
|
<TableCell>Link</TableCell>
|
||||||
</TableRow>
|
</TableRow>
|
||||||
</TableHead>
|
</TableHead>
|
||||||
<TableBody>
|
<TableBody>
|
||||||
{records.sort(sorter).map(({ id, name, version, attributes: { displayName, publicUrl } }) => {
|
{records.sort(sorter).map(({ id, name, version, createTime, attributes: { displayName, publicUrl } }) => {
|
||||||
const link = getAppUrl({ id, name, version, publicUrl });
|
const link = getAppUrl({ id, name, version, publicUrl });
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<TableRow key={id} size="small">
|
<TableRow key={id} size="small">
|
||||||
<TableCell monospace>{name}</TableCell>
|
<TableCell monospace>{name}</TableCell>
|
||||||
<TableCell monospace>{version}</TableCell>
|
<TableCell monospace>{version}</TableCell>
|
||||||
|
<TableCell>{moment.utc(createTime).fromNow()}</TableCell>
|
||||||
<TableCell>{displayName}</TableCell>
|
<TableCell>{displayName}</TableCell>
|
||||||
<TableCell monospace>
|
<TableCell monospace>
|
||||||
{link && (
|
{link && (
|
||||||
|
@ -15,10 +15,11 @@ import TableBody from '@material-ui/core/TableBody';
|
|||||||
|
|
||||||
import Table from '../../../components/Table';
|
import Table from '../../../components/Table';
|
||||||
import TableCell from '../../../components/TableCell';
|
import TableCell from '../../../components/TableCell';
|
||||||
|
import moment from 'moment';
|
||||||
|
|
||||||
const AppRecords = () => {
|
const AppRecords = () => {
|
||||||
const { config } = useContext(ConsoleContext);
|
const { config } = useContext(ConsoleContext);
|
||||||
const [sorter, sortBy] = useSorter('id');
|
const [sorter, sortBy] = useSorter('createTime', false);
|
||||||
const data = useQueryStatusReducer(useQuery(WNS_RECORDS, {
|
const data = useQueryStatusReducer(useQuery(WNS_RECORDS, {
|
||||||
pollInterval: config.api.pollInterval,
|
pollInterval: config.api.pollInterval,
|
||||||
variables: { type: 'wrn:bot' }
|
variables: { type: 'wrn:bot' }
|
||||||
@ -34,19 +35,22 @@ const AppRecords = () => {
|
|||||||
<Table>
|
<Table>
|
||||||
<TableHead>
|
<TableHead>
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell onClick={sortBy('name')}>ID</TableCell>
|
<TableCell onClick={sortBy('name')}>Identifier</TableCell>
|
||||||
<TableCell onClick={sortBy('version')} size="small">Version</TableCell>
|
<TableCell onClick={sortBy('version')} size="small">Version</TableCell>
|
||||||
|
<TableCell onClick={sortBy('createTime')} size="small">Created</TableCell>
|
||||||
<TableCell onClick={sortBy('attributes.displayName')}>Name</TableCell>
|
<TableCell onClick={sortBy('attributes.displayName')}>Name</TableCell>
|
||||||
<TableCell />
|
<TableCell />
|
||||||
</TableRow>
|
</TableRow>
|
||||||
</TableHead>
|
</TableHead>
|
||||||
<TableBody>
|
<TableBody>
|
||||||
{records.sort(sorter).map(({ id, name, version, attributes: { displayName } }) => {
|
{records.sort(sorter).map(({ id, name, version, createTime, attributes: { displayName } }) => {
|
||||||
return (
|
return (
|
||||||
<TableRow key={id} size="small">
|
<TableRow key={id} size="small">
|
||||||
<TableCell monospace>{name}</TableCell>
|
<TableCell monospace>{name}</TableCell>
|
||||||
<TableCell monospace>{version}</TableCell>
|
<TableCell monospace>{version}</TableCell>
|
||||||
|
<TableCell>{moment.utc(createTime).fromNow()}</TableCell>
|
||||||
<TableCell>{displayName}</TableCell>
|
<TableCell>{displayName}</TableCell>
|
||||||
|
<TableCell />
|
||||||
</TableRow>
|
</TableRow>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
@ -64,7 +64,7 @@ export const WNSRecordType = ({ type = types[0].key, onChanged }) => {
|
|||||||
|
|
||||||
const WNSRecords = ({ type }) => {
|
const WNSRecords = ({ type }) => {
|
||||||
const { config } = useContext(ConsoleContext);
|
const { config } = useContext(ConsoleContext);
|
||||||
const [sorter, sortBy] = useSorter('id');
|
const [sorter, sortBy] = useSorter('createTime', false);
|
||||||
const data = useQueryStatusReducer(useQuery(WNS_RECORDS, {
|
const data = useQueryStatusReducer(useQuery(WNS_RECORDS, {
|
||||||
pollInterval: config.api.pollInterval,
|
pollInterval: config.api.pollInterval,
|
||||||
variables: { type }
|
variables: { type }
|
||||||
@ -81,11 +81,11 @@ const WNSRecords = ({ type }) => {
|
|||||||
<TableHead>
|
<TableHead>
|
||||||
<TableRow>
|
<TableRow>
|
||||||
<TableCell onClick={sortBy('type')} size="small">Type</TableCell>
|
<TableCell onClick={sortBy('type')} size="small">Type</TableCell>
|
||||||
<TableCell onClick={sortBy('name')}>ID</TableCell>
|
<TableCell onClick={sortBy('name')}>Identifier</TableCell>
|
||||||
<TableCell onClick={sortBy('version')} size="small">Version</TableCell>
|
<TableCell onClick={sortBy('version')} size="small">Version</TableCell>
|
||||||
|
<TableCell onClick={sortBy('createTime')} size="small">Created</TableCell>
|
||||||
<TableCell onClick={sortBy('attributes.displayName')}>Name</TableCell>
|
<TableCell onClick={sortBy('attributes.displayName')}>Name</TableCell>
|
||||||
<TableCell onClick={sortBy('attributes.package')}>Package Hash</TableCell>
|
<TableCell onClick={sortBy('attributes.package')}>Package Hash</TableCell>
|
||||||
<TableCell onClick={sortBy('createTime')} size="small">Created</TableCell>
|
|
||||||
</TableRow>
|
</TableRow>
|
||||||
</TableHead>
|
</TableHead>
|
||||||
<TableBody>
|
<TableBody>
|
||||||
@ -95,13 +95,13 @@ const WNSRecords = ({ type }) => {
|
|||||||
<TableCell monospace>{type}</TableCell>
|
<TableCell monospace>{type}</TableCell>
|
||||||
<TableCell monospace>{name}</TableCell>
|
<TableCell monospace>{name}</TableCell>
|
||||||
<TableCell monospace>{version}</TableCell>
|
<TableCell monospace>{version}</TableCell>
|
||||||
|
<TableCell>{moment.utc(createTime).fromNow()}</TableCell>
|
||||||
<TableCell>{displayName}</TableCell>
|
<TableCell>{displayName}</TableCell>
|
||||||
<TableCell title={JSON.stringify(pkg)} monospace>
|
<TableCell title={JSON.stringify(pkg)} monospace>
|
||||||
{pkg && (
|
{pkg && (
|
||||||
<PackageLink config={config} type={type} pkg={pkg} />
|
<PackageLink config={config} type={type} pkg={pkg} />
|
||||||
)}
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell>{moment.utc(createTime).fromNow()}</TableCell>
|
|
||||||
</TableRow>
|
</TableRow>
|
||||||
))}
|
))}
|
||||||
</TableBody>
|
</TableBody>
|
||||||
|
@ -6,8 +6,8 @@ import get from 'lodash.get';
|
|||||||
import { useState } from 'react';
|
import { useState } from 'react';
|
||||||
|
|
||||||
// TODO(burdon): Enable multiple sort order (e.g., id, version).
|
// TODO(burdon): Enable multiple sort order (e.g., id, version).
|
||||||
export const useSorter = (initial) => {
|
export const useSorter = (initSort, initAscend) => {
|
||||||
const [{ sort, ascend }, setSort] = useState({ sort: initial, ascend: true });
|
const [{ sort, ascend }, setSort] = useState({ sort: initSort, ascend: initAscend });
|
||||||
|
|
||||||
const sorter = (item1, item2) => {
|
const sorter = (item1, item2) => {
|
||||||
const a = get(item1, sort);
|
const a = get(item1, sort);
|
||||||
|
@ -34,8 +34,8 @@ export default {
|
|||||||
icon: BotsIcon
|
icon: BotsIcon
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/signal',
|
path: '/signaling',
|
||||||
title: 'Signal Server',
|
title: 'Signaling',
|
||||||
icon: SignalIcon
|
icon: SignalIcon
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"build": {
|
"build": {
|
||||||
"name": "@dxos/console-client",
|
"name": "@dxos/console-client",
|
||||||
"buildDate": "2020-05-26T01:16:30.514Z",
|
"buildDate": "2020-05-26T12:54:32.629Z",
|
||||||
"version": "1.0.0-beta.0"
|
"version": "1.0.0-beta.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -35,14 +35,17 @@ export const createResolvers = config => ({
|
|||||||
// System
|
// System
|
||||||
//
|
//
|
||||||
|
|
||||||
system_status: () => ({
|
// TODO(burdon): System calls.
|
||||||
timestamp: timestamp(),
|
system_status: () => {
|
||||||
json: JSON.stringify({
|
return {
|
||||||
dxos: {
|
timestamp: timestamp(),
|
||||||
image: '0.0.1'
|
json: JSON.stringify({
|
||||||
}
|
dxos: {
|
||||||
})
|
image: '0.0.1'
|
||||||
}),
|
}
|
||||||
|
})
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
//
|
//
|
||||||
// IPFS
|
// IPFS
|
||||||
|
Loading…
Reference in New Issue
Block a user