Switch to Biome

.adr-dir

@@ -0,0 +1 @@
+doc/architecture/decisions

.node-version

@@ -0,0 +1 @@
+20.11.1

.prettierignore

@@ -0,0 +1 @@
+**

.stylelintrc.json

@@ -1,3 +1,3 @@
 {
-  "extends": ["stylelint-config-standard", "stylelint-config-clean-order"]
+	"extends": ["stylelint-config-standard", "stylelint-config-clean-order"]
 }

.vscode/extensions.json

@@ -0,0 +1,8 @@
+{
+	"recommendations": [
+		"biomejs.biome",
+		"ms-playwright.playwright",
+		"oven.bun-vscode",
+		"statelyai.stately-vscode"
+	]
+}

.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+	"editor.codeActionsOnSave": {
+		"quickfix.biome": "always",
+		"source.organizeImports.biome": "explicit"
+	},
+	"[javascript][typescript][json]": {
+		"editor.defaultFormatter": "biomejs.biome"
+	}
+}

biome.json

@@ -0,0 +1,23 @@
+{
+	"$schema": "https://biomejs.dev/schemas/1.5.3/schema.json",
+	"files": {
+		"ignore": ["**/*.typegen.ts"]
+	},
+	"linter": {
+		"enabled": true,
+		"rules": {
+			"all": true,
+			"nursery": {
+				"all": false
+			}
+		}
+	},
+	"organizeImports": {
+		"enabled": true
+	},
+	"vcs": {
+		"enabled": true,
+		"clientKind": "git",
+		"useIgnoreFile": true
+	}
+}

bunfig.toml

@@ -0,0 +1,2 @@
+[install.lockfile]
+print = "yarn"

client/index.ts

@@ -1,48 +1,49 @@
 import { io } from "socket.io-client";
-import { NameFormElement } from "../server/@types/ui";
 import { Player, Question } from "../server/@types/models";
+import { NameFormElement } from "../server/@types/ui";
 import { getElementById } from "./utils/getElementById";
 
 const addPlayer = async (name: string): Promise<void> => {
-  socket.emit("players:post", { name });
+	socket.emit("players:post", { name });
 };
 
 const generateSocketUrl = (): string => {
-  const location = window.location;
+	const location = window.location;
 
-  return "//" + location.host + location.pathname;
+	return `//${location.host}${location.pathname}`;
 };
 
 const renderPlayerList = (): void => {
-  const html = players.map((name) => `<li>${name}</li>`);
-  playerListElement.innerHTML = html.join("\n");
+	const html = players.map((name) => `<li>${name}</li>`);
+	playerListElement.innerHTML = html.join("\n");
 };
 
 const renderPlayerName = (): void => {
-  const text = `Name: ${player.name}`;
-  playerNameElement.innerText = text;
+	const text = `Name: ${player.name}`;
+	playerNameElement.innerText = text;
 };
 
+// biome-ignore lint/style/useNamingConvention: the issue here is the consecutive upper case characters, but given it's due to using a single-character word, this doesn't feel invalid
 const askAQuestion = (data: Question): void => {
-  const { question, number } = data;
-  const questionHtml = getElementById("question");
-  questionHtml.innerText = question;
-  const numberHtml = getElementById("number");
-  numberHtml.innerText = number.toString();
+	const { question, number } = data;
+	const questionHtml = getElementById("question");
+	questionHtml.innerText = question;
+	const numberHtml = getElementById("number");
+	numberHtml.innerText = number.toString();
 };
 
 const derenderNameForm = (): void => {
-  getElementById("name-form").remove();
+	getElementById("name-form").remove();
 };
 
 const startButton = getElementById("start-button");
 
 const showStartButton = (): void => {
-  startButton.style.display = "block";
+	startButton.style.display = "block";
 };
 
 startButton.addEventListener("click", () => {
-  socket.emit("round:start");
+	socket.emit("round:start");
 });
 
 const connectionStatusIconElement = getElementById("connection-status-icon");
@@ -51,39 +52,39 @@ const playerListElement = getElementById("player-list");
 const playerNameElement = getElementById("player-name");
 
 let player: Player;
-let players: Array<Player> = [];
+let players: Player[] = [];
 
 const socket = io(generateSocketUrl());
 
 socket.on("connect", () => {
-  connectionStatusIconElement.innerText = "Connected 🟢";
+	connectionStatusIconElement.innerText = "Connected 🟢";
 });
 
 socket.on("disconnect", () => {
-  connectionStatusIconElement.innerText = "Disconnected 🔴";
+	connectionStatusIconElement.innerText = "Disconnected 🔴";
 });
 
 socket.on("players:get", (data) => {
-  players = data.players;
-  renderPlayerList();
+	players = data.players;
+	renderPlayerList();
 });
 
 socket.on("player:set", (data) => {
-  player = data.player;
-  renderPlayerName();
-  derenderNameForm();
+	player = data.player;
+	renderPlayerName();
+	derenderNameForm();
 });
 
 socket.on("question:get", (data) => {
-  askAQuestion(data.question);
+	askAQuestion(data.question);
 });
 
 socket.on("game:startable", () => {
-  showStartButton();
+	showStartButton();
 });
 
-nameFormElement.addEventListener("submit", function (e) {
-  e.preventDefault();
-  addPlayer(nameFormElement.elements.name.value);
-  nameFormElement.elements.name.value = "";
+nameFormElement.addEventListener("submit", (e) => {
+	e.preventDefault();
+	addPlayer(nameFormElement.elements.name.value);
+	nameFormElement.elements.name.value = "";
 });

client/utils/getElementById.ts

@@ -1,9 +1,9 @@
 export const getElementById = (id: HTMLElement["id"]): HTMLElement => {
-  const element = document.getElementById(id);
+	const element = document.getElementById(id);
 
-  if (!element) {
-    throw new Error(`No element found with ID: ${id}`);
-  }
+	if (!element) {
+		throw new Error(`No element found with ID: ${id}`);
+	}
 
-  return element;
+	return element;
 };

doc/architecture/decisions/0001-record-architecture-decisions.md

@@ -0,0 +1,19 @@
+# 1. Record architecture decisions
+
+Date: 2023-10-24
+
+## Status
+
+Accepted
+
+## Context
+
+We need to record the architectural decisions made on this project.
+
+## Decision
+
+We will use Architecture Decision Records, as [described by Michael Nygard](http://thinkrelevance.com/blog/2011/11/15/documenting-architecture-decisions).
+
+## Consequences
+
+See Michael Nygard's article, linked above. For a lightweight ADR toolset, see Nat Pryce's [adr-tools](https://github.com/npryce/adr-tools).

docs/decisions/0001-use-bun.md → doc/architecture/decisions/0002-use-bun.md

@@ -1,4 +1,4 @@
-# 1. Use Bun
+# 2. Use Bun
 
 Date: 2023-10-24
 

docs/decisions/0002-use-game-class-to-interact-with-state-machine.md → doc/architecture/decisions/0003-use-game-class-to-interact-with-state-machine.md

@@ -1,4 +1,4 @@
-# 1. Use Game class to interact with state machine
+# 3. Use Game class to interact with state machine
 
 Date: 2023-11-20