diff --git a/frontend/index.html b/frontend/index.html index c759571a..3aac4e19 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -9,6 +9,7 @@ /> Hi.Events +
diff --git a/frontend/server.js b/frontend/server.js index 100febb9..27c303bf 100644 --- a/frontend/server.js +++ b/frontend/server.js @@ -43,6 +43,16 @@ if (!isProduction) { app.use(base, sirv("./dist/client", {extensions: []})); } +const getViteEnvironmentVariables = () => { + const envVars = {}; + for (const key in process.env) { + if (key.startsWith('VITE_')) { + envVars[key] = process.env[key]; + } + } + return JSON.stringify(envVars); +}; + app.use("*", async (req, res) => { const url = req.originalUrl.replace(base, ""); @@ -69,12 +79,12 @@ app.use("*", async (req, res) => { .map((value) => value.toString() || "") .join(" "); + const envVariablesHtml = ``; + const html = template .replace("", appHtml) - .replace( - "", - `` - ) + .replace("", ``) + .replace("", envVariablesHtml) .replace(/.*?/s, helmetHtml); res.setHeader("Content-Type", "text/html"); diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 2c575345..f2d72f1f 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -14,7 +14,6 @@ import "@mantine/tiptap/styles.css"; import "@mantine/dropzone/styles.css"; import "@mantine/charts/styles.css"; import "./styles/global.scss"; - // @ts-ignore import {messages as en} from "./locales/en.po"; // @ts-ignore @@ -27,6 +26,12 @@ import {messages as pt} from "./locales/pt.po"; import {messages as es} from "./locales/es.po"; import {setAuthToken} from "./utilites/apiClient.ts"; +declare global { + interface Window { + hievents: Record; + } +} + const supportedLocales: Record = { en, de, diff --git a/frontend/src/api/client.ts b/frontend/src/api/client.ts index 37c1ecce..2aff7ad9 100644 --- a/frontend/src/api/client.ts +++ b/frontend/src/api/client.ts @@ -1,8 +1,11 @@ import axios from "axios"; import {setAuthToken} from "../utilites/apiClient.ts"; import {isSsr} from "../utilites/helpers.ts"; +import {getConfig} from "../utilites/config.ts"; -const BASE_URL = isSsr() ? import.meta.env.VITE_API_URL_SERVER : import.meta.env.VITE_API_URL_CLIENT; +const BASE_URL = isSsr() + ? getConfig('VITE_API_URL_SERVER') + : getConfig('VITE_API_URL_CLIENT'); const LOGIN_PATH = "/auth/login"; const PREVIOUS_URL_KEY = 'previous_url'; // Key for storing the previous URL diff --git a/frontend/src/api/public-client.ts b/frontend/src/api/public-client.ts index 3292b4d0..b3fa67b6 100644 --- a/frontend/src/api/public-client.ts +++ b/frontend/src/api/public-client.ts @@ -1,10 +1,11 @@ import axios from "axios"; import {isSsr} from "../utilites/helpers.ts"; +import {getConfig} from "../utilites/config.ts"; const BASE_URL = - (isSsr() - ? import.meta.env.VITE_API_URL_SERVER - : import.meta.env.VITE_API_URL_CLIENT) + '/public'; + isSsr() + ? getConfig('VITE_API_URL_SERVER') + : getConfig('VITE_API_URL_CLIENT') + '/public'; export const publicApi = axios.create({ baseURL: BASE_URL, diff --git a/frontend/src/components/routes/ticket-widget/Payment/index.tsx b/frontend/src/components/routes/ticket-widget/Payment/index.tsx index ed460f93..4b2cc792 100644 --- a/frontend/src/components/routes/ticket-widget/Payment/index.tsx +++ b/frontend/src/components/routes/ticket-widget/Payment/index.tsx @@ -10,6 +10,7 @@ import {t} from "@lingui/macro"; import {eventHomepagePath} from "../../../../utilites/urlHelper.ts"; import {useGetEventPublic} from "../../../../queries/useGetEventPublic.ts"; import {HomepageInfoMessage} from "../../../common/HomepageInfoMessage"; +import {getConfig} from "../../../../utilites/config.ts"; const Payment = () => { const {eventId, orderShortId} = useParams(); @@ -31,7 +32,7 @@ const Payment = () => { stripeAccount: stripeAccount } : {}; - setStripePromise(loadStripe(import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY, options)); + setStripePromise(loadStripe(getConfig('VITE_STRIPE_PUBLISHABLE_KEY') as string, options)); }, [stripeData]); if (stripePaymentIntentError && event) { diff --git a/frontend/src/types.ts b/frontend/src/types.ts index d6283ce7..b3c9bc52 100644 --- a/frontend/src/types.ts +++ b/frontend/src/types.ts @@ -2,6 +2,11 @@ * @todo - This file needs to be organized better. Split into multiple files. */ +export type ConfigKeys = 'VITE_FRONTEND_URL' + | 'VITE_API_URL_CLIENT' + | 'VITE_STRIPE_PUBLISHABLE_KEY' + | 'VITE_API_URL_SERVER'; + export type IdParam = string | undefined | number; export interface AcceptInvitationRequest { diff --git a/frontend/src/utilites/config.ts b/frontend/src/utilites/config.ts new file mode 100644 index 00000000..fdb6b45e --- /dev/null +++ b/frontend/src/utilites/config.ts @@ -0,0 +1,9 @@ +import {ConfigKeys} from "../types.ts"; + +export const getConfig = (key: ConfigKeys): string | undefined => { + if (typeof window === "undefined") { + return import.meta.env[key] as string | undefined; + } + + return window.hievents[key]; +} \ No newline at end of file diff --git a/frontend/src/utilites/urlHelper.ts b/frontend/src/utilites/urlHelper.ts index e25c1df9..4f0d01a0 100644 --- a/frontend/src/utilites/urlHelper.ts +++ b/frontend/src/utilites/urlHelper.ts @@ -1,4 +1,5 @@ import {Event, IdParam} from "../types.ts"; +import {getConfig} from "./config.ts"; export const eventCheckoutPath = (eventId: IdParam, orderShortId: IdParam, subPage = '') => { return `/checkout/${eventId}/${orderShortId}/${subPage}`; @@ -9,7 +10,7 @@ export const eventHomepagePath = (event: Event) => { } export const eventHomepageUrl = (event: Event) => { - return import.meta.env.VITE_FRONTEND_URL + eventHomepagePath(event); + return getConfig('VITE_FRONTEND_URL') + eventHomepagePath(event); } export const eventCoverImageUrl = (event: Event) => {