Update dependencies and fix updateBoxProfile handler.ts

packages/app-react/package.json

@@ -11,7 +11,7 @@
     "precommit": "yarn lint-staged"
   },
   "dependencies": {
-    "3box": "^1.18.1",
+    "3box": "^1.20.3",
     "@apollo/client": "^3.0.0-beta.43",
     "@apollo/react-hooks": "^3.1.5",
     "@material-ui/core": "^4.9.10",

packages/backend/package.json

@@ -8,7 +8,7 @@
     "start": "node ./dist/index.js",
     "build": "yarn generate && tsc -b",
     "dev": "concurrently \"yarn dev-ts\" \"yarn generate --watch\"",
-    "dev-ts": "ts-node-dev --exit-child --respawn --transpileOnly src/index.ts",
+    "dev-ts": "ts-node-dev --exit-child --respawn --transpile-only -- src/index.ts",
     "typecheck": "yarn build",
     "precommit": "yarn lint-staged",
     "generate": "graphql-codegen --config=codegen.yml"
@@ -16,7 +16,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "3box": "^1.18.1",
+    "3box": "^1.20.3",
     "@metafam/utils": "1.0.0",
     "body-parser": "^1.19.0",
     "ethers": "^4.0.46",
@@ -24,12 +24,13 @@
     "express-graphql": "^0.11.0",
     "graphql": "^15.3.0",
     "graphql-tools": "^6.0.15",
-    "node-fetch": "^2.6.0"
+    "node-fetch": "^2.6.0",
+    "graphql-request": "^3.0.0-next.4"
   },
   "devDependencies": {
     "@types/express": "^4.17.6",
     "@types/node-fetch": "^2.5.6",
     "concurrently": "^5.2.0",
-    "ts-node-dev": "^1.0.0-pre.50"
+    "ts-node-dev": "^1.0.0-pre.56"
   }
 }

packages/backend/src/handlers/actions/updateBoxProfile/handler.ts

@@ -1,37 +1,36 @@
 import Box, { VerifiedAccounts } from '3box';
 import { Request, Response } from 'express';
+import { gql } from 'graphql-request';
 
 import { hasuraQuery } from '../../../lib/hasuraHelpers';
-import { getPlayerETHAddress } from '../../../lib/playerHelpers';
 
-const getPlayerQuery = `
-query GetPlayer ($playerId: uuid!) {
-  Player(
-    where: { 
-      id: { _eq: $playerId }
-    }
-  ) {
-    id
-    Accounts {
-      identifier
-      type
+type PlayerResult = {
+  Player: Array<{
+    id: string;
+    ethereum_address: string | null | undefined;
+  }>;
+};
+const getPlayerQuery = gql`
+  query GetPlayer($playerId: uuid!) {
+    Player(where: { id: { _eq: $playerId } }) {
+      id
+      ethereum_address
     }
   }
-}
 `;
 
-const upsertAccount = `
-mutation upsert_Account($objects: [Account_insert_input!]!) {
-  insert_Account (
-    objects: $objects,
-    on_conflict: {
-      constraint: Account_identifier_type_player_key,
-      update_columns: [identifier]
+const upsertAccount = gql`
+  mutation upsert_Account($objects: [Account_insert_input!]!) {
+    insert_Account(
+      objects: $objects
+      on_conflict: {
+        constraint: Account_identifier_type_player_key
+        update_columns: [identifier]
+      }
+    ) {
+      affected_rows
     }
-  ) {
-    affected_rows
   }
-}
 `;
 
 export const updateBoxProfileHandler = async (
@@ -46,16 +45,16 @@ export const updateBoxProfileHandler = async (
     throw new Error('expected role player');
   }
 
-  const data = await hasuraQuery(getPlayerQuery, {
+  const data = await hasuraQuery<PlayerResult>(getPlayerQuery, {
     playerId,
   });
 
-  const player = data.Player[0];
-  if (!player) {
+  const ethAddress = data.Player[0]?.ethereum_address;
+
+  if (!ethAddress) {
     throw new Error('unknown-player');
   }
 
-  const ethAddress = getPlayerETHAddress(player);
   const boxProfile = await Box.getProfile(ethAddress);
   const verifiedProfile = await Box.getVerifiedAccounts(boxProfile);
   const result = await updateVerifiedProfiles(playerId, verifiedProfile);

packages/backend/src/lib/hasuraHelpers.ts

@@ -1,21 +1,22 @@
-import fetch from 'node-fetch';
+import { GraphQLClient } from 'graphql-request';
+import { Variables } from 'graphql-request/dist/types';
 
 import { CONFIG } from '../config';
 
-export async function hasuraQuery(query: string, qv: any = {}) {
-  const result = await fetch(CONFIG.graphqlURL, {
-    method: 'POST',
-    body: JSON.stringify({ query, variables: qv }),
+export async function hasuraQuery<T = any>(
+  query: string,
+  variables?: Variables,
+): Promise<T> {
+  const graphQLClient = new GraphQLClient(CONFIG.graphqlURL, {
     headers: {
       'Content-Type': 'application/json',
       'x-hasura-access-key': CONFIG.adminKey,
     },
   });
 
-  const { errors, data } = await result.json();
-
-  if (errors) {
-    throw new Error(JSON.stringify(errors));
+  try {
+    return await graphQLClient.request<T>(query, variables);
+  } catch (error) {
+    throw new Error(JSON.stringify(error, undefined, 2));
   }
-  return data;
 }

packages/backend/src/lib/playerHelpers.ts

@@ -1,3 +0,0 @@
-export function getPlayerETHAddress(player: any) {
-  return player.Accounts.find((a: any) => a.type === 'ETHEREUM').identifier;
-}

packages/design-system/package.json

@@ -39,6 +39,7 @@
     "@storybook/react": "^5.3.19",
     "babel-loader": "^8.1.0",
     "react-docgen-typescript-loader": "^3.7.2",
+    "react-dom": "^16.13.1",
     "react-google-font-loader": "^1.1.0",
     "ts-loader": "^8.0.1",
     "tslib": "^2.0.0"