fix: Make backendUrl explicit requirement in appConfig

- Backend no longer sends backendUrl in API response
- Frontend only uses appConfig.oauth.backendUrl (no fallback)
- OAuth button won't work unless backendUrl is explicitly configured
- Validation is skipped if backendUrl is not set
- Updated example configs to include required backendUrl

Author: f0ssel

packages/app/src/components/catalog/EntityPage.tsx

@@ -136,6 +136,10 @@ const coderAppConfig: CoderAppConfig = {
     accessUrl: 'https://dev.coder.com',
   },
 
+  oauth: {
+    backendUrl: 'http://localhost:7007',
+  },
+
   workspaces: {
     defaultTemplateName: 'devcontainers',
     defaultMode: 'manual',

plugins/backstage-plugin-coder-backend/src/service/router.ts

@@ -24,11 +24,9 @@ export async function createRouter(
       const coderConfig = config.getOptionalConfig('coder');
 
       const clientId = coderConfig?.getString('oauth.clientId') || 'backstage';
-      const backendUrl = `${req.protocol}://${req.get('host')}`;
 
       res.json({
         clientId,
-        backendUrl,
       });
     } catch (error) {
       logger.error('Failed to get OAuth config', error);

plugins/backstage-plugin-coder/dev/DevPage.tsx

@@ -23,6 +23,10 @@ const appConfig: CoderAppConfig = {
     accessUrl: 'https://dev.coder.com',
   },
 
+  oauth: {
+    backendUrl: 'http://localhost:7007',
+  },
+
   workspaces: {
     defaultTemplateName: 'devcontainers',
     defaultMode: 'manual',

plugins/backstage-plugin-coder/src/components/CoderAuthForm/CoderAuthInputForm.tsx

@@ -16,7 +16,6 @@ import SyncIcon from '@material-ui/icons/Sync';
 
 type OAuthConfig = {
   clientId: string;
-  backendUrl: string;
 };
 
 const useStyles = makeStyles(theme => ({
@@ -108,7 +107,7 @@ export const CoderAuthInputForm = () => {
   useEffect(() => {
     const handleOAuthMessage = (event: MessageEvent) => {
       // Verify the message is from our OAuth callback backend
-      const backendUrl = oauthConfig?.backendUrl || appConfig.oauth?.backendUrl;
+      const backendUrl = appConfig.oauth?.backendUrl;
 
       // If backendUrl is configured, verify the origin matches
       if (backendUrl) {
@@ -128,7 +127,7 @@ export const CoderAuthInputForm = () => {
 
     window.addEventListener('message', handleOAuthMessage);
     return () => window.removeEventListener('message', handleOAuthMessage);
-  }, [registerNewToken, oauthConfig, appConfig.oauth?.backendUrl]);
+  }, [registerNewToken, appConfig.oauth?.backendUrl]);
 
   const onSubmit = (event: FormEvent<HTMLFormElement>) => {
     event.preventDefault();
@@ -141,9 +140,14 @@ export const CoderAuthInputForm = () => {
 
   const handleOAuthLogin = () => {
     const authUrl = `${appConfig.deployment.accessUrl}/oauth2/authorize`;
-    // Use fetched config with fallback to appConfig
     const clientId = oauthConfig?.clientId || appConfig.oauth?.clientId || 'backstage';
-    const backendUrl = oauthConfig?.backendUrl || appConfig.oauth?.backendUrl || `${window.location.protocol}//${window.location.hostname}:7007`;
+    const backendUrl = appConfig.oauth?.backendUrl;
+    
+    if (!backendUrl) {
+      console.error('OAuth backendUrl not configured in appConfig.oauth.backendUrl');
+      return;
+    }
+    
     const redirectUri = `${backendUrl}/api/auth/coder/oauth/callback`;
     const state = btoa(JSON.stringify({ returnTo: window.location.pathname }));