From 515d68e80a4b9a0deac820d00e53daf784877337 Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sat, 4 Jan 2025 15:18:07 -0500 Subject: [PATCH 01/11] update routing --- src/actions/index.js | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/src/actions/index.js b/src/actions/index.js index 32ea5f3..088d124 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -1,14 +1,17 @@ +const MESHDB_URL = "http://127.0.0.1:8000"; + export function fetchNodes(dispatch) { - fetch("https://db.nycmesh.net/api/v1/mapdata/nodes/?format=json") + fetch(`${MESHDB_URL}/api/v1/mapdata/nodes/?format=json`) .then(res => res.json()) .then(json => { + console.log("Fetched Nodes"); dispatch({ type: "FETCH_NODES_SUCCESS", nodes: json }); }) .catch(err => console.log(err)); } export function fetchLinks(dispatch) { - fetch("https://db.nycmesh.net/api/v1/mapdata/links/?format=json") + fetch(`${MESHDB_URL}/api/v1/mapdata/links/?format=json`) .then(res => res.json()) .then(json => { dispatch({ type: "FETCH_LINKS_SUCCESS", links: json }); @@ -17,7 +20,7 @@ export function fetchLinks(dispatch) { } export function fetchSectors(dispatch) { - fetch("https://db.nycmesh.net/api/v1/mapdata/sectors/?format=json") + fetch(`${MESHDB_URL}/api/v1/mapdata/sectors/?format=json`) .then(res => res.json()) .then(json => { dispatch({ type: "FETCH_SECTORS_SUCCESS", sectors: json }); @@ -26,7 +29,7 @@ export function fetchSectors(dispatch) { } export function fetchKiosks(dispatch) { - fetch("https://db.nycmesh.net/api/v1/mapdata/kiosks/?format=json") + fetch(`${MESHDB_URL}/api/v1/mapdata/kiosks/?format=json`) .then(res => res.json()) .then(json => { dispatch({ type: "FETCH_KIOSKS_SUCCESS", kiosks: json }); From 8801cf2115cb8d4d24257965fe4597f91f33848e Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sat, 4 Jan 2025 15:23:32 -0500 Subject: [PATCH 02/11] Victory --- src/Map.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/Map.js b/src/Map.js index 15cada1..2912368 100644 --- a/src/Map.js +++ b/src/Map.js @@ -16,8 +16,10 @@ class Map extends Component { constructor(props) { super(props); - window.addEventListener("setMapNode", (e) => { - this.updateSelected.bind(this)(e.selectedNodes, false) + window.addEventListener("message", ({ data, source }) => { + console.log(JSON.stringify(data)); + // Looking for selectedNodes + this.updateSelected.bind(this)(data.selectedNodes, false); } ) } From 7cd89af3831451fe2b2560df570947d3c897ff53 Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sat, 4 Jan 2025 15:31:53 -0500 Subject: [PATCH 03/11] fix icons not loading --- src/Map.js | 1 + src/components/MapView/NodeMarker.js | 30 ++++++++++++++-------------- 2 files changed, 16 insertions(+), 15 deletions(-) diff --git a/src/Map.js b/src/Map.js index 2912368..1e06239 100644 --- a/src/Map.js +++ b/src/Map.js @@ -31,6 +31,7 @@ class Map extends Component { this.setState({match: undefined}); } if (triggerEvent) { + console.log("Selected node on map"); const selectedEvent = new Event("nodeSelectedOnMap");//, {detail: {selectedNodes: selectedNodes}}); selectedEvent.selectedNodes = selectedNodes; window.dispatchEvent(selectedEvent); diff --git a/src/components/MapView/NodeMarker.js b/src/components/MapView/NodeMarker.js index 43a481f..929534b 100644 --- a/src/components/MapView/NodeMarker.js +++ b/src/components/MapView/NodeMarker.js @@ -79,7 +79,7 @@ class NodeMarker extends PureComponent { if (type === "supernode") return { icon: { - url: "/static/admin/map/img/map/supernode.svg", + url: "/img/map/supernode.svg", anchor: { x: 14, y: 14 } }, zIndex: 100 @@ -88,7 +88,7 @@ class NodeMarker extends PureComponent { if (type === "pop") return { icon: { - url: "/static/admin/map/img/map/pop.svg", + url: "/img/map/pop.svg", anchor: { x: 14, y: 14 } }, zIndex: 100 @@ -97,7 +97,7 @@ class NodeMarker extends PureComponent { if (type === "ap") return { icon: { - url: "/static/admin/map/img/map/ap.svg", + url: "/img/map/ap.svg", anchor: { x: 10, y: 10 } }, zIndex: 90 @@ -106,7 +106,7 @@ class NodeMarker extends PureComponent { if (type === "hub") return { icon: { - url: "/static/admin/map/img/map/hub.svg", + url: "/img/map/hub.svg", anchor: { x: 10, y: 10 } }, zIndex: 93 @@ -114,8 +114,8 @@ class NodeMarker extends PureComponent { if (type === "omni") { const url = filters.backbone - ? "/static/admin/map/img/map/omni.svg" - : "/static/admin/map/img/map/active.svg"; + ? "/img/map/omni.svg" + : "/img/map/active.svg"; const zIndex = filters.backbone ? 92 : 91; return { icon: { @@ -128,8 +128,8 @@ class NodeMarker extends PureComponent { if (type === "remote") { const url = filters.backbone - ? "/static/admin/map/img/map/remote.svg" - : "/static/admin/map/img/map/active.svg"; + ? "/img/map/remote.svg" + : "/img/map/active.svg"; const anchor = filters.backbone ? { x: 5, y: 5 } : { x: 7, y: 7 }; return { @@ -143,8 +143,8 @@ class NodeMarker extends PureComponent { if (type === "kiosk") { const url = filters.backbone - ? "/static/admin/map/img/map/remote.svg" - : "/static/admin/map/img/map/active.svg"; + ? "/img/map/remote.svg" + : "/img/map/active.svg"; const anchor = filters.backbone ? { x: 5, y: 5 } : { x: 7, y: 7 }; return { @@ -159,7 +159,7 @@ class NodeMarker extends PureComponent { if (type === "active") return { icon: { - url: "/static/admin/map/img/map/active.svg", + url: "/img/map/active.svg", anchor: { x: 7, y: 7 } }, zIndex: 91 @@ -168,7 +168,7 @@ class NodeMarker extends PureComponent { if (type === "potential-supernode") return { icon: { - url: "/static/admin/map/img/map/potential-supernode.svg", + url: "/img/map/potential-supernode.svg", anchor: { x: 14, y: 14 } }, zIndex: 83 @@ -177,7 +177,7 @@ class NodeMarker extends PureComponent { if (type === "potential-hub") return { icon: { - url: "/static/admin/map/img/map/potential-hub.svg", + url: "/img/map/potential-hub.svg", anchor: { x: 10, y: 10 } }, zIndex: 82 @@ -186,7 +186,7 @@ class NodeMarker extends PureComponent { if (type === "potential") return { icon: { - url: "/static/admin/map/img/map/potential.svg", + url: "/img/map/potential.svg", anchor: { x: 7, y: 7 } }, zIndex: 81 @@ -194,7 +194,7 @@ class NodeMarker extends PureComponent { return { icon: { - url: "/static/admin/map/img/map/dead.svg", + url: "/img/map/dead.svg", anchor: { x: 5, y: 5 } }, zIndex: 80 From 68c38ffdc7c915ad22f954535da51a2084bd1a5d Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sat, 4 Jan 2025 15:41:27 -0500 Subject: [PATCH 04/11] pass message back to parent --- src/Map.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/Map.js b/src/Map.js index 1e06239..5534e7a 100644 --- a/src/Map.js +++ b/src/Map.js @@ -31,10 +31,11 @@ class Map extends Component { this.setState({match: undefined}); } if (triggerEvent) { - console.log("Selected node on map"); - const selectedEvent = new Event("nodeSelectedOnMap");//, {detail: {selectedNodes: selectedNodes}}); - selectedEvent.selectedNodes = selectedNodes; - window.dispatchEvent(selectedEvent); + console.log(`Selected node on map: ${selectedNodes}`); + //const selectedEvent = new Event("nodeSelectedOnMap");//, {detail: {selectedNodes: selectedNodes}}); + //selectedEvent.selectedNodes = selectedNodes; + //window.dispatchEvent(selectedEvent); + window.parent.postMessage({selectedNodes: selectedNodes}, "http://127.0.0.1:8000"); } } From bc09ef08bf3a5a1133bea73143dc8934651b3e09 Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sun, 5 Jan 2025 16:04:40 -0500 Subject: [PATCH 05/11] Delete comments --- src/Map.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/src/Map.js b/src/Map.js index 5534e7a..19d4987 100644 --- a/src/Map.js +++ b/src/Map.js @@ -11,7 +11,7 @@ const store = createStore(rootReducer); class Map extends Component { state = { - match: {params: {nodeId: "238-240"}}, + match: {params: {nodeId: ""}}, } constructor(props) { @@ -32,9 +32,6 @@ class Map extends Component { } if (triggerEvent) { console.log(`Selected node on map: ${selectedNodes}`); - //const selectedEvent = new Event("nodeSelectedOnMap");//, {detail: {selectedNodes: selectedNodes}}); - //selectedEvent.selectedNodes = selectedNodes; - //window.dispatchEvent(selectedEvent); window.parent.postMessage({selectedNodes: selectedNodes}, "http://127.0.0.1:8000"); } } From 4f980276f40c91f323358db0c14a28ef68253ea5 Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Thu, 9 Jan 2025 21:52:33 -0500 Subject: [PATCH 06/11] Checkpoint: subway refactor. This works!? --- src/Map.js | 6 ++---- src/actions/index.js | 2 +- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/Map.js b/src/Map.js index 19d4987..2dd78be 100644 --- a/src/Map.js +++ b/src/Map.js @@ -4,8 +4,8 @@ import {Provider} from "react-redux"; import React, {Component} from "react"; import MapView from "./components/MapView"; - import rootReducer from "./reducers"; +import { MESHDB_URL } from "./actions"; const store = createStore(rootReducer); @@ -17,7 +17,6 @@ class Map extends Component { constructor(props) { super(props); window.addEventListener("message", ({ data, source }) => { - console.log(JSON.stringify(data)); // Looking for selectedNodes this.updateSelected.bind(this)(data.selectedNodes, false); } @@ -31,8 +30,7 @@ class Map extends Component { this.setState({match: undefined}); } if (triggerEvent) { - console.log(`Selected node on map: ${selectedNodes}`); - window.parent.postMessage({selectedNodes: selectedNodes}, "http://127.0.0.1:8000"); + window.parent.postMessage({selectedNodes: selectedNodes}, MESHDB_URL); } } diff --git a/src/actions/index.js b/src/actions/index.js index 088d124..51311ee 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -1,4 +1,4 @@ -const MESHDB_URL = "http://127.0.0.1:8000"; +export const MESHDB_URL = process.env.REACT_APP_MESHDB_URL; export function fetchNodes(dispatch) { fetch(`${MESHDB_URL}/api/v1/mapdata/nodes/?format=json`) From 887e03a5be5e57bbb8e03dc5afa3c0e7990760aa Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sat, 11 Jan 2025 16:32:05 -0500 Subject: [PATCH 07/11] need a diff --- src/Map.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/Map.js b/src/Map.js index 2dd78be..5825dfc 100644 --- a/src/Map.js +++ b/src/Map.js @@ -19,6 +19,8 @@ class Map extends Component { window.addEventListener("message", ({ data, source }) => { // Looking for selectedNodes this.updateSelected.bind(this)(data.selectedNodes, false); + + console.log(`State: ${JSON.stringify(this.state)}`); } ) } From e1ba943e220e38972cedd74e4241da5da1b423e6 Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sat, 11 Jan 2025 17:28:37 -0500 Subject: [PATCH 08/11] debugging weird flow control stuff --- src/Map.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/Map.js b/src/Map.js index 5825dfc..ec411bc 100644 --- a/src/Map.js +++ b/src/Map.js @@ -17,15 +17,15 @@ class Map extends Component { constructor(props) { super(props); window.addEventListener("message", ({ data, source }) => { - // Looking for selectedNodes - this.updateSelected.bind(this)(data.selectedNodes, false); + // Looking for selectedNodes + this.updateSelected.bind(this)(data.selectedNodes, false); - console.log(`State: ${JSON.stringify(this.state)}`); - } - ) + console.log(`Got message from Admin Panel: ${JSON.stringify(this.state)}`); + }); } updateSelected(selectedNodes, triggerEvent = true){ + console.log(`updating admin panel location: ${selectedNodes}`); if (selectedNodes) { this.setState({match: {params: {nodeId: selectedNodes}}}) } else { From 795ab9ad147c856fb30fc8ec14a2e477acd5c46b Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Sat, 11 Jan 2025 18:18:08 -0500 Subject: [PATCH 09/11] Ok I think we have feature pairity --- src/Map.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/Map.js b/src/Map.js index ec411bc..7804b41 100644 --- a/src/Map.js +++ b/src/Map.js @@ -17,21 +17,19 @@ class Map extends Component { constructor(props) { super(props); window.addEventListener("message", ({ data, source }) => { - // Looking for selectedNodes this.updateSelected.bind(this)(data.selectedNodes, false); - - console.log(`Got message from Admin Panel: ${JSON.stringify(this.state)}`); + console.log(`[map] Got message from Admin Panel: ${data}. State is now: ${JSON.stringify(this.state)}`); }); } updateSelected(selectedNodes, triggerEvent = true){ - console.log(`updating admin panel location: ${selectedNodes}`); if (selectedNodes) { this.setState({match: {params: {nodeId: selectedNodes}}}) } else { this.setState({match: undefined}); } if (triggerEvent) { + console.log(`[map] Posting update: ${selectedNodes}`); window.parent.postMessage({selectedNodes: selectedNodes}, MESHDB_URL); } } From 8221f366eb808b665b50a0abf06216b1fcaf1b38 Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Mon, 27 Jan 2025 00:06:36 -0500 Subject: [PATCH 10/11] Update src/Map.js --- src/Map.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/Map.js b/src/Map.js index 7804b41..66755b8 100644 --- a/src/Map.js +++ b/src/Map.js @@ -18,7 +18,6 @@ class Map extends Component { super(props); window.addEventListener("message", ({ data, source }) => { this.updateSelected.bind(this)(data.selectedNodes, false); - console.log(`[map] Got message from Admin Panel: ${data}. State is now: ${JSON.stringify(this.state)}`); }); } From c5a9d5908e189b8a60eace3f30603fbd00ea2b4b Mon Sep 17 00:00:00 2001 From: Willard Nilges Date: Mon, 27 Jan 2025 01:00:44 -0500 Subject: [PATCH 11/11] Add gamma environment infrastructure :3 --- .github/workflows/build-push-image.yaml | 42 +++++++++++++++++++ .github/workflows/helm-deploy.yaml | 7 +++- .../workflows/publish-and-deploy-gamma.yaml | 28 +++++++++++++ .github/workflows/publish-and-deploy.yaml | 42 ++++++------------- infra/admin-map/templates/deployment.yaml | 2 + 5 files changed, 91 insertions(+), 30 deletions(-) create mode 100644 .github/workflows/build-push-image.yaml create mode 100644 .github/workflows/publish-and-deploy-gamma.yaml diff --git a/.github/workflows/build-push-image.yaml b/.github/workflows/build-push-image.yaml new file mode 100644 index 0000000..b4155bd --- /dev/null +++ b/.github/workflows/build-push-image.yaml @@ -0,0 +1,42 @@ +name: Build and Publish Docker Image +permissions: read-all + +on: + workflow_call: + inputs: + environment: + required: true + type: string + image_tag: + required: true + type: string + +jobs: + push_to_registry_env: + name: Push Docker Image to Docker Hub + runs-on: ubuntu-latest + environment: ${{ inputs.environment }} + steps: + - name: Check out the repo + uses: actions/checkout@v4 + + - name: Log in to Docker Hub + uses: docker/login-action@f4ef78c080cd8ba55a85445d5b36e214a81df20a + with: + username: ${{ secrets.DOCKER_USERNAME }} + password: ${{ secrets.DOCKER_PASSWORD }} + + - name: Extract metadata (tags, labels) for Docker + id: meta + uses: docker/metadata-action@9ec57ed1fcdbf14dcef7dfbe97b2010124a938b7 + with: + images: willnilges/meshdb + + - name: Build and push Docker image + uses: docker/build-push-action@3b5e8027fcad23fda98b2e3ac259d8d67585f671 + with: + context: . + file: ./Dockerfile + push: true + tags: ${{ inputs.image_tag }} + labels: ${{ steps.meta.outputs.labels }} diff --git a/.github/workflows/helm-deploy.yaml b/.github/workflows/helm-deploy.yaml index 24b4083..de41baf 100644 --- a/.github/workflows/helm-deploy.yaml +++ b/.github/workflows/helm-deploy.yaml @@ -7,6 +7,9 @@ on: environment: required: true type: string + imageTag: + required: true + type: string jobs: helm_deploy: @@ -47,7 +50,9 @@ jobs: --create-namespace \ -f ./infra/admin-map/values.yaml \ --set adminmap.fqdn.legacy="${{ vars.ADMIN_FQDN_LEGACY }}" \ - --set adminmap.fqdn="${{ vars.ADMIN_FQDN }}" + --set adminmap.fqdn="${{ vars.ADMIN_FQDN }}" \ + --set adminmap.meshDbUrl="${{ vars.REACT_APP_MESHDB_URL }}" \ + --set adminmap.image.tag="${{ inputs.imageTag }}" # Rolling restart kubectl --kubeconfig ./config --server https://${{ secrets.SSH_TARGET_IP }}:6443 -n ${{ vars.APP_NAMESPACE }} rollout restart deploy diff --git a/.github/workflows/publish-and-deploy-gamma.yaml b/.github/workflows/publish-and-deploy-gamma.yaml new file mode 100644 index 0000000..ff30acb --- /dev/null +++ b/.github/workflows/publish-and-deploy-gamma.yaml @@ -0,0 +1,28 @@ +name: Publish and Deploy (Gamma) + +on: + push: + branches: + #- meshdb + - meshdb-admin-dev + +jobs: + # Dev and Prod use the same image + push_to_registry_gamma: + name: Push to gamma + uses: ./.github/workflows/build-push-image.yaml + with: + environment: gamma1 + image_tag: willnilges/network-map:admin-helm-gamma + secrets: inherit + if: github.ref == 'refs/heads/meshdb-admin-dev' + + deploy_to_gamma: + name: Deploy to gamma1 + uses: ./.github/workflows/helm-deploy.yaml + with: + environment: gamma1 + imageTag: admin-helm-gamma + secrets: inherit + if: github.ref == 'refs/heads/meshdb-admin-dev' + needs: push_to_registry_gamma diff --git a/.github/workflows/publish-and-deploy.yaml b/.github/workflows/publish-and-deploy.yaml index 600a09a..e7992e4 100644 --- a/.github/workflows/publish-and-deploy.yaml +++ b/.github/workflows/publish-and-deploy.yaml @@ -1,4 +1,4 @@ -name: Publish Docker Image +name: Publish and Deploy on: push: @@ -7,43 +7,25 @@ on: - meshdb-admin jobs: - push_to_registry: - name: Push Docker Image to Docker Hub - runs-on: ubuntu-latest + # Dev and Prod use the same image + push_to_registry_prod: + name: Push to prod + uses: ./.github/workflows/build-push-image.yaml + with: + environment: prod1 + image_tag: willnilges/network-map:admin-helm + secrets: inherit if: github.ref == 'refs/heads/meshdb-admin' - steps: - - name: Check out the repo - uses: actions/checkout@v4 - - - name: Log in to Docker Hub - uses: docker/login-action@f4ef78c080cd8ba55a85445d5b36e214a81df20a - with: - username: ${{ secrets.DOCKER_USERNAME }} - password: ${{ secrets.DOCKER_PASSWORD }} - - - name: Extract metadata (tags, labels) for Docker - id: meta - uses: docker/metadata-action@9ec57ed1fcdbf14dcef7dfbe97b2010124a938b7 - with: - images: willnilges/network-map - - - name: Build and push Docker image - uses: docker/build-push-action@3b5e8027fcad23fda98b2e3ac259d8d67585f671 - with: - context: . - file: ./Dockerfile - push: true - tags: "willnilges/network-map:admin-helm" - labels: ${{ steps.meta.outputs.labels }} deploy_to_dev3: name: Deploy to dev 3 uses: ./.github/workflows/helm-deploy.yaml with: environment: dev3 + imageTag: admin-helm secrets: inherit if: github.ref == 'refs/heads/meshdb-admin' - needs: push_to_registry + needs: push_to_registry_prod deploy_to_prod1: name: Deploy to prod 1 @@ -51,6 +33,7 @@ jobs: needs: deploy_to_dev3 with: environment: prod1 + imageTag: admin-helm secrets: inherit if: github.ref == 'refs/heads/meshdb-admin' @@ -60,5 +43,6 @@ jobs: needs: deploy_to_prod1 with: environment: prod2 + imageTag: admin-helm secrets: inherit if: github.ref == 'refs/heads/meshdb-admin' diff --git a/infra/admin-map/templates/deployment.yaml b/infra/admin-map/templates/deployment.yaml index 5ac13dc..4d5df34 100644 --- a/infra/admin-map/templates/deployment.yaml +++ b/infra/admin-map/templates/deployment.yaml @@ -29,6 +29,8 @@ spec: env: - name: NODE_ENV value: production + - name: REACT_APP_MESHDB_URL + value: {{.Values.adminmap.meshDbUrl}} ports: - name: http containerPort: {{ .Values.adminmap.port }}