@thepassle/app-tools 1.0.0 → 1.0.1

package/api/index.js

@@ -1,5 +1,5 @@
-import { createLogger } from '../utils/log.js';
-const log = createLogger('api');
+import { createLogger } from "../utils/log.js";
+const log = createLogger("api");
 
 class StatusError extends Error {
   constructor(response) {
@@ -10,7 +10,7 @@ class StatusError extends Error {
 
 function handleStatus(response) {
   if (!response.ok) {
-    log('Response not ok', response);
+    log("Response not ok", response);
     throw new StatusError(response);
   }
   return response;
@@ -24,7 +24,7 @@ function handleStatus(response) {
 /** @typedef {import('./types.js').MetaParams} MetaParams */
 
 /**
- * @example 
+ * @example
  * const api = new Api({
  *  baseURL: 'https://api.foo.com/',
  *  responseType: 'text',
@@ -39,130 +39,168 @@ function handleStatus(response) {
 export class Api {
   /** @param {Config} config */
   constructor(config = {}) {
-    this.config = { 
+    this.config = {
       plugins: [],
-      responseType: 'json',
-      ...config 
+      responseType: "json",
+      ...config,
     };
   }
 
   /**
-   * @param {string} url 
-   * @param {Method} method 
-   * @param {RequestOptions} [opts] 
+   * @param {string} url
+   * @param {Method} method
+   * @param {RequestOptions} [opts]
    * @param {object} [data]
-   * @returns 
+   * @returns
    */
   async fetch(url, method, opts, data) {
     const plugins = [...this.config.plugins, ...(opts?.plugins || [])];
 
     let fetchFn = globalThis.fetch;
-    let baseURL = opts?.baseURL ?? this.config?.baseURL ?? '';
+    let baseURL = opts?.baseURL ?? this.config?.baseURL ?? "";
     let responseType = opts?.responseType ?? this.config.responseType;
     let headers = new Headers({
-      'Content-Type': 'application/json',
-      ...opts?.headers
+      "Content-Type": "application/json",
+      ...opts?.headers,
     });
 
-    if(baseURL) {
-      url = url.replace(/^(?!.*\/\/)\/?/, baseURL + '/');
+    if (baseURL) {
+      url = url.replace(/^(?!.*\/\/)\/?/, baseURL + "/");
     }
 
-    if(opts?.params) {
-      url += `${(~url.indexOf('?') ? '&' : '?')}${new URLSearchParams(opts.params)}`;
+    if (opts?.params) {
+      url += `${~url.indexOf("?") ? "&" : "?"}${new URLSearchParams(opts.params)}`;
     }
 
-    for(const plugin of plugins) {
+    for (const plugin of plugins) {
       try {
-        const overrides = await plugin?.beforeFetch?.({ responseType, headers, fetchFn, baseURL, url, method, opts, data });
-        if(overrides) {
-          ({ responseType, headers, fetchFn, baseURL, url, method, opts, data } = {...overrides});
+        const overrides = await plugin?.beforeFetch?.({
+          responseType,
+          headers,
+          fetchFn,
+          baseURL,
+          url,
+          method,
+          opts,
+          data,
+        });
+        if (overrides) {
+          ({
+            responseType,
+            headers,
+            fetchFn,
+            baseURL,
+            url,
+            method,
+            opts,
+            data,
+          } = { ...overrides });
         }
-      } catch(e) {
+      } catch (e) {
         log(`Plugin "${plugin.name}" error on afterFetch hook`);
         throw e;
       }
     }
 
-    log(`Fetching ${method} ${url}`, { 
-      responseType, 
+    log(`Fetching ${method} ${url}`, {
+      responseType,
       // @ts-ignore
-      headers: Object.fromEntries(headers), 
-      fetchFn, 
-      baseURL, 
-      url, 
-      method, 
-      opts, 
-      data 
-    });
-    return fetchFn(url, {
+      headers: Object.fromEntries(headers),
+      fetchFn,
+      baseURL,
+      url,
       method,
-      headers,
-      ...(data ? { body: JSON.stringify(data) } : {}),
-      ...(opts?.mode ? { mode: opts.mode } : {}),
-      ...(opts?.credentials ? { credentials: opts.credentials } : {}),
-      ...(opts?.cache ? { cache: opts.cache } : {}),
-      ...(opts?.redirect ? { redirect: opts.redirect } : {}),
-      ...(opts?.referrer ? { referrer: opts.referrer } : {}),
-      ...(opts?.referrerPolicy ? { referrerPolicy: opts.referrerPolicy } : {}),
-      ...(opts?.integrity ? { integrity: opts.integrity } : {}),
-      ...(opts?.keepalive ? { keepalive: opts.keepalive } : {}),
-      ...(opts?.signal ? { signal: opts.signal } : {}),
-    })
-    /** [PLUGINS - AFTERFETCH] */
-    .then(async res => {
-      for(const plugin of plugins) {
-        try {
-          const afterFetchResult = await plugin?.afterFetch?.(res) ?? res;
-          if(afterFetchResult) {
-            res = afterFetchResult;
-          }
-        } catch(e) {
-          log(`Plugin "${plugin.name}" error on afterFetch hook`)
-          throw e;
-        }
-      }
-      
-      return res;
-    })
-    /** [STATUS] */
-    .then(handleStatus)
-    /** [RESPONSETYPE] */
-    .then(res => res[responseType]())
-    .then(async data => {
-      for(const plugin of plugins) {
-        try {
-          data = await plugin?.transform?.(data) ?? data;
-        } catch(e) {
-          log(`Plugin "${plugin.name}" error on transform hook`)
-          throw e;
-        }
-      }
-      log(`Fetch successful ${method} ${url}`, data);
-      return data;
-    })
-    /** [PLUGINS - HANDLEERROR] */
-    .catch(async e => {
-      log(`Fetch failed ${method} ${url}`, e);
-      const shouldThrow = plugins.length === 0 || (await Promise.all(plugins.map(({ handleError }) => handleError?.(e) ?? true))).every(_ => !!_);
-      if(shouldThrow) throw e;
+      opts,
+      data,
     });
+    return (
+      fetchFn(url, {
+        method,
+        headers,
+        ...(data ? { body: JSON.stringify(data) } : {}),
+        ...(opts?.mode ? { mode: opts.mode } : {}),
+        ...(opts?.credentials ? { credentials: opts.credentials } : {}),
+        ...(opts?.cache ? { cache: opts.cache } : {}),
+        ...(opts?.redirect ? { redirect: opts.redirect } : {}),
+        ...(opts?.referrer ? { referrer: opts.referrer } : {}),
+        ...(opts?.referrerPolicy
+          ? { referrerPolicy: opts.referrerPolicy }
+          : {}),
+        ...(opts?.integrity ? { integrity: opts.integrity } : {}),
+        ...(opts?.keepalive ? { keepalive: opts.keepalive } : {}),
+        ...(opts?.signal ? { signal: opts.signal } : {}),
+      })
+        /** [PLUGINS - AFTERFETCH] */
+        .then(async (res) => {
+          for (const plugin of plugins) {
+            try {
+              const afterFetchResult =
+                (await plugin?.afterFetch?.(res, {
+                  responseType,
+                  headers,
+                  fetchFn,
+                  baseURL,
+                  url,
+                  method,
+                  opts,
+                  data,
+                })) ?? res;
+              if (afterFetchResult) {
+                res = afterFetchResult;
+              }
+            } catch (e) {
+              log(`Plugin "${plugin.name}" error on afterFetch hook`);
+              throw e;
+            }
+          }
+
+          return res;
+        })
+        /** [STATUS] */
+        .then(handleStatus)
+        /** [RESPONSETYPE] */
+        .then((res) => res[responseType]())
+        .then(async (data) => {
+          for (const plugin of plugins) {
+            try {
+              data = (await plugin?.transform?.(data)) ?? data;
+            } catch (e) {
+              log(`Plugin "${plugin.name}" error on transform hook`);
+              throw e;
+            }
+          }
+          log(`Fetch successful ${method} ${url}`, data);
+          return data;
+        })
+        /** [PLUGINS - HANDLEERROR] */
+        .catch(async (e) => {
+          log(`Fetch failed ${method} ${url}`, e);
+          const shouldThrow =
+            plugins.length === 0 ||
+            (
+              await Promise.all(
+                plugins.map(({ handleError }) => handleError?.(e) ?? true),
+              )
+            ).every((_) => !!_);
+          if (shouldThrow) throw e;
+        })
+    );
   }
 
   /** @type {import('./types.js').BodylessMethod} */
-  get = (url, opts) => this.fetch(url, 'GET', opts);
+  get = (url, opts) => this.fetch(url, "GET", opts);
   /** @type {import('./types.js').BodylessMethod} */
-  options = (url, opts) => this.fetch(url, 'OPTIONS', opts);
+  options = (url, opts) => this.fetch(url, "OPTIONS", opts);
   /** @type {import('./types.js').BodylessMethod} */
-  delete = (url, opts) => this.fetch(url, 'DELETE', opts);
+  delete = (url, opts) => this.fetch(url, "DELETE", opts);
   /** @type {import('./types.js').BodylessMethod} */
-  head = (url, opts) => this.fetch(url, 'HEAD', opts);
+  head = (url, opts) => this.fetch(url, "HEAD", opts);
   /** @type {import('./types.js').BodyMethod} */
-  post = (url, data, opts) => this.fetch(url, 'POST', opts, data);
+  post = (url, data, opts) => this.fetch(url, "POST", opts, data);
   /** @type {import('./types.js').BodyMethod} */
-  put = (url, data, opts) => this.fetch(url, 'PUT', opts, data);
+  put = (url, data, opts) => this.fetch(url, "PUT", opts, data);
   /** @type {import('./types.js').BodyMethod} */
-  patch = (url, data, opts) => this.fetch(url, 'PATCH', opts, data);
+  patch = (url, data, opts) => this.fetch(url, "PATCH", opts, data);
 }
 
-export const api = new Api();
+export const api = new Api();

package/api/plugins/cache.js

@@ -1,19 +1,38 @@
 const TEN_MINUTES = 1000 * 60 * 10;
+const DEFAULT_MAX_SIZE = 100;
 
 /**
- * @param {{maxAge?: number}} options
+ * @param {{maxAge?: number, maxSize?: number}} options
  * @returns {import('../index.js').Plugin}
  */
-export function cachePlugin({ maxAge = TEN_MINUTES } = {}) {
-  let requestId;
+export function cachePlugin({
+  maxAge = TEN_MINUTES,
+  maxSize = DEFAULT_MAX_SIZE,
+} = {}) {
   const cache = new Map();
 
+  function evict() {
+    const now = Date.now();
+    for (const [key, value] of cache) {
+      if (value.updatedAt <= now - maxAge) {
+        cache.delete(key);
+      }
+    }
+    // if still over maxSize, evict oldest entries
+    if (cache.size > maxSize) {
+      const overflow = cache.size - maxSize;
+      const keys = cache.keys();
+      for (let i = 0; i < overflow; i++) {
+        cache.delete(keys.next().value);
+      }
+    }
+  }
+
   return {
     name: "cache",
     beforeFetch: (meta) => {
       const { method, url } = meta;
-      requestId = `${method}:${url}`;
-
+      const requestId = `${method}:${url}`;
       if (cache.has(requestId)) {
         const cached = cache.get(requestId);
         if (cached.updatedAt > Date.now() - maxAge) {
@@ -25,15 +44,12 @@ export function cachePlugin({ maxAge = TEN_MINUTES } = {}) {
         }
       }
     },
-    afterFetch: async (res) => {
-      const clone = await res.clone();
+    afterFetch: async (res, meta) => {
+      const requestId = `${meta.method}:${meta.url}`;
+      const clone = res.clone();
       const data = await clone.json();
-
-      cache.set(requestId, {
-        updatedAt: Date.now(),
-        data,
-      });
-
+      cache.set(requestId, { updatedAt: Date.now(), data });
+      evict();
       return res;
     },
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thepassle/app-tools",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "",
   "type": "module",
   "scripts": {

package/types/api/plugins/cache.d.ts

@@ -1,8 +1,9 @@
 /**
- * @param {{maxAge?: number}} options
+ * @param {{maxAge?: number, maxSize?: number}} options
  * @returns {import('../index.js').Plugin}
  */
-export function cachePlugin({ maxAge }?: {
+export function cachePlugin({ maxAge, maxSize, }?: {
     maxAge?: number;
+    maxSize?: number;
 }): import('../index.js').Plugin;
 export const cache: import("../types.js").Plugin;

package/types/api/types.d.ts

@@ -9,7 +9,7 @@ export type BodylessMethod = <R>(url: string, opts?: RequestOptions) => Promise<
 export type Method = 'GET' | 'DELETE' | 'HEAD' | 'OPTIONS' | 'POST' | 'PUT' | 'PATCH';
 export interface Plugin {
     beforeFetch?: (meta: MetaParams) => MetaParams | Promise<MetaParams> | void;
-    afterFetch?: (res: Response) => void | Promise<void> | Response | Promise<Response>;
+    afterFetch?: (res: Response, meta: MetaParams) => void | Promise<void> | Response | Promise<Response>;
     transform?: (data: any) => any;
     name: string;
     handleError?: (e: Error) => boolean;