hackforla · entrotech · Nov 20, 2024 · Oct 23, 2024 · Oct 23, 2024 · Oct 24, 2024
diff --git a/.dockerignore b/.dockerignore
@@ -4,4 +4,4 @@
 *.md
 !README.md
 **/node_modules
-**/db/demo-db
+**/db/demo-db
diff --git a/Dockerfile b/Dockerfile
@@ -1,15 +1,14 @@
 FROM node:lts-bullseye-slim as clientBuilder
 
-ENV NODE_ENV "production"
 ENV NODE_OPTIONS=--openssl-legacy-provider
 
 RUN mkdir /app
 WORKDIR /app
 COPY client/package.json .
 COPY client/package-lock.json .
-RUN npm ci --legacy-peer-deps
+RUN npm ci
 COPY client .
-
+ENV NODE_ENV "production"
 RUN npm run build
 RUN echo package.json
 
@@ -44,7 +43,7 @@ RUN npm ci --quiet
 
 COPY --from=serverBuilder /usr/src/app/build ./
 COPY ./server/uploads ./uploads
-COPY --from=clientBuilder /app/build ./client/build
+COPY --from=clientBuilder app/dist ./client/build
 
 # we don't want to run as sudo so create group and user
 RUN groupadd -r fola && useradd --no-log-init -r -g fola fola

diff --git a/client/.env b/client/.env
@@ -1,3 +1,3 @@
-REACT_APP_TENANT_ID=1
-REACT_APP_MAPBOX_ACCESS_TOKEN=pk.eyJ1IjoibHVjYXNob21lciIsImEiOiJjazFqcnRjcm0wNmZ1M2JwZXg2eDFzMXd3In0.yYpkKLrFCxF-qyBfZH1a8w
+VITE_TENANT_ID=1
+VITE_MAPBOX_ACCESS_TOKEN=pk.eyJ1IjoibHVjYXNob21lciIsImEiOiJjazFqcnRjcm0wNmZ1M2JwZXg2eDFzMXd3In0.yYpkKLrFCxF-qyBfZH1a8w
 SKIP_PREFLIGHT_CHECK=true
diff --git a/client/__mocks__/fileMock.js b/client/__mocks__/fileMock.js
@@ -0,0 +1 @@
+module.exports = "test-file-stub";
diff --git a/client/__mocks__/styleMock.js b/client/__mocks__/styleMock.js
@@ -0,0 +1 @@
+module.exports = {};
diff --git a/client/babel.config.json b/client/babel.config.json
@@ -0,0 +1,13 @@
+{
+  "presets": [
+    ["@babel/preset-env", { "targets": { "node": "current" } }],
+    ["@babel/preset-react", { "runtime": "automatic" }],
+    [
+      "babel-preset-vite",
+      {
+        "env": true,
+        "glob": false
+      }
+    ]
+  ]
+}
diff --git a/client/craco.config.js b/client/craco.config.js
diff --git a/client/public/index.html → client/index.html b/client/public/index.html → client/index.html
@@ -1,14 +1,14 @@
 <!DOCTYPE html>
 <html lang="en" height="100%">
   <head>
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link rel="shortcut icon" href="/favicon.ico" />
     <meta name="viewport" content="minimum-scale=1, initial-scale=1" />
     <!-- <meta
       name="viewport"
       content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no"
     /> -->
     <meta name="theme-color" content="#000000" />
-    <meta property="og:image" content="%PUBLIC_URL%/FoodOasisLogo.png" />
+    <meta property="og:image" content="/FoodOasisLogo.png" />
     <meta property="og:image:type" content="image/png" />
     <meta property="og:image:width" content="639" />
     <meta property="og:image:height" content="162" />
@@ -17,7 +17,7 @@
       content="Food Oasis is a non-profit, volunteer-run directory of free food resources in the Los Angeles area."
     />
     <meta property="og:locale" content="en_US" />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/favicon.ico" />
+    <link rel="apple-touch-icon" href="/favicon.ico" />
     <link
       href="https://api.tiles.mapbox.com/mapbox-gl-js/v1.4.0/mapbox-gl.css"
       rel="stylesheet"
@@ -27,16 +27,7 @@
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
     -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
+    <link rel="manifest" href="/manifest.json" />
     <style>
       html,
       #body,
@@ -107,5 +98,6 @@
         <div class="spinner"></div>
       </div>
     </div>
+    <script type="module" src="/src/index.tsx"></script>
   </body>
 </html>
diff --git a/client/jest.config.cjs b/client/jest.config.cjs
@@ -0,0 +1,26 @@
+const { pathsToModuleNameMapper } = require("ts-jest");
+const { compilerOptions } = require("./tsconfig");
+
+/** @type {import('ts-jest').JestConfigWithTsJest} */
+module.exports = {
+  roots: ["<rootDir>"],
+  preset: "ts-jest",
+  testEnvironment: "./jest.environment.cjs",
+  modulePaths: [compilerOptions.baseUrl],
+  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths ?? {}),
+  transform: {
+    ".+\\.(css|less|sass|scss|png|jpg|gif|ttf|woff|woff2|svg)$":
+      "jest-transform-stub",
+    "^.+\\.[t|j]sx?$": "babel-jest",
+  },
+  transformIgnorePatterns: [
+    'node_modules/(?!' + 
+        [
+          'debounce-fn',
+          'mimic-fn',,
+        ].join('|') +
+    ')',
+],
+  moduleFileExtensions: ["ts", "tsx", "js", "jsx"],
+  setupFilesAfterEnv: ["<rootDir>/setupTests.ts"]
+};
diff --git a/client/jest.environment.cjs b/client/jest.environment.cjs
@@ -0,0 +1,12 @@
+const Environment = require("jest-environment-jsdom").default;
+
+module.exports = class CustomTestEnvironment extends Environment {
+    async setup() {
+        await super.setup();
+        this.global.TextEncoder = TextEncoder;
+        this.global.TextDecoder = TextDecoder;
+        this.global.Response = Response;
+        this.global.Request = Request;
+
+    }
+};