From f818f65b057a74522dde6d667b09c97f65830160 Mon Sep 17 00:00:00 2001
From: Mikey Binns <38146638+mikeybinns@users.noreply.github.com>
Date: Mon, 23 Sep 2024 13:12:45 +0100
Subject: [PATCH] convert msw files to TS files

---
 msw/README.md                     | 4 ++--
 msw/mocks/handlers.cjs            | 9 ---------
 msw/mocks/handlers.ts             | 8 ++++++++
 msw/mocks/{index.cjs => index.ts} | 5 ++---
 msw/package.json                  | 3 ++-
 5 files changed, 14 insertions(+), 15 deletions(-)
 delete mode 100644 msw/mocks/handlers.cjs
 create mode 100644 msw/mocks/handlers.ts
 rename msw/mocks/{index.cjs => index.ts} (57%)

diff --git a/msw/README.md b/msw/README.md
index ea9d32e9..0d8ec4e5 100644
--- a/msw/README.md
+++ b/msw/README.md
@@ -21,8 +21,8 @@ You can read more about the use cases of MSW [here](https://mswjs.io/docs/#when-
 
 ## Relevant files
 
-- [mocks](./mocks/index.cjs) - registers the Node HTTP mock server
-- [handlers](./mocks/handlers.cjs) - describes the HTTP mocks
+- [mocks](./mocks/index.ts) - registers the Node HTTP mock server
+- [handlers](./mocks/handlers.ts) - describes the HTTP mocks
 - [package.json](./package.json)
 
 ## Related Links
diff --git a/msw/mocks/handlers.cjs b/msw/mocks/handlers.cjs
deleted file mode 100644
index 67e6918c..00000000
--- a/msw/mocks/handlers.cjs
+++ /dev/null
@@ -1,9 +0,0 @@
-const { http, HttpResponse } = require("msw");
-
-const handlers = [
-  http.get("https://my-mock-api.com", () => {
-    return HttpResponse.json({ message: "from msw" });
-  }),
-];
-
-module.exports = handlers;
diff --git a/msw/mocks/handlers.ts b/msw/mocks/handlers.ts
new file mode 100644
index 00000000..6e7f1b95
--- /dev/null
+++ b/msw/mocks/handlers.ts
@@ -0,0 +1,8 @@
+import type { HttpHandler }  from "msw";
+import { http, HttpResponse }  from "msw";
+
+export const handlers = [
+  http.get("https://my-mock-api.com", () => {
+    return HttpResponse.json({ message: "from msw" });
+  }),
+] satisfies HttpHandler[];
diff --git a/msw/mocks/index.cjs b/msw/mocks/index.ts
similarity index 57%
rename from msw/mocks/index.cjs
rename to msw/mocks/index.ts
index 95b22594..e61d57ab 100644
--- a/msw/mocks/index.cjs
+++ b/msw/mocks/index.ts
@@ -1,6 +1,5 @@
-const { setupServer } = require("msw/node");
-
-const handlers = require("./handlers.cjs");
+import { setupServer } from "msw/node";
+import { handlers } from "./handlers.js";
 
 const server = setupServer(...handlers);
 server.listen({ onUnhandledRequest: "warn" });
diff --git a/msw/package.json b/msw/package.json
index 0c691a6b..3ffbc529 100644
--- a/msw/package.json
+++ b/msw/package.json
@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "build": "remix vite:build",
-    "dev": "binode --require ./mocks/index.cjs -- @remix-run/dev:remix vite:dev",
+    "dev": "binode --import=tsx --import ./mocks/index.ts -- @remix-run/dev:remix vite:dev",
     "lint": "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .",
     "start": "remix-serve ./build/server/index.js",
     "typecheck": "tsc"
@@ -32,6 +32,7 @@
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "msw": "^2.3",
+    "tsx": "^4.19.1",
     "typescript": "^5.1.6",
     "vite": "^5.1.0",
     "vite-tsconfig-paths": "^4.2.1"