Signal status.

packages/console-app/src/components/AppLink.js

@@ -7,7 +7,7 @@ import Link from '@material-ui/core/Link';
 
 import { getServiceUrl } from '../util/config';
 
-const getAppUrl = (config, { name, version, text }) => {
+const getAppUrl = (config, { name, version }) => {
   const base = getServiceUrl(config, 'app.server');
   const pathComponents = [base];
 

packages/console-app/src/containers/Main.js

@@ -24,7 +24,7 @@ import Bots from './panels/bots/Bots';
 import Config from './panels/Config';
 import IPFS from './panels/ipfs/IPFS';
 import Metadata from './panels/Metadata';
-import Signaling from './panels/Signaling';
+import Signaling from './panels/signal/Signaling';
 import Status from './panels/Status';
 import WNS from './panels/wns/WNS';
 

packages/console-app/src/containers/panels/Signaling.js

@@ -1,20 +0,0 @@
-//
-// Copyright 2020 DxOS.org
-//
-
-import React from 'react';
-import { makeStyles } from '@material-ui/core';
-
-const useStyles = makeStyles(theme => ({
-  root: {}
-}));
-
-const Signaling = () => {
-  const classes = useStyles();
-
-  return (
-    <div className={classes.root} />
-  );
-};
-
-export default Signaling;

packages/console-app/src/containers/panels/ipfs/IPFS.js

@@ -2,11 +2,13 @@
 // Copyright 2020 DxOS.org
 //
 
-import React from 'react';
+import React, { useState } from 'react';
 import get from 'lodash.get';
 
 import { useQuery } from '@apollo/react-hooks';
 import { makeStyles } from '@material-ui/core';
+import Tab from '@material-ui/core/Tab';
+import Tabs from '@material-ui/core/Tabs';
 import TableBody from '@material-ui/core/TableBody';
 import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
@@ -68,8 +70,13 @@ const useStyles = makeStyles((theme) => ({
   }
 }));
 
+const TAB_STATUS = 'status';
+const TAB_LOG = 'log';
+
 const IPFS = () => {
   const classes = useStyles();
+  const [tab, setTab] = useState(TAB_STATUS);
+
   const ipfsResponse = useQueryStatusReducer(useQuery(IPFS_STATUS));
   const wnsResponse = useQueryStatusReducer(useQuery(WNS_RECORDS, {
     variables: { attributes: { type: RECORD_TYPE, service: SERVICE_TYPE } }
@@ -115,7 +122,12 @@ const IPFS = () => {
   return (
     <Panel
       toolbar={
-        <Toolbar />
+        <Toolbar>
+          <Tabs value={tab} onChange={(_, value) => setTab(value)}>
+            <Tab value={TAB_STATUS} label='Status' />
+            <Tab value={TAB_LOG} label='Log' />
+          </Tabs>
+        </Toolbar>
       }
     >
       <h4 className={classes.caption}>WNS-registered IPFS Servers</h4>

packages/console-app/src/containers/panels/signal/SignalLog.js

@@ -0,0 +1,26 @@
+//
+// Copyright 2020 DxOS.org
+//
+
+import React, { useContext } from 'react';
+import { useQuery } from '@apollo/react-hooks';
+
+import SIGNAL_LOG from '../../../gql/signal_log.graphql';
+
+import { ConsoleContext, useQueryStatusReducer } from '../../../hooks';
+
+import Log from '../../../components/Log';
+
+const SignalLog = () => {
+  const { config } = useContext(ConsoleContext);
+  const data = useQueryStatusReducer(useQuery(SIGNAL_LOG, { pollInterval: config.api.intervalLog }));
+  if (!data) {
+    return null;
+  }
+
+  return (
+    <Log log={data.signal_log.log} />
+  );
+};
+
+export default SignalLog;

packages/console-app/src/containers/panels/signal/SignalStatus.js

@@ -0,0 +1,26 @@
+//
+// Copyright 2020 DxOS.org
+//
+
+import React, { useContext } from 'react';
+import { useQuery } from '@apollo/react-hooks';
+
+import SIGNAL_STATUS from '../../../gql/signal_status.graphql';
+
+import { ConsoleContext, useQueryStatusReducer } from '../../../hooks';
+
+import Json from '../../../components/Json';
+
+const SignalStatus = () => {
+  const { config } = useContext(ConsoleContext);
+  const data = useQueryStatusReducer(useQuery(SIGNAL_STATUS, { pollInterval: config.api.intervalQuery }));
+  if (!data) {
+    return null;
+  }
+
+  return (
+    <Json data={data.signal_status.json} />
+  );
+};
+
+export default SignalStatus;

packages/console-app/src/containers/panels/signal/Signaling.js

@@ -0,0 +1,74 @@
+//
+// Copyright 2020 DxOS.org
+//
+
+import React, { useState } from 'react';
+import { makeStyles } from '@material-ui/core';
+import Paper from '@material-ui/core/Paper';
+import Tab from '@material-ui/core/Tab';
+import Tabs from '@material-ui/core/Tabs';
+import TabContext from '@material-ui/lab/TabContext';
+
+import Panel from '../../../components/Panel';
+import Toolbar from '../../../components/Toolbar';
+
+import SignalLog from './SignalLog';
+import SignalStatus from './SignalStatus';
+
+const TAB_STATUS = 'status';
+const TAB_LOG = 'log';
+
+const useStyles = makeStyles(() => ({
+  expand: {
+    flex: 1
+  },
+
+  panel: {
+    display: 'flex',
+    overflow: 'hidden',
+    flex: 1
+  },
+
+  paper: {
+    display: 'flex',
+    overflow: 'hidden',
+    flex: 1
+  }
+}));
+
+const Signal = () => {
+  const classes = useStyles();
+  const [tab, setTab] = useState(TAB_STATUS);
+  const [type, setType] = useState();
+
+  return (
+    <Panel
+      toolbar={
+        <Toolbar>
+          <Tabs value={tab} onChange={(_, value) => setTab(value)}>
+            <Tab value={TAB_STATUS} label='Status' />
+            <Tab value={TAB_LOG} label='Log' />
+          </Tabs>
+        </Toolbar>
+      }
+    >
+      <TabContext value={tab}>
+        {tab === TAB_STATUS && (
+          <div className={classes.panel}>
+            <Paper className={classes.paper}>
+              <SignalStatus />
+            </Paper>
+          </div>
+        )}
+
+        {tab === TAB_LOG && (
+          <div className={classes.panel}>
+            <SignalLog />
+          </div>
+        )}
+      </TabContext>
+    </Panel>
+  );
+};
+
+export default Signal;

packages/console-app/src/containers/panels/wns/WNSRecords.js

@@ -84,7 +84,7 @@ const WNSRecords = ({ type }) => {
         <TableRow>
           <TableCell onClick={sortBy('type')} size='small'>Type</TableCell>
           <TableCell onClick={sortBy('name')}>Identifier</TableCell>
-          <TableCell size='icon'>Query</TableCell>
+          <TableCell size='icon'>GraphQL</TableCell>
           <TableCell onClick={sortBy('attributes.displayName')}>Name</TableCell>
           <TableCell onClick={sortBy('version')} size='small'>Version</TableCell>
           <TableCell onClick={sortBy('createTime')} size='small'>Created</TableCell>

packages/console-app/src/gql/signal_log.graphql

@@ -0,0 +1,10 @@
+#
+# Copyright 2020 DxOS.org
+#
+
+query {
+  signal_log @client {
+    timestamp
+    log
+  }
+}

packages/console-app/src/gql/signal_status.graphql

@@ -0,0 +1,10 @@
+#
+# Copyright 2020 DxOS.org
+#
+
+query {
+  signal_status @client {
+    timestamp
+    json
+  }
+}

packages/console-app/src/resolvers.js

@@ -80,7 +80,32 @@ export const createResolvers = config => {
           timestamp: timestamp(),
           log: [...cachedLog].reverse()
         };
-      }
+      },
+
+      signal_status: async () => {
+        log('Signal status...');
+
+        const url = getServiceUrl(config, 'signal.api', { path: 'status' });
+        const res = await fetch(url);
+
+        return {
+          __typename: 'JSONResult',
+          timestamp: timestamp(),
+
+          // NOTE: Hack since this should be a string according to the schema.
+          json: res.json()
+        };
+      },
+
+      signal_log: async () => {
+        log('Signal log...');
+
+        return {
+          __typename: 'JSONLog',
+          timestamp: timestamp(),
+          log: []
+        };
+      },
     }
   };
 };