From e577bd9a3880353bbbc61c7ada087d4018e1a389 Mon Sep 17 00:00:00 2001 From: aayushh-patell Date: Mon, 27 May 2024 19:44:55 -0500 Subject: [PATCH 01/10] Integrated Ngrok Adjusted docker-compose.yml to run ngrok using my personal authentication token --- .DS_Store | Bin 6148 -> 10244 bytes backend/typescript/Dockerfile | 10 ++++++++-- docker-compose.yml | 21 +++++++++++++++++---- 3 files changed, 25 insertions(+), 6 deletions(-) diff --git a/.DS_Store b/.DS_Store index 71c2deb93a7d0ea9894ffe621ed05481a99675b6..eb315c1e3db695ede60c2efb11545f36315d88d9 100644 GIT binary patch literal 10244 zcmeHMJ#5oJ6n-Wtaasydfp$O@Mo5UEO_N9!EewPZkQfkBg8&IoNa8fH;@DA~5LHn{ zCVo1wu`w|*cYuWrbzp*t4T+hZ4Jo`kUz+nziY%n6O7E(>XZzl}^Y^`%cfKnCNSU^p z1W*7##!6)D7&bnI^pol-N7$1kloHxQv12ugx>>~g4<2ptKrkQ}5DW+g1OtMBgTMf; z*`&x*wiK;kKrkQ}*kyp^2L&sUX(oHNq^ScNx&=TP#>ceab&On~RG3UN*|R0~V3BN7 zl(wnFwiuFaj?WdQmu9kOOWPbIw)v3Q%o5w7NOX1_U!m$CrEMu%!GK`E%K+KChanCX z(4fWd--``hvs#J7cj-tdJaIH4N8~B_ajt51a;-wEZDk70hve?AY3jwnb)k4qD|hm- zQ`b$SRnUxblNxAh8C4$L*9_I{WX!gqTGTdYcgRsWnvczPyNLy5HMO~*bd$@;)Pl0I zoZ8%s%BRmSU0KW5^txfbv;jyg3Ba@q&?_E|UP`z*~lyDUDQ!DGGfWn~zvF0CQf(ONuK_GL5!Dwr%9n~17}cXeoB zYhirGVFT~j3WXj&CeJCKJ)NVur{|khyq{DVI=IW z>4=8OZ#c2v%&zE{VI7(n9R~HSGk<;D_f>kX+g(ilYndj?FqV#xBhV~J~;Ca4kyV;Ms+P7{}b!KpzdAQG95)WXl9299GvHK6@0 zwN!CYC+RNlc&|KtBb}zfIF7#&aBSj3Q3L~m0l~nSGZ3=zDdhbB1}6Ct|NkFz76d%O zz~N><3TJcK4013yR&&!q&e|2MPq30g^m?|WCfLy9c$D-w9&gBT{6(xpH$fyRc%5dl lXG?s7W#9i9FgO(y`~QP|mg}?I4){6mGlFCDbZGbge*sbYoF)JO delta 148 zcmZn(XfcprU|?W$DortDU=RQ@Ie-{Mvv5r;6q~50D9Q /etc/apt/sources.list -# libcurl3 is required for mongodb-memory-server, which is used for testing -RUN apt-get update && apt-get install -y libcurl3 +# Install dependencies +RUN apt-get update && apt-get install -y libcurl4 curl unzip + +# Install ngrok using curl +RUN curl -o ngrok-stable-linux-amd64.zip https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip && \ + unzip ngrok-stable-linux-amd64.zip && \ + mv ngrok /usr/local/bin/ && \ + rm ngrok-stable-linux-amd64.zip RUN yarn install diff --git a/docker-compose.yml b/docker-compose.yml index 9ab580a..664ee44 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -10,11 +10,12 @@ services: - ./frontend:/app - /app/node_modules ports: - - 3000:3000 + - "3000:3000" environment: - CHOKIDAR_USEPOLLING=true env_file: - ./frontend/.env + ts-backend: container_name: de_ts_backend build: @@ -24,7 +25,7 @@ services: - ./backend/typescript:/app - /app/node_modules ports: - - 5000:5000 + - "5001:5001" dns: - 8.8.8.8 depends_on: @@ -33,11 +34,12 @@ services: env_file: - ./.env - ./backend/typescript/.env + db: container_name: de_db image: postgres:12-alpine ports: - - 5432:5432 + - "5432:5432" volumes: - postgres_data:/var/lib/postgresql/data/ - ./db-init:/docker-entrypoint-initdb.d @@ -46,10 +48,21 @@ services: environment: - POSTGRES_MULTIPLE_DATABASES=${POSTGRES_DB_DEV},${POSTGRES_DB_TEST} healthcheck: - test: [ "CMD-SHELL", "pg_isready -U postgres" ] + test: ["CMD-SHELL", "pg_isready -U postgres"] interval: 5s timeout: 5s retries: 5 + ngrok: + image: ngrok/ngrok:latest + platform: linux/arm64 + command: ngrok http ts-backend:5001 + ports: + - "4040:4040" # ngrok web interface + depends_on: + - ts-backend + environment: + - NGROK_AUTHTOKEN=2gqfbeXPRkhFsAGXsIpFZJCiitr_7VbDSwxB2h9Z6HbeK259K + volumes: postgres_data: From 70127e7ae56b73a33832b8203ff37bd94fbae438 Mon Sep 17 00:00:00 2001 From: Leo Zhang Date: Mon, 27 May 2024 22:06:28 -0400 Subject: [PATCH 02/10] add environment variable for ngrok authtoken --- backend/typescript/package.json | 4 ++-- backend/typescript/prisma/schema.prisma | 1 + docker-compose.yml | 3 +-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/backend/typescript/package.json b/backend/typescript/package.json index 95fbdfa..5dddf62 100644 --- a/backend/typescript/package.json +++ b/backend/typescript/package.json @@ -13,7 +13,7 @@ "author": "", "license": "ISC", "dependencies": { - "@prisma/client": "^5.11.0", + "@prisma/client": "^5.14.0", "@types/graphql-upload": "^8.0.6", "@types/json2csv": "^5.0.3", "@types/multer": "^1.4.6", @@ -74,7 +74,7 @@ "mongodb-memory-server": "^6.9.6", "nodemon": "^2.0.7", "prettier": "^2.2.1", - "prisma": "^5.11.0", + "prisma": "^5.14.0", "ts-jest": "^27.0.3", "typescript": "^4.1.5" }, diff --git a/backend/typescript/prisma/schema.prisma b/backend/typescript/prisma/schema.prisma index a9944ce..4c8412e 100644 --- a/backend/typescript/prisma/schema.prisma +++ b/backend/typescript/prisma/schema.prisma @@ -1,5 +1,6 @@ generator client { provider = "prisma-client-js" + binaryTargets = ["native", "linux-arm64-openssl-3.0.x"] } datasource db { diff --git a/docker-compose.yml b/docker-compose.yml index 664ee44..4b3df0d 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -62,7 +62,6 @@ services: depends_on: - ts-backend environment: - - NGROK_AUTHTOKEN=2gqfbeXPRkhFsAGXsIpFZJCiitr_7VbDSwxB2h9Z6HbeK259K - + - NGROK_AUTHTOKEN=${auth_token} volumes: postgres_data: From b9e81d900023132b7af9ed2551a0dfe4cba4dc0b Mon Sep 17 00:00:00 2001 From: aayushh-patell Date: Mon, 3 Jun 2024 19:35:29 -0500 Subject: [PATCH 03/10] Add ngrok set-up instructions in README.md --- README.md | 31 +++++++++++++++++++++++++++++++ docker-compose.yml | 2 +- 2 files changed, 32 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 15c7b0d..5798212 100644 --- a/README.md +++ b/README.md @@ -106,6 +106,37 @@ Open Prisma studio: npx prisma studio ``` +## Ngrok +### Set-up +1. Create an [ngrok](https://dashboard.ngrok.com/signup) account + +2. Insert your personal ngrok authentication token in docker-compose.yml: +```bash +NGROK_AUTHTOKEN= +``` + +3. Run the application: +```bash +docker compose up --build +``` + +### Troubleshooting + +If another service is occupying port 5000, identify the PID of the service: +```bash +sudo lsof -i :5000 +``` + +Kill the occupying service: +```bash +sudo kill +``` + +Run the application again: +```bash +docker compose up --build +``` + ## The Team ### Term 1 (W24): **Project Lead:** N/A
diff --git a/docker-compose.yml b/docker-compose.yml index 664ee44..c47d011 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -62,7 +62,7 @@ services: depends_on: - ts-backend environment: - - NGROK_AUTHTOKEN=2gqfbeXPRkhFsAGXsIpFZJCiitr_7VbDSwxB2h9Z6HbeK259K + - NGROK_AUTHTOKEN= volumes: postgres_data: From 5d3c1150dd891806b719e58f8e2aea1394fd0adb Mon Sep 17 00:00:00 2001 From: Leo Zhang Date: Mon, 3 Jun 2024 22:24:10 -0400 Subject: [PATCH 04/10] updating ngrok authtoken as variable / exposing port 5001 for backend --- backend/typescript/Dockerfile | 2 +- backend/typescript/server.ts | 4 ++-- docker-compose.yml | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/backend/typescript/Dockerfile b/backend/typescript/Dockerfile index f04b775..cf2ee4e 100644 --- a/backend/typescript/Dockerfile +++ b/backend/typescript/Dockerfile @@ -24,5 +24,5 @@ COPY . ./ RUN npx prisma generate -EXPOSE 5000 +EXPOSE 5001 ENTRYPOINT ["yarn", "dev"] diff --git a/backend/typescript/server.ts b/backend/typescript/server.ts index ccb6a64..3942560 100644 --- a/backend/typescript/server.ts +++ b/backend/typescript/server.ts @@ -57,7 +57,7 @@ firebaseAdmin.initializeApp({ }), }); -app.listen({ port: process.env.PORT || 5000 }, () => { +app.listen({ port: process.env.PORT || 5001 }, () => { /* eslint-disable-next-line no-console */ - console.info(`Server is listening on port ${process.env.PORT || 5000}!`); + console.info(`Server is listening on port ${process.env.PORT || 5001}!`); }); diff --git a/docker-compose.yml b/docker-compose.yml index c47d011..f135e1e 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -62,7 +62,7 @@ services: depends_on: - ts-backend environment: - - NGROK_AUTHTOKEN= + - NGROK_AUTHTOKEN=${authtoken} # store personal authtoken (generated from signing up for ngrok account) as environment variable: authoken=INSERT_AUTH_TOKEN_HERE volumes: postgres_data: From 70116e64f54ce98382b739f98fd62ef43d9155e5 Mon Sep 17 00:00:00 2001 From: Leo Zhang Date: Mon, 3 Jun 2024 22:34:37 -0400 Subject: [PATCH 05/10] environment variable for ngrok authtoken instead of hardcoding --- README.md | 8 ++++---- docker-compose.yml | 3 +-- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 5798212..db85766 100644 --- a/README.md +++ b/README.md @@ -110,9 +110,9 @@ npx prisma studio ### Set-up 1. Create an [ngrok](https://dashboard.ngrok.com/signup) account -2. Insert your personal ngrok authentication token in docker-compose.yml: +2. Insert your personal ngrok authentication token as an environment variable in the .env file of the root directory: ```bash -NGROK_AUTHTOKEN= +NGROK_AUTHTOKEN=${authtoken} ``` 3. Run the application: @@ -122,9 +122,9 @@ docker compose up --build ### Troubleshooting -If another service is occupying port 5000, identify the PID of the service: +If another service is occupying port 5001, identify the PID of the service: ```bash -sudo lsof -i :5000 +sudo lsof -i :5001 ``` Kill the occupying service: diff --git a/docker-compose.yml b/docker-compose.yml index f135e1e..59e061a 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -62,7 +62,6 @@ services: depends_on: - ts-backend environment: - - NGROK_AUTHTOKEN=${authtoken} # store personal authtoken (generated from signing up for ngrok account) as environment variable: authoken=INSERT_AUTH_TOKEN_HERE - + - NGROK_AUTHTOKEN=${authtoken} volumes: postgres_data: From f0165d0dcf1455f427cb50b6065919f5e3c711b7 Mon Sep 17 00:00:00 2001 From: Leo Zhang Date: Mon, 3 Jun 2024 22:41:00 -0400 Subject: [PATCH 06/10] typo --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index db85766..d3341fa 100644 --- a/README.md +++ b/README.md @@ -110,7 +110,7 @@ npx prisma studio ### Set-up 1. Create an [ngrok](https://dashboard.ngrok.com/signup) account -2. Insert your personal ngrok authentication token as an environment variable in the .env file of the root directory: +2. Store your personal ngrok authentication token as an environment variable in the .env file of the root directory: ```bash NGROK_AUTHTOKEN=${authtoken} ``` From 1af87e8495d7f2e957e044036fb31bdbeaa92aa1 Mon Sep 17 00:00:00 2001 From: mat-ng Date: Wed, 5 Jun 2024 13:31:35 -0400 Subject: [PATCH 07/10] update readme --- README.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index d3341fa..5dde68a 100644 --- a/README.md +++ b/README.md @@ -107,12 +107,12 @@ npx prisma studio ``` ## Ngrok -### Set-up +### Setup 1. Create an [ngrok](https://dashboard.ngrok.com/signup) account 2. Store your personal ngrok authentication token as an environment variable in the .env file of the root directory: -```bash -NGROK_AUTHTOKEN=${authtoken} +``` +NGROK_AUTHTOKEN= ``` 3. Run the application: @@ -122,7 +122,7 @@ docker compose up --build ### Troubleshooting -If another service is occupying port 5001, identify the PID of the service: +If another service is occupying port 5001, identify the PID of the service (macOS): ```bash sudo lsof -i :5001 ``` From b547e3b49986778f93556a0acbe515e8ddc0877a Mon Sep 17 00:00:00 2001 From: Leo Zhang Date: Wed, 5 Jun 2024 21:18:13 -0400 Subject: [PATCH 08/10] delete ngrok container --- docker-compose.yml | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/docker-compose.yml b/docker-compose.yml index 59e061a..f8f33cf 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -52,16 +52,5 @@ services: interval: 5s timeout: 5s retries: 5 - - ngrok: - image: ngrok/ngrok:latest - platform: linux/arm64 - command: ngrok http ts-backend:5001 - ports: - - "4040:4040" # ngrok web interface - depends_on: - - ts-backend - environment: - - NGROK_AUTHTOKEN=${authtoken} volumes: postgres_data: From 00a06801e8135a164fc717cc8b893553c323eee8 Mon Sep 17 00:00:00 2001 From: Leo Zhang <101443196+lzboy14@users.noreply.github.com> Date: Wed, 5 Jun 2024 21:21:11 -0400 Subject: [PATCH 09/10] Delete .DS_Store --- .DS_Store | Bin 10244 -> 0 bytes 1 file changed, 0 insertions(+), 0 deletions(-) delete mode 100644 .DS_Store diff --git a/.DS_Store b/.DS_Store deleted file mode 100644 index eb315c1e3db695ede60c2efb11545f36315d88d9..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 10244 zcmeHMJ#5oJ6n-Wtaasydfp$O@Mo5UEO_N9!EewPZkQfkBg8&IoNa8fH;@DA~5LHn{ zCVo1wu`w|*cYuWrbzp*t4T+hZ4Jo`kUz+nziY%n6O7E(>XZzl}^Y^`%cfKnCNSU^p z1W*7##!6)D7&bnI^pol-N7$1kloHxQv12ugx>>~g4<2ptKrkQ}5DW+g1OtMBgTMf; z*`&x*wiK;kKrkQ}*kyp^2L&sUX(oHNq^ScNx&=TP#>ceab&On~RG3UN*|R0~V3BN7 zl(wnFwiuFaj?WdQmu9kOOWPbIw)v3Q%o5w7NOX1_U!m$CrEMu%!GK`E%K+KChanCX z(4fWd--``hvs#J7cj-tdJaIH4N8~B_ajt51a;-wEZDk70hve?AY3jwnb)k4qD|hm- zQ`b$SRnUxblNxAh8C4$L*9_I{WX!gqTGTdYcgRsWnvczPyNLy5HMO~*bd$@;)Pl0I zoZ8%s%BRmSU0KW5^txfbv;jyg3Ba@q&?_E|UP`z*~lyDUDQ!DGGfWn~zvF0CQf(ONuK_GL5!Dwr%9n~17}cXeoB zYhirGVFT~j3WXj&CeJCKJ)NVur{|khyq{DVI=IW z>4=8OZ#c2v%&zE{VI7(n9R~HSGk<;D_f>kX+g(ilYndj?FqV#xBhV~J~;Ca4kyV;Ms+P7{}b!KpzdAQG95)WXl9299GvHK6@0 zwN!CYC+RNlc&|KtBb}zfIF7#&aBSj3Q3L~m0l~nSGZ3=zDdhbB1}6Ct|NkFz76d%O zz~N><3TJcK4013yR&&!q&e|2MPq30g^m?|WCfLy9c$D-w9&gBT{6(xpH$fyRc%5dl lXG?s7W#9i9FgO(y`~QP|mg}?I4){6mGlFCDbZGbge*sbYoF)JO From 56f8b26388ba04cb1ed17d8ac7a6434b0afd28ef Mon Sep 17 00:00:00 2001 From: Leo Zhang Date: Wed, 5 Jun 2024 21:25:56 -0400 Subject: [PATCH 10/10] run linter --- frontend/src/APIClients/AuthAPIClient.ts | 10 ++++++++-- frontend/src/APIClients/EntityAPIClient.ts | 2 +- frontend/src/components/auth/Logout.tsx | 1 - frontend/src/components/auth/RefreshCredentials.tsx | 1 - frontend/src/components/crud/CreateForm.tsx | 4 +++- frontend/src/components/crud/DisplayTableContainer.tsx | 2 -- frontend/src/components/crud/UpdateForm.tsx | 7 +++---- .../src/components/pages/__tests__/Default.test.tsx | 1 - 8 files changed, 15 insertions(+), 13 deletions(-) diff --git a/frontend/src/APIClients/AuthAPIClient.ts b/frontend/src/APIClients/AuthAPIClient.ts index 4f55923..ca3ce26 100644 --- a/frontend/src/APIClients/AuthAPIClient.ts +++ b/frontend/src/APIClients/AuthAPIClient.ts @@ -11,7 +11,6 @@ import { setLocalStorageObjProperty, } from "../utils/LocalStorageUtils"; - const login = async ( email: string, password: string, @@ -116,4 +115,11 @@ const refresh = async (): Promise => { } }; -export default { login, logout, loginWithGoogle, register, resetPassword, refresh }; +export default { + login, + logout, + loginWithGoogle, + register, + resetPassword, + refresh, +}; diff --git a/frontend/src/APIClients/EntityAPIClient.ts b/frontend/src/APIClients/EntityAPIClient.ts index b9063cc..d22059e 100644 --- a/frontend/src/APIClients/EntityAPIClient.ts +++ b/frontend/src/APIClients/EntityAPIClient.ts @@ -71,7 +71,7 @@ const getFile = async (uuid: string): Promise => { headers: { Authorization: bearerToken }, }); - return data.fileURL + return data.fileURL; } catch (error) { return error; } diff --git a/frontend/src/components/auth/Logout.tsx b/frontend/src/components/auth/Logout.tsx index 30854a1..49899ad 100644 --- a/frontend/src/components/auth/Logout.tsx +++ b/frontend/src/components/auth/Logout.tsx @@ -3,7 +3,6 @@ import React, { useContext } from "react"; import authAPIClient from "../../APIClients/AuthAPIClient"; import AuthContext from "../../contexts/AuthContext"; - const Logout = (): React.ReactElement => { const { authenticatedUser, setAuthenticatedUser } = useContext(AuthContext); diff --git a/frontend/src/components/auth/RefreshCredentials.tsx b/frontend/src/components/auth/RefreshCredentials.tsx index f946880..abbc8ec 100644 --- a/frontend/src/components/auth/RefreshCredentials.tsx +++ b/frontend/src/components/auth/RefreshCredentials.tsx @@ -3,7 +3,6 @@ import React, { useContext } from "react"; import authAPIClient from "../../APIClients/AuthAPIClient"; import AuthContext from "../../contexts/AuthContext"; - const RefreshCredentials = (): React.ReactElement => { const { setAuthenticatedUser } = useContext(AuthContext); diff --git a/frontend/src/components/crud/CreateForm.tsx b/frontend/src/components/crud/CreateForm.tsx index 3c4e595..13e0aaf 100644 --- a/frontend/src/components/crud/CreateForm.tsx +++ b/frontend/src/components/crud/CreateForm.tsx @@ -83,7 +83,9 @@ const CreateForm = (): React.ReactElement => { if (fileField) { multipartFormData.append("file", fileField); } - const result = await EntityAPIClient.create({ formData: multipartFormData }); + const result = await EntityAPIClient.create({ + formData: multipartFormData, + }); setData(result); }; return ( diff --git a/frontend/src/components/crud/DisplayTableContainer.tsx b/frontend/src/components/crud/DisplayTableContainer.tsx index ba0c8fe..730cbcc 100644 --- a/frontend/src/components/crud/DisplayTableContainer.tsx +++ b/frontend/src/components/crud/DisplayTableContainer.tsx @@ -3,7 +3,6 @@ import React, { useState, useEffect } from "react"; import BTable from "react-bootstrap/Table"; import { HeaderGroup, useTable, Column } from "react-table"; - import EntityAPIClient, { EntityResponse, } from "../../APIClients/EntityAPIClient"; @@ -149,7 +148,6 @@ const DisplayTableContainer: React.FC = (): React.ReactElement | null => { }, []); const downloadEntityFile = async (fileUUID: string) => { - const data = await EntityAPIClient.getFile(fileUUID); downloadFile(data, "file"); }; diff --git a/frontend/src/components/crud/UpdateForm.tsx b/frontend/src/components/crud/UpdateForm.tsx index decca84..4e539a8 100644 --- a/frontend/src/components/crud/UpdateForm.tsx +++ b/frontend/src/components/crud/UpdateForm.tsx @@ -91,10 +91,9 @@ const UpdateForm = (): React.ReactElement => { if (fileField) { multipartFormData.append("file", fileField); } - const result = await EntityAPIClient.update( - formData.id, - { entityData: multipartFormData } - ); + const result = await EntityAPIClient.update(formData.id, { + entityData: multipartFormData, + }); setData(result); }; return ( diff --git a/frontend/src/components/pages/__tests__/Default.test.tsx b/frontend/src/components/pages/__tests__/Default.test.tsx index f037501..400866d 100644 --- a/frontend/src/components/pages/__tests__/Default.test.tsx +++ b/frontend/src/components/pages/__tests__/Default.test.tsx @@ -7,7 +7,6 @@ import Default from "../Default"; // https://jestjs.io/docs/tutorial-react // https://reactjs.org/docs/testing.html - describe("Default page", () => { it("Should render Create Entity button", () => { const page = render();