diff --git a/packages/twenty-front/index.html b/packages/twenty-front/index.html
index e144b28fb..740aee959 100644
--- a/packages/twenty-front/index.html
+++ b/packages/twenty-front/index.html
@@ -28,7 +28,13 @@
/>
Twenty
-
+
+
+
+
+EOF
+)
+# Use sed to replace the config block in index.html
+# Using pattern space to match across multiple lines
+sed -i.bak '
+ //,//{
+ //!{
+ //!d
+ }
+ //r /dev/stdin
+ //d
+ }
+' build/index.html <<< "$CONFIG_BLOCK"
+rm -f build/index.html.bak
diff --git a/packages/twenty-front/src/config/index.ts b/packages/twenty-front/src/config/index.ts
index 4525e814d..a61b4ef53 100644
--- a/packages/twenty-front/src/config/index.ts
+++ b/packages/twenty-front/src/config/index.ts
@@ -12,12 +12,12 @@ const getDefaultUrl = () => {
) {
// In development environment front and backend usually run on separate ports
// we set the default value to localhost:3000.
- // It dev context, we use env vars to overwrite it
+ // In dev context, we use env vars to overwrite it
return 'http://localhost:3000';
} else {
// Outside of localhost we assume that they run on the same port
// because the backend will serve the frontend
- // It prod context, we use env-config.js + window var to ovewrite it
+ // In prod context, we use index.html + window var to ovewrite it
return `${window.location.protocol}//${window.location.hostname}${
window.location.port ? `:${window.location.port}` : ''
}`;
diff --git a/packages/twenty-server/src/main.ts b/packages/twenty-server/src/main.ts
index 0a9e75b8d..548540494 100644
--- a/packages/twenty-server/src/main.ts
+++ b/packages/twenty-server/src/main.ts
@@ -80,7 +80,7 @@ const bootstrap = async () => {
}),
);
- // Create the env-config.js of the front at runtime
+ // Inject the server url in the frontend page
generateFrontConfig();
// Enable session - Today it's used only for SSO
diff --git a/packages/twenty-server/src/utils/generate-front-config.ts b/packages/twenty-server/src/utils/generate-front-config.ts
index 5bc490639..be82e817b 100644
--- a/packages/twenty-server/src/utils/generate-front-config.ts
+++ b/packages/twenty-server/src/utils/generate-front-config.ts
@@ -13,23 +13,29 @@ export function generateFrontConfig(): void {
},
};
- const configString = `window._env_ = ${JSON.stringify(
- configObject.window._env_,
- null,
- 2,
- )};`;
+ const configString = `
+
+ `;
const distPath = path.join(__dirname, '../..', 'front');
- const filePath = path.join(distPath, 'env-config.js');
+ const indexPath = path.join(distPath, 'index.html');
- if (!fs.existsSync(distPath)) {
- fs.mkdirSync(distPath, { recursive: true });
+ if (!fs.existsSync(indexPath)) {
+ console.log(
+ 'Frontend build not found, assuming it is served independently',
+ );
+
+ return;
}
- if (
- !fs.existsSync(filePath) ||
- fs.readFileSync(filePath, 'utf8') !== configString
- ) {
- fs.writeFileSync(filePath, configString, 'utf8');
- }
+ let indexContent = fs.readFileSync(indexPath, 'utf8');
+
+ indexContent = indexContent.replace(
+ /[\s\S]*?/,
+ configString,
+ );
+
+ fs.writeFileSync(indexPath, indexContent, 'utf8');
}
diff --git a/packages/twenty-ui/src/utilities/config/index.ts b/packages/twenty-ui/src/utilities/config/index.ts
index 5038c5010..5a9b2ce39 100644
--- a/packages/twenty-ui/src/utilities/config/index.ts
+++ b/packages/twenty-ui/src/utilities/config/index.ts
@@ -12,12 +12,12 @@ const getDefaultUrl = () => {
) {
// In development environment front and backend usually run on separate ports
// we set the default value to localhost:3000.
- // It dev context, we use env vars to overwrite it
+ // In dev context, we use env vars to overwrite it
return 'http://localhost:3000';
} else {
// Outside of localhost we assume that they run on the same port
// because the backend will serve the frontend
- // It prod context, we use env-config.js + window var to ovewrite it
+ // In prod context, we use index.html + window var to ovewrite it
return `${window.location.protocol}//${window.location.hostname}${
window.location.port ? `:${window.location.port}` : ''
}`;