Add backend submodule and update docker-compose

.github/workflows/ci.yml

@@ -8,6 +8,7 @@ on:
 
 env:
   APP_TITLE: ${{ vars.APP_TITLE }}
+  APP_GRAPHQL_CODEGEN_ENDPOINT: ${{ vars.APP_GRAPHQL_CODEGEN_ENDPOINT }}
   GITHUB_WORKFLOW: true
 
 jobs:
@@ -16,6 +17,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+        with:
+          submodules: true
 
       - uses: pnpm/action-setup@v4
         name: Install pnpm
@@ -37,6 +40,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+        with:
+          submodules: true
 
       - uses: pnpm/action-setup@v4
         name: Install pnpm
@@ -58,6 +63,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+        with:
+          submodules: true
 
       - uses: pnpm/action-setup@v4
         name: Install pnpm
@@ -100,6 +107,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+        with:
+          submodules: true
 
       - uses: pnpm/action-setup@v4
         name: Install pnpm
@@ -122,6 +131,8 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+        with:
+          submodules: true
 
       - uses: pnpm/action-setup@v4
         name: Install pnpm

.gitignore

@@ -7,7 +7,10 @@ yarn-error.log*
 pnpm-debug.log*
 lerna-debug.log*
 
+
 node_modules
+generated
+.pnpm-store
 dist
 dist-ssr
 build

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "backend"]
+	path = backend
+	url = [email protected]:toggle-corp/ai-chatbot-backend.git

Dockerfile

@@ -2,10 +2,10 @@ FROM node:18-bullseye
 
 RUN apt-get update -y \
     && apt-get install -y --no-install-recommends \
-        git bash g++ make \
+        git bash g++ make iproute2 \
     && rm -rf /var/lib/apt/lists/*
 
-RUN npm install pnpm
+RUN npm install -g pnpm
 
 WORKDIR /code
 

codegen.ts

@@ -0,0 +1,20 @@
+import { CodegenConfig } from '@graphql-codegen/cli';
+
+const config: CodegenConfig = {
+    schema: process.env.APP_GRAPHQL_CODEGEN_ENDPOINT,
+    documents: [
+        'src/**/*.tsx',
+        'src/**/*.ts',
+    ],
+    ignoreNoDocuments: true, // for better experience with the watcher
+    generates: {
+        './generated/types/': {
+            preset: 'client',
+        },
+    },
+    config: {
+        enumsAsTypes: true,
+    },
+};
+
+export default config;

docker-compose-with-backend.yml

@@ -0,0 +1,16 @@
+name: chatbot
+
+services:
+  react:
+    build: ../
+    command: sh -c 'pnpm install && pnpm start --host'
+    environment:
+      APP_TITLE: ${APP_TITLE:-CMS}
+      APP_GRAPHQL_ENDPOINT: ${APP_GRAPHQL_ENDPOINT:-http://localhost:8001/graphql/}
+      APP_GRAPHQL_CODEGEN_ENDPOINT: ${APP_GRAPHQL_CODEGEN_ENDPOINT:-http://web:8001/graphql/}
+    volumes:
+      - ../:/code
+    ports:
+      - '3000:3000'
+    depends_on:
+      - web

env.ts

@@ -4,6 +4,6 @@ import {
 } from '@julr/vite-plugin-validate-env';
 
 export default defineConfig({
-    APP_TITLE: Schema.string.optional(),
-    APP_GRAPHQL_ENDPOINT: Schema.string.optional(),
+    COMPOSE_FILE: Schema.string.optional(),
+    APP_TITLE: Schema.string(),
 });

package.json

@@ -10,6 +10,9 @@
         "preview": "vite preview",
         "test": "vitest",
         "coverage": "vitest run --coverage",
+        "get-hostname": "ip route | awk '/default/ { print $3 }'",
+        "replace-localhost": "awk \"{sub(/localhost/, \\\"$(pnpm -s get-hostname)\\\")}1\"",
+        "generate:type": "APP_GRAPHQL_CODEGEN_ENDPOINT=$(echo $APP_GRAPHQL_CODEGEN_ENDPOINT | pnpm -s replace-localhost) graphql-codegen --require dotenv/config --config codegen.ts",
         "typecheck": "tsc",
         "lint": "pnpm lint:js && pnpm lint:css",
         "lint:fix": "pnpm lint:js --fix && pnpm lint:css --fix",
@@ -28,6 +31,9 @@
         "react-router-dom": "^6.11.1"
     },
     "devDependencies": {
+        "@graphql-codegen/cli": "^5.0.2",
+        "@graphql-codegen/client-preset": "^4.3.3",
+        "@graphql-typed-document-node/core": "^3.2.0",
         "@types/node": "^20.1.3",
         "@types/react": "^18.0.28",
         "@types/react-dom": "^18.0.11",
@@ -36,6 +42,7 @@
         "@vitejs/plugin-react-swc": "^3.0.0",
         "@vitest/coverage-v8": "^2.1.3",
         "autoprefixer": "^10.4.14",
+        "dotenv": "^16.4.5",
         "eslint": "^8.40.0",
         "eslint-config-airbnb": "^19.0.4",
         "eslint-import-resolver-typescript": "^3.5.5",