ags: add scripts

modules/home/ags/README.md

@@ -17,7 +17,15 @@ bun install
 ### Building
 
 ```bash
-bun run build
+bun comp
+bun watch # rebuilds when files change
+```
+
+### Running
+
+```bash
+bun start
+bun dev # restarts when files change
 ```
 
 ## Acknowledgements

modules/home/ags/assets/.gitignore

@@ -0,0 +1,2 @@
+*
+!.gitignore

modules/home/ags/config.ts

@@ -1,7 +1,7 @@
 import Bar from "./widget/Bar";
+// @ts-ignore
+import style from "./style.scss";
 
 App.addIcons(`${App.configDir}/assets`);
-App.config({
-  windows: [Bar(0)],
-  style: `${App.configDir}/style.css`,
-});
+App.applyCss(style);
+App.config({ windows: [Bar(0)] });

modules/home/ags/default.nix

@@ -19,12 +19,9 @@ in {
           # Copy assets
           cp ${nixos-symbolic} ./assets/nixos-symbolic.svg
 
-          # Build sass
-          sass ./style.scss style.css
-
           # Build bun files
           bun install
-          bun run build
+          bun comp
         '';
 
         installPhase = ''

modules/home/ags/package.json

@@ -1,21 +1,19 @@
 {
   "name": "@bricked/ags-dots",
   "module": "src/index.ts",
-  "type": "module",
   "devDependencies": {
-    "@types/bun": "latest"
+    "@types/bun": "latest",
+    "sass": "^1.72.0"
   },
   "peerDependencies": {
     "typescript": "^5.0.0"
   },
   "scripts": {
     "postinstall": "rm types; ln -s $HOME/.local/share/com.github.Aylur.ags/types types",
-    "build": "bun build:bun & bun build:sass",
-    "build:bun": "bun build ./config.ts --outfile ./config.js --external \"resource://*\" --external \"gi://*\"",
-    "build:sass": "sass style.scss:style.css",
-    "watch": "bun watch:bun & bun watch:sass",
-    "watch:bun": "bun build:bun --watch",
-    "watch:sass": "bun build:sass --watch",
-    "start": "ags --config ./config.js"
-  }
+    "comp": "bun scripts/build.ts",
+    "watch": "bun scripts/watch.ts",
+    "start": "bun scripts/start.ts",
+    "dev": "bun scripts/dev.ts"
+  },
+  "type": "module"
 }

modules/home/ags/scripts/build.ts

@@ -0,0 +1,26 @@
+import type { BuildOutput, BuildConfig as BunBuildConfig } from "bun";
+import sassPlugin from "./sassPlugin";
+import { benchmark } from "./log";
+
+export interface BuildConfig extends Partial<BunBuildConfig> {}
+
+export function build(config?: BuildConfig) {
+  return Bun.build({
+    entrypoints: ["./config.ts"],
+    outdir: ".",
+    external: ["resource://*", "gi://*"],
+    plugins: [sassPlugin],
+    ...config,
+  });
+}
+
+export async function logOutput(output: BuildOutput) {
+  if (output.logs.length) {
+    console.log(output.logs.join("\n"));
+  }
+}
+
+if (import.meta.main) {
+  const output = await benchmark(build(), "build");
+  logOutput(output);
+}

modules/home/ags/scripts/dev.ts

@@ -0,0 +1,15 @@
+import { build, logOutput } from "./build";
+import { watch } from "./watch";
+import { start, restart } from "./start";
+import { benchmark } from "./log";
+
+if (import.meta.main) {
+  const output = await benchmark(build(), "build");
+  logOutput(output);
+  start();
+  for await (const { filename } of watch(`${import.meta.dir}/..`)) {
+    const output = await benchmark(build(), "build", filename!);
+    logOutput(output);
+    restart();
+  }
+}

modules/home/ags/scripts/log.ts

@@ -0,0 +1,20 @@
+export function format(name: string, ...reason: string[]) {
+  return [`\x1b[32m${name}\x1b[0m`, ...reason].join(" ");
+}
+
+export function log(name: string, ...reason: string[]) {
+  console.log(format(name, ...reason));
+}
+
+export async function benchmark(
+  process: Promise<any>,
+  name: string,
+  ...reason: string[]
+) {
+  const message = format(name, ...reason);
+  console.time(message);
+  const result = await process;
+  console.timeEnd(message);
+
+  return result;
+}

modules/home/ags/scripts/sassPlugin.ts

@@ -0,0 +1,18 @@
+import { type BunPlugin } from "bun";
+
+export const sassPlugin: BunPlugin = {
+  name: "Sass",
+  async setup(build) {
+    const { compile } = await import("sass");
+
+    build.onLoad({ filter: /\.(scss|sass)$/ }, (args) => {
+      const result = compile(args.path);
+      return {
+        contents: result.css,
+        loader: "text",
+      };
+    });
+  },
+};
+
+export default sassPlugin;

modules/home/ags/scripts/start.ts

@@ -0,0 +1,20 @@
+import { $ } from "bun";
+import { log } from "./log";
+
+export async function start(configPath = "./config.js") {
+  return await $`ags --config ${configPath} 2> /dev/null`;
+}
+
+export async function stop() {
+  return await $`ags --quit`;
+}
+
+export async function restart(configPath = "./config.js") {
+  await stop();
+  return await start(configPath);
+}
+
+if (import.meta.main) {
+  log("start", "config.js");
+  await start();
+}

modules/home/ags/scripts/watch.ts

@@ -0,0 +1,31 @@
+import { watch as fsWatch } from "fs/promises";
+import { build, logOutput } from "./build";
+import { benchmark } from "./log";
+
+interface WatchConfig {
+  filename?: string | RegExp;
+}
+
+export async function* watch(dirname: string, config?: WatchConfig) {
+  config ??= {};
+  config.filename ??=
+    /^(config\.ts|style\.scss|(widget|service|style|assets)\/.*\.\w+)$/;
+
+  const watcher = fsWatch(dirname, { recursive: true });
+  for await (const event of watcher) {
+    const { filename } = event;
+    if (typeof filename !== "string") continue;
+    if (/\/\d+$/.test(filename)) continue;
+    if (!filename.match(config.filename)) continue;
+    yield event;
+  }
+}
+
+if (import.meta.main) {
+  const output = await benchmark(build(), "build");
+  logOutput(output);
+  for await (const { filename } of watch(`${import.meta.dir}/..`)) {
+    const output = await benchmark(build(), "build", filename!);
+    logOutput(output);
+  }
+}