@povio/ui 0.0.2 → 0.0.3

package/src/utils/date-time.utils.ts

@@ -0,0 +1,85 @@
+import {
+  CalendarDate,
+  CalendarDateTime,
+  type DateValue,
+  type ZonedDateTime,
+  fromDate,
+  getLocalTimeZone,
+  parseAbsolute,
+  parseAbsoluteToLocal,
+} from "@internationalized/date";
+import { DateTime } from "luxon";
+
+export namespace DateTimeUtils {
+  export function fromISOtoZonedDateTime(isoString: string): ZonedDateTime {
+    return parseAbsoluteToLocal(isoString);
+  }
+
+  export function fromDateValueToISO(dateValue: DateValue): string {
+    return dateValue.toDate(getLocalTimeZone()).toISOString();
+  }
+
+  export function fromLocalToZonedDateTime(date: Date): ZonedDateTime {
+    return fromDate(date, getLocalTimeZone());
+  }
+
+  export function fromDateValueToLocal(dateValue: DateValue): Date {
+    return dateValue.toDate(getLocalTimeZone());
+  }
+
+  export function fromCalendarDateToUTCISO(calendarDate: CalendarDate, options: { endOfDay?: boolean } = {}): string {
+    const date = DateTime.fromObject(
+      {
+        year: calendarDate.year,
+        month: calendarDate.month,
+        day: calendarDate.day,
+      },
+      { zone: "utc" },
+    );
+    if (options.endOfDay) {
+      return date.endOf("day").toUTC().toISO() ?? calendarDate.toString();
+    }
+    return date.toUTC().toISO() ?? calendarDate.toString();
+  }
+
+  export function fromUTCISOToCalendarDate(isoString: string): CalendarDate {
+    const date = new Date(isoString);
+    return new CalendarDate(date.getUTCFullYear(), date.getUTCMonth() + 1, date.getUTCDate());
+  }
+
+  export function fromCalendarDateTimeToUTCISO(calendarDateTime: CalendarDateTime): string {
+    return calendarDateTime.toDate("UTC").toISOString();
+  }
+
+  export function fromUTCISOToCalendarDateTime(isoString: string): CalendarDateTime {
+    const zonedDateTime = parseAbsolute(isoString, "UTC");
+    return new CalendarDateTime(
+      zonedDateTime.year,
+      zonedDateTime.month,
+      zonedDateTime.day,
+      zonedDateTime.hour,
+      zonedDateTime.minute,
+      zonedDateTime.second,
+      zonedDateTime.millisecond,
+    );
+  }
+
+  export function formatTextDateToCalendarDateTime(textDate: string | null): CalendarDateTime | null {
+    if (!textDate?.includes("hh")) {
+      return null;
+    }
+
+    const datePart = textDate.split(",").at(0)?.trim();
+    if (!datePart) {
+      return null;
+    }
+
+    const date = new Date(datePart);
+    if (!date || date.toString() === "Invalid Date") {
+      return null;
+    }
+
+    const zonedDateTime = fromDate(date, getLocalTimeZone());
+    return new CalendarDateTime(zonedDateTime.year, zonedDateTime.month, zonedDateTime.day, 0, 0, 0, 0);
+  }
+}

package/src/utils/date.utils.spec.ts

@@ -0,0 +1,12 @@
+import { describe, expect, test } from "vitest";
+
+import { DateUtils } from "./date.utils";
+
+describe("DateUtils", () => {
+  test("formatDate", () => {
+    const date = new Date(2025, 2, 4);
+    const dateString = "04/03/2025";
+
+    expect(DateUtils.formatDate(date)).toEqual(dateString);
+  });
+});

package/src/utils/date.utils.ts

@@ -0,0 +1,9 @@
+import { DateTime } from "luxon";
+
+export namespace DateUtils {
+  const DATE_FORMAT = "dd/MM/yyyy";
+
+  export function formatDate(date: Date, format = DATE_FORMAT): string {
+    return DateTime.fromJSDate(date).toFormat(format);
+  }
+}

package/src/utils/dom.utils.ts

@@ -0,0 +1,16 @@
+import type { KeyboardEvent, SyntheticEvent } from "react";
+
+export namespace DomUtils {
+  const KEYBOARD_INPUTS = ["button", "submit", "checkbox", "file", "image"];
+
+  export const isKeyboardInput = (elem: Element) => {
+    return (
+      (elem.tagName === "INPUT" && !KEYBOARD_INPUTS.includes((elem as HTMLInputElement).type)) ||
+      elem.hasAttribute("contenteditable")
+    );
+  };
+
+  export const isKeyboardEvent = (event: SyntheticEvent): event is KeyboardEvent => {
+    return event.nativeEvent instanceof KeyboardEvent;
+  };
+}

package/src/utils/file.utils.ts

@@ -0,0 +1,73 @@
+import type { AxiosResponse, AxiosResponseHeaders } from "axios";
+
+import { RestUtils } from "#ui/utils/rest/rest.utils";
+
+export namespace FileUtils {
+  export const getObjectUrl = (data: Blob | AxiosResponse<Blob>, revokeTimeoutMs = 40_000) => {
+    const url = URL.createObjectURL(data instanceof Blob ? data : data.data);
+    setTimeout(() => URL.revokeObjectURL(url), revokeTimeoutMs);
+    return url;
+  };
+
+  export const openFile = (data: Blob | AxiosResponse<Blob>, target = "_blank", revokeTimeoutMs?: number) => {
+    const url = getObjectUrl(data, revokeTimeoutMs);
+    window.open(url, target);
+  };
+
+  export const downloadFile = (data: Blob | AxiosResponse<Blob>, fileName?: string, revokeTimeoutMs?: number) => {
+    const url = getObjectUrl(data, revokeTimeoutMs);
+    const contentDispositionFileName =
+      data instanceof Blob
+        ? undefined
+        : RestUtils.extractContentDispositionFilename(data.headers as AxiosResponseHeaders);
+
+    const a = document.createElement("a");
+    a.download = fileName ?? contentDispositionFileName ?? "download";
+    a.rel = "noopener";
+    a.href = url;
+
+    setTimeout(() => a.dispatchEvent(new MouseEvent("click")));
+  };
+
+  export const isFileTypeAccepted = (file: File, fileTypes?: readonly string[] | string[]): boolean => {
+    if (!fileTypes || fileTypes.length === 0) {
+      return true;
+    }
+
+    return fileTypes.some((type) => {
+      if (type.includes("/")) {
+        return file.type === type || (type.endsWith("/*") && file.type.startsWith(type.slice(0, -1)));
+      }
+      return file.name.toLowerCase().endsWith(type.toLowerCase());
+    });
+  };
+
+  export const getCalculatedFileSize = (file?: File): string => {
+    if (!file) {
+      return "";
+    }
+    if (file.size < 1024) {
+      return `${file.size} B`;
+    }
+    if (file.size < 1024 * 1024) {
+      return `${(file.size / 1024).toFixed(2)} KB`;
+    }
+    if (file.size < 1024 * 1024 * 1024) {
+      return `${(file.size / 1024 / 1024).toFixed(2)} MB`;
+    }
+    return `${(file.size / 1024 / 1024 / 1024).toFixed(2)} GB`;
+  };
+
+  export const formatBytes = (size: number, decimals = 2) => {
+    if (size < 1024) {
+      return `${size} B`;
+    }
+    if (size < 1024 * 1024) {
+      return `${(size / 1024).toFixed(decimals)} KB`;
+    }
+    if (size < 1024 * 1024 * 1024) {
+      return `${(size / 1024 / 1024).toFixed(decimals)} MB`;
+    }
+    return `${(size / 1024 / 1024 / 1024).toFixed(decimals)} GB`;
+  };
+}

package/src/utils/isEqual.ts

@@ -0,0 +1,153 @@
+/* oxlint-disable default-case, no-self-compare, no-param-reassign */
+import { ObjectUtils } from "#ui/utils/object.utils";
+
+export const isEqual = (a: any, b: any) => {
+  return eq(a, b);
+};
+
+// Lodash internal recursive comparison function for `isEqual`.
+const eq = (a: any, b: any, aStack?: any[], bStack?: any[]) => {
+  // Identical objects are equal. `0 === -0`, but they aren't identical.
+  // See the [Harmony `egal` proposal](http://wiki.ecmascript.org/doku.php?id=harmony:egal).
+  if (a === b) {
+    return a !== 0 || 1 / a === 1 / b;
+  }
+
+  // A strict comparison is necessary because `null == undefined`.
+  if (a == null || b == null) {
+    return a === b;
+  }
+
+  // `NaN`s are equivalent, but non-reflexive.
+  if (a !== a) {
+    return b !== b;
+  }
+
+  // Exhaust primitive checks
+  const type = typeof a;
+  if (type !== "function" && type !== "object" && typeof b !== "object") {
+    return false;
+  }
+
+  return deepEq(a, b, aStack, bStack);
+};
+
+// Lodash internal recursive comparison function for `isEqual`.
+const deepEq = (a: any, b: any, aStack?: any[], bStack?: any[]) => {
+  // Compare `[[Class]]` names.
+  const className = toString.call(a);
+  if (className !== toString.call(b)) {
+    return false;
+  }
+
+  switch (className) {
+    // Strings, numbers, regular expressions, dates, and booleans are compared by value.
+    // RegExps are coerced to strings for comparison (Note: '' + /a/i === '/a/i')
+    case "[object RegExp]":
+    case "[object String]":
+      // Primitives and their corresponding object wrappers are equivalent; thus, `"5"` is
+      // equivalent to `new String("5")`.
+      return `${a}` === `${b}`;
+    case "[object Number]":
+      // `NaN`s are equivalent, but non-reflexive.
+      // Object(NaN) is equivalent to NaN.
+      if (+a !== +a) {
+        return +b !== +b;
+      }
+      // An `egal` comparison is performed for other numeric values.
+      return +a === 0 ? 1 / +a === 1 / b : +a === +b;
+    case "[object Date]":
+    case "[object Boolean]":
+      // Coerce dates and booleans to numeric primitive values. Dates are compared by their
+      // millisecond representations. Note that invalid dates with millisecond representations
+      // of `NaN` are not equivalent.
+      return +a === +b;
+    case "[object Symbol]":
+      return Symbol.prototype.valueOf.call(a) === Symbol.prototype.valueOf.call(b);
+  }
+
+  const areArrays = className === "[object Array]";
+  if (!areArrays) {
+    if (typeof a !== "object" || typeof b !== "object") {
+      return false;
+    }
+
+    // Objects with different constructors are not equivalent, but `Object`s or `Array`s
+    // from different frames are.
+    const aCtor = (a as object).constructor;
+    const bCtor = (b as object).constructor;
+    if (
+      aCtor !== bCtor &&
+      !(
+        ObjectUtils.isFunction(aCtor) &&
+        aCtor instanceof aCtor &&
+        ObjectUtils.isFunction(bCtor) &&
+        bCtor instanceof bCtor
+      ) &&
+      "constructor" in a &&
+      "constructor" in b
+    ) {
+      return false;
+    }
+  }
+  // Assume equality for cyclic structures. The algorithm for detecting cyclic
+  // structures is adapted from ES 5.1 section 15.12.3, abstract operation `JO`.
+
+  // Initializing stack of traversed objects.
+  // It's done here since we only need them for objects and arrays comparison.
+  aStack = aStack || [];
+  bStack = bStack || [];
+  let { length } = aStack;
+  while (length--) {
+    // Linear search. Performance is inversely proportional to the number of
+    // unique nested structures.
+    if (aStack[length] === a) {
+      return bStack[length] === b;
+    }
+  }
+
+  // Add the first object to the stack of traversed objects.
+  aStack.push(a);
+  bStack.push(b);
+
+  // Recursively compare objects and arrays.
+  if (areArrays) {
+    // Compare array lengths to determine if a deep comparison is necessary.
+    length = (a as any[]).length;
+    if (length !== (b as any[]).length) {
+      return false;
+    }
+    // Deep compare the contents, ignoring non-numeric properties.
+    while (length--) {
+      if (!eq((a as any[])[length], (b as any[])[length], aStack, bStack)) {
+        return false;
+      }
+    }
+  } else {
+    // Deep compare objects.
+    const keys = Object.keys(a as object);
+    let key;
+    length = keys.length;
+    // Ensure that both objects contain the same number of properties before comparing deep equality.
+    if (Object.keys(b as object).length !== length) {
+      return false;
+    }
+    while (length--) {
+      // Deep compare each member
+      key = keys[length];
+      if (
+        !(
+          Object.prototype.hasOwnProperty.call(b, key) &&
+          eq((a as Record<string, any>)[key], (b as Record<string, any>)[key], aStack, bStack)
+        )
+      ) {
+        return false;
+      }
+    }
+  }
+
+  // Remove the first object from the stack of traversed objects.
+  aStack.pop();
+  bStack.pop();
+  return true;
+};

package/src/utils/logger.ts

@@ -0,0 +1,19 @@
+import log from "loglevel";
+import prefix from "loglevel-plugin-prefix";
+
+prefix.reg(log);
+
+prefix.apply(log, {
+  template: "[%t] %l:",
+  timestampFormatter: (date) => {
+    return date.toISOString();
+  },
+});
+
+export const logger = {
+  info: (...args: unknown[]) => log.info(...args),
+  debug: (...args: unknown[]) => log.debug(...args),
+  warn: (...args: unknown[]) => log.warn(...args),
+  error: (...args: unknown[]) => log.error(...args),
+  trace: (...args: unknown[]) => log.trace(...args),
+};

package/src/utils/object.utils.ts

@@ -0,0 +1,62 @@
+export namespace ObjectUtils {
+  export const isNil = (obj: unknown) => {
+    return obj == null;
+  };
+
+  export const isFunction = (obj: unknown) => {
+    return typeof obj === "function";
+  };
+
+  export const isObject = (obj: unknown) => {
+    return typeof obj === "object" && !!obj;
+  };
+
+  export const isString = (obj: unknown): obj is string => {
+    return Object.prototype.toString.call(obj) === "[object String]";
+  };
+
+  export const isDate = (obj: unknown): obj is Date => {
+    return Object.prototype.toString.call(obj) === "[object Date]";
+  };
+
+  export const isRegExp = (obj: unknown): obj is RegExp => {
+    return Object.prototype.toString.call(obj) === "[object RegExp]";
+  };
+
+  export const isEmpty = (obj: unknown) => {
+    if (obj == null) {
+      return true;
+    }
+    if (Array.isArray(obj) || isString(obj)) {
+      return obj.length === 0;
+    }
+    return Object.keys(obj).length === 0;
+  };
+
+  export const deepConditionalMerge = <T extends object>(
+    target: Partial<T>,
+    source: Partial<T>,
+    condition: (value: unknown, key: string) => boolean,
+  ): T => {
+    const output = { ...target };
+
+    for (const key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        const value = source[key as keyof T];
+        if (condition(value, key)) {
+          if (typeof value === "object" && !Array.isArray(value)) {
+            output[key as keyof T] = deepConditionalMerge(
+              output[key as keyof T] as object,
+              value as object,
+              condition,
+            ) as T[keyof T];
+          } else {
+            output[key as keyof T] = value as T[keyof T];
+          }
+        }
+      }
+    }
+
+    return output as T;
+  };
+}

package/src/utils/queries.utils.ts

@@ -0,0 +1,10 @@
+import type { QueryClient } from "@tanstack/react-query";
+
+export namespace QueriesUtils {
+  export const prefetchMultipleQueries = (
+    queryClient: QueryClient,
+    queries: Array<(queryClient: QueryClient) => Promise<void>>,
+  ) => {
+    return Promise.all(queries.map((query) => query(queryClient)));
+  };
+}

package/src/utils/rest/interceptors/logging.interceptor.ts

@@ -0,0 +1,16 @@
+import { logger } from "#ui/utils/logger";
+
+import { RestInterceptor } from "./rest-interceptor";
+
+export const LoggingInterceptor = new RestInterceptor((client) => {
+  return client.interceptors.request.use(
+    (config) => {
+      logger.info("Rest call", config.method, config.url, config.data);
+      return config;
+    },
+    (error) => {
+      logger.error("Rest call error", error);
+      return Promise.reject(error as Error);
+    },
+  );
+});

package/src/utils/rest/interceptors/response.interceptor.ts

@@ -0,0 +1,27 @@
+import type { AxiosError } from "axios";
+
+import { logger } from "#ui/utils/logger";
+
+import { RestInterceptor } from "./rest-interceptor";
+
+export const ResponseInterceptor = new RestInterceptor((client) => {
+  return client.interceptors.response.use(
+    (response) => {
+      logger.info("Rest response", response.data, response?.config?.url, response?.status);
+
+      return {
+        ...response,
+        // oxlint-disable-next-line @typescript-eslint/no-unsafe-assignment
+        data: response.data === "" ? undefined : response.data,
+      };
+    },
+    (error: AxiosError) => {
+      logger.error(
+        `Rest response error: ${error?.response?.config?.url}`,
+        error?.response?.data,
+        error?.response?.status,
+      );
+      throw error;
+    },
+  );
+});

package/src/utils/rest/interceptors/rest-interceptor.ts

@@ -0,0 +1,22 @@
+import type { AxiosInstance } from "axios";
+
+export class RestInterceptor<T extends any[]> {
+  private interceptorIdMap: { client: AxiosInstance; interceptorId: number }[] = [];
+
+  constructor(private applyInterceptor: (client: AxiosInstance, ...args: T) => number) {}
+
+  public addInterceptor(client: AxiosInstance, ...args: T) {
+    this.removeInterceptor(client);
+    const interceptorId = this.applyInterceptor(client, ...args);
+    this.interceptorIdMap.push({ client, interceptorId });
+  }
+
+  public removeInterceptor(client: AxiosInstance) {
+    const interceptorId = this.interceptorIdMap.find((i) => i.client === client)?.interceptorId;
+
+    if (interceptorId != null) {
+      client.interceptors.request.eject(interceptorId);
+      this.interceptorIdMap = this.interceptorIdMap.filter((i) => i.client !== client);
+    }
+  }
+}

package/src/utils/rest/rest-client.ts

@@ -0,0 +1,125 @@
+import axios, {
+  type AxiosInstance,
+  type AxiosRequestConfig,
+  type AxiosResponse,
+  type CreateAxiosDefaults,
+} from "axios";
+import { z } from "zod";
+
+import { LoggingInterceptor } from "#ui/utils/rest/interceptors/logging.interceptor";
+import { ResponseInterceptor } from "#ui/utils/rest/interceptors/response.interceptor";
+import type { RestInterceptor } from "#ui/utils/rest/interceptors/rest-interceptor";
+import { type ErrorHandler, type GeneralErrorCodes, SharedErrorHandler } from "#ui/utils/vendor/error-handling";
+
+interface RequestInfo<ZOutput, ECodes extends string> {
+  resSchema: z.ZodType<ZOutput>;
+  errorHandler?: ErrorHandler<ECodes>;
+}
+
+interface RequestConfig<IsRawRes extends boolean = false> {
+  rawResponse?: IsRawRes;
+}
+
+type Response<ZOutput, IsRawRes extends boolean = false> = IsRawRes extends true ? AxiosResponse<ZOutput> : ZOutput;
+
+export class RestClient {
+  protected client: AxiosInstance;
+
+  constructor({
+    config,
+    interceptors,
+  }: {
+    config?: CreateAxiosDefaults;
+    interceptors?: RestInterceptor<any[]>[];
+  } = {}) {
+    this.client = axios.create(config);
+
+    const defaultInterceptors = [LoggingInterceptor, ResponseInterceptor];
+
+    this.attachInterceptors(defaultInterceptors);
+    this.attachInterceptors(interceptors);
+  }
+
+  public attachInterceptors<T extends any[]>(interceptors?: RestInterceptor<T>[], ...args: T) {
+    if (interceptors != null) {
+      interceptors.forEach((interceptor) => this.attachInterceptor(interceptor, ...args));
+    }
+  }
+
+  public attachInterceptor<T extends any[]>(interceptor: RestInterceptor<T>, ...args: T) {
+    interceptor.addInterceptor(this.client, ...args);
+  }
+
+  public ejectInterceptor<T extends any[]>(interceptor: RestInterceptor<T>) {
+    interceptor.removeInterceptor(this.client);
+  }
+
+  public async get<ZOutput, ECodes extends string = GeneralErrorCodes, IsRawRes extends boolean = false>(
+    requestInfo: RequestInfo<ZOutput, ECodes>,
+    url: string,
+    requestConfig?: AxiosRequestConfig & RequestConfig<IsRawRes>,
+  ): Promise<Response<ZOutput, IsRawRes>> {
+    return this.makeRequest(requestInfo, { ...requestConfig, method: "get", url });
+  }
+
+  public async post<ZOutput, ECodes extends string = GeneralErrorCodes, IsRawRes extends boolean = false>(
+    requestInfo: RequestInfo<ZOutput, ECodes>,
+    url: string,
+    data?: any,
+    requestConfig?: AxiosRequestConfig & RequestConfig<IsRawRes>,
+  ): Promise<Response<ZOutput, IsRawRes>> {
+    return this.makeRequest(requestInfo, { ...requestConfig, method: "post", url, data });
+  }
+
+  public async patch<ZOutput, ECodes extends string = GeneralErrorCodes, IsRawRes extends boolean = false>(
+    requestInfo: RequestInfo<ZOutput, ECodes>,
+    url: string,
+    data?: any,
+    requestConfig?: AxiosRequestConfig & RequestConfig<IsRawRes>,
+  ): Promise<Response<ZOutput, IsRawRes>> {
+    return this.makeRequest(requestInfo, { ...requestConfig, method: "patch", url, data });
+  }
+
+  public async put<ZOutput, ECodes extends string = GeneralErrorCodes, IsRawRes extends boolean = false>(
+    requestInfo: RequestInfo<ZOutput, ECodes>,
+    url: string,
+    data?: any,
+    requestConfig?: AxiosRequestConfig & RequestConfig<IsRawRes>,
+  ): Promise<Response<ZOutput, IsRawRes>> {
+    return this.makeRequest(requestInfo, { ...requestConfig, method: "put", url, data });
+  }
+
+  public async delete<ZOutput, ECodes extends string = GeneralErrorCodes, IsRawRes extends boolean = false>(
+    requestInfo: RequestInfo<ZOutput, ECodes>,
+    url: string,
+    data?: any,
+    requestConfig?: AxiosRequestConfig & RequestConfig<IsRawRes>,
+  ): Promise<Response<ZOutput, IsRawRes>> {
+    return this.makeRequest(requestInfo, { ...requestConfig, method: "delete", url, data });
+  }
+
+  private async makeRequest<ZOutput, ECodes extends string = GeneralErrorCodes, IsRawRes extends boolean = false>(
+    requestInfo: RequestInfo<ZOutput, ECodes>,
+    requestConfig: AxiosRequestConfig & RequestConfig<IsRawRes>,
+  ): Promise<Response<ZOutput, IsRawRes>> {
+    const errorStack = new Error().stack;
+
+    try {
+      const { rawResponse, ...config } = requestConfig;
+
+      const res = await this.client(config);
+
+      const resData = requestInfo.resSchema.parse(res.data);
+
+      return (rawResponse ? { ...res, data: resData } : resData) as Response<ZOutput, IsRawRes>;
+    } catch (e) {
+      if (e instanceof z.ZodError) {
+        e.name = "BE Response schema mismatch - ZodError";
+        e.stack = [e.stack, ...(errorStack?.split("\n").slice(2) ?? [])].join("\n");
+      }
+      const errorHandler = requestInfo.errorHandler ?? SharedErrorHandler;
+      errorHandler.rethrowError(e);
+      throw e;
+    }
+  }
+}