Web: Login: added base server

packages/login/src/server/index.tsx

@@ -0,0 +1,73 @@
+import express from "express";
+import template from "./lib/template";
+import devMiddleware from "./lib/middleware/devMiddleware";
+import path from "path";
+import compression from "compression";
+import ws from "./lib/websocket";
+import fs from "fs";
+// import logger from "morgan";
+// import winston from "./lib/logger";
+import { getAssets } from "./lib/helpers";
+import { renderToString } from "react-dom/server";
+import React from "react";
+import App from "../client/App";
+
+let port: number = 5011;
+
+const renderApp = () => {
+  return renderToString(<App />);
+};
+
+// winston.stream = {
+//   write: (message) => winston.info(message),
+// };
+
+const app = express();
+app.use(compression());
+app.use("/login", express.static(path.resolve(path.join(__dirname, "client"))));
+
+//app.use(logger("dev", { stream: winston.stream }));
+
+if (IS_DEVELOPMENT) {
+  app.use(devMiddleware);
+
+  app.get("/login", async (req: DevRequest, res) => {
+    const { assets } = req;
+    const appComponent = renderApp();
+
+    const htmlString = template(
+      {},
+      appComponent,
+      "styleTags",
+      {},
+      "userLng",
+      assets
+    );
+
+    res.send(htmlString);
+  });
+
+  const server = app.listen(port, () => {
+    console.log(`Server is listening on port ${port}`);
+  });
+
+  const wss = ws(server);
+
+  const manifestFile = path.resolve(
+    path.join(__dirname, "client/manifest.json")
+  );
+
+  let fsWait = false;
+  let waitTimeout: ReturnType<typeof setTimeout>;
+  fs.watch(manifestFile, (event, filename) => {
+    if (filename && event === "change") {
+      if (fsWait) return;
+      fsWait = true;
+      waitTimeout = setTimeout(() => {
+        fsWait = false;
+        clearTimeout(waitTimeout);
+        wss.broadcast("reload");
+      }, 100);
+    }
+  });
+}

packages/login/src/server/lib/helpers/index.ts

@@ -0,0 +1,26 @@
+import path from "path";
+import fs from "fs";
+
+export const getAssets = (): object => {
+  const manifest = fs.readFileSync(
+    path.join(__dirname, "client/manifest.json"),
+    "utf-8"
+  );
+
+  const assets = JSON.parse(manifest);
+
+  return assets;
+};
+
+export const getScripts = (assets: object): string[] => {
+  const regTest = /static\/js\/.*/;
+  const keys = [];
+  console.log(assets);
+  for (let key in assets) {
+    if (assets.hasOwnProperty(key) && regTest.test(key)) {
+      keys.push(key);
+    }
+  }
+
+  return keys;
+};

packages/login/src/server/lib/logger.ts

@@ -0,0 +1,58 @@
+import winston from "winston";
+import "winston-daily-rotate-file";
+import path from "path";
+import fs from "fs";
+
+let logpath = process.env.logpath || null;
+
+if (logpath != null) {
+  if (!path.isAbsolute(logpath)) {
+    logpath = path.join(__dirname, "..", logpath);
+  }
+}
+
+const fileName = IS_DEVELOPMENT
+  ? path.join(__dirname, "..", "..", "..", "Logs", "editor.%DATE%.log")
+  : logpath
+  ? path.join(logpath, "editor.%DATE%.log")
+  : path.join(__dirname, "..", "..", "..", "Logs", "editor.%DATE%.log");
+const dirName = path.dirname(fileName);
+
+if (!fs.existsSync(dirName)) {
+  fs.mkdirSync(dirName);
+}
+
+const options = {
+  file: {
+    filename: fileName,
+    datePattern: "MM-DD",
+    handleExceptions: true,
+    humanReadableUnhandledException: true,
+    zippedArchive: true,
+    maxSize: "50m",
+    maxFiles: "30d",
+    json: true,
+  },
+  console: {
+    level: "debug",
+    handleExceptions: true,
+    json: false,
+    colorize: true,
+  },
+};
+
+const transports = [
+  new winston.transports.Console(options.console),
+  new winston.transports.DailyRotateFile(options.file),
+];
+
+export default new winston.createLogger({
+  format: winston.format.combine(
+    winston.format.timestamp({
+      format: "YYYY-MM-DD HH:mm:ss",
+    }),
+    winston.format.json()
+  ),
+  transports: transports,
+  exitOnError: false,
+});

packages/login/src/server/lib/middleware/devMiddleware.ts

@@ -0,0 +1,22 @@
+// import winston from "../logger";
+import { Response, NextFunction } from "express";
+import { getAssets } from "../helpers";
+
+// winston.stream = {
+//   write: (message) => winston.info(message), //ts check
+// };
+
+export default async (req: DevRequest, res: Response, next: NextFunction) => {
+  try {
+    const assets = await getAssets();
+
+    req.assets = assets;
+  } catch (e) {
+    let message: string | unknown = e;
+    if (e instanceof Error) {
+      message = e.message;
+    }
+    console.log(message);
+  }
+  next();
+};

packages/login/src/server/lib/template.ts

@@ -1,29 +1,29 @@
 import { getScripts } from "./helpers";
-import pkg from "../../../package.json";
 
-declare var IS_DEVELOPMENT: boolean;
+type Template = (
+  initLoginState: IInitLoginState,
+  appComponent: string,
+  styleTags: string,
+  initialI18nStoreASC: object,
+  initialLanguage: string,
+  assets: object
+) => string;
 
-export default function template(
-  initialEditorState = {},
+const template: Template = (
+  initLoginState = {},
   appComponent = "",
-  styleTags: any,
-  initialI18nStoreASC: any,
-  initialLanguage: any,
-  assets: any
-) {
-  const { title } = pkg;
-  const { docApiUrl, error } = initialEditorState;
+  styleTags,
+  initialI18nStoreASC,
+  initialLanguage,
+  assets
+): string => {
+  const title = "Login";
 
   let clientScripts =
     assets && assets.hasOwnProperty("client.js")
       ? `<script defer="defer" src='${assets["client.js"]}'></script>`
       : "";
 
-  const editorApiScript =
-    error || !docApiUrl
-      ? ""
-      : `<script type='text/javascript' id='scripDocServiceAddress' src="${docApiUrl}" async></script>`;
-
   if (!IS_DEVELOPMENT) {
     const productionBundleKeys = getScripts(assets);
     productionBundleKeys.map((key) => {
@@ -32,14 +32,11 @@ export default function template(
     });
   }
 
-  console.log(clientScripts);
   const scripts = `   
-    <script id="__ASC_INITIAL_EDITOR_STATE__">
-      window.__ASC_INITIAL_EDITOR_STATE__ = ${JSON.stringify(
-        initialEditorState
-      )}
+    <script id="__ASC_INITIAL_LOGIN_STATE__">
+      window.__ASC_INITIAL_LOGIN_STATE__ = ${JSON.stringify(initLoginState)}
     </script>
-    <script id="__ASC_INITIAL_EDITOR_I18N__">
+    <script id="__ASC_INITIAL_LOGIN_I18N__">
       window.initialI18nStoreASC = ${JSON.stringify(initialI18nStoreASC)}
       window.initialLanguage = '${initialLanguage}'
     </script>
@@ -47,7 +44,7 @@ export default function template(
     <script>
       console.log("It's Login INIT");
     </script>
-    ${editorApiScript} 
+
 
 `;
 
@@ -81,4 +78,6 @@ export default function template(
   `;
 
   return page;
-}
+};
+
+export default template;

packages/login/src/server/lib/websocket.ts

@@ -0,0 +1,30 @@
+const WebSocket = require("ws");
+const pkg = require("../../../package.json");
+const { socketPath } = pkg;
+
+module.exports = (expressServer) => {
+  const wss = new WebSocket.Server({
+    noServer: true,
+    path: socketPath,
+  });
+
+  expressServer.on("upgrade", (request, socket, head) => {
+    wss.handleUpgrade(request, socket, head, (websocket) => {
+      wss.emit("connection", websocket, request);
+    });
+  });
+
+  wss.on("connection", function connection(ws) {
+    ws.on("message", function (message) {
+      wss.broadcast(message);
+    });
+  });
+
+  wss.broadcast = function broadcast(msg) {
+    wss.clients.forEach(function each(client) {
+      client.send(msg);
+    });
+  };
+
+  return wss;
+};