@auto-engineer/generate-react-client 1.64.0 → 1.65.0

package/dist/starter/public/mockServiceWorker.js

@@ -12,105 +12,105 @@ const INTEGRITY_CHECKSUM = '4db4a41e972cec1b64cc569c66952d82';
 const IS_MOCKED_RESPONSE = Symbol('isMockedResponse');
 const activeClientIds = new Set();
 
-addEventListener('install', function () {
-  self.skipWaiting();
+addEventListener('install', () => {
+	self.skipWaiting();
 });
 
-addEventListener('activate', function (event) {
-  event.waitUntil(self.clients.claim());
+addEventListener('activate', (event) => {
+	event.waitUntil(self.clients.claim());
 });
 
-addEventListener('message', async function (event) {
-  const clientId = Reflect.get(event.source || {}, 'id');
-
-  if (!clientId || !self.clients) {
-    return;
-  }
-
-  const client = await self.clients.get(clientId);
-
-  if (!client) {
-    return;
-  }
-
-  const allClients = await self.clients.matchAll({
-    type: 'window',
-  });
-
-  switch (event.data) {
-    case 'KEEPALIVE_REQUEST': {
-      sendToClient(client, {
-        type: 'KEEPALIVE_RESPONSE',
-      });
-      break;
-    }
-
-    case 'INTEGRITY_CHECK_REQUEST': {
-      sendToClient(client, {
-        type: 'INTEGRITY_CHECK_RESPONSE',
-        payload: {
-          packageVersion: PACKAGE_VERSION,
-          checksum: INTEGRITY_CHECKSUM,
-        },
-      });
-      break;
-    }
-
-    case 'MOCK_ACTIVATE': {
-      activeClientIds.add(clientId);
-
-      sendToClient(client, {
-        type: 'MOCKING_ENABLED',
-        payload: {
-          client: {
-            id: client.id,
-            frameType: client.frameType,
-          },
-        },
-      });
-      break;
-    }
-
-    case 'CLIENT_CLOSED': {
-      activeClientIds.delete(clientId);
-
-      const remainingClients = allClients.filter((client) => {
-        return client.id !== clientId;
-      });
-
-      // Unregister itself when there are no more clients
-      if (remainingClients.length === 0) {
-        self.registration.unregister();
-      }
-
-      break;
-    }
-  }
+addEventListener('message', async (event) => {
+	const clientId = Reflect.get(event.source || {}, 'id');
+
+	if (!clientId || !self.clients) {
+		return;
+	}
+
+	const client = await self.clients.get(clientId);
+
+	if (!client) {
+		return;
+	}
+
+	const allClients = await self.clients.matchAll({
+		type: 'window',
+	});
+
+	switch (event.data) {
+		case 'KEEPALIVE_REQUEST': {
+			sendToClient(client, {
+				type: 'KEEPALIVE_RESPONSE',
+			});
+			break;
+		}
+
+		case 'INTEGRITY_CHECK_REQUEST': {
+			sendToClient(client, {
+				type: 'INTEGRITY_CHECK_RESPONSE',
+				payload: {
+					packageVersion: PACKAGE_VERSION,
+					checksum: INTEGRITY_CHECKSUM,
+				},
+			});
+			break;
+		}
+
+		case 'MOCK_ACTIVATE': {
+			activeClientIds.add(clientId);
+
+			sendToClient(client, {
+				type: 'MOCKING_ENABLED',
+				payload: {
+					client: {
+						id: client.id,
+						frameType: client.frameType,
+					},
+				},
+			});
+			break;
+		}
+
+		case 'CLIENT_CLOSED': {
+			activeClientIds.delete(clientId);
+
+			const remainingClients = allClients.filter((client) => {
+				return client.id !== clientId;
+			});
+
+			// Unregister itself when there are no more clients
+			if (remainingClients.length === 0) {
+				self.registration.unregister();
+			}
+
+			break;
+		}
+	}
 });
 
-addEventListener('fetch', function (event) {
-  const requestInterceptedAt = Date.now();
-
-  // Bypass navigation requests.
-  if (event.request.mode === 'navigate') {
-    return;
-  }
-
-  // Opening the DevTools triggers the "only-if-cached" request
-  // that cannot be handled by the worker. Bypass such requests.
-  if (event.request.cache === 'only-if-cached' && event.request.mode !== 'same-origin') {
-    return;
-  }
-
-  // Bypass all requests when there are no active clients.
-  // Prevents the self-unregistered worked from handling requests
-  // after it's been terminated (still remains active until the next reload).
-  if (activeClientIds.size === 0) {
-    return;
-  }
-
-  const requestId = crypto.randomUUID();
-  event.respondWith(handleRequest(event, requestId, requestInterceptedAt));
+addEventListener('fetch', (event) => {
+	const requestInterceptedAt = Date.now();
+
+	// Bypass navigation requests.
+	if (event.request.mode === 'navigate') {
+		return;
+	}
+
+	// Opening the DevTools triggers the "only-if-cached" request
+	// that cannot be handled by the worker. Bypass such requests.
+	if (event.request.cache === 'only-if-cached' && event.request.mode !== 'same-origin') {
+		return;
+	}
+
+	// Bypass all requests when there are no active clients.
+	// Prevents the self-unregistered worked from handling requests
+	// after it's been terminated (still remains active until the next reload).
+	if (activeClientIds.size === 0) {
+		return;
+	}
+
+	const requestId = crypto.randomUUID();
+	event.respondWith(handleRequest(event, requestId, requestInterceptedAt));
 });
 
 /**
@@ -119,43 +119,43 @@ addEventListener('fetch', function (event) {
  * @param {number} requestInterceptedAt
  */
 async function handleRequest(event, requestId, requestInterceptedAt) {
-  const client = await resolveMainClient(event);
-  const requestCloneForEvents = event.request.clone();
-  const response = await getResponse(event, client, requestId, requestInterceptedAt);
-
-  // Send back the response clone for the "response:*" life-cycle events.
-  // Ensure MSW is active and ready to handle the message, otherwise
-  // this message will pend indefinitely.
-  if (client && activeClientIds.has(client.id)) {
-    const serializedRequest = await serializeRequest(requestCloneForEvents);
-
-    // Clone the response so both the client and the library could consume it.
-    const responseClone = response.clone();
-
-    sendToClient(
-      client,
-      {
-        type: 'RESPONSE',
-        payload: {
-          isMockedResponse: IS_MOCKED_RESPONSE in response,
-          request: {
-            id: requestId,
-            ...serializedRequest,
-          },
-          response: {
-            type: responseClone.type,
-            status: responseClone.status,
-            statusText: responseClone.statusText,
-            headers: Object.fromEntries(responseClone.headers.entries()),
-            body: responseClone.body,
-          },
-        },
-      },
-      responseClone.body ? [serializedRequest.body, responseClone.body] : [],
-    );
-  }
-
-  return response;
+	const client = await resolveMainClient(event);
+	const requestCloneForEvents = event.request.clone();
+	const response = await getResponse(event, client, requestId, requestInterceptedAt);
+
+	// Send back the response clone for the "response:*" life-cycle events.
+	// Ensure MSW is active and ready to handle the message, otherwise
+	// this message will pend indefinitely.
+	if (client && activeClientIds.has(client.id)) {
+		const serializedRequest = await serializeRequest(requestCloneForEvents);
+
+		// Clone the response so both the client and the library could consume it.
+		const responseClone = response.clone();
+
+		sendToClient(
+			client,
+			{
+				type: 'RESPONSE',
+				payload: {
+					isMockedResponse: IS_MOCKED_RESPONSE in response,
+					request: {
+						id: requestId,
+						...serializedRequest,
+					},
+					response: {
+						type: responseClone.type,
+						status: responseClone.status,
+						statusText: responseClone.statusText,
+						headers: Object.fromEntries(responseClone.headers.entries()),
+						body: responseClone.body,
+					},
+				},
+			},
+			responseClone.body ? [serializedRequest.body, responseClone.body] : [],
+		);
+	}
+
+	return response;
 }
 
 /**
@@ -167,30 +167,30 @@ async function handleRequest(event, requestId, requestInterceptedAt) {
  * @returns {Promise<Client | undefined>}
  */
 async function resolveMainClient(event) {
-  const client = await self.clients.get(event.clientId);
-
-  if (activeClientIds.has(event.clientId)) {
-    return client;
-  }
-
-  if (client?.frameType === 'top-level') {
-    return client;
-  }
-
-  const allClients = await self.clients.matchAll({
-    type: 'window',
-  });
-
-  return allClients
-    .filter((client) => {
-      // Get only those clients that are currently visible.
-      return client.visibilityState === 'visible';
-    })
-    .find((client) => {
-      // Find the client ID that's recorded in the
-      // set of clients that have registered the worker.
-      return activeClientIds.has(client.id);
-    });
+	const client = await self.clients.get(event.clientId);
+
+	if (activeClientIds.has(event.clientId)) {
+		return client;
+	}
+
+	if (client?.frameType === 'top-level') {
+		return client;
+	}
+
+	const allClients = await self.clients.matchAll({
+		type: 'window',
+	});
+
+	return allClients
+		.filter((client) => {
+			// Get only those clients that are currently visible.
+			return client.visibilityState === 'visible';
+		})
+		.find((client) => {
+			// Find the client ID that's recorded in the
+			// set of clients that have registered the worker.
+			return activeClientIds.has(client.id);
+		});
 }
 
 /**
@@ -201,72 +201,72 @@ async function resolveMainClient(event) {
  * @returns {Promise<Response>}
  */
 async function getResponse(event, client, requestId, requestInterceptedAt) {
-  // Clone the request because it might've been already used
-  // (i.e. its body has been read and sent to the client).
-  const requestClone = event.request.clone();
-
-  function passthrough() {
-    // Cast the request headers to a new Headers instance
-    // so the headers can be manipulated with.
-    const headers = new Headers(requestClone.headers);
-
-    // Remove the "accept" header value that marked this request as passthrough.
-    // This prevents request alteration and also keeps it compliant with the
-    // user-defined CORS policies.
-    const acceptHeader = headers.get('accept');
-    if (acceptHeader) {
-      const values = acceptHeader.split(',').map((value) => value.trim());
-      const filteredValues = values.filter((value) => value !== 'msw/passthrough');
-
-      if (filteredValues.length > 0) {
-        headers.set('accept', filteredValues.join(', '));
-      } else {
-        headers.delete('accept');
-      }
-    }
-
-    return fetch(requestClone, { headers });
-  }
-
-  // Bypass mocking when the client is not active.
-  if (!client) {
-    return passthrough();
-  }
-
-  // Bypass initial page load requests (i.e. static assets).
-  // The absence of the immediate/parent client in the map of the active clients
-  // means that MSW hasn't dispatched the "MOCK_ACTIVATE" event yet
-  // and is not ready to handle requests.
-  if (!activeClientIds.has(client.id)) {
-    return passthrough();
-  }
-
-  // Notify the client that a request has been intercepted.
-  const serializedRequest = await serializeRequest(event.request);
-  const clientMessage = await sendToClient(
-    client,
-    {
-      type: 'REQUEST',
-      payload: {
-        id: requestId,
-        interceptedAt: requestInterceptedAt,
-        ...serializedRequest,
-      },
-    },
-    [serializedRequest.body],
-  );
-
-  switch (clientMessage.type) {
-    case 'MOCK_RESPONSE': {
-      return respondWithMock(clientMessage.data);
-    }
-
-    case 'PASSTHROUGH': {
-      return passthrough();
-    }
-  }
-
-  return passthrough();
+	// Clone the request because it might've been already used
+	// (i.e. its body has been read and sent to the client).
+	const requestClone = event.request.clone();
+
+	function passthrough() {
+		// Cast the request headers to a new Headers instance
+		// so the headers can be manipulated with.
+		const headers = new Headers(requestClone.headers);
+
+		// Remove the "accept" header value that marked this request as passthrough.
+		// This prevents request alteration and also keeps it compliant with the
+		// user-defined CORS policies.
+		const acceptHeader = headers.get('accept');
+		if (acceptHeader) {
+			const values = acceptHeader.split(',').map((value) => value.trim());
+			const filteredValues = values.filter((value) => value !== 'msw/passthrough');
+
+			if (filteredValues.length > 0) {
+				headers.set('accept', filteredValues.join(', '));
+			} else {
+				headers.delete('accept');
+			}
+		}
+
+		return fetch(requestClone, { headers });
+	}
+
+	// Bypass mocking when the client is not active.
+	if (!client) {
+		return passthrough();
+	}
+
+	// Bypass initial page load requests (i.e. static assets).
+	// The absence of the immediate/parent client in the map of the active clients
+	// means that MSW hasn't dispatched the "MOCK_ACTIVATE" event yet
+	// and is not ready to handle requests.
+	if (!activeClientIds.has(client.id)) {
+		return passthrough();
+	}
+
+	// Notify the client that a request has been intercepted.
+	const serializedRequest = await serializeRequest(event.request);
+	const clientMessage = await sendToClient(
+		client,
+		{
+			type: 'REQUEST',
+			payload: {
+				id: requestId,
+				interceptedAt: requestInterceptedAt,
+				...serializedRequest,
+			},
+		},
+		[serializedRequest.body],
+	);
+
+	switch (clientMessage.type) {
+		case 'MOCK_RESPONSE': {
+			return respondWithMock(clientMessage.data);
+		}
+
+		case 'PASSTHROUGH': {
+			return passthrough();
+		}
+	}
+
+	return passthrough();
 }
 
 /**
@@ -276,19 +276,19 @@ async function getResponse(event, client, requestId, requestInterceptedAt) {
  * @returns {Promise<any>}
  */
 function sendToClient(client, message, transferrables = []) {
-  return new Promise((resolve, reject) => {
-    const channel = new MessageChannel();
+	return new Promise((resolve, reject) => {
+		const channel = new MessageChannel();
 
-    channel.port1.onmessage = (event) => {
-      if (event.data && event.data.error) {
-        return reject(event.data.error);
-      }
+		channel.port1.onmessage = (event) => {
+			if (event.data?.error) {
+				return reject(event.data.error);
+			}
 
-      resolve(event.data);
-    };
+			resolve(event.data);
+		};
 
-    client.postMessage(message, [channel.port2, ...transferrables.filter(Boolean)]);
-  });
+		client.postMessage(message, [channel.port2, ...transferrables.filter(Boolean)]);
+	});
 }
 
 /**
@@ -296,41 +296,41 @@ function sendToClient(client, message, transferrables = []) {
  * @returns {Response}
  */
 function respondWithMock(response) {
-  // Setting response status code to 0 is a no-op.
-  // However, when responding with a "Response.error()", the produced Response
-  // instance will have status code set to 0. Since it's not possible to create
-  // a Response instance with status code 0, handle that use-case separately.
-  if (response.status === 0) {
-    return Response.error();
-  }
-
-  const mockedResponse = new Response(response.body, response);
-
-  Reflect.defineProperty(mockedResponse, IS_MOCKED_RESPONSE, {
-    value: true,
-    enumerable: true,
-  });
-
-  return mockedResponse;
+	// Setting response status code to 0 is a no-op.
+	// However, when responding with a "Response.error()", the produced Response
+	// instance will have status code set to 0. Since it's not possible to create
+	// a Response instance with status code 0, handle that use-case separately.
+	if (response.status === 0) {
+		return Response.error();
+	}
+
+	const mockedResponse = new Response(response.body, response);
+
+	Reflect.defineProperty(mockedResponse, IS_MOCKED_RESPONSE, {
+		value: true,
+		enumerable: true,
+	});
+
+	return mockedResponse;
 }
 
 /**
  * @param {Request} request
  */
 async function serializeRequest(request) {
-  return {
-    url: request.url,
-    mode: request.mode,
-    method: request.method,
-    headers: Object.fromEntries(request.headers.entries()),
-    cache: request.cache,
-    credentials: request.credentials,
-    destination: request.destination,
-    integrity: request.integrity,
-    redirect: request.redirect,
-    referrer: request.referrer,
-    referrerPolicy: request.referrerPolicy,
-    body: await request.arrayBuffer(),
-    keepalive: request.keepalive,
-  };
+	return {
+		url: request.url,
+		mode: request.mode,
+		method: request.method,
+		headers: Object.fromEntries(request.headers.entries()),
+		cache: request.cache,
+		credentials: request.credentials,
+		destination: request.destination,
+		integrity: request.integrity,
+		redirect: request.redirect,
+		referrer: request.referrer,
+		referrerPolicy: request.referrerPolicy,
+		body: await request.arrayBuffer(),
+		keepalive: request.keepalive,
+	};
 }

package/dist/starter/scripts/build-component-db.ts

@@ -1,16 +1,16 @@
-import { writeFileSync, mkdirSync } from "node:fs";
-import { mkdir, writeFile } from "node:fs/promises";
-import { dirname, resolve } from "node:path";
-import { fileURLToPath } from "node:url";
-import { parseArgs } from "node:util";
-import { uploadFile } from "@auto-engineer/file-upload";
+import { mkdirSync, writeFileSync } from 'node:fs';
+import { mkdir, writeFile } from 'node:fs/promises';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { parseArgs } from 'node:util';
+import { uploadFile } from '@auto-engineer/file-upload';
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
-const OUTPUT_DIR = resolve(__dirname, "../../.context");
-const OUTPUT_FILE = resolve(OUTPUT_DIR, "components-db.json");
+const OUTPUT_DIR = resolve(__dirname, '../../.context');
+const OUTPUT_FILE = resolve(OUTPUT_DIR, 'components-db.json');
 
 const { values } = parseArgs({
-	options: { port: { type: "string", default: "6006" } },
+	options: { port: { type: 'string', default: '6006' } },
 });
 const PORT = Number(values.port);
 
@@ -58,8 +58,7 @@ async function checkStorybookRunning(port: number): Promise<void> {
 	for (let attempt = 0; attempt <= delays.length; attempt++) {
 		try {
 			const response = await fetch(`http://localhost:${port}`);
-			if (!response.ok)
-				throw new Error("Storybook responded with non-OK status");
+			if (!response.ok) throw new Error('Storybook responded with non-OK status');
 			return;
 		} catch {
 			if (attempt === delays.length) {
@@ -79,15 +78,14 @@ async function fetchWithRetry<T>(url: string, maxAttempts = 3): Promise<T> {
 	for (let attempt = 1; attempt <= maxAttempts; attempt++) {
 		try {
 			const res = await fetch(url);
-			if (!res.ok)
-				throw new Error(`${url} responded with status ${res.status}`);
+			if (!res.ok) throw new Error(`${url} responded with status ${res.status}`);
 			return await res.json();
 		} catch (err) {
 			if (attempt === maxAttempts) throw err;
 			await new Promise((r) => setTimeout(r, 1000));
 		}
 	}
-	throw new Error("unreachable");
+	throw new Error('unreachable');
 }
 
 function merge(componentsJson: ComponentsManifest, indexJson: IndexJson) {
@@ -97,13 +95,12 @@ function merge(componentsJson: ComponentsManifest, indexJson: IndexJson) {
 	const docsByComponent = new Map<string, IndexEntry>();
 
 	for (const entry of Object.values(entries)) {
-		const componentId = entry.id.replace(/--.*$/, "");
+		const componentId = entry.id.replace(/--.*$/, '');
 
-		if (entry.type === "docs") {
+		if (entry.type === 'docs') {
 			docsByComponent.set(componentId, entry);
 		} else {
-			if (!storysByComponent.has(componentId))
-				storysByComponent.set(componentId, []);
+			if (!storysByComponent.has(componentId)) storysByComponent.set(componentId, []);
 			storysByComponent.get(componentId)!.push(entry);
 		}
 	}
@@ -153,14 +150,14 @@ const [componentsJson, indexJson] = await Promise.all([
 
 const merged = merge(componentsJson, indexJson);
 
-const json = JSON.stringify(merged, null, 2) + "\n";
+const json = `${JSON.stringify(merged, null, 2)}\n`;
 
 mkdirSync(OUTPUT_DIR, { recursive: true });
 writeFileSync(OUTPUT_FILE, json);
 
 console.log(`Wrote ${merged.length} components to ${OUTPUT_FILE}`);
 
-await uploadFile(".context/components-db.json", new TextEncoder().encode(json), {
+await uploadFile('.context/components-db.json', new TextEncoder().encode(json), {
 	uploadUrl: process.env.FILE_UPLOAD_URL,
 	prefix: process.env.FILE_UPLOAD_PREFIX,
 	signerUrl: process.env.UPLOAD_SIGNER_URL,