feat: configurable env-based API URLs for web and mobile apps (#824)#846
Open
Rudra-clrscr wants to merge 3 commits into
Open
feat: configurable env-based API URLs for web and mobile apps (#824)#846Rudra-clrscr wants to merge 3 commits into
Rudra-clrscr wants to merge 3 commits into
Conversation
…known84#824) Investigated first: both apps already read from env vars with a hardcoded fallback (not fully hardcoded as the issue implies), but neither warned when the fallback was in use, the mobile app had no .env.example or shared config module, and the root README's mobile example had a stale "YOUR_IP" placeholder that didn't match how the actual app works. Web (frontend/): - axiosInstance.js: centralizes VITE_API_URI/VITE_PYTHON_URI resolution into API_BASE_URL/PYTHON_API_BASE_URL, warning once via console.warn when a var is missing and the localhost fallback is in use, instead of silently defaulting with zero indication. - Removed 13 scattered `${import.meta.env.VITE_API_URI || ...}/path` constructions across BulkSpamDetection.jsx, Chatbot.jsx, EmailHeaderAnalyzer.jsx, FeedbackWidget.jsx, SpamInsightsDashboard.jsx, App.jsx, ForgotPassword.jsx, Login.jsx, Register.jsx, and ResetPassword.jsx - all of them duplicated env-reading that the `api` axios instance already handles via its configured baseURL, so they now just use relative paths. Several of these had NO fallback at all (bare `import.meta.env.VITE_API_URI`), which would silently produce a broken "undefined/path" request URL if the var were ever unset - a real latent bug, not just style. - Chatbot.jsx was using raw `axios` instead of the shared `api` instance, missing both the centralized URL config and the auth-token interceptor every other call site gets; switched it to use `api`. - Dashboard.jsx: now imports the shared PYTHON_API_BASE_URL constant instead of re-declaring its own local fallback. Mobile (spamdetection/): - New constants/api.ts: extracts the inline Platform-based URL logic from app/index.tsx into a shared module, same warn-on-fallback behavior as the web app. The 10.0.2.2 (Android emulator) and localhost (iOS simulator) defaults aren't wrong values to delete - they're the correct way to reach a local backend from an emulator/simulator - so they're kept, but now with a warning explaining they won't work for real-device testing and what to set instead. - New .env.example documenting EXPO_PUBLIC_ANDROIDAPI/EXPO_PUBLIC_IOSAPI (none existed before). - spamdetection/README.md (previously the unmodified create-expo-app boilerplate) gains a "Configuring the API URL" section covering emulator defaults and real-device LAN IP setup. Docs: - Root README: fixed the "YOUR_IP" placeholder in the generic React Native example (which didn't reflect how the real app works and was the exact confusing reference the issue described), pointed readers at spamdetection/README.md for the actual app's setup, and documented the frontend's new missing-env warning behavior next to its .env.example block. Verified: `cd frontend && npx vite build` succeeds; `npx eslint` on all touched frontend files is clean (2 pre-existing errors surfaced in Chatbot.jsx/Dashboard.jsx are already fixed on the separate, not-yet- merged fix/frontend-eslint-errors branch, unrelated to this change). `cd spamdetection && npx tsc --noEmit` and `npx expo lint` both pass with zero errors. Out of scope, noted but not touched: predictionRoutes.js's own ML_API_BASE has a similar hardcoded-fallback pattern for the Node -> Flask connection, but the issue explicitly scopes this work to "the React and React Native applications", not the backend. App.jsx and ManipulationIndex.jsx again carry the same parse-error fixes from the pending fix/frontend-eslint-errors PR, for the same reason as every other issue worked this session on a fresh upstream/main branch.
|
Someone is attempting to deploy a commit to the Aditya Sharma's projects Team on Vercel. A member of the Team first needs to authorize it. |
added 2 commits
July 14, 2026 03:19
fix/frontend-eslint-errors (from the same batch of issues) independently fixes the same file's missing `user` variable (referenced at ActivityHeatmap's userId prop but never obtained from anywhere - a real pre-existing bug) by importing and calling useAuth(). Split PYTHON_API_BASE_URL into its own import statement rather than folding it into the existing `import api from "../utils/axiosInstance"` line - fe's branch never touches that line's content, so as long as this branch doesn't either, the two branches' edits land in non-overlapping regions (fe inserts its useAuth import before the api import, this branch's PYTHON_API_BASE_URL import goes after it) and merge cleanly in either order instead of both re-writing the same line differently. Verified: vite build still succeeds.
The container's Flask process defaults to FLASK_HOST=127.0.0.1 (a deliberate secure default for bare-metal runs), so inside the CI container it never listens on an interface reachable through the -p 5000:5000 port mapping, and the smoke test's curl always times out. docker-compose.yml already sets FLASK_HOST=0.0.0.0 for the same reason; the CI workflow's docker run step needs the same override.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Closes #824.
Investigated first: both apps already read from env vars with a hardcoded
fallback (not fully hardcoded as the issue implies), but neither warned
when the fallback was in use, the mobile app had no
.env.exampleorshared config module, and the root README's mobile example had a stale
"YOUR_IP" placeholder that didn't match how the actual app works.
Web (
frontend/)axiosInstance.js: centralizesVITE_API_URI/VITE_PYTHON_URIresolution into
API_BASE_URL/PYTHON_API_BASE_URL, warning once viaconsole.warnwhen a var is missing and the localhost fallback is inuse, instead of silently defaulting with zero indication.
${import.meta.env.VITE_API_URI || ...}/pathconstructions across
BulkSpamDetection.jsx,Chatbot.jsx,EmailHeaderAnalyzer.jsx,FeedbackWidget.jsx,SpamInsightsDashboard.jsx,App.jsx,ForgotPassword.jsx,Login.jsx,Register.jsx, andResetPassword.jsx— all of themduplicated env-reading that the
apiaxios instance already handlesvia its configured
baseURL, so they now just use relative paths.Several of these had no fallback at all (bare
import.meta.env.VITE_API_URI), which would silently produce a broken"undefined/path"request URL if the var were ever unset — a reallatent bug, not just style.
Chatbot.jsxwas using rawaxiosinstead of the sharedapiinstance, missing both the centralized URL config and the auth-token
interceptor every other call site gets; switched it to use
api.Dashboard.jsx: now imports the sharedPYTHON_API_BASE_URLconstantinstead of re-declaring its own local fallback.
Mobile (
spamdetection/)constants/api.ts: extracts the inline Platform-based URL logicfrom
app/index.tsxinto a shared module, same warn-on-fallbackbehavior as the web app. The
10.0.2.2(Android emulator) andlocalhost(iOS simulator) defaults aren't wrong values to delete —they're the correct way to reach a local backend from an
emulator/simulator — so they're kept, but now with a warning explaining
they won't work for real-device testing and what to set instead.
.env.exampledocumentingEXPO_PUBLIC_ANDROIDAPI/EXPO_PUBLIC_IOSAPI(none existed before).spamdetection/README.md(previously the unmodifiedcreate-expo-appboilerplate) gains a "Configuring the API URL" section covering
emulator defaults and real-device LAN IP setup.
Docs
Native example (which didn't reflect how the real app works and was the
exact confusing reference the issue described), pointed readers at
spamdetection/README.mdfor the actual app's setup, and documentedthe frontend's new missing-env warning behavior next to its
.env.exampleblock.Out of scope
predictionRoutes.js's ownML_API_BASEhas a similar hardcoded-fallbackpattern for the Node → Flask connection, but the issue explicitly scopes
this work to "the React and React Native applications", not the backend.
Note:
App.jsxandManipulationIndex.jsxagain carry the sameparse-error fixes from the pending
fix/frontend-eslint-errorsPR —needed here for the same reason as every other issue worked this session
on a fresh
upstream/mainbranch. Will need reconciling with whichever PRmerges first.
Test plan
cd frontend && npx vite build— succeedsnpx eslinton all touched frontend files — clean (2 pre-existingerrors surfaced in
Chatbot.jsx/Dashboard.jsxare already fixed onthe separate
fix/frontend-eslint-errorsbranch, unrelated to thischange)
cd spamdetection && npx tsc --noEmit— zero errorscd spamdetection && npx expo lint— zero errors