feat: improve graphql docker for deployment

.github/actions/docker-publish/action.yaml

@@ -19,6 +19,10 @@ inputs:
   dockerfile:
     description: 'Path to the Dockerfile'
     required: true
+  context:
+    description: 'Path to the Context'
+    default: .
+    required: true
   build-args:
     description: 'List of build-time variables'
     required: false
@@ -65,7 +69,7 @@ runs:
       uses: docker/build-push-action@v4
       id: publish
       with:
-        context: .
+        context: ${{ inputs.context }}
         file: ${{ inputs.dockerfile }}
         push: true
         tags: ${{ steps.meta.outputs.tags }}

.github/workflows/docker-publish.yml

@@ -30,3 +30,4 @@ jobs:
           password: ${{ secrets.GITHUB_TOKEN }}
           image: ghcr.io/fuellabs/fuel-explorer
           dockerfile: deployment/Dockerfile
+          context: ./packages/graphql

contracts/predicate/scripts/run-predicate.ts

@@ -2,17 +2,17 @@ import { BaseAssetId, Predicate, Provider, Wallet, bn, hexlify } from 'fuels';
 import { promises as fs } from 'node:fs';
 import { resolve } from 'node:path';
 
-const { FUEL_PROVIDER_BETA5, PRIVATE_KEY } = process.env;
+const { FUEL_PROVIDER, PRIVATE_KEY } = process.env;
 const BIN_PATH = resolve(__dirname, '../out/debug/predicate-app.bin');
 const AMOUNT = 300_000;
 
-if (!FUEL_PROVIDER_BETA5 || !PRIVATE_KEY) {
-  throw new Error('Missing some config on your .env file');
+if (!FUEL_PROVIDER || !PRIVATE_KEY) {
+  throw new Error('Missing some config in .env file. Should have FUEL_PROVIDER and PRIVATE_KEY');
 }
 
 async function main() {
   const binHex = hexlify(await fs.readFile(BIN_PATH));
-  const provider = await Provider.create(FUEL_PROVIDER_BETA5!);
+  const provider = await Provider.create(FUEL_PROVIDER!);
   const wallet = Wallet.fromPrivateKey(PRIVATE_KEY!, provider);
   const { minGasPrice: gasPrice } = wallet.provider.getGasConfig();
   const walletAddress = wallet.address.toB256();

deployment/Dockerfile

@@ -4,20 +4,21 @@ FROM node:20-slim AS base
 
 # Expose the ENVs to the env of the container
 ENV PORT="${PORT}"
-ENV FUEL_PROVIDER_BETA5="${FUEL_PROVIDER_BETA5}"
+ENV FUEL_PROVIDER="${FUEL_PROVIDER:-https://beta-5.fuel.network/graphql}"
 ENV PNPM_HOME="/pnpm"
 ENV PATH="$PNPM_HOME:$PATH"
+ENV SERVER_BUILD=true
 
 # Enable pnpm using corepack form node.js
 RUN corepack enable
 
 COPY . /app-explorer
 WORKDIR /app-explorer
 
-RUN pnpm install --frozen-lockfile
+RUN pnpm install
 
-EXPOSE 4444
+EXPOSE ${PORT}
 
-WORKDIR /app-explorer/packages/graphql
+WORKDIR /app-explorer
 
-CMD ["pnpm", "start"]
+CMD ["pnpm", "server:start"]

packages/app-explorer/.env.example

@@ -1 +1 @@
-FUEL_PROVIDER_BETA5=https://beta-5.fuel.network/graphql
+FUEL_PROVIDER=https://beta-5.fuel.network/graphql

packages/app-explorer/.env.production

@@ -1 +1 @@
-FUEL_PROVIDER_BETA5=https://beta-5.fuel.network/graphql
+FUEL_PROVIDER=https://beta-5.fuel.network/graphql

packages/app-explorer/src/app/api/graphql/route.ts

@@ -1,8 +1,10 @@
 import { createExecutor, createSchema } from '@fuel-explorer/graphql';
 import { ContextDomain } from '@fuel-explorer/graphql/src/domains/Context';
 import { createYoga } from 'graphql-yoga';
+import { requireEnv } from '~/systems/utils/requireEnv';
+
+const { FUEL_PROVIDER: url } = requireEnv(['FUEL_PROVIDER']);
 
-const url = process.env.FUEL_PROVIDER_BETA5!;
 const executor = createExecutor(async ({ body }) => {
   return fetch(url, {
     body,

packages/app-explorer/src/systems/utils/requireEnv.ts

@@ -0,0 +1,12 @@
+export function requireEnv<
+  A extends string[],
+  B extends { [key in A[number]]: string },
+>(keys: string[]): B {
+  return keys.reduce((ret, key) => {
+    if (!process.env[key]) {
+      throw new Error(`Environment variable ${key} is required`);
+    }
+    ret[key] = process.env[key]!;
+    return ret;
+  }, {} as B);
+}

packages/graphql/.dockerignore

@@ -0,0 +1,3 @@
+node_moduels
+.turbo
+dist

packages/graphql/.env.example

@@ -1,2 +1,2 @@
-FUEL_PROVIDER_BETA5=https://beta-5.fuel.network/graphql
-SERVER_PORT=4000
+FUEL_PROVIDER=https://beta-5.fuel.network/graphql
+SERVER_PORT=4444

packages/graphql/.env.production

@@ -1 +1,2 @@
-FUEL_PROVIDER_BETA5=https://beta-5.fuel.network/graphql
+FUEL_PROVIDER=https://beta-5.fuel.network/graphql
+SERVER_PORT=4444

packages/graphql/README.md

@@ -7,3 +7,13 @@ This is a mock api for block-explorer
 ```sh
 pnpm dev
 ```
+
+## Docker
+
+```
+docker run \
+  -e FUEL_PROVIDER=https://beta-5.fuel.network/graphql \
+  -e SERVER_PORT=3000 \
+  -p 3333:3000 \
+  ghcr.io/fuellabs/fuel-explorer:main
+```

packages/graphql/codegen.fuel.ts

@@ -1,13 +1,15 @@
 import type { CodegenConfig } from '@graphql-codegen/cli';
 
-console.log(`process.env.FUEL_PROVIDER_BETA5`, process.env.FUEL_PROVIDER_BETA5);
+import { requireEnv } from './src/utils/requireEnv';
+
+const { FUEL_PROVIDER } = requireEnv([
+  ['FUEL_PROVIDER', 'https://beta-5.fuel.network/graphql'],
+]);
 
 const config: CodegenConfig = {
   generates: {
     './src/schemas/fuelcore.graphql': {
-      schema:
-        process.env.FUEL_PROVIDER_BETA5 ||
-        'https://beta-5.fuel.network/graphql',
+      schema: FUEL_PROVIDER,
       plugins: ['schema-ast'],
       config: {
         includeDirectives: true,

packages/graphql/package.json

@@ -10,12 +10,12 @@
   "typings": "./src/index.ts",
   "scripts": {
     "build": "run-s codegen:fuel build:lib",
-    "build:lib": "tsup --dts",
+    "build:lib": "tsup",
     "build:watch": "pnpm build:lib --watch",
     "codegen:fuel": "gql-gen -r dotenv/config --config codegen.fuel.ts",
     "codegen:app": "gql-gen -r dotenv/config --config codegen.ts",
     "dev": "pnpm build:watch",
-    "start": "pnpm dev",
+    "server:start": "node ./dist/index.js",
     "fix:generated": "node ./scripts/fix-generated.mjs",
     "ts:check": "tsc --noEmit",
     "prepare": "pnpm build"
@@ -43,7 +43,8 @@
     "graphql-tag": "2.12.6",
     "lodash": "^4.17.21",
     "tai64": "1.0.0",
-    "typescript": "5.3.3"
+    "typescript": "5.3.3",
+    "wait-port": "1.1.0"
   },
   "devDependencies": {
     "@babel/cli": "7.23.9",
@@ -63,7 +64,9 @@
     "execa": "8.0.1",
     "graphql-codegen-typescript-common": "0.18.2",
     "graphql-codegen-typescript-mock-data": "3.7.1",
+    "npm-run-all": "^4.1.5",
     "tsconfig-paths": "^4.2.0",
+    "tsup": "8.0.1",
     "tsx": "4.7.0"
   }
 }

packages/graphql/src/bin/index.ts

@@ -0,0 +1,9 @@
+import { runServerCodegen, runServer } from './server';
+
+const { CODE_GEN = 'false' } = process.env;
+
+if (CODE_GEN === 'true') {
+  runServerCodegen();
+} else {
+  runServer();
+}

packages/graphql/src/bin/server.ts

@@ -0,0 +1,79 @@
+import chokidar from 'chokidar';
+import { execa } from 'execa';
+import { createServer } from 'http';
+import { resolve } from 'path';
+
+import app from '../server';
+import { requireEnv } from '../utils/requireEnv';
+
+const { SERVER_PORT } = requireEnv([['SERVER_PORT', '4444']]);
+const { WATCH = 'false' } = process.env;
+
+const server = createServer(app);
+
+export async function runServer() {
+  return new Promise((resolve) => {
+    server.listen(SERVER_PORT, async () => {
+      console.log(
+        `🚀 Server running at http://localhost:${SERVER_PORT}/graphql`
+      );
+      resolve(null);
+    });
+  });
+}
+
+export async function closeServer() {
+  return new Promise((resolve) => {
+    server.close(() => {
+      resolve(null);
+      console.log('🛑 GraphQL server stopped!');
+    });
+  });
+}
+
+export async function runServerCodegen() {
+  const cwd = resolve(__dirname, '../');
+  const gqlWatcher = chokidar.watch(['src/**/*.graphql'], {
+    cwd,
+    ignoreInitial: true,
+    ignored: ['src/schemas'],
+  });
+
+  async function codegen() {
+    console.log('⌛️ Generating GraphQL code...');
+    try {
+      await execa('pnpm', ['codegen:app'], { stdio: 'inherit' });
+      console.log('✅ GraphQL code generated!');
+    } catch (err) {
+      console.log('❌ GraphQL error!');
+    }
+
+    console.log('👀 Watching for GraphQL changes...');
+  }
+
+  await runServer();
+  await codegen();
+
+  async function exitHandler() {
+    await closeServer();
+    gqlWatcher.close();
+  }
+
+  if (WATCH !== 'true') {
+    exitHandler();
+    return;
+  }
+
+  process.on('exit', exitHandler);
+  process.on('SIGTERM', exitHandler);
+  process.on('SIGINT', exitHandler);
+  process.on('SIGUSR1', exitHandler);
+
+  gqlWatcher.on('all', async () => {
+    await closeServer();
+    await runServer();
+    await codegen();
+  });
+
+  return exitHandler;
+}

packages/graphql/src/domains/Network.ts

@@ -1,8 +1,18 @@
 import { Provider } from 'fuels';
 
+import { Cache } from '../utils';
+
+const CHAIN_CACHE = 43200000;
+
 export class NetworkDomain {
+  static cache = new Cache();
+
   static async getChainInfo(url: string) {
-    const provider = await Provider.create(url);
+    let provider = this.cache.get<Provider>(url);
+    if (!provider) {
+      provider = await Provider.create(url);
+    }
+    this.cache.put(url, provider, CHAIN_CACHE);
     return provider.getChain();
   }
 }