Fix GQL QueryLink (#45)

Reviewed-on: cerc-io/laconic-console#45
Co-authored-by: Thomas E Lackey <telackey@bozemanpass.com>
Co-committed-by: Thomas E Lackey <telackey@bozemanpass.com>

.gitea/workflows/publish.yaml

@@ -0,0 +1,39 @@
+name: Publish npm package to gitea
+on:
+  release:
+    types: [published]
+jobs:
+  npm_publish:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [ 18.x ]
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - name: Download yarn
+        run: |
+          curl -fsSL -o /usr/local/bin/yarn https://github.com/yarnpkg/yarn/releases/download/v1.22.21/yarn-1.22.21.js
+          chmod +x /usr/local/bin/yarn
+      - name: Install jq
+        run: |
+          apt update && apt install -y jq
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: yarn
+      - name: Run yarn build
+        run: |
+          LACONIC_HOSTED_CONFIG_FILE=config-hosted.yml yarn dist
+      - name: Configure git.vdb.to npm registry
+        run: |
+          npm config set registry https://git.vdb.to/api/packages/cerc-io/npm/
+      - name: Authenticate to git.vdb.to registry
+        run: |
+          npm config set -- '//git.vdb.to/api/packages/cerc-io/npm/:_authToken' "${{ secrets.CICD_PUBLISH_TOKEN }}"
+      - name: npm publish
+        run: |
+          npm publish

.idea/codeStyles/codeStyleConfig.xml

@@ -1,5 +0,0 @@
-<component name="ProjectCodeStyleConfiguration">
-  <state>
-    <option name="PREFERRED_PROJECT_CODE_STYLE" value="Default" />
-  </state>
-</component>

.idea/console.iml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>

.idea/inspectionProfiles/Project_Default.xml

@@ -1,11 +0,0 @@
-<component name="InspectionProjectProfileManager">
-  <profile version="1.0">
-    <option name="myName" value="Project Default" />
-    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
-    <inspection_tool class="SpellCheckingInspection" enabled="false" level="TYPO" enabled_by_default="false">
-      <option name="processCode" value="true" />
-      <option name="processLiterals" value="true" />
-      <option name="processComments" value="true" />
-    </inspection_tool>
-  </profile>
-</component>

.idea/jsLibraryMappings.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="JavaScriptLibraryMappings">
-    <includedPredefinedLibrary name="Node.js Core" />
-  </component>
-</project>

.idea/misc.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="JavaScriptSettings">
-    <option name="languageLevel" value="JSX" />
-  </component>
-</project>

.idea/modules.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/console.iml" filepath="$PROJECT_DIR$/.idea/console.iml" />
-    </modules>
-  </component>
-</project>

.idea/runConfigurations/client.xml

@@ -1,12 +0,0 @@
-<component name="ProjectRunConfigurationManager">
-  <configuration default="false" name="client" type="js.build_tools.npm">
-    <package-json value="$PROJECT_DIR$/packages/console-app/package.json" />
-    <command value="run" />
-    <scripts>
-      <script value="start" />
-    </scripts>
-    <node-interpreter value="project" />
-    <envs />
-    <method v="2" />
-  </configuration>
-</component>

.idea/runConfigurations/server.xml

@@ -1,12 +0,0 @@
-<component name="ProjectRunConfigurationManager">
-  <configuration default="false" name="server" type="js.build_tools.npm">
-    <package-json value="$PROJECT_DIR$/packages/console-server/package.json" />
-    <command value="run" />
-    <scripts>
-      <script value="start" />
-    </scripts>
-    <node-interpreter value="project" />
-    <envs />
-    <method v="2" />
-  </configuration>
-</component>

.idea/vcs.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="$PROJECT_DIR$" vcs="Git" />
-  </component>
-</project>

.npmrc

@@ -1,2 +0,0 @@
-@cerc-io:registry=https://git.vdb.to/api/packages/cerc-io/npm/
-@lirewine:registry=https://git.vdb.to/api/packages/cerc-io/npm/

README.md

@@ -1,11 +1,9 @@
 # Console
 
-Laconic Kubenet GraphQL server and console application.
+Laconic console application.
 
 User interface for submitting and reading records registered on Laconic.
 
-![Console](./docs/images/console.png)
-
 ## Development
 
 * Clone the required repos:
@@ -21,9 +19,14 @@ User interface for submitting and reading records registered on Laconic.
     ```bash
     ./init.sh
     ```
+  * For auction functionality enabled, add this environment variable:
+
+    ```bash
+    TEST_AUCTION_ENABLED=true ./init.sh
+    ```
 
 * Run the laconic-console app
-  * In [laconic-console](https://github.com/cerc-io/laconic-console) repo, install dependencies
+  * From the root of this repo, run:
 
     ```bash
     yarn
@@ -40,19 +43,15 @@ User interface for submitting and reading records registered on Laconic.
 
     This can be ignored as it is an error for installing optional dependency
 
-  * Change directory to [packages/console-app](https://github.com/cerc-io/laconic-console/tree/main/packages/console-app) and start the react app
+  * Start the app:
 
-      ```bash
+      ```bash 
-      # Change directory
-      cd packages/console-app/
-      
-      # Start app
       CONFIG_FILE=config-local.yml yarn start
       ```
 
-  * Open console-app at <http://localhost:8080>
+  * Open console at <http://localhost:8080>
 
-  * To view records in the app, test suite in laconic-sdk can be run
+  * To view records in the console, the test suite in laconic-sdk can be run
 
     * Clone the [laconic-sdk](https://github.com/cerc-io/laconic-sdk) repo:
 
@@ -88,4 +87,4 @@ User interface for submitting and reading records registered on Laconic.
 
       *NOTE*: One test from [util.test.ts](https://github.com/cerc-io/laconic-sdk/blob/main/src/util.test.ts) fails as mentioned in the [PR](https://github.com/cerc-io/laconic-sdk/pull/5#issuecomment-1299572012)
 
-    * Open console-app at <http://localhost:8080> to view the records.
+    * Open console at <http://localhost:8080> to view the records.

babel.config.js

@@ -12,7 +12,6 @@ module.exports = {
     'import-graphql',
     'inline-json-import',
 
-    '@babel/plugin-proposal-class-properties',
+    '@babel/plugin-proposal-class-properties'
-    '@babel/plugin-proposal-export-default-from'
   ]
 };

config-hosted.yml

@@ -0,0 +1,42 @@
+#
+# NODE_ENV=development
+# NOTE: Set CONFIG_FILE to swap out this config file.
+#
+
+# TODO: write a tool to automated insertion of the template strings in files like this.
+
+app:
+  title: 'Console'
+  org': 'Laconic'
+  theme: 'dark'
+  website: 'LACONIC_HOSTED_CONFIG_app_website' # e.g. https://laconic.com
+  publicUrl: '/console'
+
+api:
+  server: 'LACONIC_HOSTED_CONFIG_api_server' # e.g. http://127.0.0.1:9004
+  path: '/api'
+  intervalLog: 5000
+  pollInterval: 10000
+
+system:
+  debug: 'laconic:console:*'
+
+services:
+  app:
+    prefix: '/app'
+    server: 'LACONIC_HOSTED_CONFIG_services_app_server' # e.g. http://127.0.0.1:5999
+
+  wns:
+    server: 'LACONIC_HOSTED_CONFIG_services_wns_server' # e.g. http://127.0.0.1:9473/api
+    webui: 'LACONIC_HOSTED_CONFIG_services_wns_webui' # e.g. http://127.0.0.1:9473/console
+
+  signal:
+    server: 'LACONIC_HOSTED_CONFIG_services_signal_server' # e.g. ws://127.0.0.1:4000
+    api: 'LACONIC_HOSTED_CONFIG_services_signal_api' # e.g. http://127.0.0.1:4000/api
+
+  ipfs:
+    server: 'LACONIC_HOSTED_CONFIG_services_ipfs_server' # e.g. http://127.0.0.1:5001
+    gateway: 'LACONIC_HOSTED_CONFIG_services_ipfs_gateway' # e.g. http://127.0.0.1:8888/ipfs/
+
+  wellknown:
+    endpoint: 'LACONIC_HOSTED_CONFIG_services_wellknown_endpoint' # e.g. http://127.0.0.1:9000/.well-known/laconic

lerna.json

@@ -1,5 +0,0 @@
-{
-  "version": "1.2.9",
-  "useWorkspaces": true,
-  "npmClient": "yarn"
-}

package.json

@@ -1,69 +1,91 @@
 {
-  "name": "laconic-console",
+  "name": "@cerc-io/console-app",
-  "version": "1.2.9-alpha.0",
+  "version": "1.3.7",
   "description": "Laconic Console",
-  "main": "index.js",
+  "repository": "https://github.com/cerc-io/laconic-console",
-  "private": true,
+  "main": "dist/es/index.js",
+  "files": [
+    "dist/*", "src/*"
+  ],
   "scripts": {
-    "build": "lerna run build",
+    "analyzer": "webpack --config webpack-analyzer.config.js",
-    "clean": "lerna run clean",
+    "build": "yarn dist",
-    "lint": "lerna run lint",
+    "build:babel": "babel ./src --out-dir ./dist/es --ignore \"**/*.test.js\" --source-maps inline",
-    "lint:fix": "lerna run lint -- --fix",
+    "clean": "rm -rf dist",
-    "lint:staged": "lint-staged",
+    "updatever": "scripts/update_version.sh > src/version.json",
-    "sort-package-json": "lerna exec npx sort-package-json",
+    "dist": "yarn clean && yarn updatever && yarn build:babel && CONFIG_FILE=${LACONIC_HOSTED_CONFIG_FILE:-config-production.yml} webpack",
-    "test": "lerna run test"
+    "lint": "semistandard 'src/**/*.js'",
+    "start": "CONFIG_FILE=${CONFIG_FILE:-config-testnet.yml} VERBOSE=true webpack-dev-server --mode development",
+    "test": "jest --rootDir ./src --passWithNoTests --no-cache"
   },
   "author": "",
-  "license": "AGPLv3",
+  "license": "GPL-3.0",
-  "workspaces": {
-    "packages": [
-      "packages/*"
-    ]
-  },
   "browserslist": [
-    "> 5%"
+    "> 2%"
   ],
   "jest": {
     "testEnvironment": "node"
   },
   "dependencies": {
-    "lerna": "^3.19.0"
+    "@apollo/client": "^3.7.10",
+    "@apollo/react-components": "^4.0.0",
+    "@apollo/react-hooks": "^4.0.0",
+    "@babel/runtime": "^7.21.0",
+    "@cerc-io/laconic-sdk": "^0.1.14",
+    "@lirewine/debug": "1.0.0-beta.78",
+    "@lirewine/gem-core": "1.0.0-beta.28",
+    "@lirewine/react-ux": "1.1.0-beta.1",
+    "@material-ui/core": "^4.12.4",
+    "@material-ui/icons": "^4.11.3",
+    "@material-ui/lab": "^4.0.0-alpha.61",
+    "@rehooks/component-size": "^1.0.3",
+    "@visx/network": "^1.0.0",
+    "@visx/tooltip": "^1.0.0",
+    "@visx/zoom": "^1.0.0",
+    "build-url": "^2.0.0",
+    "clsx": "^1.1.0",
+    "compare-versions": "^3.6.0",
+    "d3-force": "^2.1.1",
+    "debug": "^4.1.1",
+    "graphql-tag": "^2.10.3",
+    "lodash.defaultsdeep": "^4.6.1",
+    "lodash.get": "^4.4.2",
+    "moment": "^2.26.0",
+    "node-polyfill-webpack-plugin": "^2.0.1",
+    "react": "^16.12.0",
+    "react-dom": "^16.12.0",
+    "react-router": "^5.3.4",
+    "react-router-dom": "^5.3.4",
+    "source-map-support": "^0.5.12"
   },
   "devDependencies": {
-    "babel-eslint": "^10.0.3",
+    "@babel/cli": "7.21.0",
-    "eslint": "^6.7.2",
+    "@babel/core": "^7.21.0",
-    "eslint-config-semistandard": "^15.0.0",
+    "@babel/preset-env": "^7.20.2",
-    "eslint-config-standard": "^14.1.1",
+    "@babel/preset-react": "^7.18.6",
-    "eslint-loader": "^3.0.3",
+    "@webpack-cli/info": "^2.0.1",
-    "eslint-plugin-babel": "^5.3.0",
+    "babel-jest": "^29.5.0",
-    "eslint-plugin-import": "^2.18.2",
+    "babel-loader": "^9.1.2",
-    "eslint-plugin-jest": "^23.13.1",
+    "babel-plugin-import-graphql": "^2.7.0",
-    "eslint-plugin-jsdoc": "^21.0.0",
+    "babel-plugin-inline-import": "^3.0.0",
-    "eslint-plugin-node": "^11.1.0",
+    "babel-plugin-inline-json-import": "^0.3.2",
-    "eslint-plugin-standard": "^4.0.1",
+    "dotenv-webpack": "^8.0.1",
-    "lint-staged": "^9.5.0",
+    "graphql": "^15.0.0",
-    "pre-commit": "^1.2.2",
+    "html-webpack-plugin": "^5.5.0",
-    "webpack-cli": "^3.3.11"
+    "jest": "^29.5.0",
+    "webpack": "^5.76.2",
+    "webpack-bundle-analyzer": "^4.8.0",
+    "webpack-cli": "^5.0.1",
+    "webpack-dev-server": "^4.13.1",
+    "webpack-merge": "^5.8.0",
+    "webpack-version-file-plugin": "^0.5.0",
+    "yaml-loader": "^0.8.0"
   },
-  "eslintConfig": {
+  "peerDependencies": {
-    "parser": "babel-eslint",
+    "react": "16.12.0",
-    "extends": [
+    "react-dom": "^16.12.0"
-      "plugin:jest/recommended",
-      "semistandard"
-    ],
-    "plugins": [
-      "babel"
-    ],
-    "rules": {
-      "babel/semi": 1
-    }
   },
-  "semistandard": {
+  "publishConfig": {
-    "parser": "babel-eslint",
+    "access": "public"
-    "env": [
-      "jest",
-      "node",
-      "browser"
-    ]
   }
 }

packages/console-app/README.md

@@ -1,58 +0,0 @@
-# Console
-
-Apollo GraphQL client.
-
-## Usage
-
-First start the server:
-
-```bash
-  cd packages/console-server
-  yarn start
-```
-
-Then start the Webpack devserver.
-
-```bash
-  cd packages/console-app
-  yarn start
-```
-
-Then load the app: http://localhost:8080.
-
-## Using a KUBE
-
-To use your KUBE for testing, rather than running all the services locally, specify a different
-config file when starting: `config-kube.yml`, which connects to `kube.local` for all services.
-
-For example:
-
-```javascript
-  cd packages/console-app
-  CONFIG_FILE=config-kube.yml yarn start
-```
-
-## Deploy
-
-```bash
-  yarn build
-```
-
-This creates the following folders:
-
-```
-/dist
-  /es               # Module imports.
-  /production       # Production build.
-```
-
-NOTE: GQL and Production files and exported and may be used by the server.
-
-```javascript
-import SYSTEM_STATUS from '@cerc-io/console-app/src/gql/system_status.graphql';
-
-...
-
-const file = path.join(__dirname + '../../../../node_modules/@cerc-io/console-app/dist/production', 'index.html');
-res.sendFile(file);
-```

packages/console-app/package.json

@@ -1,133 +0,0 @@
-{
-  "name": "@cerc-io/console-app",
-  "version": "1.2.9",
-  "description": "Kubenet Console Client",
-  "repository": "https://github.com/cerc-io/laconic-console",
-  "main": "dist/es/index.js",
-  "files": [
-    "src/gql"
-  ],
-  "scripts": {
-    "analyzer": "webpack --config webpack-analyzer.config.js",
-    "build": "yarn dist",
-    "build:babel": "babel ./src --out-dir ./dist/es --ignore \"**/*.test.js\" --source-maps inline",
-    "clean": "rm -rf dist",
-    "dist": "yarn clean && yarn build:babel && CONFIG_FILE=config-production.yml webpack",
-    "lint": "semistandard 'src/**/*.js'",
-    "start": "CONFIG_FILE=${CONFIG_FILE:-config-testnet.yml} VERBOSE=true webpack-dev-server --host 0.0.0.0 --mode development",
-    "test": "jest --rootDir ./src --passWithNoTests --no-cache"
-  },
-  "author": "",
-  "license": "GPL-3.0",
-  "browserslist": [
-    "> 2%"
-  ],
-  "jest": {
-    "testEnvironment": "node"
-  },
-  "dependencies": {
-    "@apollo/react-components": "^3.1.5",
-    "@apollo/react-hooks": "^3.1.5",
-    "@babel/runtime": "^7.8.7",
-    "@cerc-io/laconic-sdk": "0.1.4",
-    "@lirewine/debug": "1.0.0-beta.78",
-    "@lirewine/gem-core": "1.0.0-beta.28",
-    "@lirewine/react-ux": "1.1.0-beta.0",
-    "@material-ui/core": "^4.10.0",
-    "@material-ui/icons": "^4.9.1",
-    "@material-ui/lab": "^4.0.0-alpha.54",
-    "@rehooks/component-size": "^1.0.3",
-    "@visx/network": "^1.0.0",
-    "@visx/tooltip": "^1.0.0",
-    "@visx/zoom": "^1.0.0",
-    "apollo-cache-inmemory": "^1.6.6",
-    "apollo-client": "^2.6.10",
-    "apollo-link": "^1.2.14",
-    "apollo-link-http": "^1.5.17",
-    "build-url": "^2.0.0",
-    "clsx": "^1.1.0",
-    "compare-versions": "^3.6.0",
-    "d3-force": "^2.1.1",
-    "debug": "^4.1.1",
-    "graphql-tag": "^2.10.3",
-    "lodash.defaultsdeep": "^4.6.1",
-    "lodash.get": "^4.4.2",
-    "moment": "^2.26.0",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "react-router": "^5.2.0",
-    "react-router-dom": "^5.2.0",
-    "source-map-support": "^0.5.12"
-  },
-  "devDependencies": {
-    "@babel/cli": "7.4.4",
-    "@babel/core": "^7.4.5",
-    "@babel/node": "^7.8.7",
-    "@babel/plugin-proposal-class-properties": "^7.5.5",
-    "@babel/plugin-proposal-export-default-from": "^7.8.3",
-    "@babel/preset-env": "^7.4.5",
-    "@babel/preset-react": "^7.0.0",
-    "@webpack-cli/info": "^0.2.0",
-    "@webpack-cli/init": "^0.3.0",
-    "babel-eslint": "^10.0.2",
-    "babel-jest": "^24.8.0",
-    "babel-loader": "^8.0.0",
-    "babel-plugin-add-module-exports": "^1.0.2",
-    "babel-plugin-import-graphql": "^2.7.0",
-    "babel-plugin-inline-import": "^3.0.0",
-    "babel-plugin-inline-json-import": "^0.3.2",
-    "dotenv-webpack": "^1.8.0",
-    "eslint": "^6.7.2",
-    "eslint-config-semistandard": "^15.0.0",
-    "eslint-config-standard": "^14.1.1",
-    "eslint-config-standard-jsx": "^8.1.0",
-    "eslint-loader": "^3.0.3",
-    "eslint-plugin-babel": "^5.3.0",
-    "eslint-plugin-import": "^2.18.2",
-    "eslint-plugin-jest": "^23.13.1",
-    "eslint-plugin-jsdoc": "^21.0.0",
-    "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-standard": "^4.0.1",
-    "graphql": "^15.0.0",
-    "html-webpack-plugin": "^4.3.0",
-    "jest": "^24.8.0",
-    "react-scripts": "^3.4.1",
-    "semistandard": "^14.2.0",
-    "webpack": "^4.41.2",
-    "webpack-bundle-analyzer": "^3.6.0",
-    "webpack-cli": "^3.3.11",
-    "webpack-dev-server": "^3.11.0",
-    "webpack-merge": "^4.2.2",
-    "webpack-version-file-plugin": "^0.4.0",
-    "yaml-loader": "^0.6.0"
-  },
-  "peerDependencies": {
-    "react": "16.12.0",
-    "react-dom": "^16.12.0"
-  },
-  "publishConfig": {
-    "access": "public"
-  },
-  "eslintConfig": {
-    "parser": "babel-eslint",
-    "extends": [
-      "plugin:jest/recommended",
-      "semistandard",
-      "standard-jsx"
-    ],
-    "plugins": [
-      "babel"
-    ],
-    "rules": {
-      "babel/semi": 1
-    }
-  },
-  "semistandard": {
-    "parser": "babel-eslint",
-    "env": [
-      "jest",
-      "node",
-      "browser"
-    ]
-  }
-}

packages/console-app/src/version.json

@@ -1,7 +0,0 @@
-{
-  "build": {
-    "name":      "@cerc-io/console-app",
-    "buildDate": "2020-12-19T03:06:08.492Z",
-    "version":   "1.2.9-alpha.1"
-  }
-}

packages/console-app/version.ejs

@@ -1,7 +0,0 @@
-{
-  "build": {
-    "name":      "<%= package.name %>",
-    "buildDate": "<%= currentTime.toISOString() %>",
-    "version":   "<%= package.version %>"
-  }
-}

scripts/update_version.sh

@@ -0,0 +1,8 @@
+#/bin/bash
+
+
+NAME=`cat package.json | jq '.name'`
+VERSION=`cat package.json | jq '.version'`
+DATE=`date --rfc-3339=seconds`
+
+echo '{"build": {}}' | jq ".build.name = $NAME" | jq ".build.version = $VERSION" | jq ".build.buildDate = \"$DATE\""

src/client.js

@@ -2,10 +2,7 @@
 // Copyright 2020 DXOS.org
 //
 
-import { ApolloClient } from 'apollo-client';
+import { ApolloClient, InMemoryCache, ApolloLink, HttpLink } from '@apollo/client';
-import { ApolloLink } from 'apollo-link';
-import { createHttpLink } from 'apollo-link-http';
-import { InMemoryCache } from 'apollo-cache-inmemory';
 
 import { createResolvers } from './resolvers';
 import { getServiceUrl } from './util/config';
@@ -28,7 +25,7 @@ export const graphqlApi = config => {
  */
 export const clientFactory = config => {
   // https://www.apollographql.com/docs/link/
-  const defaultLink = createHttpLink({
+  const defaultLink = new HttpLink({
     uri: graphqlApi(config),
 
     // TODO(burdon): Authentication: send signed message to server (from client wallet).
@@ -39,7 +36,7 @@ export const clientFactory = config => {
   });
 
   const serviceLinks = {
-    signal: createHttpLink({
+    signal: new HttpLink({
       uri: getServiceUrl(config, 'signal.api')
     })
   };

src/components/QueryLink.js

@@ -10,8 +10,41 @@ import LinkIcon from '@material-ui/icons/ExitToApp';
 import { getServiceUrl } from '../util/config';
 
 const QUERY = `
-  query {
+  fragment ValueParts on Value {
-    getRecordsByIds(ids: [ "%ID%" ]) {
+    ... on BooleanValue {
+      bool: value
+    }
+    ... on IntValue {
+      int: value
+    }
+    ... on FloatValue {
+      float: value
+    }
+    ... on StringValue {
+      string: value
+    }
+    ... on BytesValue {
+      bytes: value
+    }
+    ... on LinkValue {
+      link: value
+    }
+  }
+
+  fragment AttrParts on Attribute {
+    key
+    value {
+      ...ValueParts
+      ... on ArrayValue {
+        value {
+          ...ValueParts
+        }
+      }
+    }
+  }
+
+  {
+    getRecordsByIds(ids: ["%ID%"]) {
       id
       names
       bondId
@@ -19,12 +52,12 @@ const QUERY = `
       expiryTime
       owners
       attributes {
-        key
+        ...AttrParts
         value {
-          string
+          ... on MapValue {
-          json
+            map: value {
-          reference {
+              ...AttrParts
-            id
+            }
           }
         }
       }