From 35a63ad55166e4c26b67331b818ea04a05f2601b Mon Sep 17 00:00:00 2001
From: MapleLeaf <19603573+itsMapleLeaf@users.noreply.github.com>
Date: Mon, 3 Jan 2022 11:58:14 -0600
Subject: [PATCH] clean up dev script

---
 packages/docs/package.json   |   8 +-
 packages/docs/scripts/dev.ts | 171 +++++++++++++++++++++++------------
 packages/docs/tsup.config.js |   8 ++
 3 files changed, 124 insertions(+), 63 deletions(-)
 create mode 100644 packages/docs/tsup.config.js

diff --git a/packages/docs/package.json b/packages/docs/package.json
index 191bc26..8e84ba1 100644
--- a/packages/docs/package.json
+++ b/packages/docs/package.json
@@ -2,12 +2,12 @@
   "name": "reacord-docs-new",
   "type": "module",
   "private": true,
-  "main": "./src/main.tsx",
+  "main": "./dist/main.js",
   "scripts": {
+    "build": "tsup --minify",
     "dev": "esmo --no-warnings scripts/dev.ts | pino-colada",
-    "serve": "esmo --experimental-import-meta-resolve --no-warnings --enable-source-maps src/main.tsx",
-    "build": "tsup src/main.tsx --target node16 --format esm --sourcemap --minify",
-    "start": "NODE_ENV=production node  --experimental-import-meta-resolve --experimental-json-modules --no-warnings --enable-source-maps dist/main.js | pino-colada",
+    "start": "NODE_ENV=production pnpm serve | pino-colada",
+    "serve": "node --experimental-import-meta-resolve --experimental-json-modules --no-warnings --enable-source-maps dist/main.js",
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
diff --git a/packages/docs/scripts/dev.ts b/packages/docs/scripts/dev.ts
index d9ebe08..01819a8 100644
--- a/packages/docs/scripts/dev.ts
+++ b/packages/docs/scripts/dev.ts
@@ -3,83 +3,136 @@ import chokidar from "chokidar"
 import type { ExecaChildProcess } from "execa"
 import { execa } from "execa"
 import pino from "pino"
-import { concatMap, debounceTime, map, Observable, tap } from "rxjs"
+import { concatMap, debounceTime, Observable, tap } from "rxjs"
 import waitOn from "wait-on"
 import packageJson from "../package.json"
 
 const console = pino()
 
-let app: ExecaChildProcess | undefined
+function awaitChildStopped(child: ExecaChildProcess) {
+  if (child.killed) return
+  return new Promise((resolve) => child.once("close", resolve))
+}
 
-async function stopApp() {
-  if (app) {
-    if (app.pid != undefined) {
-      process.kill(-app.pid, "SIGINT")
-    } else {
-      app.kill("SIGINT")
+class App {
+  app: ExecaChildProcess | undefined
+
+  async start() {
+    console.info(this.app ? "Restarting app..." : "Starting app...")
+
+    await this.stop()
+
+    const [command, ...flags] = packageJson.scripts.serve.split(/\s+/)
+    this.app = execa(command!, flags, {
+      stdio: "inherit",
+      detached: true,
+    })
+
+    this.app.catch((error) => {
+      if (error.signal !== "SIGINT") {
+        console.error(error)
+      }
+    })
+
+    void this.app.on("close", () => {
+      this.app = undefined
+    })
+
+    await waitOn({ resources: ["http-get://localhost:3000"] })
+
+    console.info("App running")
+  }
+
+  async stop() {
+    if (this.app) {
+      if (this.app.pid != undefined) {
+        process.kill(-this.app.pid, "SIGINT")
+      } else {
+        this.app.kill("SIGINT")
+      }
+      await awaitChildStopped(this.app)
     }
-    await new Promise((resolve) => app?.once("close", resolve))
   }
 }
 
-async function startApp() {
-  console.info(app ? "Restarting app..." : "Starting app...")
-
-  await stopApp()
-
-  const [command, ...flags] = packageJson.scripts.serve.split(/\s+/)
-  app = execa(command!, flags, {
+class Builder {
+  child = execa("tsup", ["--watch"], {
     stdio: "inherit",
-    detached: true,
   })
 
-  app.catch((error) => {
-    if (error.signal !== "SIGINT") {
-      console.error(error)
-    }
-  })
-
-  await waitOn({ resources: ["http-get://localhost:3000"] })
-
-  console.info("App running")
+  async stop() {
+    this.child.kill()
+    await awaitChildStopped(this.child)
+  }
 }
 
-const browser = browserSync.create()
+class Browser {
+  browser = browserSync.create()
+
+  constructor() {
+    this.browser.emitter.on("init", () => {
+      console.info("Browsersync started")
+    })
+    this.browser.emitter.on("browser:reload", () => {
+      console.info("Browser reloaded")
+    })
+  }
+
+  init() {
+    this.browser.init({
+      proxy: "http://localhost:3000",
+      port: 3001,
+      ui: false,
+      logLevel: "silent",
+    })
+  }
+
+  reload() {
+    this.browser.reload()
+  }
+
+  stop() {
+    this.browser.exit()
+  }
+}
+
+class Watcher {
+  subscription = new Observable<string>((subscriber) => {
+    chokidar
+      .watch(packageJson.main, { ignored: /node_modules/, ignoreInitial: true })
+      .on("all", (_, path) => subscriber.next(path))
+  })
+    .pipe(
+      tap((path) => console.info(`Changed:`, path)),
+      debounceTime(100),
+      concatMap(async () => {
+        await this.app.start()
+        this.browser.reload()
+      }),
+    )
+    .subscribe()
+
+  constructor(private app: App, private browser: Browser) {}
+
+  stop() {
+    this.subscription.unsubscribe()
+  }
+}
+
+const app = new App()
+const builder = new Builder()
+const browser = new Browser()
+const watcher = new Watcher(app, browser)
 
 process.on("SIGINT", async () => {
   console.info("Shutting down...")
-  await stopApp()
-  browser.exit()
+  try {
+    await Promise.all([app, browser, watcher, builder].map((it) => it.stop()))
+  } catch (error) {
+    console.error(error)
+  }
   process.exit()
 })
 
-await startApp()
-
-browser.emitter.on("init", () => {
-  console.info("Browsersync started")
-})
-browser.emitter.on("browser:reload", () => {
-  console.info("Browser reloaded")
-})
-
-browser.init({
-  proxy: "http://localhost:3000",
-  port: 3001,
-  ui: false,
-  logLevel: "silent",
-})
-
-new Observable<string>((subscriber) => {
-  chokidar
-    .watch(".", { ignored: /node_modules/, ignoreInitial: true })
-    .on("all", (_, path) => subscriber.next(path))
-})
-  .pipe(
-    tap((path) => console.info(`Changed:`, path)),
-    debounceTime(100),
-    concatMap(startApp),
-    map(() => browser.reload()),
-  )
-  .subscribe()
-
-// chokidar.watch(".", { ignored: /node_modules/, ignoreInitial: true }).on('all', )
+await app.start()
+browser.init()
diff --git a/packages/docs/tsup.config.js b/packages/docs/tsup.config.js
new file mode 100644
index 0000000..0fc1a6f
--- /dev/null
+++ b/packages/docs/tsup.config.js
@@ -0,0 +1,8 @@
+import { defineConfig } from "tsup"
+
+export default defineConfig({
+  entry: ["./src/main.tsx"],
+  target: "node16",
+  format: ["esm"],
+  sourcemap: true,
+})