@andre1502/react-utilities 0.9.0

package/src/Format/NumberFormat.ts

@@ -0,0 +1,96 @@
+import { NumberFormat } from '@formatjs/intl-numberformat';
+import { CurrencySymbolEnum } from '../enums/CurrencySymbolEnum';
+import { FormatOptions } from '../interfaces/Format/FormatOptions';
+import { NumberParser } from './NumberParser';
+
+const formatAccountNumber = (
+  accountNumber: string,
+  separator: string = ' ',
+) => {
+  return accountNumber
+    ?.replace(/\s?/g, '')
+    .replace(/(\d{4})/g, `$1${separator}`)
+    .trim();
+};
+
+const getCurrencySymbol = (currency: string, showCurrency: boolean = true) => {
+  let symbol;
+
+  switch (currency) {
+    case 'TWD':
+      symbol = CurrencySymbolEnum.TWD;
+      break;
+    case 'USD':
+      symbol = CurrencySymbolEnum.USD;
+      break;
+    case 'VND':
+      symbol = CurrencySymbolEnum.VND;
+      break;
+    default:
+      symbol = '';
+  }
+
+  if (!showCurrency) {
+    symbol = '';
+  }
+
+  return symbol;
+};
+
+const formatNumber = (options: FormatOptions) => {
+  options.value = options.value ?? 0;
+  options.styleCurrency = options.styleCurrency ?? 'currency';
+  options.currencyDisplay = options.currencyDisplay ?? 'code';
+  options.showValue = options.showValue ?? true;
+  options.showCurrency = options.showCurrency ?? true;
+  options.minimumFractionDigits = options.minimumFractionDigits ?? 0;
+  options.maximumFractionDigits = options.maximumFractionDigits ?? 0;
+  options.trailingZeroDisplay = options.trailingZeroDisplay ?? 'stripIfInteger';
+
+  // console.log(`options: ${JSON.stringify(options)}.`);
+
+  let formatOptions = {
+    style: options.styleCurrency,
+    currency: options.currency,
+    currencyDisplay: options.currencyDisplay,
+    minimumFractionDigits: options.minimumFractionDigits,
+    maximumFractionDigits: options.maximumFractionDigits,
+    trailingZeroDisplay: options.trailingZeroDisplay,
+  };
+
+  if (options.options) {
+    formatOptions = {
+      ...formatOptions,
+      ...options.options,
+    };
+  }
+
+  let localizedNumber = NumberFormat(options.lang, formatOptions)
+    .format(options.value)
+    .replace(/^([\d,.]+)(\s*)([A-Z]{3})$/, '$3$2$1')
+    .replace(/([\d,.]+)$/, options.showValue ? ' $1' : ' ********')
+    .replace(
+      options.currency,
+      getCurrencySymbol(options.currency, options.showCurrency),
+    )
+    .trim();
+
+  // console.log(`localizedNumber: ${localizedNumber}.`);
+
+  return localizedNumber;
+};
+
+const parseFormatNumber = (lang: string, value: string) => {
+  if (!value) {
+    return null;
+  }
+
+  return new NumberParser(lang).parse(value);
+};
+
+export {
+  formatAccountNumber,
+  formatNumber,
+  getCurrencySymbol,
+  parseFormatNumber,
+};

package/src/Format/NumberParser.ts

@@ -0,0 +1,42 @@
+import { NumberFormat } from '@formatjs/intl-numberformat';
+
+class NumberParser {
+  private _group: RegExp;
+  private _decimal: RegExp;
+  private _numeral: RegExp;
+  private _index: (d: any) => any;
+
+  constructor(locale: string) {
+    const parts = new NumberFormat(locale).formatToParts(12345.6);
+
+    const numerals = [
+      ...new NumberFormat(locale, { useGrouping: false }).format(9876543210),
+    ].reverse();
+
+    const index = new Map(numerals.map((d, i) => [d, i]));
+
+    this._group = new RegExp(
+      `[${parts.find((d) => d.type === 'group')?.value}]`,
+      'g',
+    );
+
+    this._decimal = new RegExp(
+      `[${parts.find((d) => d.type === 'decimal')?.value}]`,
+    );
+
+    this._numeral = new RegExp(`[${numerals.join('')}]`, 'g');
+    this._index = (d) => index.get(d);
+  }
+
+  parse(value: string) {
+    value = value
+      ?.trim()
+      ?.replace(this._group, '')
+      ?.replace(this._decimal, '.')
+      ?.replace(this._numeral, this._index);
+
+    return value ? +value : NaN;
+  }
+}
+
+export { NumberParser };

package/src/Sentry/Build.ts

@@ -0,0 +1,67 @@
+// sentry-cli sourcemaps inject --org <org> --project <project> ./build/static/js && sentry-cli sourcemaps upload --org <org> --project <project> ./build/static/js
+
+import SentryCli from '@sentry/cli';
+import { SourceMapOptions } from '../interfaces/Sentry/SourceMapOptions';
+import { deleteFile } from '../Utils/Files';
+
+/**
+ * Create Sentry release and upload to Sentry host.
+ *
+ * @param {SourceMapOptions} options
+ * @return {Promise<void>}
+ */
+const releaseSourceMap = async (options: SourceMapOptions): Promise<void> => {
+  if (
+    !options.requiredEnvForSourceMap ||
+    options.requiredEnvForSourceMap.length <= 0
+  ) {
+    options.requiredEnvForSourceMap = ['production'];
+  }
+
+  if (!options.urlPrefix) {
+    options.urlPrefix = '';
+  }
+
+  if (!options.includeFolder || options.includeFolder.length <= 0) {
+    console.error('includeFolder value is empty.');
+    return;
+  }
+
+  if (!options.requiredEnvForSourceMap.includes(options.env)) {
+    console.log(
+      'No need to upload sentry source map, required env:',
+      options.requiredEnvForSourceMap,
+    );
+
+    options.includeFolder.forEach((folder) => deleteFile(folder, ['.map']));
+
+    return;
+  }
+
+  try {
+    const cli = new SentryCli();
+
+    console.log('Now creating sentry release ' + options.release);
+
+    await cli.releases.new(options.release);
+
+    console.log('Now uploading source maps');
+    await cli.releases.uploadSourceMaps(options.release, {
+      urlPrefix: options.urlPrefix,
+      include: options.includeFolder,
+      rewrite: true,
+      validate: true,
+      useArtifactBundle: true,
+    });
+
+    console.log('Releasing release');
+
+    await cli.releases.finalize(options.release);
+
+    options.includeFolder.forEach((folder) => deleteFile(folder, ['.map']));
+  } catch (ex) {
+    console.error('Source maps uploading failed:', ex);
+  }
+};
+
+export { releaseSourceMap };

package/src/Sentry/React.ts

@@ -0,0 +1,127 @@
+import * as Sentry from '@sentry/react';
+import { InitOptions } from '../interfaces/Sentry/InitOptions';
+import { StringRegexArr } from '../types/Sentry/OptionType';
+import { recordSentryHttp } from './Utils';
+
+/**
+ * Initialize Sentry for React.
+ *
+ * @param {InitOptions} options
+ * @return {void}
+ */
+const initSentry = (options: InitOptions): void => {
+  let shouldSendToSentry = options?.requiredEnvForSendToSentry?.includes(
+    options.env,
+  );
+
+  let ignoreErrors: StringRegexArr = [
+    /antd:/,
+    /is deprecated in StrictMode/,
+    /React Intl/,
+  ];
+
+  if (options?.ignoreErrorsOptions) {
+    ignoreErrors = ignoreErrors.concat(options.ignoreErrorsOptions);
+  }
+
+  if (options?.options?.ignoreErrors) {
+    ignoreErrors = ignoreErrors.concat(options.options.ignoreErrors);
+    delete options.options.ignoreErrors;
+  }
+
+  let integrations: any[] = [];
+
+  if (
+    options?.httpClientIntegrationOptions?.failedRequestStatusCodes &&
+    options?.httpClientIntegrationOptions?.failedRequestTargets
+  ) {
+    integrations.push(
+      Sentry.httpClientIntegration({
+        failedRequestStatusCodes:
+          options.httpClientIntegrationOptions.failedRequestStatusCodes,
+        failedRequestTargets:
+          options.httpClientIntegrationOptions.failedRequestTargets,
+      }),
+    );
+  }
+
+  if (options?.captureConsoleIntegrationOptions?.levels) {
+    integrations.push(
+      Sentry.captureConsoleIntegration({
+        levels: options.captureConsoleIntegrationOptions.levels,
+      }),
+    );
+  }
+
+  if (options?.options?.hasOwnProperty('integrations')) {
+    options.options.integrations = [
+      ...options.options.integrations,
+      ...integrations,
+    ];
+  } else {
+    options.options = options.options || {};
+    options.options.integrations = integrations;
+  }
+
+  let sentryOptions: Sentry.BrowserOptions = {
+    dsn: options.dsn,
+    debug: options.debug,
+    release: options.release,
+    environment: options.env,
+    ignoreErrors: ignoreErrors,
+    sampleRate: 1.0,
+    maxBreadcrumbs: 50,
+    attachStacktrace: true,
+    autoSessionTracking: true,
+    sendClientReports: true,
+    enableTracing: true,
+    // Performance Monitoring
+    tracesSampleRate: 1.0, //  Capture 100% of the transactions
+    // Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled
+    tracePropagationTargets: ['localhost'],
+    sendDefaultPii: true,
+    beforeSend: (event) => {
+      if (
+        event?.message?.includes('antd:') ||
+        event?.message?.includes('is deprecated in StrictMode') ||
+        event?.message?.includes('React Intl') ||
+        !shouldSendToSentry
+      ) {
+        return null;
+      }
+
+      return event;
+    },
+  };
+
+  if (options?.beforeSend) {
+    sentryOptions.beforeSend = options.beforeSend;
+  }
+
+  if (options?.options) {
+    sentryOptions = {
+      ...sentryOptions,
+      ...options.options,
+    };
+  }
+
+  Sentry.init(sentryOptions);
+};
+
+/**
+ * Record additional http data for Sentry.
+ *
+ * @param {any | null} config
+ * @param {any | null} request
+ * @param {any | null} response
+ * @return {void}
+ */
+const recordAdditionalSentryHttp = (
+  config?: any,
+  request?: any,
+  response?: any,
+) => {
+  recordSentryHttp(Sentry, config, request, response);
+};
+
+export { initSentry, recordAdditionalSentryHttp };

package/src/Sentry/ReactNative.ts

@@ -0,0 +1,133 @@
+import {
+  captureConsoleIntegration,
+  httpClientIntegration,
+} from '@sentry/integrations';
+import * as Sentry from '@sentry/react-native';
+import { InitOptionsRN } from '../interfaces/Sentry/InitOptionsRN';
+import { StringRegexArr } from '../types/Sentry/OptionType';
+import { recordSentryHttp } from './Utils';
+
+/**
+ * Initialize Sentry for React Native.
+ *
+ * @param {InitOptionsRN} options
+ * @return {void}
+ */
+const initSentry = (options: InitOptionsRN): void => {
+  let shouldSendToSentry = options?.requiredEnvForSendToSentry?.includes(
+    options.env,
+  );
+
+  let ignoreErrors: StringRegexArr = [/StallTracking/];
+
+  if (options?.ignoreErrorsOptions) {
+    ignoreErrors = ignoreErrors.concat(options.ignoreErrorsOptions);
+  }
+
+  if (options?.options?.ignoreErrors) {
+    ignoreErrors = ignoreErrors.concat(options.options.ignoreErrors);
+    delete options.options.ignoreErrors;
+  }
+
+  let integrations: any[] = [];
+
+  if (
+    options?.httpClientIntegrationOptions?.failedRequestStatusCodes &&
+    options?.httpClientIntegrationOptions?.failedRequestTargets
+  ) {
+    integrations.push(
+      httpClientIntegration({
+        failedRequestStatusCodes:
+          options.httpClientIntegrationOptions.failedRequestStatusCodes,
+        failedRequestTargets:
+          options.httpClientIntegrationOptions.failedRequestTargets,
+      }),
+    );
+  }
+
+  if (options?.captureConsoleIntegrationOptions?.levels) {
+    integrations.push(
+      captureConsoleIntegration({
+        levels: options.captureConsoleIntegrationOptions.levels,
+      }),
+    );
+  }
+
+  if (options?.options?.hasOwnProperty('integrations')) {
+    options.options.integrations = [
+      ...options.options.integrations,
+      ...integrations,
+    ];
+  } else {
+    options.options = options.options || {};
+    options.options.integrations = integrations;
+  }
+
+  let sentryOptions: Sentry.ReactNativeOptions = {
+    dsn: options.dsn,
+    debug: options.debug,
+    environment: options.env,
+    ignoreErrors: ignoreErrors,
+    sampleRate: 1.0,
+    maxBreadcrumbs: 50,
+    autoSessionTracking: true,
+    attachScreenshot: true,
+    enableCaptureFailedRequests: true,
+    enableTracing: true,
+    tracesSampleRate: 1.0,
+    enableNative: true,
+    autoInitializeNativeSdk: true,
+    enableNativeCrashHandling: true,
+    enableNativeNagger: true,
+    enableAutoSessionTracking: true,
+    enableNdkScopeSync: true,
+    attachThreads: true,
+    enableAutoPerformanceTracing: true,
+    enableWatchdogTerminationTracking: true,
+    enableAppHangTracking: true,
+    appHangTimeoutInterval: 5,
+    sendDefaultPii: true,
+    beforeSend: (event) => {
+      if (event?.message?.includes('StallTracking') || !shouldSendToSentry) {
+        return null;
+      }
+
+      return event;
+    },
+  };
+
+  if (options?.release) {
+    sentryOptions.release = options.release;
+  }
+
+  if (options?.beforeSend) {
+    sentryOptions.beforeSend = options.beforeSend;
+  }
+
+  if (options?.options) {
+    sentryOptions = {
+      ...sentryOptions,
+      ...options.options,
+    };
+  }
+
+  Sentry.init(sentryOptions);
+};
+
+/**
+ * Record additional http data for Sentry.
+ *
+ * @param {any | null} config
+ * @param {any | null} request
+ * @param {any | null} response
+ * @return {void}
+ */
+const recordAdditionalSentryHttp = (
+  config?: any,
+  request?: any,
+  response?: any,
+) => {
+  recordSentryHttp(Sentry, config, request, response);
+};
+
+export { initSentry, recordAdditionalSentryHttp };

package/src/Sentry/Utils.ts

@@ -0,0 +1,26 @@
+const recordSentryHttp = (
+  Sentry: any,
+  config?: any,
+  request?: any,
+  response?: any,
+) => {
+  if (config) {
+    Sentry.withScope((scope: any) => {
+      scope.setContext('config', config);
+    });
+  }
+
+  if (request) {
+    Sentry.withScope((scope: any) => {
+      scope.setContext('request', request);
+    });
+  }
+
+  if (response) {
+    Sentry.withScope((scope: any) => {
+      scope.setContext('response', response);
+    });
+  }
+};
+
+export { recordSentryHttp };

package/src/Utils/Files.ts

@@ -0,0 +1,51 @@
+import { lstatSync, readdir, unlinkSync } from 'fs';
+import * as path from 'path';
+
+/**
+ * @param {string} path - The path.
+ * @returns {boolean} Whether path is a directory, otherwise always false.
+ */
+const isDir = (path: string): boolean => {
+  try {
+    const stat = lstatSync(path);
+    return stat.isDirectory();
+  } catch (error) {
+    // lstatSync throws an error if path doesn't exist
+    return false;
+  }
+};
+
+/**
+ * @param {string} dirPath - Directory path.
+ * @param {string[]} exts - List of Extension file need to be removed.
+ * @returns {void}
+ */
+const deleteFile = (dirPath: string, exts: string[]): void => {
+  readdir(dirPath, (err, files) => {
+    if (err) {
+      console.error(err);
+    }
+
+    files.forEach((file) => {
+      const fileDir = path.join(`${dirPath}/${file}`);
+      // Get the extension name of the file, lowercase it, then see if it is in the array of extensions
+      // defined above. If so, remove it.
+
+      if (isDir(fileDir)) {
+        deleteFile(fileDir, exts);
+        return;
+      }
+
+      if (
+        file.toLowerCase() === '.ds_store' ||
+        exts.includes(path.extname(file).toLowerCase())
+      ) {
+        unlinkSync(fileDir);
+
+        console.log(`File: ${fileDir} deleted successfully.`);
+      }
+    });
+  });
+};
+
+export { deleteFile };

package/src/config-cli.ts

@@ -0,0 +1,152 @@
+import { GoogleAuth } from 'google-auth-library';
+import { JSONClient } from 'google-auth-library/build/src/auth/googleauth';
+import { exportConfig, processConfig } from './Config/Config';
+import { authorizeServiceAccount, fetchGoogleSheet } from './Config/GoogleAuth';
+import { exportLocales, processLocales } from './Config/Locales';
+import { ConfigOptions } from './interfaces/Config/ConfigOptions';
+
+export { transformConfig } from './Config/Config';
+export { transformSitemap } from './Config/Sitemap';
+export * from './interfaces/Config/ConfigOptions';
+export * from './interfaces/Config/OutputOptions';
+export type { ExportAs, FormatAs } from './types/Config/OptionType';
+
+/**
+ * Private function to fetch locales
+ *
+ * @param {GoogleAuth<JSONClient>} auth
+ * @param {ConfigOption} options
+ * @return {Promise<void>}
+ */
+const innerFetchLocales = async (
+  auth: GoogleAuth<JSONClient>,
+  options: ConfigOptions,
+): Promise<void> => {
+  // console.log('auth', auth);
+
+  const values = await fetchGoogleSheet(
+    auth,
+    options.spreadsheetId,
+    options.spreadsheetTab,
+  );
+
+  if (!values || values.length === 0) {
+    console.log('No data found.');
+    return;
+  }
+
+  // console.log('values,', values);
+
+  const data = processLocales(values);
+
+  exportLocales(data, options.output);
+};
+
+/**
+ * Private function to fetch config
+ *
+ * @param {GoogleAuth<JSONClient>} auth
+ * @param {ConfigOption} options
+ * @return {Promise<void>}
+ */
+const innerFetchConfig = async (
+  auth: GoogleAuth<JSONClient>,
+  options: ConfigOptions,
+): Promise<void> => {
+  // console.log('auth', auth);
+
+  const values = await fetchGoogleSheet(
+    auth,
+    options.spreadsheetId,
+    options.spreadsheetTab,
+  );
+
+  if (!values || values.length === 0) {
+    console.log('No data found.');
+    return;
+  }
+
+  // console.log('values,', values);
+
+  const data = processConfig(values);
+
+  exportConfig(data, options.output);
+};
+
+/**
+ * Fetch locales
+ *
+ * @param {ConfigOptions} options
+ * @return {void}
+ */
+export const fetchLocales = (options: ConfigOptions): void => {
+  try {
+    const auth = authorizeServiceAccount();
+
+    innerFetchLocales(auth, options);
+  } catch (error) {
+    console.error(error);
+  }
+};
+
+/**
+ * Fetch config
+ *
+ * @param {ConfigOptions} options
+ * @return {void}
+ */
+export const fetchConfig = (options: ConfigOptions): void => {
+  try {
+    const auth = authorizeServiceAccount();
+
+    innerFetchConfig(auth, options);
+  } catch (error) {
+    console.error(error);
+  }
+};
+
+/**
+ * Fetch all format from array options
+ *
+ * @param {ConfigOptions[]} options
+ * @return {void}
+ */
+export const fetchAll = (options: ConfigOptions[]): void => {
+  try {
+    const auth = authorizeServiceAccount();
+
+    options.forEach((option) => {
+      if (option.formatAs === 'locales') {
+        innerFetchLocales(auth, option);
+      } else if (option.formatAs === 'config') {
+        innerFetchConfig(auth, option);
+      }
+    });
+  } catch (error) {
+    console.error(error);
+  }
+};
+
+/**
+ * Fetch raw value
+ *
+ * @param {ConfigOptions} options
+ * @return {Promise<any[][] | null | undefined>}
+ */
+export const fetchRawValue = async (
+  options: ConfigOptions,
+): Promise<any[][] | null | undefined> => {
+  try {
+    const auth = authorizeServiceAccount();
+
+    return await fetchGoogleSheet(
+      auth,
+      options.spreadsheetId,
+      options.spreadsheetTab,
+    );
+  } catch (error) {
+    console.error(error);
+  }
+
+  return null;
+};

package/src/enums/CurrencySymbolEnum.ts

@@ -0,0 +1,5 @@
+export enum CurrencySymbolEnum {
+  TWD = 'NT$', // Taiwan
+  USD = 'US$', // USA
+  VND = '₫', // Vietnam
+}