Load configuration from ENV variables using dotenv

oxsecurity · Jul 23, 2023 · 484842b · 484842b
1 parent 5a5f43d
commit 484842b
Show file tree

Hide file tree

Showing 25 changed files with 152 additions and 56 deletions.
diff --git a/.env b/.env
@@ -0,0 +1,16 @@
+# MEGALINTER
+MEGALINTER_ANALYSIS_URL=http://127.0.0.1:8000/analysis
+MEGALINTER_UPLOAD_URL=http://127.0.0.1:8000/upload-file
+MEGALINTER_REDIS_URL=redis://127.0.0.1:6379
+MEGALINTER_REDIS_CHANNEL=megalinter:pubsub:<request-id>
+
+# BACKEND
+CODETOTAL_HTTP_PORT=8081
+CODETOTAL_HTTP_HOST=127.0.0.1
+CODETOTAL_WS_PORT=8080
+CODETOTAL_WS_HOST=127.0.0.1
+DEBUG_MODULES=actions,megalinter,stores,transport
+
+# FRONTEND
+UPLOAD_FILE_LIMIT_BYTES=10000000
+
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/app/src/analysis/actions/analysis-actions.ts b/packages/app/src/analysis/actions/analysis-actions.ts
@@ -7,7 +7,7 @@ import {
   RepoAnalysis,
   SnippetAnalysis,
 } from "shared-types";
-import config from "../../config.json";
+import config from "../../config";
 import { ReportStore } from "../../report/stores/fe-report-store";
 import { AnalysisStore, AsyncState } from "../stores/analysis-store";
 
@@ -23,11 +23,15 @@ export const startAnalysis = async (navigate: NavigateFunction) => {
     reset();
 
     const data = createRequestData();
-    const report = await axios.post(`${config.backendUrl}/analysis`, data, {
-      headers: {
-        "Content-Type": "multipart/form-data",
-      },
-    });
+    const report = await axios.post(
+      `http://${config.CODETOTAL_HTTP_HOST}:${config.CODETOTAL_HTTP_PORT}/analysis`,
+      data,
+      {
+        headers: {
+          "Content-Type": "multipart/form-data",
+        },
+      }
+    );
     const requestId = report.data.requestId;
     navigate({ pathname: `/report/${requestId}` });
   } catch (err) {

diff --git a/packages/app/src/analysis/components/FileUploadForm.tsx b/packages/app/src/analysis/components/FileUploadForm.tsx
@@ -5,7 +5,7 @@ import { FileRejection, useDropzone } from "react-dropzone";
 import { BiSolidCloudUpload } from "react-icons/bi";
 import { useNavigate } from "react-router-dom";
 import { makeStyles } from "tss-react/mui";
-import config from "../../config.json";
+import config from "../../config";
 import { startAnalysis } from "../actions/analysis-actions";
 import { AnalysisStore } from "../stores/analysis-store";
 
@@ -26,7 +26,7 @@ export const FileUploadForm: FC = () => {
       ) {
         setError(
           `File too large (max allowed: ${filesize(
-            config.uploadFileLimitBytes
+            config.UPLOAD_FILE_LIMIT_BYTES
           )})`
         );
         return;
@@ -46,7 +46,7 @@ export const FileUploadForm: FC = () => {
   const { getRootProps, getInputProps, isDragActive } = useDropzone({
     onDrop,
     multiple: false,
-    maxSize: config.uploadFileLimitBytes,
+    maxSize: config.UPLOAD_FILE_LIMIT_BYTES,
   });
 
   return (

diff --git a/packages/app/src/app/components/App.tsx b/packages/app/src/app/components/App.tsx
@@ -2,10 +2,9 @@ import Container from "@mui/material/Container/Container";
 import CssBaseline from "@mui/material/CssBaseline/CssBaseline";
 import { FC } from "react";
 import { makeStyles } from "tss-react/mui";
-import config from "../../config.json";
 import { AppRouteProvider } from "./AppRouteProvider";
 import { AppThemeProvider } from "./AppThemeProvider";
-import { Footer } from "./Footer";
+import { FOOTER_HEIGHT, Footer } from "./Footer";
 
 export const App: FC = () => {
   const { classes } = useStyles();
@@ -22,5 +21,5 @@ export const App: FC = () => {
 };
 
 const useStyles = makeStyles()(() => ({
-  container: { paddingBlockEnd: config.footerHeight },
+  container: { paddingBlockEnd: FOOTER_HEIGHT },
 }));
diff --git a/packages/app/src/app/components/Footer.tsx b/packages/app/src/app/components/Footer.tsx
@@ -3,7 +3,6 @@ import { FC } from "react";
 import { makeStyles } from "tss-react/mui";
 import bg from "../../assets/bg.svg";
 import oxLogo from "../../assets/ox.svg";
-import config from "../../config.json";
 import { ToggleThemeButton } from "./ToggleThemeButton";
 
 export const Footer: FC = () => {
@@ -47,6 +46,8 @@ export const Footer: FC = () => {
   );
 };
 
+export const FOOTER_HEIGHT = 80;
+
 const useStyles = makeStyles()((theme: Theme) => ({
   footer: {
     position: "fixed",
@@ -55,7 +56,7 @@ const useStyles = makeStyles()((theme: Theme) => ({
     left: 0,
     display: "flex",
     flexDirection: "column",
-    height: config.footerHeight,
+    height: FOOTER_HEIGHT,
     background: theme.palette.background.default,
   },
   background: {

diff --git a/packages/app/src/config.json b/packages/app/src/config.json
diff --git a/packages/app/src/config.ts b/packages/app/src/config.ts
@@ -0,0 +1,19 @@
+declare const process: {
+  env: {
+    CODETOTAL_HTTP_PORT: string;
+    CODETOTAL_HTTP_HOST: string;
+    CODETOTAL_WS_PORT: number;
+    CODETOTAL_WS_HOST: number;
+    UPLOAD_FILE_LIMIT_BYTES: number;
+  };
+};
+
+const config = {
+  CODETOTAL_HTTP_PORT: process.env.CODETOTAL_HTTP_PORT,
+  CODETOTAL_HTTP_HOST: process.env.CODETOTAL_HTTP_HOST,
+  CODETOTAL_WS_PORT: process.env.CODETOTAL_WS_PORT,
+  CODETOTAL_WS_HOST: process.env.CODETOTAL_WS_HOST,
+  UPLOAD_FILE_LIMIT_BYTES: process.env.UPLOAD_FILE_LIMIT_BYTES,
+};
+
+export default config;
diff --git a/packages/app/src/report/actions/init-report-action.ts b/packages/app/src/report/actions/init-report-action.ts
@@ -1,7 +1,7 @@
 import axios from "axios";
 import { NavigateFunction } from "react-router-dom";
 import { AnalysisStatus } from "shared-types";
-import config from "../../config.json";
+import config from "../../config";
 import { ReportStore } from "../stores/fe-report-store";
 import { subscribeToLintProgress } from "./subscribe-report-action";
 
@@ -10,7 +10,9 @@ export const initProgress = async (
   navigate: NavigateFunction
 ) => {
   try {
-    const res = await axios.get(`${config.backendUrl}/report/${requestId}`);
+    const res = await axios.get(
+      `http://${config.CODETOTAL_HTTP_HOST}:${config.CODETOTAL_HTTP_PORT}/report/${requestId}`
+    );
     const { status } = res.data;
 
     switch (status) {

diff --git a/packages/app/src/ws-client.ts b/packages/app/src/ws-client.ts
@@ -1,5 +1,5 @@
 import { ReportState } from "shared-types";
-import config from "./config.json";
+import config from "./config";
 
 export const subscribe = (
   requestId: string,
@@ -8,7 +8,7 @@ export const subscribe = (
   onClose: () => void
 ) => {
   const ws = new WebSocket(
-    `ws://${config.websocketServerUrl}?requestId=${requestId}`
+    `ws://${config.CODETOTAL_WS_HOST}:${config.CODETOTAL_WS_PORT}?requestId=${requestId}`
   );
   ws.onmessage = (event) => {
     const data = JSON.parse(event.data);

diff --git a/packages/app/tsconfig.json b/packages/app/tsconfig.json
@@ -22,7 +22,7 @@
     "noFallthroughCasesInSwitch": true,
     "declaration": false
   },
-  "include": ["./src/**/*"],
+  "include": ["src/**/*"],
   "exclude": ["vite.config.ts"],
   "references": [{ "path": "./tsconfig.node.json" }]
 }
diff --git a/packages/app/tsconfig.node.json b/packages/app/tsconfig.node.json
@@ -6,5 +6,5 @@
     "moduleResolution": "bundler",
     "allowSyntheticDefaultImports": true
   },
-  "include": ["vite.config.ts"]
+  "include": ["vite.config.ts", "src/config.ts"]
 }
diff --git a/packages/app/vite.config.ts b/packages/app/vite.config.ts
@@ -1,6 +1,13 @@
+/* eslint-disable import/first */
+import dotenv from "dotenv";
+
+// load ENV variables from .env file
+dotenv.config({ path: "../../.env" });
+
 import react from "@vitejs/plugin-react";
 import { PluginOption, defineConfig } from "vite";
 import checker from "vite-plugin-checker";
+import config from "./src/config";
 
 export default defineConfig(({ command }) => {
   const plugins: PluginOption[] = [react()];
@@ -34,6 +41,11 @@ export default defineConfig(({ command }) => {
         },
       },
     },
+    define: {
+      "process.env": JSON.stringify({
+        ...config,
+      }),
+    },
     esbuild: {
       // needed for keepNames
       minifyIdentifiers: false,

diff --git a/packages/backend/jest.config.mjs b/packages/backend/jest.config.mjs
@@ -1,3 +1,8 @@
+import dotenv from "dotenv";
+
+// load ENV variables from .env file
+dotenv.config({ path: "../../.env" });
+
 export default {
   preset: "ts-jest",
   testEnvironment: "node",

diff --git a/packages/backend/package.json b/packages/backend/package.json
@@ -18,6 +18,7 @@
   "dependencies": {
     "axios": "^1.4.0",
     "cors": "^2.8.5",
+    "dotenv": "^16.3.1",
     "express": "^4.18.2",
     "md5": "^2.3.0",
     "multer": "^1.4.5-lts.1",

diff --git a/packages/backend/src/actions/create-analysis-request.ts b/packages/backend/src/actions/create-analysis-request.ts
@@ -8,7 +8,7 @@ import {
   RepoAnalysis,
   SnippetAnalysis,
 } from "shared-types";
-import config from "../config.json";
+import config from "../config";
 import { logger } from "../utils/logger";
 
 export const createAnalysisRequestData = async (
@@ -37,7 +37,7 @@ export const createAnalysisRequestData = async (
         });
 
         const res = await axios.post<{ fileUploadId: string }>(
-          config.megalinterHttpUploadURL,
+          config.MEGALINTER_UPLOAD_URL,
           form
         );
 

diff --git a/packages/backend/src/actions/create-analysis.ts b/packages/backend/src/actions/create-analysis.ts
@@ -1,10 +1,10 @@
 import axios from "axios";
 import { Analysis } from "shared-types";
-import config from "../config.json";
+import config from "../config";
 import { createReportStore } from "../stores/be-report-store";
+import { logger } from "../utils/logger";
 import { createAnalysisRequestData } from "./create-analysis-request";
 import { subscribeToMegaLinter } from "./subscribe-to-megalinter";
-import { logger } from "../utils/logger";
 
 export const createAnalysis = async (
   action: Analysis
@@ -13,7 +13,7 @@ export const createAnalysis = async (
     const [data, resourceValue] = await createAnalysisRequestData(action);
 
     const response = await axios.post<{ request_id: string }>(
-      config.megalinterHttpURL,
+      config.MEGALINTER_ANALYSIS_URL,
       data
     );
 
@@ -27,7 +27,7 @@ export const createAnalysis = async (
     return { requestId };
   } catch (err) {
     logger.actions.error(
-      `Unable to send HTTP request to megalinter at: ${config.megalinterHttpURL}`
+      `Unable to send HTTP request to megalinter at: ${config.MEGALINTER_ANALYSIS_URL}`
     );
     throw err;
   }

diff --git a/packages/backend/src/actions/subscribe-to-megalinter.ts b/packages/backend/src/actions/subscribe-to-megalinter.ts
@@ -1,4 +1,4 @@
-import config from "../config.json";
+import config from "../config";
 import { parseMessage } from "../megalinter/parsers/parser";
 import { ReportStore } from "../stores/be-report-store";
 import { subscribeToRedis } from "../transport/redis-client";
@@ -9,7 +9,10 @@ export const subscribeToMegaLinter = async (
   store: ReportStore
 ) => {
   try {
-    const channelId = config.redisChannel.replace("<request-id>", requestId);
+    const channelId = config.MEGALINTER_REDIS_CHANNEL.replace(
+      "<request-id>",
+      requestId
+    );
     await subscribeToRedis(channelId, (message: string) => {
       parseMessage(JSON.parse(message), store);
     });

diff --git a/packages/backend/src/config.json b/packages/backend/src/config.json
diff --git a/packages/backend/src/config.ts b/packages/backend/src/config.ts
@@ -0,0 +1,27 @@
+declare const process: {
+  env: {
+    MEGALINTER_ANALYSIS_URL: string;
+    MEGALINTER_UPLOAD_URL: string;
+    MEGALINTER_REDIS_URL: string;
+    MEGALINTER_REDIS_CHANNEL: string;
+    CODETOTAL_HTTP_PORT: number;
+    CODETOTAL_HTTP_HOST: string;
+    CODETOTAL_WS_PORT: number;
+    CODETOTAL_WS_HOST: string;
+    DEBUG_MODULES: string;
+  };
+};
+
+const config = {
+  MEGALINTER_ANALYSIS_URL: process.env.MEGALINTER_ANALYSIS_URL,
+  MEGALINTER_UPLOAD_URL: process.env.MEGALINTER_UPLOAD_URL,
+  MEGALINTER_REDIS_URL: process.env.MEGALINTER_REDIS_URL,
+  MEGALINTER_REDIS_CHANNEL: process.env.MEGALINTER_REDIS_CHANNEL,
+  CODETOTAL_HTTP_PORT: process.env.CODETOTAL_HTTP_PORT,
+  CODETOTAL_HTTP_HOST: process.env.CODETOTAL_HTTP_HOST,
+  CODETOTAL_WS_PORT: process.env.CODETOTAL_WS_PORT,
+  CODETOTAL_WS_HOST: process.env.CODETOTAL_WS_HOST,
+  DEBUG_MODULES: process.env.DEBUG_MODULES,
+};
+
+export default config;