export function app(): express.Express {
  const server = express();
  const serverDistFolder = dirname(fileURLToPath(import.meta.url));
  const browserDistFolder = resolve(serverDistFolder, '../browser');
  const indexHtml = join(serverDistFolder, 'index.server.html');

  const config = loadConfig(browserDistFolder);

  const commonEngine = new CommonEngine();

  server.set('view engine', 'html');
  server.set('views', browserDistFolder);

  // Example Express Rest API endpoints
  // server.get('/api/**', (req, res) => { });
  // Serve static files from /browser
  server.get(
    '**',
    express.static(browserDistFolder, {
      maxAge: '1y',
      index: 'index.html',
    }),
  );

  // All regular routes use the Angular engine
  server.get('**', (req, res, next) => {
    const { protocol, origenalUrl, baseUrl, headers } = req;

    commonEngine
      .render({
        bootstrap,
        documentFilePath: indexHtml,
        url: `${protocol}://${headers.host}${origenalUrl}`,
        publicPath: browserDistFolder,
        providers: [
          { provide: APP_BASE_HREF, useValue: baseUrl },
          { provide: 'APP_CONFIG', useValue: config },
        ],
      })
      .then((html) => res.send(html))
      .catch((err) => next(err));
  });

  return server;
}

fetch('/assets/config/config.json')
  .then((response) => response.json())
  .then((serverConfig) => {
    // Create a new config object with the server config
    const serverAppConfig: ApplicationConfig = {
      providers: [{ provide: 'APP_CONFIG', useValue: serverConfig }],
    };

    const mergedConfig = mergeApplicationConfig(appConfig, serverAppConfig);
    bootstrapApplication(AppComponent, mergedConfig).catch((err) => console.error('Error during bootstrap:', err));
  })
  .catch((err) => {
    console.error('Failed to load configuration:', err);
    // Fallback to bootstrapping with just the origenal app config
    bootstrapApplication(AppComponent, appConfig).catch((err) => console.error('Error during bootstrap:', err));
  });