Vite (#2289)

* First attempt at deploying with vite * Added ts types for react-dom, react-gtm-module * Try to deploy the vite app * Try again * try this one * Allow dist folder * Update docker file * Try this * Try adding !dist folder in docker ignore * Try this one * Add mapbox-gl to client/package.json * Setup client tests (#2268) * Fix item attribute error * Vite a (#2286) * Fix create feature bug * fix for dynamic vertical centering on mobile (#2266) * Fix some bugs (#2274) * Bump http-proxy-middleware from 2.0.6 to 2.0.7 in /client (#2264) Bumps [http-proxy-middleware](https://github.com/chimurai/http-proxy-middleware) from 2.0.6 to 2.0.7. - [Release notes](https://github.com/chimurai/http-proxy-middleware/releases) - [Changelog](https://github.com/chimurai/http-proxy-middleware/blob/v2.0.7/CHANGELOG.md) - [Commits](chimurai/http-proxy-middleware@v2.0.6...v2.0.7) --- updated-dependencies: - dependency-name: http-proxy-middleware dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * 2262 feature flag survey and mobile survey (#2269) * fix feature refetch after add and delete * Fix user is null when use featureflag * Update userFeedbacksurvey mobile size * Undo usefeatureflag hook refech name * Update App.jsx Fixed spelling of userFeedbackSurvey * Fix refresh when add & delete --------- Co-authored-by: John Darragh <[email protected]> * Update social links (#2279) * Trigger the fetchMapboxResults function on the leading edge of the wait interval. (#2280) * Directly install mapbox-gl NPM pkg * Bumped version number to 1.0.86 * Fix deployment issue, remove validation from social media fields (#2282) * Bumped version to 1.0.87 * Rebuild package-lock.json files * Add email and phone input validation (#2284) * display current location button on mobile (#2283) * merge vite with develop --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Hannah Zulueta <[email protected]> Co-authored-by: Whitney Gould <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: June Zhao <[email protected]> Co-authored-by: Farhad Siraj <[email protected]> Co-authored-by: Jenna <[email protected]> * Vite a (#2287) * Fix create feature bug * fix for dynamic vertical centering on mobile (#2266) * Fix some bugs (#2274) * Bump http-proxy-middleware from 2.0.6 to 2.0.7 in /client (#2264) Bumps [http-proxy-middleware](https://github.com/chimurai/http-proxy-middleware) from 2.0.6 to 2.0.7. - [Release notes](https://github.com/chimurai/http-proxy-middleware/releases) - [Changelog](https://github.com/chimurai/http-proxy-middleware/blob/v2.0.7/CHANGELOG.md) - [Commits](chimurai/http-proxy-middleware@v2.0.6...v2.0.7) --- updated-dependencies: - dependency-name: http-proxy-middleware dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * 2262 feature flag survey and mobile survey (#2269) * fix feature refetch after add and delete * Fix user is null when use featureflag * Update userFeedbacksurvey mobile size * Undo usefeatureflag hook refech name * Update App.jsx Fixed spelling of userFeedbackSurvey * Fix refresh when add & delete --------- Co-authored-by: John Darragh <[email protected]> * Update social links (#2279) * Trigger the fetchMapboxResults function on the leading edge of the wait interval. (#2280) * Directly install mapbox-gl NPM pkg * Bumped version number to 1.0.86 * Fix deployment issue, remove validation from social media fields (#2282) * Bumped version to 1.0.87 * Rebuild package-lock.json files * Add email and phone input validation (#2284) * display current location button on mobile (#2283) * merge vite with develop * install @types/node --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Hannah Zulueta <[email protected]> Co-authored-by: Whitney Gould <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: June Zhao <[email protected]> Co-authored-by: Farhad Siraj <[email protected]> Co-authored-by: Jenna <[email protected]> * Vite a (#2288) * Fix create feature bug * fix for dynamic vertical centering on mobile (#2266) * Fix some bugs (#2274) * Bump http-proxy-middleware from 2.0.6 to 2.0.7 in /client (#2264) Bumps [http-proxy-middleware](https://github.com/chimurai/http-proxy-middleware) from 2.0.6 to 2.0.7. - [Release notes](https://github.com/chimurai/http-proxy-middleware/releases) - [Changelog](https://github.com/chimurai/http-proxy-middleware/blob/v2.0.7/CHANGELOG.md) - [Commits](chimurai/http-proxy-middleware@v2.0.6...v2.0.7) --- updated-dependencies: - dependency-name: http-proxy-middleware dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * 2262 feature flag survey and mobile survey (#2269) * fix feature refetch after add and delete * Fix user is null when use featureflag * Update userFeedbacksurvey mobile size * Undo usefeatureflag hook refech name * Update App.jsx Fixed spelling of userFeedbackSurvey * Fix refresh when add & delete --------- Co-authored-by: John Darragh <[email protected]> * Update social links (#2279) * Trigger the fetchMapboxResults function on the leading edge of the wait interval. (#2280) * Directly install mapbox-gl NPM pkg * Bumped version number to 1.0.86 * Fix deployment issue, remove validation from social media fields (#2282) * Bumped version to 1.0.87 * Rebuild package-lock.json files * Add email and phone input validation (#2284) * display current location button on mobile (#2283) * merge vite with develop * install @types/node * install @types/node --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Hannah Zulueta <[email protected]> Co-authored-by: Whitney Gould <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: June Zhao <[email protected]> Co-authored-by: Farhad Siraj <[email protected]> Co-authored-by: Jenna <[email protected]> --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Hannah Zulueta <[email protected]> Co-authored-by: Whitney Gould <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: June Zhao <[email protected]> Co-authored-by: Farhad Siraj <[email protected]> Co-authored-by: Jenna <[email protected]>
hackforla · Nov 20, 2024 · a6ddc7e · a6ddc7e
1 parent b599aab
commit a6ddc7e
Show file tree

Hide file tree

Showing 48 changed files with 7,375 additions and 16,031 deletions.
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;
+
+    }
+};