import { renderToReadableStream } from 'react-dom/server';
import Main, { createServerDataScript, getData } from './pages/a/main.tsx';
import http from 'http';
import fs from 'fs';
import path from 'path';

const PORT = 3000;
const distDir = path.join(process.cwd(), 'dist');
const indexHtmlPath = path.join(process.cwd(), 'dist/index.html');

const mimeTypes: Record<string, string> = {
  '.html': 'text/html',
  '.js': 'application/javascript',
  '.css': 'text/css',
  '.json': 'application/json',
  '.png': 'image/png',
  '.jpg': 'image/jpeg',
  '.svg': 'image/svg+xml',
  '.ico': 'image/x-icon',
};



async function ssrRender(res: http.ServerResponse, mode: 'server' | 'client' = 'client') {
  let template: string;
  try {
    template = fs.readFileSync(indexHtmlPath, 'utf-8');
  } catch {
    res.writeHead(500);
    res.end('dist/index.html not found');
    return;
  }
  if (mode === 'client'   ) {
    res.writeHead(200, { 'Content-Type': 'text/html' });
    res.end(template);
    return;
  }

  try {
    const serverData = await getData()
    const stream = await renderToReadableStream(<Main data={serverData} />, {
      bootstrapScripts: []
    });

    let renderedHtml = '';
    for await (const chunk of stream) {
      renderedHtml += new TextDecoder().decode(chunk);
    }

    // console.log('Rendered HTML:', renderedHtml);
    const html = template
      .replace('<div id="root"></div>', `<div id="root">${renderedHtml}</div>`)
      .replace('</head>', `${createServerDataScript(serverData)}</head>`);
    res.writeHead(200, { 'Content-Type': 'text/html' });
    res.end(html);
  } catch (err) {
    console.error('Render error:', err);
    res.writeHead(500);
    res.end('Server Error');
  }
}

http.createServer((req, res) => {
  const urlPath = req.url?.split('?')[0] || '/';

  if (urlPath === '/') {
    ssrRender(res, 'client');
    return;
  }

  if (urlPath === '/a') {
    ssrRender(res, 'server');
    return;
  }

  const distFilePath = path.join(distDir, urlPath);
  try {
    if (fs.existsSync(distFilePath) && fs.statSync(distFilePath).isFile()) {
      const ext = path.extname(distFilePath);
      const contentType = mimeTypes[ext] || 'application/octet-stream';
      res.writeHead(200, { 'Content-Type': contentType });
      fs.createReadStream(distFilePath).pipe(res);
      return;
    }
  } catch {
  }

  ssrRender(res);
}).listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});