From 4cc55de96af871e1cd865d8a5fbea486eb8efc2c Mon Sep 17 00:00:00 2001
From: Yossi Eynav <yossi.eynav@gmail.com>
Date: Sun, 11 Feb 2024 22:07:17 +0200
Subject: [PATCH] ci(client): pass env variable to react app in the right way
 (#761)

---
 .github/workflows/client.yml      | 4 +++-
 client/.env                       | 2 ++
 client/src/components/Map/map.jsx | 2 +-
 client/src/services/api.js        | 5 ++++-
 client/src/services/paymentApi.js | 4 ++--
 5 files changed, 12 insertions(+), 5 deletions(-)
 create mode 100644 client/.env

diff --git a/.github/workflows/client.yml b/.github/workflows/client.yml
index 11d8470ce..811ba5306 100644
--- a/.github/workflows/client.yml
+++ b/.github/workflows/client.yml
@@ -99,11 +99,12 @@ jobs:
 
       - name: build
         working-directory: client
-        run: npm run build:staging
+        run: npm run build
         env:
           NODE_ENV: staging
           BASE_NAME: ${{ github.ref_name }}
           PUBLIC_URL: "https://staging.meirim.org/${{ github.ref_name }}" 
+          REACT_APP_BASE_API_URL: https://staging-api.meirim.org/api
       
       - uses: jakejarvis/s3-sync-action@master
         with:
@@ -146,6 +147,7 @@ jobs:
         env:
           PUBLIC_URL: "https://meirim.org"
           NODE_ENV: production
+          REACT_APP_BASE_API_URL: https://api.meirim.org/api
       
       - uses: jakejarvis/s3-sync-action@master
         with:
diff --git a/client/.env b/client/.env
new file mode 100644
index 000000000..add971143
--- /dev/null
+++ b/client/.env
@@ -0,0 +1,2 @@
+REACT_APP_MAPBOX_KEY=pk.eyJ1IjoibWVpcmltIiwiYSI6ImNrbWNjYmlwYjJhYzYycW42NTYzcmdpYWcifQ.lCBjl1gWMI6UxySOCCBUHg
+REACT_APP_BASE_API_URL=https://change-this.meirim.org/api
\ No newline at end of file
diff --git a/client/src/components/Map/map.jsx b/client/src/components/Map/map.jsx
index b1d2034cf..6fb68d6b9 100644
--- a/client/src/components/Map/map.jsx
+++ b/client/src/components/Map/map.jsx
@@ -10,7 +10,7 @@ import Mapbox from 'react-map-gl';
 import PropTypes from 'prop-types';
 
 mapboxgl.workerClass = MapboxWorker;
-const apiKey = process.env.CONFIG.mapboxApiKey;
+const apiKey = process.env.REACT_APP_MAPBOX_KEY;
 
 
 export const Map = ({ onMouseMove, id, children, onClick, initialViewState, interactiveLayerIds, style, mapStyle = 'mapbox://styles/mapbox/light-v11' }) => {
diff --git a/client/src/services/api.js b/client/src/services/api.js
index 9a638652a..39b39a73f 100644
--- a/client/src/services/api.js
+++ b/client/src/services/api.js
@@ -1,6 +1,9 @@
 import axios from 'axios'
 
-const instance = axios.create(process.env.CONFIG.axios)
+const instance = axios.create({
+	"baseURL": process.env.REACT_APP_BASE_API_URL,
+	"withCredentials": true
+})
 
 export default {
 	get: (path, data, options) => instance.get(path, { params: data }, options)
diff --git a/client/src/services/paymentApi.js b/client/src/services/paymentApi.js
index d364763d2..b6e2f3a4f 100644
--- a/client/src/services/paymentApi.js
+++ b/client/src/services/paymentApi.js
@@ -1,8 +1,8 @@
 const axios = require('axios');
-const config = process.env.CONFIG.axios;
+const config = process.env.REACT_APP_BASE_API_URL
 
 const instance = axios.create({
-    baseURL: `${config.baseURL}/funding`
+    baseURL: `${config}/funding`
 })
 
 module.exports = {