From 18757bb2d4f9df0fd84643222b3f27cd29880055 Mon Sep 17 00:00:00 2001
From: Kuba Orlik <kontakt@kuba-orlik.name>
Date: Mon, 1 Aug 2022 19:46:14 +0200
Subject: [PATCH] Auto-updating scss styles

---
 esbuild.js        | 28 ++++++++++++++++++++++++++--
 package-lock.json | 15 ++++++++-------
 package.json      |  3 ++-
 src/includes.scss |  4 ++++
 src/main.scss     |  5 +----
 5 files changed, 41 insertions(+), 14 deletions(-)
 create mode 100644 src/includes.scss

diff --git a/esbuild.js b/esbuild.js
index 05fa22b..2f0c7dc 100644
--- a/esbuild.js
+++ b/esbuild.js
@@ -1,6 +1,8 @@
 const { build } = require("esbuild");
+const { spawn } = require("child_process");
 const { sassPlugin } = require("esbuild-sass-plugin");
 const glob = require("tiny-glob");
+const chokidar = require("chokidar");
 
 const watch = process.argv.includes("--watch");
 
@@ -16,14 +18,16 @@ const watch = process.argv.includes("--watch");
 		target: "node16",
 		format: "cjs",
 	});
-	build({
+	const scss_build = await build({
 		entryPoints: ["./src/main.scss"],
 		sourcemap: true,
 		outfile: "./public/dist/style.css",
 		logLevel: "info",
-		watch,
+		incremental: watch,
 		plugins: [sassPlugin()],
 	});
+	scss_build.rebuild();
+
 	build({
 		entryPoints: ["./src/front/index.ts"],
 		sourcemap: true,
@@ -32,4 +36,24 @@ const watch = process.argv.includes("--watch");
 		bundle: true,
 		watch,
 	});
+
+	if (watch) {
+		const scss_watcher = chokidar.watch("src", { ignoreInitial: true });
+		scss_watcher.on("all", (_, path) => {
+			if (path.endsWith(".scss")) {
+				// refresh the list of all scss files in includes.scss
+				spawn("./node_modules/.bin/sealgen", ["generate-scss-includes"]).on(
+					"close",
+					() => {
+						scss_build.rebuild().catch(async (e) => {
+							console.error(e);
+							setTimeout(() => {
+								scss_build.rebuild();
+							}, 200);
+						});
+					}
+				);
+			}
+		});
+	}
 })();
diff --git a/package-lock.json b/package-lock.json
index 6d350e7..be38939 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,7 +12,7 @@
 				"@babel/core": "^7.12.10",
 				"@hotwired/turbo": "^7.1.0",
 				"@koa/router": "^10.1.1",
-				"@sealcode/sealgen": "^0.1.6",
+				"@sealcode/sealgen": "^0.1.7",
 				"@sealcode/ts-predicates": "^0.4.0",
 				"esbuild-node-tsc": "^1.8.2",
 				"hint": "^7.0.1",
@@ -38,6 +38,7 @@
 				"@typescript-eslint/eslint-plugin": "^5.10.0",
 				"@typescript-eslint/parser": "^5.10.2",
 				"axios": "^0.24.0",
+				"chokidar": "^3.5.3",
 				"esbuild": "^0.14.10",
 				"esbuild-sass-plugin": "^2.0.0",
 				"eslint": "^7.19.0",
@@ -2442,9 +2443,9 @@
 			}
 		},
 		"node_modules/@sealcode/sealgen": {
-			"version": "0.1.6",
-			"resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.1.6.tgz",
-			"integrity": "sha512-BHoRF6Nkb9ZEdIDsanJ6DVZ9yJ+3J58i9+LQXSKiQaKFbkS3jgvPB00kQ/Qah6xkTOh1lYXh9qRtKMeV7PGzMw==",
+			"version": "0.1.7",
+			"resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.1.7.tgz",
+			"integrity": "sha512-hnDY3KSUYtUnf1ybNgsg/PDnEmD5IMar3IWt3HoPS/EBuMtevNKozu1IxvtcI6fY4aNfBAGygo0pgsYuhYsdBA==",
 			"dependencies": {
 				"@sealcode/ts-predicates": "^0.2.1",
 				"locreq": "^2.0.2"
@@ -18201,9 +18202,9 @@
 			}
 		},
 		"@sealcode/sealgen": {
-			"version": "0.1.6",
-			"resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.1.6.tgz",
-			"integrity": "sha512-BHoRF6Nkb9ZEdIDsanJ6DVZ9yJ+3J58i9+LQXSKiQaKFbkS3jgvPB00kQ/Qah6xkTOh1lYXh9qRtKMeV7PGzMw==",
+			"version": "0.1.7",
+			"resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.1.7.tgz",
+			"integrity": "sha512-hnDY3KSUYtUnf1ybNgsg/PDnEmD5IMar3IWt3HoPS/EBuMtevNKozu1IxvtcI6fY4aNfBAGygo0pgsYuhYsdBA==",
 			"requires": {
 				"@sealcode/ts-predicates": "^0.2.1",
 				"locreq": "^2.0.2"
diff --git a/package.json b/package.json
index e7f066a..9dd0542 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,7 @@
 		"@babel/core": "^7.12.10",
 		"@hotwired/turbo": "^7.1.0",
 		"@koa/router": "^10.1.1",
-		"@sealcode/sealgen": "^0.1.6",
+		"@sealcode/sealgen": "^0.1.7",
 		"@sealcode/ts-predicates": "^0.4.0",
 		"esbuild-node-tsc": "^1.8.2",
 		"hint": "^7.0.1",
@@ -46,6 +46,7 @@
 		"@typescript-eslint/eslint-plugin": "^5.10.0",
 		"@typescript-eslint/parser": "^5.10.2",
 		"axios": "^0.24.0",
+		"chokidar": "^3.5.3",
 		"esbuild": "^0.14.10",
 		"esbuild-sass-plugin": "^2.0.0",
 		"eslint": "^7.19.0",
diff --git a/src/includes.scss b/src/includes.scss
new file mode 100644
index 0000000..741a285
--- /dev/null
+++ b/src/includes.scss
@@ -0,0 +1,4 @@
+// DO NOT EDIT! This file is generated automaticaly with npx sealgen generate-scss-includes
+
+@import "back/forms/forms.scss";
+@import "back/routes/common/ui/input.scss";
diff --git a/src/main.scss b/src/main.scss
index ef5062b..fdc7ef9 100644
--- a/src/main.scss
+++ b/src/main.scss
@@ -21,7 +21,4 @@ body {
 	align-items: center;
 }
 
-// === Views ===
-
-@import "back/routes/common/ui/input.scss";
-@import "back/forms/forms.scss";
+@import "includes.scss";