Sync branch to template

build/esbuild-build.ts

@@ -0,0 +1,33 @@
+import esbuild from "esbuild";
+const typescriptEntries = ["static/main.ts"];
+// const cssEntries = ["static/style.css"];
+const entries = [
+  ...typescriptEntries,
+  //  ...cssEntries
+];
+
+export const esBuildContext: esbuild.BuildOptions = {
+  sourcemap: true,
+  entryPoints: entries,
+  bundle: true,
+  minify: false,
+  loader: {
+    ".png": "dataurl",
+    ".woff": "dataurl",
+    ".woff2": "dataurl",
+    ".eot": "dataurl",
+    ".ttf": "dataurl",
+    ".svg": "dataurl",
+  },
+  outdir: "static/dist",
+};
+
+esbuild
+  .build(esBuildContext)
+  .then(() => {
+    console.log("\tesbuild complete");
+  })
+  .catch((err) => {
+    console.error(err);
+    process.exit(1);
+  });

build/esbuild-server.ts

@@ -0,0 +1,18 @@
+import esbuild from "esbuild";
+import { esBuildContext } from "./esbuild-build";
+
+(async () => {
+  await server();
+})().catch((error) => {
+  console.error("Unhandled error:", error);
+  process.exit(1);
+});
+
+export async function server() {
+  const _context = await esbuild.context(esBuildContext);
+  const { port } = await _context.serve({
+    servedir: "static",
+    port: 8080,
+  });
+  console.log(`http://localhost:${port}`);
+}

build/index.ts

@@ -0,0 +1,4 @@
+import * as dotenv from "dotenv";
+// load environment variables (if you have them)
+dotenv.config();
+console.log("Welcome to ts-template");

cypress.config.ts

@@ -0,0 +1,11 @@
+import { defineConfig } from "cypress";
+
+export default defineConfig({
+  e2e: {
+    setupNodeEvents() {
+      // implement node event listeners here
+    },
+    experimentalStudio: true,
+    baseUrl: "http://localhost:8080",
+  },
+});

cypress/e2e/main.cy.ts

@@ -0,0 +1,12 @@
+describe("Homepage tests", () => {
+  it("Console is cleared of errors and warnings", () => {
+    cy.visit("/", {
+      onBeforeLoad(win) {
+        cy.stub(win.console, "error").as("consoleError");
+      },
+    });
+    cy.get("@consoleError").should("not.be.called");
+    cy.get("body").should("exist");
+    cy.get("h1").should("exist");
+  });
+});

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "[email protected]",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

cypress/support/commands.ts

@@ -0,0 +1,37 @@
+/// <reference types="cypress" />
+// ***********************************************
+// This example commands.ts shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+//
+// declare global {
+//   namespace Cypress {
+//     interface Chainable {
+//       login(email: string, password: string): Chainable<void>
+//       drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
+//     }
+//   }
+// }

cypress/support/e2e.ts

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/e2e.ts is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import "./commands";
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

package.json

@@ -1,72 +1,81 @@
 {
-  "name": "@ubiquity-dao/ubiquibot-logger",
-  "version": "1.3.0",
-  "description": "Ubiquity logging module with Supabase support.",
+  "name": "ts-template",
+  "version": "1.0.0",
+  "description": "Template repository with TypeScript support.",
+  "main": "build/index.ts",
   "author": "Ubiquity DAO",
   "license": "MIT",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "type": "module",
-  "exports": {
-    ".": {
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    }
+  "engines": {
+    "node": ">=20.10.0"
   },
-  "files": [
-    "dist/*"
-  ],
   "scripts": {
-    "build": "tsup",
-    "prepare": "husky install",
-    "format": "run-s format:*",
+    "start": "tsx build/esbuild-server.ts",
+    "build": "tsx build/esbuild-build.ts",
+    "format": "run-s format:lint format:prettier format:cspell",
+    "format:lint": "eslint --fix .",
     "format:prettier": "prettier --write .",
-    "format:eslint": "eslint --fix .",
-    "test": "jest"
+    "format:cspell": "cspell **/*",
+    "knip": "knip --config .github/knip.ts",
+    "knip-ci": "knip --no-exit-code --reporter json --config .github/knip.ts",
+    "prepare": "husky install",
+    "test": "jest --setupFiles dotenv/config --coverage",
+    "cy:open": "cypress open",
+    "cy:run": "cypress run"
   },
   "keywords": [
     "typescript",
-    "logging",
-    "supabase",
+    "template",
     "dao",
     "ubiquity",
     "open-source"
   ],
-  "dependencies": {},
+  "dependencies": {
+    "dotenv": "^16.4.4"
+  },
   "devDependencies": {
-    "@commitlint/cli": "^18.4.3",
-    "@commitlint/config-conventional": "^18.4.3",
-    "@types/jest": "^29.5.12",
-    "@types/node": "^20.10.4",
-    "@typescript-eslint/eslint-plugin": "^7.14.1",
-    "@typescript-eslint/parser": "^7.14.1",
-    "esbuild": "^0.19.8",
-    "eslint": "^8.54.0",
+    "@commitlint/cli": "^18.6.1",
+    "@commitlint/config-conventional": "^18.6.2",
+    "@cspell/dict-node": "^4.0.3",
+    "@cspell/dict-software-terms": "^3.3.18",
+    "@cspell/dict-typescript": "^3.1.2",
+    "@jest/globals": "29.7.0",
+    "@mswjs/data": "0.16.1",
+    "@types/jest": "29.5.12",
+    "@types/node": "^20.11.19",
+    "@typescript-eslint/eslint-plugin": "^7.0.1",
+    "@typescript-eslint/parser": "^7.0.1",
+    "cspell": "^8.4.0",
+    "cypress": "13.6.6",
+    "esbuild": "^0.20.1",
+    "eslint": "^8.56.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-filename-rules": "^1.3.1",
+    "eslint-plugin-prettier": "^5.1.3",
     "eslint-plugin-sonarjs": "^0.24.0",
-    "husky": "^8.0.3",
-    "jest": "^29.7.0",
-    "jest-junit": "^16.0.0",
-    "jest-md-dashboard": "^0.8.0",
-    "knip": "^3.3.0",
-    "lint-staged": "^15.1.0",
+    "husky": "^9.0.11",
+    "jest": "29.7.0",
+    "jest-junit": "16.0.0",
+    "jest-md-dashboard": "0.8.0",
+    "knip": "^5.0.1",
+    "lint-staged": "^15.2.2",
     "npm-run-all": "^4.1.5",
-    "prettier": "^3.1.0",
-    "ts-jest": "^29.1.5",
-    "ts-node": "^10.9.2",
-    "tsup": "^7.2.0",
-    "tsx": "^4.6.0",
-    "typescript": "^5.5.2"
+    "prettier": "^3.2.5",
+    "ts-jest": "29.1.2",
+    "tsx": "^4.7.1",
+    "typescript": "^5.3.3"
   },
   "lint-staged": {
     "*.ts": [
       "yarn prettier --write",
       "eslint --fix"
+    ],
+    "src/**.{ts,json}": [
+      "cspell"
     ]
   },
   "commitlint": {
     "extends": [
       "@commitlint/config-conventional"
     ]
-  },
-  "packageManager": "[email protected]"
+  }
 }

static/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Ubiquity TypeScript Template</title>
+    <link rel="stylesheet" href="style.css" />
+  </head>
+  <body>
+    <h1>Ubiquity TypeScript Template</h1>
+    <script type="module" src="dist/main.js"></script>
+  </body>
+</html>

static/main.ts

@@ -0,0 +1,11 @@
+export async function mainModule() {
+  console.log(`Hello from mainModule`);
+}
+
+mainModule()
+  .then(() => {
+    console.log("mainModule loaded");
+  })
+  .catch((error) => {
+    console.error(error);
+  });

static/style.css

@@ -0,0 +1,16 @@
+body {
+  font-family: "Proxima Nova", "Ubiquity Nova", sans-serif;
+  background-color: #06061aff;
+  color: #fff;
+  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABYWlDQ1BrQ0dDb2xvclNwYWNlRGlzcGxheVAzAAAokWNgYFJJLCjIYWFgYMjNKykKcndSiIiMUmB/yMAOhLwMYgwKicnFBY4BAT5AJQwwGhV8u8bACKIv64LMOiU1tUm1XsDXYqbw1YuvRJsw1aMArpTU4mQg/QeIU5MLikoYGBhTgGzl8pICELsDyBYpAjoKyJ4DYqdD2BtA7CQI+whYTUiQM5B9A8hWSM5IBJrB+API1klCEk9HYkPtBQFul8zigpzESoUAYwKuJQOUpFaUgGjn/ILKosz0jBIFR2AopSp45iXr6SgYGRiaMzCAwhyi+nMgOCwZxc4gxJrvMzDY7v////9uhJjXfgaGjUCdXDsRYhoWDAyC3AwMJ3YWJBYlgoWYgZgpLY2B4dNyBgbeSAYG4QtAPdHFacZGYHlGHicGBtZ7//9/VmNgYJ/MwPB3wv//vxf9//93MVDzHQaGA3kAFSFl7jXH0fsAAAA4ZVhJZk1NACoAAAAIAAGHaQAEAAAAAQAAABoAAAAAAAKgAgAEAAAAAQAAABigAwAEAAAAAQAAABgAAAAAwf1XlwAAACNJREFUSA3t0IEAAAAMBKFHm7/UTaQQWnXDgAEDBgwYMGDgAXaJAz4RVVHYAAAAAElFTkSuQmCC");
+}
+@font-face {
+  font-family: "Ubiquity Nova";
+  font-style: normal;
+  font-weight: 400;
+  src: url(./fonts/ubiquity-nova-standard.eot);
+  src:
+    url(./fonts/ubiquity-nova-standard.eot#iefix) format("embedded-opentype"),
+    url(./fonts/ubiquity-nova-standard.woff) format("woff"),
+    url(./fonts/ubiquity-nova-standard.ttf) format("truetype");
+}

tests/__mocks__/db.ts

@@ -0,0 +1,12 @@
+// cSpell:disable
+import { factory, primaryKey } from "@mswjs/data";
+
+/**
+ * Creates an object that can be used as a db to persist data within tests
+ */
+export const db = factory({
+  users: {
+    id: primaryKey(Number),
+    name: String,
+  },
+});

tests/__mocks__/handlers.ts

@@ -0,0 +1,11 @@
+import { http, HttpResponse } from "msw";
+import { db } from "./db";
+
+/**
+ * Intercepts the routes and returns a custom payload
+ */
+export const handlers = [
+  http.get("https://api.ubiquity.com/users", () => {
+    return HttpResponse.json(db.users.getAll());
+  }),
+];

tests/__mocks__/node.ts

@@ -0,0 +1,4 @@
+import { setupServer } from "msw/node";
+import { handlers } from "./handlers";
+
+export const server = setupServer(...handlers);

tests/__mocks__/users-get.json

@@ -0,0 +1,10 @@
+[
+  {
+    "id": 1,
+    "name": "user1"
+  },
+  {
+    "id": 2,
+    "name": "user2"
+  }
+]

tests/main.test.ts

@@ -0,0 +1,24 @@
+import { mainModule } from "../static/main";
+import { db } from "./__mocks__/db";
+import { server } from "./__mocks__/node";
+import usersGet from "./__mocks__/users-get.json";
+import { expect, describe, beforeAll, beforeEach, afterAll, afterEach, it } from "@jest/globals";
+
+beforeAll(() => server.listen());
+afterEach(() => server.resetHandlers());
+afterAll(() => server.close());
+
+describe("User tests", () => {
+  beforeEach(() => {
+    for (const item of usersGet) {
+      db.users.create(item);
+    }
+  });
+
+  it("Should fetch all the users", async () => {
+    const res = await fetch("https://api.ubiquity.com/users");
+    const data = await res.json();
+    expect(data).toMatchObject(usersGet);
+    expect(async () => await mainModule()).not.toThrow();
+  });
+});