Bug/diverging analysis id uifix to main (#663)

* Bug/654/census codespace block w corsanywhere (#658)

* Workaround "Census API appears to have blocked Codespaces"
Fixes #645

* env var proxy option

* Prettier fix for #658  (#659)

* prettier

* env var proxy option

* Fix bug where UI could not link to cases where analysis and caseid were not the same

Author: thadk

.github/workflows/heat-stack.yml

@@ -217,6 +217,10 @@ jobs:
       name: 🎭 Playwright
       runs-on: ubuntu-22.04
       timeout-minutes: 60
+      # CORS proxy settings for geocoding API calls
+      env:
+        VITE_CORS_PROXY_URL: ${{ secrets.VITE_CORS_PROXY_URL }}
+        VITE_CORS_ORIGIN: ${{ secrets.VITE_CORS_ORIGIN }}
       steps:
         - name: ⬇️ Checkout repo
           uses: actions/checkout@v4

heat-stack/app/routes/cases+/index.tsx

@@ -139,7 +139,7 @@ export default function Cases({
 										<td className="whitespace-nowrap px-6 py-4">
 											<div className="text-sm font-medium text-gray-900">
 												<Link
-													to={`/cases/${firstAnalysis?.id}/edit?edit_mode=true`}
+													to={`/cases/${caseItem.id}/edit?edit_mode=true`}
 													className="text-sm font-medium text-indigo-700 underline hover:underline"
 												>
 													{caseItem.id}
@@ -170,19 +170,19 @@ export default function Cases({
 										</td>
 										<td className="whitespace-nowrap px-6 py-4">
 											<Link
-												to={`/cases/${firstAnalysis?.id}`}
+												to={`/cases/${caseItem.id}`}
 												className="mx-1 text-indigo-600 hover:text-indigo-900"
 											>
 												View
 											</Link>
 											<Link
-												to={`/cases/${firstAnalysis?.id}/edit`}
+												to={`/cases/${caseItem.id}/edit`}
 												className="mx-1 text-indigo-600 hover:text-indigo-900"
 											>
 												Edit
 											</Link>
 											<Link
-												to={`/cases/${firstAnalysis?.id}/delete`}
+												to={`/cases/${caseItem.id}/delete`}
 												className="hover:text-indigo-9001 mx-1 text-indigo-600"
 											>
 												Delete

heat-stack/app/utils/GeocodeUtil.ts

@@ -1,6 +1,16 @@
-const BASE_URL = 'https://geocoding.geo.census.gov'
+const BASE_URL =
+	import.meta.env.VITE_CORS_PROXY_URL ?? 'https://geocoding.geo.census.gov'
+const CORS_ORIGIN = import.meta.env.VITE_CORS_ORIGIN
 const ADDRESS_ENDPOINT = '/geocoder/geographies/onelineaddress'
 
+// Build headers only if origin is defined
+const headers = CORS_ORIGIN
+	? {
+			Origin: CORS_ORIGIN,
+			'X-Requested-With': 'XMLHttpRequest',
+		}
+	: undefined
+
 // example: https://geocoding.geo.census.gov/geocoder/geographies/onelineaddress?address=1%20broadway%2C%20cambridge%2C%20ma%2002142&benchmark=4&vintage=4&format=json
 interface CensusGeocoderResponse {
 	result: {
@@ -93,8 +103,8 @@ class GeocodeUtil {
 
 		/**  TODO: note that for this Census API you can specify particular parts of this that
      we want (x, y, state_id, and county_id for now), read the docs */
-		let url = new URL(BASE_URL + ADDRESS_ENDPOINT + '?' + params.toString())
-		let rezzy = await fetch(url)
+		const url = new URL(BASE_URL + ADDRESS_ENDPOINT + '?' + params.toString())
+		let rezzy = await fetch(url, headers ? { headers } : undefined)
 		let jrez = (await rezzy.json()) as CensusGeocoderResponse
 		// TODO: Return all addresses and let the user choose the right one
 		// const fs = await import('node:fs')