@brickflow/http 0.0.12 → 0.0.14

package/dist/runtime/composables/useHttp.js

@@ -0,0 +1,197 @@
+import { useLazyAsyncData, useNuxtApp, useRuntimeConfig, useState } from "nuxt/app";
+import { onScopeDispose, shallowReactive, shallowRef } from "vue";
+import { dbDeleteKeysWithPart, dbGet, dbSafeSet, getRandom, hashData } from "../utils/index.js";
+import {
+  createHttpUrl,
+  createNetworkError,
+  isHttpErrorPayload
+} from "../utils/shared.js";
+const CHANNEL_NAME = "brickflow-http-tab-sync";
+let channel;
+export async function useHttp(options) {
+  const app = useNuxtApp();
+  const runtimeConfig = useRuntimeConfig();
+  const httpConfig = runtimeConfig.public.brickflowHttp;
+  const mapParams = (params) => {
+    if (options.mapParams) {
+      return options.mapParams(params ?? {});
+    }
+    return params ?? {};
+  };
+  const cacheEnabled = httpConfig.cache && !(httpConfig.disableCacheInDev && import.meta.dev);
+  const initFullUrl = createHttpUrl(options.url, mapParams(options.initParams));
+  let hasDataFromServer = false;
+  const result = shallowReactive({
+    data: null,
+    error: null,
+    fetch: async () => await void 0,
+    hasFirstData: false,
+    hasFreshData: false,
+    pending: true,
+    pendingCache: true
+  });
+  const controller = new AbortController();
+  const serverData = useState(`http:${initFullUrl}`, () => null);
+  if (options.server && import.meta.server) {
+    const paramsReactive = shallowRef(mapParams(options.initParams));
+    const ssr = await useLazyAsyncData(initFullUrl, async () => {
+      return await app.$http.get(options.url, {
+        params: paramsReactive.value
+      });
+    });
+    result.fetch = async (params) => {
+      paramsReactive.value = mapParams(params);
+      await ssr.refresh();
+    };
+    const payload = ssr.data.value?.data ?? null;
+    serverData.value = payload;
+    if (payload === null) {
+      result.pending = false;
+      result.pendingCache = false;
+    } else {
+      applyPayload(payload, result);
+      result.hasFirstData = true;
+      result.hasFreshData = true;
+      result.pending = false;
+      result.pendingCache = false;
+      options.effect?.(payload, {
+        cached: false,
+        params: mapParams(options.initParams)
+      });
+      if (!isHttpErrorPayload(payload)) {
+        hasDataFromServer = true;
+      }
+    }
+  }
+  if (import.meta.client) {
+    let onMessage = function(event) {
+      if (!event.data.fullUrl || !fullUrlHistory[event.data.fullUrl] || event.data.data === void 0) {
+        return;
+      }
+      const payload = event.data.data;
+      applyPayload(payload, result);
+      result.hasFirstData = true;
+      result.hasFreshData = true;
+      options.effect?.(payload, {
+        cached: false,
+        params: event.data.params ?? mapParams()
+      });
+    };
+    const fullUrlHistory = {};
+    const clientChannel = getChannel();
+    clientChannel?.addEventListener("message", onMessage);
+    if (serverData.value !== null) {
+      applyPayload(serverData.value, result);
+      result.pending = false;
+      result.pendingCache = false;
+      result.hasFirstData = true;
+      result.hasFreshData = true;
+    }
+    const raceCondition = {};
+    const runFetch = async (params, fetchOpt) => {
+      const mappedParams = mapParams(params);
+      const fullUrl = createHttpUrl(options.url, mappedParams);
+      const fetchId = Date.now() + getRandom(0, 300);
+      if (raceCondition[fullUrl]) {
+        return;
+      }
+      raceCondition[fullUrl] = fetchId;
+      try {
+        result.pending = true;
+        result.pendingCache = true;
+        const cachedFetch = cacheEnabled && httpConfig.cacheDbName && httpConfig.cacheStoreName ? await dbGet(fullUrl, "smart-cache-v2", httpConfig.cacheStoreName) : null;
+        if (cachedFetch) {
+          applyPayload(cachedFetch.value, result);
+          result.hasFirstData = true;
+          result.pendingCache = false;
+          options.effect?.(cachedFetch.value, {
+            cached: true,
+            params: mappedParams
+          });
+        }
+        if (controller.signal.aborted || fetchOpt?.signal?.aborted) {
+          throw new DOMException("Aborted", "AbortError");
+        }
+        const signal = fetchOpt?.signal ? [controller.signal, fetchOpt.signal] : controller.signal;
+        const response = await app.$http.get(options.url, {
+          params: mappedParams,
+          signal
+        });
+        applyPayload(response.data, result);
+        result.hasFirstData = true;
+        result.hasFreshData = true;
+        fullUrlHistory[fullUrl] = true;
+        clientChannel?.postMessage({
+          data: normalizeBroadcastValue(response.data),
+          fullUrl,
+          params: normalizeBroadcastValue(mappedParams),
+          type: "STATE_UPDATE"
+        });
+        options.effect?.(response.data, {
+          cached: false,
+          params: mappedParams
+        });
+        if (cacheEnabled && response.status === 200) {
+          if (cachedFetch !== null) {
+            const currentHash = await hashData(response.data);
+            if (currentHash !== cachedFetch.hash) {
+              await dbDeleteKeysWithPart(options.url, "smart-cache-v2", httpConfig.cacheStoreName);
+            }
+          }
+          await dbSafeSet(
+            fullUrl,
+            response.data,
+            "smart-cache-v2",
+            httpConfig.cacheStoreName,
+            httpConfig.cacheTtlMs
+          );
+        }
+      } catch (error) {
+        if (!isHttpErrorPayload(result.error)) {
+          result.error = createNetworkError(error);
+        }
+      } finally {
+        if (raceCondition[fullUrl] === fetchId) {
+          delete raceCondition[fullUrl];
+        }
+        result.pending = false;
+        result.pendingCache = false;
+      }
+    };
+    result.fetch = runFetch;
+    if (!hasDataFromServer && options.lazy !== true) {
+      await runFetch(options.initParams);
+    }
+    onScopeDispose(() => {
+      clientChannel?.removeEventListener("message", onMessage);
+      controller.abort(`Http Abort -> onScopeDispose ${options.url}`);
+      if (serverData.value !== null) {
+        serverData.value = null;
+      }
+    });
+  }
+  return result;
+}
+function applyPayload(payload, result) {
+  if (isHttpErrorPayload(payload)) {
+    result.data = null;
+    result.error = payload;
+    return;
+  }
+  result.data = payload;
+  result.error = null;
+}
+function getChannel() {
+  if (!import.meta.client) {
+    return void 0;
+  }
+  channel ??= new BroadcastChannel(CHANNEL_NAME);
+  return channel;
+}
+function normalizeBroadcastValue(payload) {
+  try {
+    return structuredClone(payload);
+  } catch {
+    return JSON.parse(JSON.stringify(payload));
+  }
+}

package/dist/runtime/http/client.d.ts

@@ -0,0 +1,3 @@
+import { type CreateHttpClientOptions, type HttpClient } from '../utils/shared.js';
+export declare function createHttpClient(options?: CreateHttpClientOptions): HttpClient;
+//# sourceMappingURL=client.d.ts.map

package/dist/runtime/http/client.js

@@ -0,0 +1,217 @@
+import { getRetryDelay, isFormData, sleep } from "../utils/helpers.js";
+import { getHttpRequestMiddlewares, getHttpResponseMiddlewares } from "../utils/middleware.js";
+import {
+  joinUrl
+} from "../utils/shared.js";
+export function createHttpClient(options = {}) {
+  const requestTimeoutMs = options.requestTimeoutMs ?? 8e4;
+  const defaultRetry = {
+    delay: options.retry?.delay ?? 300,
+    retries: options.retry?.retries ?? 3
+  };
+  return {
+    async get(url, config = {}) {
+      const retry = {
+        delay: config.retry?.delay ?? defaultRetry.delay,
+        retries: config.retry?.retries ?? defaultRetry.retries
+      };
+      const attemptRequest = async (attempt) => {
+        const request = await createRequestContext({
+          method: "GET",
+          options,
+          params: config.params,
+          requestTimeoutMs,
+          signal: config.signal,
+          url
+        });
+        try {
+          const result = await fetch(request.url, {
+            credentials: request.credentials,
+            headers: request.headers,
+            method: request.method,
+            signal: request.signal
+          });
+          const response = buildResponse(
+            request.url,
+            await readResponseBody(result),
+            result.status
+          );
+          if (!result.ok && isRetryableStatus(result.status) && attempt < retry.retries) {
+            await sleep(getRetryDelay(attempt, retry.delay));
+            return await attemptRequest(attempt + 1);
+          }
+          await runResponseMiddlewares(response, request, options.responseMiddleware);
+          return response;
+        } catch (error) {
+          if (isAbortError(error) || attempt >= retry.retries) {
+            throw error;
+          }
+          await sleep(getRetryDelay(attempt, retry.delay));
+          return await attemptRequest(attempt + 1);
+        }
+      };
+      return await attemptRequest(0);
+    },
+    async post(url, data, config = {}) {
+      const request = await createRequestContext({
+        body: data,
+        method: "POST",
+        options,
+        params: config.params,
+        requestTimeoutMs,
+        signal: config.signal,
+        url
+      });
+      let requestBody;
+      if (request.body !== void 0) {
+        requestBody = isFormData(request.body) ? request.body : JSON.stringify(request.body);
+      }
+      const result = await fetch(request.url, {
+        body: requestBody,
+        credentials: request.credentials,
+        headers: request.headers,
+        method: request.method,
+        signal: request.signal
+      });
+      const response = buildResponse(
+        request.url,
+        await readResponseBody(result),
+        result.status
+      );
+      await runResponseMiddlewares(response, request, options.responseMiddleware);
+      return response;
+    }
+  };
+}
+function buildRequestUrl(url, params, method) {
+  if (!params || Object.keys(params).length === 0) {
+    return url;
+  }
+  const searchParams = new URLSearchParams();
+  Object.entries(params ?? {}).forEach(([key, value]) => {
+    if (value === void 0 || value === null) {
+      return;
+    }
+    if (Array.isArray(value)) {
+      if (method === "POST") {
+        value.forEach((item) => {
+          searchParams.append(`${key}[]`, String(item));
+        });
+        return;
+      }
+      searchParams.append(key, JSON.stringify(value));
+      return;
+    }
+    searchParams.append(key, String(value));
+  });
+  const query = searchParams.toString();
+  if (!query) {
+    return url;
+  }
+  const separator = url.includes("?") ? "&" : "?";
+  return `${url}${separator}${query}`;
+}
+function buildResponse(url, data, status) {
+  return {
+    config: {
+      url
+    },
+    data,
+    status
+  };
+}
+function createAnySignal(signals) {
+  if (typeof AbortSignal.any === "function") {
+    return AbortSignal.any(signals);
+  }
+  const controller = new AbortController();
+  signals.filter(Boolean).forEach((signal) => {
+    signal.addEventListener("abort", () => controller.abort(signal.reason), { once: true });
+  });
+  return controller.signal;
+}
+async function createRequestContext(input) {
+  const signal = resolveSignal(input.signal, input.requestTimeoutMs);
+  const headers = await createRequestHeaders(
+    input.options.createHeaders,
+    input.method === "POST" && input.body !== void 0 && !isFormData(input.body) ? {
+      "Content-Type": "application/json"
+    } : void 0
+  );
+  const request = {
+    baseURL: await resolveBaseURL(input.options.baseURL),
+    body: input.body,
+    credentials: "include",
+    headers,
+    method: input.method,
+    params: input.params,
+    signal,
+    url: input.url
+  };
+  await runRequestMiddlewares(request, input.options.requestMiddleware);
+  request.url = buildRequestUrl(joinUrl(request.baseURL, request.url), request.params, request.method);
+  return request;
+}
+async function createRequestHeaders(createHeaders, extraHeaders) {
+  const headers = new Headers(createHeaders ? await createHeaders() : void 0);
+  const extra = new Headers(extraHeaders);
+  extra.forEach((value, key) => {
+    headers.set(key, value);
+  });
+  return headers;
+}
+function createTimeoutSignal(ms) {
+  if (typeof AbortSignal.timeout === "function") {
+    return AbortSignal.timeout(ms);
+  }
+  const controller = new AbortController();
+  const timeoutId = setTimeout(() => controller.abort(new DOMException("Timed out", "AbortError")), ms);
+  controller.signal.addEventListener("abort", () => clearTimeout(timeoutId), { once: true });
+  return controller.signal;
+}
+function isAbortError(error) {
+  return error instanceof DOMException && error.name === "AbortError";
+}
+function isRetryableStatus(status) {
+  return status >= 500 || status === 429;
+}
+async function readResponseBody(response) {
+  const raw = await response.text();
+  if (!raw) {
+    return null;
+  }
+  try {
+    return JSON.parse(raw);
+  } catch {
+    return raw;
+  }
+}
+async function resolveBaseURL(baseURL) {
+  if (!baseURL) {
+    return "";
+  }
+  if (typeof baseURL === "function") {
+    return await baseURL() || "";
+  }
+  return baseURL;
+}
+function resolveSignal(signal, requestTimeoutMs) {
+  const timeoutSignal = createTimeoutSignal(requestTimeoutMs);
+  if (Array.isArray(signal)) {
+    return createAnySignal([...signal, timeoutSignal]);
+  }
+  if (signal) {
+    return createAnySignal([signal, timeoutSignal]);
+  }
+  return timeoutSignal;
+}
+async function runRequestMiddlewares(request, middlewares) {
+  for (const middleware of [...getHttpRequestMiddlewares(), ...middlewares ?? []]) {
+    await middleware(request);
+  }
+}
+async function runResponseMiddlewares(response, request, middlewares) {
+  for (const middleware of [...getHttpResponseMiddlewares(), ...middlewares ?? []]) {
+    await middleware(response, request);
+  }
+}

package/dist/runtime/plugin.d.ts

@@ -0,0 +1,7 @@
+declare const _default: import("nuxt/app").Plugin<{
+    http: import("./utils/index.js").HttpClient;
+}> & import("nuxt/app").ObjectPlugin<{
+    http: import("./utils/index.js").HttpClient;
+}>;
+export default _default;
+//# sourceMappingURL=plugin.d.ts.map

package/dist/runtime/plugin.js

@@ -0,0 +1,56 @@
+import { defineNuxtPlugin, useRuntimeConfig } from "nuxt/app";
+import { createHttpClient } from "./http/client.js";
+import { isHttpErrorPayload } from "./utils/shared.js";
+export default defineNuxtPlugin(() => {
+  const runtimeConfig = useRuntimeConfig();
+  const httpConfig = runtimeConfig.public.brickflowHttp;
+  const http = createHttpClient({
+    baseURL: () => httpConfig.baseURL,
+    createHeaders: () => {
+      const headers = new Headers(httpConfig.defaultHeaders);
+      headers.set("X-Requested-With", "XMLHttpRequest");
+      if (httpConfig.clientEnvHeader && import.meta.dev) {
+        headers.set("Client-Env", "development");
+      }
+      return headers;
+    },
+    requestTimeoutMs: httpConfig.requestTimeoutMs,
+    responseMiddleware: [createRuntimeHttpErrorMiddleware()],
+    retry: httpConfig.retry
+  });
+  return {
+    provide: {
+      http
+    }
+  };
+});
+function createRuntimeHttpErrorMiddleware() {
+  return (response) => {
+    const { data, status } = response;
+    if (status !== 451 && status < 500 || !isHttpErrorPayload(data)) {
+      return;
+    }
+    const raise = async () => {
+      const { showError } = await import("nuxt/app");
+      showError({
+        data,
+        statusCode: status
+      });
+    };
+    const raiseSafely = () => {
+      ;
+      (async () => {
+        try {
+          await raise();
+        } catch (error) {
+          console.error(error);
+        }
+      })();
+    };
+    if (import.meta.server) {
+      raiseSafely();
+      return;
+    }
+    setTimeout(raiseSafely, 0);
+  };
+}

package/dist/runtime/types.d.ts

@@ -0,0 +1,21 @@
+import type { HttpRouteMap, TypedHttpClient } from './utils/typed'
+
+declare module '#app' {
+  interface NuxtApp {
+    $http: TypedHttpClient<HttpRouteMap>
+  }
+}
+
+declare module 'nuxt/app' {
+  interface NuxtApp {
+    $http: TypedHttpClient<HttpRouteMap>
+  }
+}
+
+declare module 'vue' {
+  interface ComponentCustomProperties {
+    $http: TypedHttpClient<HttpRouteMap>
+  }
+}
+
+export {}

package/dist/runtime/utils/helpers.d.ts

@@ -0,0 +1,5 @@
+export declare function getRandom(min: number, max: number): number;
+export declare function getRetryDelay(attempt: number, baseDelay: number): number;
+export declare function isFormData(value?: FormData | Record<string, unknown> | unknown): value is FormData;
+export declare const sleep: (ms: number) => Promise<void>;
+//# sourceMappingURL=helpers.d.ts.map

package/dist/runtime/utils/helpers.js

@@ -0,0 +1,14 @@
+export function getRandom(min, max) {
+  const hasFloat = !Number.isInteger(min) || !Number.isInteger(max);
+  return hasFloat ? Math.random() * (max - min) + min : Math.floor(Math.random() * (max - min + 1)) + min;
+}
+export function getRetryDelay(attempt, baseDelay) {
+  return Math.random() * baseDelay * 2 ** attempt;
+}
+export function isFormData(value) {
+  if (!value) {
+    return false;
+  }
+  return typeof value === "object" && typeof value.append === "function" && typeof value.has === "function";
+}
+export const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

package/dist/runtime/utils/index.d.ts

@@ -0,0 +1,6 @@
+export * from './helpers.js';
+export * from './indexeddb.js';
+export * from './middleware.js';
+export * from './shared.js';
+export * from './typed.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/runtime/utils/index.js

@@ -0,0 +1,5 @@
+export * from "./helpers.js";
+export * from "./indexeddb.js";
+export * from "./middleware.js";
+export * from "./shared.js";
+export * from "./typed.js";

package/dist/runtime/utils/indexeddb.d.ts

@@ -0,0 +1,14 @@
+export interface DbEntry<T> {
+    expiresAt: number;
+    hash: string;
+    key: string;
+    value: T;
+}
+declare const allowDb: readonly ["smart-cache-v2"];
+type AllowDB = (typeof allowDb)[number];
+export declare function dbDeleteKeysWithPart(part: string, dbName: AllowDB, storeName: string): Promise<void>;
+export declare function dbGet<T>(key: string, dbName: AllowDB, storeName: string): Promise<DbEntry<T> | null>;
+export declare function dbSafeSet<T>(key: string, value: T, dbName: AllowDB, storeName: string, ttl: number, retries?: number): Promise<void>;
+export declare function hashData(data: unknown): Promise<string>;
+export {};
+//# sourceMappingURL=indexeddb.d.ts.map