To describe error from Client and Server with internationalization support

A100_Describe_Error.md

Error description in TS

error.d.ts

export type ErrorFromServer = {
  code?: number;
  message?: string;
  config?: {
    withCredentials?: boolean;
  };
};

/**
 * key will be used for the translation
 */
export type ErrorClient = {
  key: string;
  message?: string;
  advice?: string;
};

error.json

{
    "errorUnknown": "Some strange thing happened.",
    "unknownDescription": "unknown description",
    "errorNumber": "Error number",
    "errorServerDescription": "A network error occured: {{description}} ({{code}}).",
    "errorClientDescription": "A client error occured: {{description}}.",
    "clientPasswordConfirm": "password confirmation differs",
    "clientPasswordStrength" : "password should contain number, letter, and symbol",
    "ERR_NETWORK": "network error",
    "ERR_CONNECTION_REFUSED": "refused connection",
    "400": "Bad Request",
    "401": "Unauthorized",
    "402": "Payment Required",
    "403": "Forbidden",
    "404": "Not Found",
    "405": "Method Not Allowed",
    "406": "Not Acceptable",
    "407": "Proxy Authentication Required",
    "408": "Request Timeout",
    "409": "Conflict",
    "410": "Gone",
    "411": "Length Required",
    "412": "Precondition Failed",
    "413": "Payload Too Large",
    "414": "URI Too Long",
    "415": "Unsupported Media Type",
    "416": "Range Not Satisfiable",
    "417": "Expectation Failed",
    "418": "I'm a teapot",
    "422": "Unprocessable Entity",
    "425": "Too Early",
    "426": "Upgrade Required",
    "428": "Precondition Required",
    "429": "Too Many Requests",
    "431": "Request Header Fields Too Large",
    "451": "Unavailable For Legal Reasons",
    "500": "Internal Server Error",
    "501": "Not Implemented",
    "502": "Bad Gateway",
    "503": "Service Unavailable",
    "504": "Gateway Timeout",
    "505": "HTTP Version Not Supported",
    "506": "Variant Also Negotiates",
    "507": "Insufficient Storage",
    "508": "Loop Detected",
    "510": "Not Extended",
    "511": "Network Authentication Required",
    "601": "Too Many Request Error",
    "602": "Bad Option Value Error",
    "603": "Bad Option Error",
    "604": "Network Error",
    "605": "Deprecated Error",
    "606": "Bad Reponse Error",
    "607": "Bad Request Error",
    "608": "Canceled Error",
    "609": "Connection Aborted Error",
    "610": "Timeout Error"
}

format.error.ts

import type { AxiosError } from 'axios';

import type { ErrorClient, ErrorFromServer } from '../types/interfaces/error';

import { capitalizeFirstLetter } from './format.case';

/**
 * ERROR
 */

const codeMap = {
  ERR_FR_TOO_MANY_REDIRECTS: 601,
  ERR_BAD_OPTION_VALUE: 602,
  ERR_BAD_OPTION: 603,
  ERR_NETWORK: 604,
  ERR_DEPRECATED: 605,
  ERR_BAD_RESPONSE: 606,
  ERR_BAD_REQUEST: 607,
  ERR_CANCELED: 608,
  ECONNABORTED: 609,
  ETIMEDOUT: 610,
};
const keys = Object.keys(codeMap);

/**
 * To translate the description of an error received from a server
 * @param t from i18n useTranslation
 * @param error
 * @returns
 */
export function describeServerError(t: (...args: any) => string, error: ErrorFromServer): string {
  return t('errorServerDescription', {
    description: t(`${error?.code}`, 'unknownDescription'),
    code: error?.code,
    ns: 'error',
  });
}

/**
 * To translate the description of an error raised by the client
 * @param t from i18n useTranslation
 * @param error
 * @returns
 */
export function describeClientError(t: (...args: any) => string, error: ErrorClient): string {
  return t('errorClientDescription', {
    description: t(`client${capitalizeFirstLetter(error.key)}`, 'unknownDescription'),
    ns: 'error',
  });
}

export function formatError(error: AxiosError): ErrorFromServer {
  let code: number | undefined;
  if (error?.code && keys.includes(error?.code)) {
    //https://stackoverflow.com/a/69198602
    code = codeMap[error?.code as keyof typeof codeMap];
  } else {
    if (error?.code != undefined) {
      code = error?.code as unknown as number;
    } else {
      code = undefined;
    }
  }
  return {
    code: code,
    message: error.message,
    config: {
      withCredentials: error.config.withCredentials,
    },
  };
}