diff --git a/.github/workflows/pull_request_template.md b/.github/pull_request_template.md
similarity index 100%
rename from .github/workflows/pull_request_template.md
rename to .github/pull_request_template.md
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 1b5dacbfb..b81b68b5d 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -8,11 +8,14 @@ on:
env:
APP_TITLE: ${{ vars.APP_TITLE }}
+ APP_GRAPHQL_CODEGEN_ENDPOINT: ${{ vars.APP_GRAPHQL_CODEGEN_ENDPOINT }}
+ APP_GRAPHQL_ENDPOINT: ${{ vars.APP_GRAPHQL_ENDPOINT }}
GITHUB_WORKFLOW: true
jobs:
test:
name: Run tests
+ environment: 'test'
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
@@ -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
diff --git a/.gitignore b/.gitignore
index 4f1c24c57..a62060a4f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,7 +7,10 @@ yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
+
node_modules
+generated
+.pnpm-store
dist
dist-ssr
build
diff --git a/.gitmodules b/.gitmodules
new file mode 100644
index 000000000..18cf160fd
--- /dev/null
+++ b/.gitmodules
@@ -0,0 +1,3 @@
+[submodule "backend"]
+ path = backend
+ url = git@github.com:toggle-corp/ai-chatbot-backend.git
diff --git a/.npmrc b/.npmrc
new file mode 100644
index 000000000..6c59086d8
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1 @@
+enable-pre-post-scripts=true
diff --git a/Dockerfile b/Dockerfile
index 0b92c8be7..da63263cd 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -3,9 +3,7 @@ FROM node:18-bullseye
RUN apt-get update -y \
&& apt-get install -y --no-install-recommends \
git bash g++ make \
- && rm -rf /var/lib/apt/lists/*
-
-RUN npm install pnpm
+RUN npm install -g pnpm
WORKDIR /code
diff --git a/README.md b/README.md
index 9ef542aba..14605f261 100644
--- a/README.md
+++ b/README.md
@@ -2,9 +2,92 @@
The AI chatbot will be white-labeled, allowing for full customization to meet the needs of any company. The chatbot will be integrated with Facebook Messenger, WhatsApp, and a custom chat window that can be embedded into company websites.
-Useful Resources and Links
+## Built with
+[![React][react-shields]][react-url] [![Vite][vite-shields]][vite-url] [![Typescript][typescript-shields]][typescript-url]
-* Board board: https://github.com/orgs/toggle-corp/projects/36
-* Timeline:
-* Figma:
-* Local Deployment:
+## Getting started
+
+Below are the steps to guide you through preparing your local enviroment for the AI CHATBOT CMS. Before diving into setup please look into the concept of [Github Sub Modules](https://github.blog/open-source/git/working-with-submodules/), [Docker Merge](https://docs.docker.com/compose/how-tos/multiple-compose-files/merge/).
+
+### Prerequisites
+
+To begin, ensure you have network access. Then, you'll need the following:
+
+1. [Git](https://git-scm.com/)
+2. [Node.JS](https://nodejs.org/en/) version >=18 / 20+
+3. [Pnpm](https://pnpm.io/)
+4. Alternatively, you can use [Docker](https://www.docker.com/) to build the application.
+
+### Local development (with docker)
+
+Clone the repository using HTTPS, SSH, or Github CLI
+```bash
+git clone https://github.com/toggle-corp/ai-chatbot-cms.git #HTTPS
+git clone git@github.com:toggle-corp/ai-chatbot-cms.git #SSH
+gh repo clone toggle-corp/ai-chatbot-cms #Github CLI
+```
+Download the contents of backend(ai-chatbot-backend)
+```bash
+git submodule update --init --recursive
+```
+Update Environment variables
+* create .env file and add COMPOSE_FILE variable for the ai-chatbot-cms
+```bash
+touch .env
+```
+* Copy env.example to .env and update the variables for the backend
+```bash
+cd backend
+cp env.example .env
+```
+> NOTE: The backend has a higher priority than the ai-chatbot-cms. You can add backend environment variables in the CMS, but you must create a .env file in the backend for them to work.
+
+Build the docker image
+```bash
+docker compose build
+```
+Start the development server
+```bash
+docker compose up
+```
+Install the dependencies
+```bash
+docker compose exec react bash -c 'pnpm install'
+```
+Generate type
+```bash
+docker compose exec react bash -c 'pnpm generate:type'
+```
+### Local development (without docker)
+
+Same steps upto downloading the contents of backend
+
+Update Enviroment variables
+
+* create .env file and add COMPOSE_FILE and other variable for the ai-chatbot-cms
+```bash
+touch .env
+```
+> NOTE: Copy the env variables from the docker compose file in environment section
+
+Install the dependencies
+```bash
+pnpm install
+```
+Generate type
+```bash
+pnpm generate:type
+```
+Start the development server
+```bash
+pnpm start
+```
+
+
+
+[react-shields]: https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB
+[react-url]: https://reactjs.org/
+[vite-shields]: https://img.shields.io/badge/vite-%23646CFF.svg?style=for-the-badge&logo=vite&logoColor=white
+[vite-url]: https://vitejs.dev/
+[typescript-shields]: https://img.shields.io/badge/typescript-%23007ACC.svg?style=for-the-badge&logo=typescript&logoColor=white
+[typescript-url]: https://www.typescriptlang.org/
diff --git a/backend b/backend
new file mode 160000
index 000000000..81bac9497
--- /dev/null
+++ b/backend
@@ -0,0 +1 @@
+Subproject commit 81bac949745925bae52ad3dcde5a4e965a75440f
diff --git a/codegen.ts b/codegen.ts
new file mode 100644
index 000000000..e2013d24e
--- /dev/null
+++ b/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;
diff --git a/docker-compose-with-backend.yml b/docker-compose-with-backend.yml
new file mode 100644
index 000000000..d936724f9
--- /dev/null
+++ b/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:-./backend/schema.graphql}
+ volumes:
+ - ../:/code
+ ports:
+ - '3000:3000'
+ depends_on:
+ - web
diff --git a/docker-compose.yml b/docker-compose.yml
deleted file mode 100644
index 3f19cad0a..000000000
--- a/docker-compose.yml
+++ /dev/null
@@ -1,11 +0,0 @@
-version: '3.8'
-services:
- react:
- build: .
- command: sh -c 'yarn install && yarn dev --host'
- environment:
- APP_TITLE: ${APP_TITLE:-React Base App}
- volumes:
- - .:/code
- ports:
- - '3000:3000'
diff --git a/env.ts b/env.ts
index d925fa5aa..7aa55218d 100644
--- a/env.ts
+++ b/env.ts
@@ -4,6 +4,9 @@ import {
} from '@julr/vite-plugin-validate-env';
export default defineConfig({
- APP_TITLE: Schema.string.optional(),
- GRAPHQL_ENDPOINT: Schema.string.optional(),
+ // NOTE: We need to replace with URL
+ APP_GRAPHQL_ENDPOINT: Schema.string(),
+
+ // NOTE: It is not used for now
+ APP_TITLE: Schema.string(),
});
diff --git a/index.html b/index.html
index e0322f2c8..d2d5a3cd5 100644
--- a/index.html
+++ b/index.html
@@ -21,7 +21,26 @@
%APP_TITLE%
-
+
+