@bigbinary/neeto-commons-frontend 4.13.91 → 4.13.92-beta.1

package/README.md

@@ -80,6 +80,7 @@ React utilities [↗](./docs/react/README.md)
 - [handleMetaClick](./docs/react/utils/handleMetaClick.md)
 - [isMetaKeyPressed](./docs/react/utils/isMetaKeyPressed.md)
 - [withT](./docs/react/utils/withT.md)
+- [lazyWithRetry](./docs/react/utils/lazyWithRetry.md)
 
 </td>
   </tr>

package/configs/esbuild/index.js

@@ -15,6 +15,9 @@ const sass = require("sass");
 const alias = require("./alias.js");
 const { babelPlugin } = require("./plugins/babel.js");
 const { entrypointPlugin } = require("./plugins/entrypoint.js");
+const {
+  packageTranslationsPlugin,
+} = require("./plugins/packageTranslations.js");
 const { prevalPlugin } = require("./plugins/preval.js");
 const { reactGiphyPlugin } = require("./plugins/reactGiphy.js");
 const { virtualizedPlugin } = require("./plugins/virtualized.js");
@@ -49,6 +52,7 @@ const config = {
   plugins: [
     rails(),
     entrypointPlugin(isWatchMode),
+    packageTranslationsPlugin(),
     prevalPlugin(),
     babelPlugin(),
     virtualizedPlugin(),

package/configs/esbuild/plugins/packageTranslations.js

@@ -0,0 +1,16 @@
+const {
+  generateMergedTranslations,
+  writeTranslationsToDisk,
+} = require("../../utils/packageTranslations");
+
+const packageTranslationsPlugin = () => ({
+  name: "package-translations",
+  setup(build) {
+    build.onStart(() => {
+      const mergedTranslations = generateMergedTranslations();
+      writeTranslationsToDisk(mergedTranslations);
+    });
+  },
+});
+
+module.exports = { packageTranslationsPlugin };

package/configs/esbuild/plugins/preval.js

@@ -1,5 +1,13 @@
+/* eslint-disable @bigbinary/neeto/no-dangling-constants */
 /* eslint-disable  import/extensions */
-const PkgTranslations = require("@bigbinary/neeto-commons-frontend/configs/scripts/getPkgTranslations.js");
+const translationImports = require("@bigbinary/neeto-commons-frontend/configs/scripts/buildTranslationImports.js");
+const englishTranslations = require("@bigbinary/neeto-commons-frontend/configs/scripts/getEnglishTranslation.js");
+
+const PREVAL_IMPORT_TRANSLATION_IMPORTS =
+  'preval.require("../../configs/scripts/buildTranslationImports.js")';
+
+const PREVAL_IMPORT_ENGLISH_TRANSLATIONS =
+  'preval.require("../../configs/scripts/getEnglishTranslation.js")';
 
 const prevalPlugin = () => ({
   name: "preval-plugin",
@@ -13,12 +21,14 @@ const prevalPlugin = () => ({
         const fs = require("fs").promises;
         const contents = await fs.readFile(args.path, "utf8");
 
-        const transformedContents = contents.replace(
-          `preval.require("../../configs/scripts/getPkgTranslations.js")`,
-          JSON.stringify(PkgTranslations)
-        );
+        const transformedContent = contents
+          .replace(PREVAL_IMPORT_TRANSLATION_IMPORTS, translationImports)
+          .replace(
+            PREVAL_IMPORT_ENGLISH_TRANSLATIONS,
+            JSON.stringify(englishTranslations)
+          );
 
-        return { contents: transformedContents, loader: "js" };
+        return { contents: transformedContent, loader: "js" };
       }
     );
   },

package/configs/scripts/buildTranslationImports.js

@@ -0,0 +1,22 @@
+const fs = require("fs");
+const path = require("path");
+
+const translationsDir = path.resolve("dist/translations");
+if (!fs.existsSync(translationsDir)) {
+  fs.mkdirSync(translationsDir, { recursive: true });
+}
+
+const files = fs
+  .readdirSync(translationsDir)
+  .filter(file => file.endsWith(".json"));
+
+// Create a map like { "en": () => import("dist/translations/en.json") }
+const entries = files.map(file => {
+  const lang = path.basename(file, ".json");
+
+  return `"${lang}": () => import("${process.cwd()}/dist/translations/${file}")`;
+});
+
+const content = `{ ${entries.join(",\n")} }`;
+
+module.exports = content;

package/configs/scripts/getEnglishTranslation.js

@@ -0,0 +1,17 @@
+const fs = require("fs");
+const path = require("path");
+
+const filePath = path.resolve(process.cwd(), "dist/translations/en.json");
+
+let englishTranslations = {};
+
+try {
+  if (fs.existsSync(filePath)) {
+    const content = fs.readFileSync(filePath, "utf8");
+    englishTranslations = JSON.parse(content);
+  }
+} catch {
+  englishTranslations = {};
+}
+
+module.exports = englishTranslations;

package/configs/utils/packageTranslations.js

@@ -0,0 +1,90 @@
+const fs = require("fs");
+const path = require("path");
+
+const { mergeDeepLeft } = require("ramda");
+
+const getPkgTransPath = pkg => {
+  const packageDir = path.join(__dirname, "../../..");
+
+  const basePath = path.join(packageDir, pkg);
+  const transPath1 = path.join(basePath, "app/javascript/src/translations");
+  const transPath2 = path.join(basePath, "src/translations");
+
+  return fs.existsSync(transPath1) ? transPath1 : transPath2;
+};
+
+const loadTranslations = translationsDir => {
+  try {
+    const jsonFiles = fs
+      .readdirSync(translationsDir)
+      .filter(file => file.endsWith(".json"))
+      .map(file => path.join(translationsDir, file));
+
+    const translations = {};
+
+    jsonFiles.forEach(jsonFile => {
+      const content = fs.readFileSync(jsonFile, "utf8");
+      const basename = path.basename(jsonFile, ".json");
+      translations[basename] = { translation: JSON.parse(content) };
+    });
+
+    return translations;
+  } catch {
+    return {};
+  }
+};
+
+const generatePackageTranslations = () => {
+  const packageDir = "./node_modules/@bigbinary";
+  const packages = fs.readdirSync(packageDir);
+
+  return packages
+    .map(pkg => {
+      const transPath = getPkgTransPath(pkg);
+
+      return fs.existsSync(transPath) ? loadTranslations(transPath) : {};
+    })
+    .reduce(mergeDeepLeft, {});
+};
+
+const getHostTranslations = () => {
+  const hostTranslationsDir = "./app/javascript/src/translations";
+
+  return fs.existsSync(hostTranslationsDir)
+    ? loadTranslations(hostTranslationsDir)
+    : {};
+};
+
+const generateMergedTranslations = () => {
+  const packageTranslations = generatePackageTranslations();
+  const hostTranslations = getHostTranslations();
+
+  return mergeDeepLeft(hostTranslations, packageTranslations);
+};
+
+const writeTranslationsToDisk = mergedTranslations => {
+  const publicTranslationsDir = path.join(
+    process.cwd(),
+    "dist",
+    "translations"
+  );
+
+  if (!fs.existsSync(publicTranslationsDir)) {
+    fs.mkdirSync(publicTranslationsDir, { recursive: true });
+  }
+
+  Object.keys(mergedTranslations).forEach(lang => {
+    const translationData = mergedTranslations[lang];
+    const outputPath = path.join(publicTranslationsDir, `${lang}.json`);
+
+    fs.writeFileSync(
+      outputPath,
+      JSON.stringify(translationData.translation, null, 2)
+    );
+  });
+};
+
+module.exports = {
+  generateMergedTranslations,
+  writeTranslationsToDisk,
+};

package/configs/vite/index.js

@@ -1,9 +1,13 @@
 /* eslint-disable  import/extensions */
+
 const { default: viteYaml } = require("@modyfi/vite-plugin-yaml");
 const { default: react } = require("@vitejs/plugin-react");
 const dotenv = require("dotenv");
 
 const { nanoDevelopmentPlugin } = require("./plugins/nanoDevelopment.js");
+const {
+  packageTranslationsPlugin,
+} = require("./plugins/packageTranslations.js");
 const { prevalPlugin } = require("./plugins/preval.js");
 const { reactGiphyPlugin } = require("./plugins/reactGiphy.js");
 const svgr = require("./plugins/svgr.js");
@@ -25,6 +29,7 @@ const config = {
     react({ babel: VITE_BABEL_CONFIG }),
     virtualizedPlugin(),
     reactGiphyPlugin(),
+    packageTranslationsPlugin(),
     prevalPlugin(),
     viteYaml(),
     nanoDevelopmentPlugin(),

package/configs/vite/plugins/packageTranslations.js

@@ -0,0 +1,14 @@
+const {
+  generateMergedTranslations,
+  writeTranslationsToDisk,
+} = require("../../utils/packageTranslations");
+
+const packageTranslationsPlugin = () => ({
+  name: "package-translations",
+  buildStart() {
+    const mergedTranslations = generateMergedTranslations();
+    writeTranslationsToDisk(mergedTranslations);
+  },
+});
+
+module.exports = { packageTranslationsPlugin };

package/configs/vite/plugins/preval.js

@@ -1,23 +1,45 @@
 /* eslint-disable  import/extensions */
 /* eslint-disable @bigbinary/neeto/no-dangling-constants */
 
-const getUncachedTranslations = () => {
-  delete require.cache[require.resolve("../../scripts/getPkgTranslations.js")];
+const getUncachedTranslationImports = () => {
+  delete require.cache[
+    require.resolve("../../scripts/buildTranslationImports.js")
+  ];
 
-  return require("../../scripts/getPkgTranslations.js");
+  return require("../../scripts/buildTranslationImports.js");
 };
 
-const PREVAL_IMPORT =
-  'preval.require("../../configs/scripts/getPkgTranslations.js")';
+const getUncachedEnglishTranslations = () => {
+  delete require.cache[
+    require.resolve("../../scripts/getEnglishTranslation.js")
+  ];
+
+  return require("../../scripts/getEnglishTranslation.js");
+};
+
+const PREVAL_IMPORT_TRANSLATION_IMPORTS =
+  'preval.require("../../configs/scripts/buildTranslationImports.js")';
+
+const PREVAL_IMPORT_ENGLISH_TRANSLATIONS =
+  'preval.require("../../configs/scripts/getEnglishTranslation.js")';
 
 const prevalPlugin = () => ({
   name: "preval-plugin",
   transform(code, id) {
-    if (id.includes("node_modules") && code.includes(PREVAL_IMPORT)) {
-      const replacedCode = code.replace(
-        PREVAL_IMPORT,
-        JSON.stringify(getUncachedTranslations())
-      );
+    if (
+      id.includes("node_modules") &&
+      (code.includes(PREVAL_IMPORT_TRANSLATION_IMPORTS) ||
+        code.includes(PREVAL_IMPORT_ENGLISH_TRANSLATIONS))
+    ) {
+      const replacedCode = code
+        .replace(
+          PREVAL_IMPORT_TRANSLATION_IMPORTS,
+          getUncachedTranslationImports()
+        )
+        .replace(
+          PREVAL_IMPORT_ENGLISH_TRANSLATIONS,
+          JSON.stringify(getUncachedEnglishTranslations())
+        );
 
       return { code: replacedCode, map: null };
     }

package/dist/cjs/initializers/i18n.js

@@ -427,147 +427,52 @@ var Browser = /*#__PURE__*/function () {
 }();
 Browser.type = 'languageDetector';
 
-var generic = {
-	error: "Something went wrong. Please try again later."
-};
-var authentication = {
-	notLoggedIn: "Could not authenticate, please login to continue!",
-	couldNotAuth: "Could not authenticate with the provided {{parameter}}.",
-	incorrectPassword: "Current password is incorrect. Please try again.",
-	incorrectEmailPassword: "Incorrect email or password. Please try again."
-};
-var authorization = {
-	unauthorized: "You are not authorized to perform this action."
-};
-var resource = {
-	add_one: "{{entity}} has been added successfully.",
-	add_other: "{{entity}} have been added successfully.",
-	save: "{{entity}} has been saved successfully.",
-	save_one: "{{entity}} has been saved successfully.",
-	save_other: "{{entity}} have been saved successfully.",
-	update: "{{entity}} has been updated successfully.",
-	update_one: "{{entity}} has been updated successfully.",
-	update_other: "{{entity}} have been updated successfully.",
-	delete_one: "{{entity}} has been deleted successfully.",
-	delete_other: "{{entity}} have been deleted successfully.",
-	clone: "{{entity}} has been cloned successfully.",
-	notFound: "{{entity}} does not exist.",
-	remove_one: "{{entity}} has been removed successfully.",
-	remove_other: "{{entity}} have been removed successfully.",
-	sent: "{{entity}} sent successfully.",
-	merged: "{{entity}} have been successfully merged.",
-	disconnected: "{{entity}} has been successfully disconnected."
-};
-var otp = {
-	sent: "OTP has been sent successfully.",
-	invalid: "Invalid OTP",
-	verified: "OTP has been verified successfully."
-};
-var upload = {
-	error: "An error occurred while uploading the file"
-};
-var image = {
-	profile: {
-		removalFailed: "Failed to remove profile picture",
-		removalSuccess: "Profile picture successfully removed"
-	},
-	contentTypeInvalid: "Other than jpg, png, svg are not supported",
-	sizeOutOfRange: "Should not be more than {{maxSize, number}} MB"
-};
-var userRole = {
-	deactivateActiveAdmin: "You cannot deactivate active admin from the workspace!"
-};
-var activeRecord = {
-	error: {
-		blankName: "Name can't be blank",
-		blankDescription: "Description can't be blank",
-		blankValue: "Value can't be blank",
-		prefixType: "Prefix type {{value}} is not valid",
-		minimumEntryLimit: "Minimum entry limit must be less than or equal to {{maximumEntryLimit, number}}",
-		maximumEntryLimit: "Maximum entry limit must be greater than or equal to {{minimumEntryLimit, number}}"
-	}
-};
-var sessions = {
-	expiry: "Your session has expired. Please login again."
-};
-var payment = {
-	error: {
-		incomplete: "Your payment could not be completed"
-	}
-};
-var invitations = {
-	deleted_one: "Invitation has been deleted successfully",
-	deleted_other: "{{count, number}} Invitations have been deleted successfully",
-	sent_one: "Invitation has been sent successfully",
-	sent_other: "{{count, number}} Invitations have been sent successfully",
-	notFound: "{{email}} was not invited to test this website."
-};
-var github = {
-	error: {
-		webhookPermissionDenied: "Permission denied. Ensure you have permission to create webhooks for the repository.",
-		primaryNonDeletable: "Primary Github account cannot be deleted."
-	}
-};
-var neetoCommons = {
-	fallbackComponent: {
-		somethingWentWrong: "Sorry, something went wrong.",
-		description: "Please try <reloading>reloading</reloading> the page.<br> If the problem persists, <contactus>contact us</contactus>."
-	},
-	toastr: {
-		success: {
-			copiedToClipboard: "Copied to clipboard!"
-		},
-		error: {
-			noInternetConnection: "No Internet Connection.",
-			networkError: "Network error. Please check your connection and try again."
-		}
-	},
-	notice: {
-		errorOccurred: "Some error occurred."
-	},
-	validators: {
-		isRequired: "{{what}} is required.",
-		mustNotContainCapitalLetters: "{{what}} must not contain capital letters.",
-		mustNotContainSpaces: "{{what}} must not contain spaces.",
-		mustNotContainSpecialCharactersExceptHyphen: "{{what}} must not contain any special characters, except '-'",
-		mustNotStartOrEndWithSpecialCharacters: "{{what}} must not start or end with special characters."
-	},
-	copyToClipboard: {
-		failed: "Failed to copy to clipboard"
-	}
-};
-var commonsEn = {
-	generic: generic,
-	authentication: authentication,
-	authorization: authorization,
-	resource: resource,
-	otp: otp,
-	upload: upload,
-	image: image,
-	userRole: userRole,
-	activeRecord: activeRecord,
-	sessions: sessions,
-	payment: payment,
-	invitations: invitations,
-	github: github,
-	neetoCommons: neetoCommons
+var resourcesToBackend = function resourcesToBackend(res) {
+  return {
+    type: 'backend',
+    init: function init(services, backendOptions, i18nextOptions) {},
+    read: function read(language, namespace, callback) {
+      if (typeof res === 'function') {
+        if (res.length < 3) {
+          try {
+            var r = res(language, namespace);
+            if (r && typeof r.then === 'function') {
+              r.then(function (data) {
+                return callback(null, data && data.default || data);
+              }).catch(callback);
+            } else {
+              callback(null, r);
+            }
+          } catch (err) {
+            callback(err);
+          }
+          return;
+        }
+        res(language, namespace, callback);
+        return;
+      }
+      callback(null, res && res[language] && res[language][namespace]);
+    }
+  };
 };
 
 // eslint-disable-next-line import/no-mutable-exports
 exports.taxonomies = {};
-var initializeI18n = function initializeI18n(hostTranslations) {
+var initializeI18n = function initializeI18n() {
   var _window$globalProps, _window$globalProps2;
+  var hostTranslations = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var enableDirAttribute = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
   document.documentElement.removeAttribute("lang");
   var userLanguage = (_window$globalProps = window.globalProps) === null || _window$globalProps === void 0 || (_window$globalProps = _window$globalProps.user) === null || _window$globalProps === void 0 ? void 0 : _window$globalProps.language;
   if (userLanguage) document.documentElement.setAttribute("lang", userLanguage);
-  var packageTranslations = preval.require("../../../configs/scripts/getPkgTranslations.js");
-  var commonsTranslations = {
+  var translationImports = preval.require("../../../configs/scripts/buildTranslationImports.js");
+  var englishTranslations = preval.require("../../../configs/scripts/getEnglishTranslation.js");
+  var englishResource = {
     en: {
-      translation: commonsEn
+      translation: englishTranslations || {}
     }
   };
-  var resources = [hostTranslations, commonsTranslations, packageTranslations].reduce(ramda.mergeDeepLeft);
+  var resources = ramda.mergeDeepLeft(hostTranslations, englishResource);
   var defaultTaxonomyKeys = Object.keys(resources.en.translation.taxonomyDefaultLabels || {});
   var defaultTaxonomies = Object.fromEntries(defaultTaxonomyKeys.map(function (key) {
     return [key, {
@@ -577,8 +482,12 @@ var initializeI18n = function initializeI18n(hostTranslations) {
   }));
   var hostTaxonomies = ((_window$globalProps2 = window.globalProps) === null || _window$globalProps2 === void 0 ? void 0 : _window$globalProps2.taxonomies) || {};
   exports.taxonomies = initializers_utils_utils.replaceNullValuesWithGetter(ramda.mergeDeepLeft(hostTaxonomies, defaultTaxonomies));
-  i18next.use(Browser).use(reactI18next.initReactI18next).use(initializers_utils_customPostProcessors.sentenceCaseProcessor).init({
+  i18next.use(Browser).use(reactI18next.initReactI18next).use(initializers_utils_customPostProcessors.sentenceCaseProcessor).use(resourcesToBackend(function (language) {
+    var _translationImports$l;
+    return translationImports === null || translationImports === void 0 || (_translationImports$l = translationImports[language]) === null || _translationImports$l === void 0 ? void 0 : _translationImports$l.call(translationImports);
+  })).init({
     resources: resources,
+    partialBundledLanguages: true,
     fallbackLng: "en",
     interpolation: {
       defaultVariables: {