diff --git a/packages/console-app/src/components/AppLink.js b/packages/console-app/src/components/AppLink.js
new file mode 100644
index 0000000..301b431
--- /dev/null
+++ b/packages/console-app/src/components/AppLink.js
@@ -0,0 +1,42 @@
+//
+// Copyright 2020 DxOS.org.org
+//
+
+import React from 'react';
+import Link from '@material-ui/core/Link';
+
+import { getServiceUrl } from '../util/config';
+
+const getAppUrl = (config, { name, version, text }) => {
+ const base = getServiceUrl(config, 'app.server');
+ const pathComponents = [base];
+
+ // TODO(burdon): Fix.
+ // `wire app serve` expects the /wrn/ prefix.
+ // That is OK in the production config where we can make it part of the the route,
+ // but in development it must be prepended since we don't want to make it part of services.app.server.
+ if (!base.startsWith(`/${config.services.app.prefix}`) && !base.endsWith(`/${config.services.app.prefix}`)) {
+ pathComponents.push(config.services.app.prefix.substring(1));
+ }
+
+ if (version) {
+ pathComponents.push(`${name}@${version}`);
+ } else {
+ pathComponents.push(name);
+ }
+ return `${pathComponents.join('/')}/`;
+};
+
+/**
+ * Render link to record in WNS.
+ * @param {Object} config
+ * @param {string} name
+ * @param {string} [text]
+ * @param {string} [version]
+ */
+const AppLink = ({ config, name, version, text }) => {
+ const fullURL = getAppUrl(config, {name, version});
+ return {text || name};
+};
+
+export default AppLink;
diff --git a/packages/console-app/src/components/PackageLink.js b/packages/console-app/src/components/PackageLink.js
index f9bcfb3..82a1c27 100644
--- a/packages/console-app/src/components/PackageLink.js
+++ b/packages/console-app/src/components/PackageLink.js
@@ -4,6 +4,8 @@
import React from 'react';
import Link from '@material-ui/core/Link';
+import Menu from '@material-ui/core/Menu';
+import MenuItem from '@material-ui/core/MenuItem';
import { getServiceUrl } from '../util/config';
@@ -12,12 +14,13 @@ import { getServiceUrl } from '../util/config';
* @param {Object} config
* @param {string} [type]
* @param {string} pkg
+ * @param {string} [text]
*/
-const PackageLink = ({ config, type, pkg }) => {
+const PackageLink = ({ config, type, pkg, text }) => {
// TODO(burdon): Pass in expected arg types.
if (typeof pkg === 'string') {
const ipfsUrl = getServiceUrl(config, 'ipfs.gateway', { path: `${pkg}` });
- return {pkg};
+ return {text || pkg};
}
// eslint-disable-next-line default-case
@@ -28,16 +31,17 @@ const PackageLink = ({ config, type, pkg }) => {
Object.keys(pkg[platform]).forEach(arch => {
const cid = pkg[platform][arch];
const ipfsUrl = getServiceUrl(config, 'ipfs.gateway', { path: `${cid}` });
-
packageLinks.push(
-
- {platform}/{arch}: {cid}
-
+
+
+ {platform}/{arch}
+
+
);
});
});
diff --git a/packages/console-app/src/components/QueryLink.js b/packages/console-app/src/components/QueryLink.js
new file mode 100644
index 0000000..7e1fcd6
--- /dev/null
+++ b/packages/console-app/src/components/QueryLink.js
@@ -0,0 +1,38 @@
+//
+// Copyright 2020 DxOS.org.org
+//
+
+import React from 'react';
+
+import ExitToApp from '@material-ui/icons/ExitToApp';
+import Link from '@material-ui/core/Link';
+
+import { getServiceUrl } from '../util/config';
+
+const QUERY = `{
+ queryRecords(attributes: [
+ { key: "name", value: { string: "%NAME%" }}]) {
+ id type name bondId createTime expiryTime owners attributes { key, value { string, json } }
+ }
+}`;
+
+/**
+ * Render link to record in WNS.
+ * @param {Object} config
+ * @param {string} name
+ * @param {string} [text]
+ */
+const QueryLink = ({ config, name, text, icon = false}) => {
+ const baseURL = getServiceUrl(config, 'wns.webui');
+ const query = QUERY.replace('%NAME%', name);
+ const fullURL= encodeURI(`${baseURL}?query=${query}`);
+
+ if (icon) {
+ return
+
+
+ }
+ return {text || name};
+};
+
+export default QueryLink;
diff --git a/packages/console-app/src/components/TableCell.js b/packages/console-app/src/components/TableCell.js
index fa63db1..51f4650 100644
--- a/packages/console-app/src/components/TableCell.js
+++ b/packages/console-app/src/components/TableCell.js
@@ -11,6 +11,12 @@ import { makeStyles } from '@material-ui/core';
const useStyles = makeStyles(() => ({
small: {
width: 160
+ },
+ medium: {
+ width: 220
+ },
+ icon: {
+ width: 120
}
}));
diff --git a/packages/console-app/src/containers/panels/apps/AppRecords.js b/packages/console-app/src/containers/panels/apps/AppRecords.js
index 35d6665..995ea40 100644
--- a/packages/console-app/src/containers/panels/apps/AppRecords.js
+++ b/packages/console-app/src/containers/panels/apps/AppRecords.js
@@ -20,6 +20,7 @@ import { BooleanIcon } from '../../../components/BooleanIcon';
import Table from '../../../components/Table';
import TableCell from '../../../components/TableCell';
import { getServiceUrl } from '../../../util/config';
+import AppLink from "../../../components/AppLink";
const AppRecords = () => {
const { config } = useContext(ConsoleContext);
@@ -41,27 +42,6 @@ const AppRecords = () => {
const localRefs = new Set(ipfsData.refs.local);
- // TODO(burdon): Test if app is deployed.
- const getAppUrl = ({ name, version }) => {
- const base = getServiceUrl(config, 'app.server');
- const pathComponents = [base];
-
- // TODO(burdon): Fix.
- // `wire app serve` expects the /wrn/ prefix.
- // That is OK in the production config where we can make it part of the the route,
- // but in development it must be prepended since we don't want to make it part of services.app.server.
- if (!base.startsWith(`/${config.services.app.prefix}`) && !base.endsWith(`/${config.services.app.prefix}`)) {
- pathComponents.push(config.services.app.prefix.substring(1));
- }
-
- if (version) {
- pathComponents.push(`${name}@${version}`);
- } else {
- pathComponents.push(name);
- }
- return `${pathComponents.join('/')}/`;
- };
-
return (
@@ -70,22 +50,19 @@ const AppRecords = () => {
Name
Version
Created
- Downloaded
+ Downloaded
{appData.sort(sorter).map(({ id, name, version, createTime, attributes: { displayName, publicUrl, package: hash } }) => {
- const verLink = getAppUrl({ id, name, version, publicUrl });
- const appLink = getAppUrl({ id, name, publicUrl });
-
return (
- {name}
+
{displayName}
- {version}
+
{moment.utc(createTime).fromNow()}
diff --git a/packages/console-app/src/containers/panels/ipfs/IPFS.js b/packages/console-app/src/containers/panels/ipfs/IPFS.js
index be7e74f..827c410 100644
--- a/packages/console-app/src/containers/panels/ipfs/IPFS.js
+++ b/packages/console-app/src/containers/panels/ipfs/IPFS.js
@@ -122,9 +122,9 @@ const IPFS = () => {
- Identifier
- Description
- Connected
+ Identifier
+ Description
+ Connected
Address
diff --git a/packages/console-app/src/containers/panels/wns/WNSRecords.js b/packages/console-app/src/containers/panels/wns/WNSRecords.js
index d64d5e1..ce8bb81 100644
--- a/packages/console-app/src/containers/panels/wns/WNSRecords.js
+++ b/packages/console-app/src/containers/panels/wns/WNSRecords.js
@@ -11,6 +11,7 @@ import Button from '@material-ui/core/Button';
import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
import TableBody from '@material-ui/core/TableBody';
+import Tooltip from '@material-ui/core/Tooltip';
import WNS_RECORDS from '../../../gql/wns_records.graphql';
@@ -20,6 +21,8 @@ import Table from '../../../components/Table';
import TableCell from '../../../components/TableCell';
import PackageLink from '../../../components/PackageLink';
+import QueryLink from "../../../components/QueryLink";
+import AppLink from "../../../components/AppLink";
const types = [
{ key: null, label: 'ALL' },
@@ -67,14 +70,14 @@ const WNSRecords = ({ type }) => {
const [sorter, sortBy] = useSorter('createTime', false);
const data = useQueryStatusReducer(useQuery(WNS_RECORDS, {
pollInterval: config.api.intervalQuery,
- variables: { type }
+ variables: { attributes: { type } }
}));
if (!data) {
return null;
}
- const records = data.wns_records.json;
+ const records = JSON.parse(data.wns_records.json);
return (
@@ -82,28 +85,51 @@ const WNSRecords = ({ type }) => {
Type
Identifier
+ Query
+ Name
Version
Created
- Name
- Package Hash
+ Package
{records.sort(sorter)
- .map(({ id, type, name, version, createTime, attributes: { displayName, package: pkg } }) => (
-
- {type}
- {name}
- {version}
- {moment.utc(createTime).fromNow()}
- {displayName}
-
- {pkg && (
-
- )}
-
-
- ))}
+ .map((record) => {
+ const { id, type, name, version, createTime, attributes: { displayName, description, service, package: pkg } } = record;
+
+ let pkgLink = undefined;
+ let appLink = undefined;
+ let verLink = undefined;
+
+ if (pkg) {
+ pkgLink = ();
+ }
+
+ if (type === 'wrn:app') {
+ appLink = ();
+ verLink = ();
+ }
+
+ return (
+ {type}
+
+ {appLink && appLink || name}
+
+
+
+
+ {displayName || service || description}
+
+ {verLink && verLink || version}
+
+ {moment.utc(createTime).fromNow()}
+
+ {pkgLink}
+
+
+ );
+ }
+ )}
);