Patches for dev env (#2931)

* patches env vars

* linter fixes

Tiltfile

@@ -44,6 +44,7 @@ else:
     exit()
 
 watch_file('zarf/helm/.server.env')
+watch_file('zarf/helm/.dashboard.env')
 
 ## Build binary locally for faster devexp
 local_resource(
@@ -93,10 +94,7 @@ local_resource(
     serve_cmd="npm start",
     serve_dir="dashboard",
     serve_env={
-        "NODE_ENV": "development",
-        "DEV_SERVER_PORT": "8081",
-        "ENABLE_PROXY": "true",
-        "API_SERVER": "http://localhost:8080"
+        "ENV_FILE": "../zarf/helm/.dashboard.env"
     },
     resource_deps=["postgresql"],
     labels=["porter"]

dashboard/package-lock.json

@@ -5,6 +5,7 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "dashboard",
       "version": "0.1.0",
       "dependencies": {
         "@ironplans/react": "^0.4.0",
@@ -3029,7 +3030,7 @@
       "version": "18.0.28",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.28.tgz",
       "integrity": "sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==",
-      "devOptional": true,
+      "dev": true,
       "dependencies": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
@@ -3142,7 +3143,7 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
       "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
-      "devOptional": true
+      "dev": true
     },
     "node_modules/@types/reactcss": {
       "version": "1.2.6",
@@ -16047,8 +16048,7 @@
     "@icons/material": {
       "version": "0.2.4",
       "resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
-      "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw==",
-      "requires": {}
+      "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw=="
     },
     "@ironplans/api": {
       "version": "0.4.1",
@@ -16214,8 +16214,7 @@
     "@material-ui/types": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz",
-      "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==",
-      "requires": {}
+      "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A=="
     },
     "@material-ui/utils": {
       "version": "4.11.3",
@@ -16530,8 +16529,7 @@
       "version": "7.2.1",
       "resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-7.2.1.tgz",
       "integrity": "sha512-oZ0Ib5I4Z2pUEcoo95cT1cr6slco9WY7yiPpG+RGNkj8YcYgJnM7pXmYmorNOReh8MIGcKSqXyeGjxnr8YiZbA==",
-      "dev": true,
-      "requires": {}
+      "dev": true
     },
     "@types/body-parser": {
       "version": "1.19.2",
@@ -16839,7 +16837,7 @@
       "version": "18.0.28",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.28.tgz",
       "integrity": "sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==",
-      "devOptional": true,
+      "dev": true,
       "requires": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
@@ -16850,7 +16848,7 @@
           "version": "3.1.1",
           "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
           "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
-          "devOptional": true
+          "dev": true
         }
       }
     },
@@ -17806,15 +17804,13 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/ajv-errors/-/ajv-errors-1.0.1.tgz",
       "integrity": "sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ==",
-      "dev": true,
-      "requires": {}
+      "dev": true
     },
     "ajv-keywords": {
       "version": "3.5.2",
       "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
       "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
-      "dev": true,
-      "requires": {}
+      "dev": true
     },
     "anser": {
       "version": "2.1.1",
@@ -20639,8 +20635,7 @@
     "goober": {
       "version": "2.1.12",
       "resolved": "https://registry.npmjs.org/goober/-/goober-2.1.12.tgz",
-      "integrity": "sha512-yXHAvO08FU1JgTXX6Zn6sYCUFfB/OJSX8HHjDSgerZHZmFKAb08cykp5LBw5QnmyMcZyPRMqkdyHUSSzge788Q==",
-      "requires": {}
+      "integrity": "sha512-yXHAvO08FU1JgTXX6Zn6sYCUFfB/OJSX8HHjDSgerZHZmFKAb08cykp5LBw5QnmyMcZyPRMqkdyHUSSzge788Q=="
     },
     "good-listener": {
       "version": "1.2.2",
@@ -21026,8 +21021,7 @@
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
       "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
-      "dev": true,
-      "requires": {}
+      "dev": true
     },
     "ieee754": {
       "version": "1.2.1",
@@ -21863,8 +21857,7 @@
     "markdown-to-jsx": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/markdown-to-jsx/-/markdown-to-jsx-7.2.0.tgz",
-      "integrity": "sha512-3l4/Bigjm4bEqjCR6Xr+d4DtM1X6vvtGsMGSjJYyep8RjjIvcWtrXBS8Wbfe1/P+atKNMccpsraESIaWVplzVg==",
-      "requires": {}
+      "integrity": "sha512-3l4/Bigjm4bEqjCR6Xr+d4DtM1X6vvtGsMGSjJYyep8RjjIvcWtrXBS8Wbfe1/P+atKNMccpsraESIaWVplzVg=="
     },
     "material-colors": {
       "version": "1.2.6",
@@ -22755,8 +22748,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz",
       "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==",
-      "dev": true,
-      "requires": {}
+      "dev": true
     },
     "postcss-modules-local-by-default": {
       "version": "4.0.0",
@@ -23134,8 +23126,7 @@
     "react-onclickoutside": {
       "version": "6.12.2",
       "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.12.2.tgz",
-      "integrity": "sha512-NMXGa223OnsrGVp5dJHkuKxQ4czdLmXSp5jSV9OqiCky9LOpPATn3vLldc+q5fK3gKbEHvr7J1u0yhBh/xYkpA==",
-      "requires": {}
+      "integrity": "sha512-NMXGa223OnsrGVp5dJHkuKxQ4czdLmXSp5jSV9OqiCky9LOpPATn3vLldc+q5fK3gKbEHvr7J1u0yhBh/xYkpA=="
     },
     "react-popper": {
       "version": "2.3.0",
@@ -23185,8 +23176,7 @@
     "react-table": {
       "version": "7.8.0",
       "resolved": "https://registry.npmjs.org/react-table/-/react-table-7.8.0.tgz",
-      "integrity": "sha512-hNaz4ygkZO4bESeFfnfOft73iBUj8K5oKi1EcSHPAibEydfsX2MyU6Z8KCr3mv3C9Kqqh71U+DhZkFvibbnPbA==",
-      "requires": {}
+      "integrity": "sha512-hNaz4ygkZO4bESeFfnfOft73iBUj8K5oKi1EcSHPAibEydfsX2MyU6Z8KCr3mv3C9Kqqh71U+DhZkFvibbnPbA=="
     },
     "react-transition-group": {
       "version": "4.4.5",
@@ -24966,8 +24956,7 @@
     "use-sync-external-store": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz",
-      "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==",
-      "requires": {}
+      "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA=="
     },
     "util": {
       "version": "0.11.1",
@@ -26262,8 +26251,7 @@
       "version": "7.5.9",
       "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.9.tgz",
       "integrity": "sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==",
-      "dev": true,
-      "requires": {}
+      "dev": true
     },
     "xtend": {
       "version": "4.0.2",

dashboard/webpack.config.js

@@ -11,11 +11,18 @@ const BundleAnalyzerPlugin = require("webpack-bundle-analyzer")
 const TerserPlugin = require("terser-webpack-plugin");
 
 module.exports = () => {
-  let env = dotenv.config().parsed;
+  let envPath = ".env";
+  if (process.env.ENV_FILE !== "") {
+    envPath = process.env.ENV_FILE;
+  }
+  console.log(`using envfile from path ${envPath}`);
 
+  let env = dotenv.config({ path: envPath }).parsed;
+  console.log(env);
   if (!env) {
     env = process.env;
   }
+
   const envKeys = Object.keys(env).reduce((prev, next) => {
     const varName = `process.env.${next}`;
     if (typeof env[next] !== "string") return prev;

zarf/helm/.dashboardenv

@@ -0,0 +1,12 @@
+# Fill out this file, and renamed to '.dashboard.env' in order to run this with Tilt
+
+NODE_ENV=development
+DEV_SERVER_PORT=8081
+ENABLE_PROXY=true
+API_SERVER=http://localhost:8080
+
+# SERVER_URL must be set to your ngrok url, If you are using ngrok for your github app setup on the backend
+# SERVER_URL=
+
+# TRUST_ARN is the ARN of the role which will be used for creating CAPI clusters
+# TRUST_ARN=arn:aws:iam::MY_ID:role/OrganizationAccountAccessRole

zarf/helm/.serverenv

@@ -1,6 +1,7 @@
 # Fill out this file, and renamed to '.server.env' in order to run this with Tilt
 
 # Required parameters
+
 SQL_LITE=false
 DB_NAME=porter
 DB_USER=porter
@@ -9,22 +10,32 @@ DB_HOST=postgresql
 DB_PORT=5432
 
 # Required for accessing cluster control plane. If ENABLE_CAPI_PROVISIONER=false, nothing in this section will be used
+
 ENABLE_CAPI_PROVISIONER=false
 NATS_URL=nats:4222
 CLUSTER_CONTROL_PLANE_ADDRESS=http://ccp-web:7833
 
 # Github Login OAuth
+
 GITHUB_LOGIN_ENABLED=false
 
 # Github App for repo deployments, and preview environments. Remove these if you are not using preview environments or deploying from a repo locally
+
 GITHUB_APP_CLIENT_ID=<github_app_id>
 GITHUB_APP_CLIENT_SECRET=<github_secret>
 GITHUB_APP_WEBHOOK_SECRET=<webhook_secret>
 GITHUB_APP_NAME=<github_app_name>
 GITHUB_APP_ID=<github_app_id>
+
 # GITHUB_APP_SECRET_PATH is the path to your secret within the container. Tilt will sync your ~/.ssh/ folder into /app/ssh automatically. This will likely be /app/ssh/your_ssh_pem_name
+
 GITHUB_APP_SECRET_PATH=<path_to_secret>
 
 # Optional parameters
+
 HELM_APP_REPO_URL=https://charts.getporter.dev
-HELM_ADD_ON_REPO_URL=https://charts.getporter.dev
+HELM_ADD_ON_REPO_URL=https://charts.getporter.dev
+
+# SERVER_URL must be set to your ngrok url, If you are using ngrok for your github app setup on the backend
+
+# SERVER_URL=