@zeesoft/i18n-verify 2.0.2 → 2.1.0

package/dist/utils/reportFactory/html/template/javascript/insight.js

@@ -4,221 +4,246 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = () => `
-//Cards of locales
- (() => {
-        document.addEventListener("DOMContentLoaded", function () {
-          renderCards();
-
-          // helper methods to generate cards and its sections
-          function createStatSection(data) {
-            const isDefaultLocale = false; // dynamically pass
-            const holder = document.createElement("div");
-            const table = document.createElement("table");
-            const tbody = document.createElement("tbody");
-            const name = document.createElement("div");
-            const tableData = {
-              Reviewed: 1000,
-              "Internationlized Strings": 600,
-              "Not Internationlized Strings": 100,
-              "Untranslated Strings": 50,
-              "Encoding Issue Strings": 15,
-              "DNT Strings": 15,
-              "Auto Ignored Strings": 20,
-              "Internationlized Numbers": 20,
-              "Not Internationlized Numbers": 20,
-              "Internationlized Currency": 20,
-              "Not Internationlized Currency": 20,
-              "Internationlized Date": 20,
-              "Not Internationlized Date": 20,
-              "Internationlized Time": 20,
-              "Not Internationlized Time": 20,
-              "Internationlized DateTime": 20,
-              "Not Internationlized DateTime": 20,
-            };
-            const addRow = (name, value) => {
-              const row = document.createElement("tr");
-
-              const col1 = document.createElement("td");
-              col1.classList.add("name");
-              col1.textContent = name;
-
-              const col2 = document.createElement("td");
-              col2.classList.add("value");
-              col2.textContent = value;
-
-              row.appendChild(col1);
-              row.appendChild(col2);
-              return row;
-            };
-
-            for (const rowData of Object.entries(tableData)) {
-              if (!isDefaultLocale || rowData[0] !== "Untranslated Strings") {
-                tbody.appendChild(addRow(rowData[0], rowData[1]));
-              }
+var _default = () => `// insights content
+      (() => {
+      if (!DataStore.ranSuccessfully()) {
+        document.getElementById('overview').innerHTML =
+          'Unable to prepare zQA automation report for the project.';
+        return;
+      }
+
+      document.addEventListener('DOMContentLoaded', function () {
+        renderCards();
+
+        // helper methods to generate cards and its sections
+        function createStatSection(locale, data) {
+          const isDefaultLocale = DataStore.isDefaultLocale(locale);
+          const holder = document.createElement('div');
+          const table = document.createElement('table');
+          const tbody = document.createElement('tbody');
+          const name = document.createElement('div');
+          const tableData = {
+            Reviewed: data.reviewed,
+            'Internationlized Strings':
+              data.localizedStrings +
+              data.untranslatedStrings +
+              data.partialStrings,
+            'Not Internationlized Strings': data.notLocalizedStrings,
+            'Untranslated Strings': data.untranslatedStrings,
+            'Encoding Issue Strings': data.encoding,
+            'DNT Strings': data.dnt,
+            'Ignored Strings': data.ignored,
+            'Auto Ignored Strings': data.autoIgnored,
+            'User Input Strings': data.userInput,
+            'Internationlized Numbers': data.localizedNumber,
+            'Not Internationlized Numbers': data.notLocalizedNumber,
+            'Internationlized Currency': data.localizedCurrency,
+            'Not Internationlized Currency': data.notLocalizedCurrency,
+            'Not Internationlized Numbers': data.notLocalizedNumber,
+            'Internationlized Percentage': data.localizedPercentage,
+            'Not Internationlized Percentage': data.notLocalizedPercentage,
+            'Internationlized Date': data.localizedDate,
+            'Not Internationlized Date': data.notLocalizedDate,
+            'Internationlized Time': data.localizedTime,
+            'Not Internationlized Time': data.notLocalizedTime,
+            'Internationlized DateTime': data.localizedDate,
+            'Not Internationlized DateTime': data.notLocalizedDateTime
+          };
+          const addRow = (name, value) => {
+            const row = document.createElement('tr');
+
+            const col1 = document.createElement('td');
+            col1.classList.add('name');
+            col1.textContent = name;
+
+            const col2 = document.createElement('td');
+            col2.classList.add('value');
+            col2.textContent = value;
+
+            row.appendChild(col1);
+            row.appendChild(col2);
+            return row;
+          };
+
+          for (const rowData of Object.entries(tableData)) {
+            if (!isDefaultLocale || rowData[0] !== 'Untranslated Strings') {
+              tbody.appendChild(addRow(rowData[0], rowData[1]));
             }
-
-            holder.classList.add("stat");
-            name.classList.add("name");
-            name.textContent = "Summary";
-            holder.append(name);
-
-            table.appendChild(tbody);
-            holder.appendChild(table);
-            return holder;
           }
 
-          function createStatusBarSection(data) {
-            const holder = document.createElement("div");
-            holder.classList.add("status-bar");
-
-            const generateBarEl = (name, total, current) => {
-              current = (current / total) * 100;
-              const holder = document.createElement("div");
-              holder.classList.add("bar-container");
-
-              const nameHolder = document.createElement("div");
-              nameHolder.classList.add("name");
-              nameHolder.textContent = name;
-
-              const barHolder = document.createElement("div");
-              barHolder.classList.add("bar-holder");
-
-              const bar = document.createElement("div");
-              bar.classList.add("bar");
-              bar.style.width = \`\${current}%\`;
-              bar.textContent = \`\${current}%\`;
-
-              barHolder.appendChild(bar);
-              holder.appendChild(nameHolder);
-              holder.appendChild(barHolder);
-
-              return holder;
+          holder.classList.add('stat');
+          name.classList.add('name');
+          name.textContent = 'Summary';
+          holder.append(name);
+
+          table.appendChild(tbody);
+          holder.appendChild(table);
+          return holder;
+        }
+
+        function createStatusBarSection(locale, data) {
+          const holder = document.createElement('div');
+          holder.classList.add('status-bar');
+
+          const generateBarEl = (name, total, current) => {
+            const getColorClass = (value) => {
+              if (value <= 25) {
+                return 'red';
+              } else if (value <= 50) {
+                return 'yellow';
+              } else if (value <= 75) {
+                return 'blue';
+              } else if (value <= 100) {
+                return 'green';
+              }
             };
+            current = (current / total) * 100;
+            current = isNaN(current) || !isFinite(current) ? 0 : current;
+            const holder = document.createElement('div');
+            holder.classList.add('bar-container');
 
-            const isDefaultLocale = false; // should be dynamically passed
-            const totalStrings = isDefaultLocale ? 100 : 100; // reviewed - ignore - dnt - autoignore - encoding
-            const totalI18nedStr = isDefaultLocale ? 100 : 70;
-            const totalLocStr = isDefaultLocale ? 100 : 90;
-            const totalI18nedNum = isDefaultLocale ? 100 : 50;
-            const totalI18nedDateTime = isDefaultLocale ? 100 : 80;
+            const nameHolder = document.createElement('div');
+            nameHolder.classList.add('name');
+            nameHolder.textContent = name;
 
-            holder.appendChild(
-              generateBarEl("String I18n level", totalStrings, totalI18nedStr)
-            );
-            holder.appendChild(
-              generateBarEl("String L10n level", totalStrings, totalLocStr)
-            );
-            holder.appendChild(
-              generateBarEl("Number I18n level", totalStrings, totalI18nedNum)
-            );
-            holder.appendChild(
-              generateBarEl(
-                "DateTime I18n level",
-                totalStrings,
-                totalI18nedDateTime
-              )
-            );
-            return holder;
-          }
+            const barHolder = document.createElement('div');
+            barHolder.classList.add('bar-holder');
 
-          function generateCardContents(data) {
-            const cardContent = document.createElement("div");
-            cardContent.classList.add("card-content");
+            const bar = document.createElement('div');
+            bar.classList.add('bar');
+            bar.classList.add(\`--\${getColorClass(current)}\`);
+            bar.style.width = \`\${current}%\`;
+            bar.textContent = \`\${current.toFixed(0)}%\`;
 
-            cardContent.appendChild(createStatusBarSection(data));
-            cardContent.appendChild(createStatSection(data));
-            return cardContent;
-          }
+            barHolder.appendChild(bar);
+            holder.appendChild(nameHolder);
+            holder.appendChild(barHolder);
 
-          function createCardEl(locale, data) {
-            const card = document.createElement("div");
-            const title = document.createElement("div");
-            card.classList.add("card");
-            card.dataset.locale = locale;
-            title.classList.add("title");
-            title.textContent = \`\${locale} details\`;
-
-            // fire menu selection event on clicking the card
-            card.addEventListener("click", () => {
-              const previousSelectedSubMenu = document.querySelector(
-                '.sub-menu-item.selected'
-              );
-              if (previousSelectedSubMenu) {
-                window.previousSelectedLocale =
-                  previousSelectedSubMenu.dataset.locale;
-              }
+            return holder;
+          };
+
+          const isDefaultLocale = DataStore.isDefaultLocale(locale),
+            totalI18nCount = isDefaultLocale
+              ? 100
+              : data.localizedStrings +
+                data.untranslatedStrings +
+                data.partialStrings +
+                data.notLocalizedStrings,
+            i18nStrings = isDefaultLocale
+              ? 100
+              : data.localizedStrings +
+                data.untranslatedStrings +
+                data.partialStrings,
+            totalLocCount = isDefaultLocale
+              ? 100
+              : totalI18nCount -
+                data.untranslatedStrings -
+                data.notLocalizedStrings,
+            totalNumberCount = isDefaultLocale
+              ? 100
+              : data.localizedNumber +
+                data.localizedCurrency +
+                data.localizedPercentage +
+                data.notLocalizedPercentage +
+                data.notLocalizedCurrency +
+                data.notLocalizedNumber,
+            i18nNumbers = isDefaultLocale
+              ? 100
+              : totalNumberCount -
+                data.notLocalizedPercentage -
+                data.notLocalizedCurrency -
+                data.notLocalizedNumber,
+            totalI18nDateTimeCount = isDefaultLocale
+              ? 100
+              : data.localizedDate +
+                data.localizedDateTime +
+                data.localizedTime +
+                data.notLocalizedDate +
+                data.notLocalizedDateTime +
+                data.notLocalizedTime,
+            i18nDateTime = isDefaultLocale
+              ? 100
+              : totalI18nDateTimeCount -
+                data.notLocalizedDate -
+                data.notLocalizedDateTime -
+                data.notLocalizedTime;
+
+          holder.appendChild(
+            generateBarEl('String I18n level', totalI18nCount, i18nStrings)
+          );
+
+          holder.appendChild(
+            generateBarEl('String L10n level', totalI18nCount, totalLocCount)
+          );
+
+          holder.appendChild(
+            generateBarEl('Number I18n level', totalNumberCount, i18nNumbers)
+          );
+
+          holder.appendChild(
+            generateBarEl(
+              'DateTime I18n level',
+              totalI18nDateTimeCount,
+              i18nDateTime
+            )
+          );
+          return holder;
+        }
+
+        function generateCardContents(locale, data) {
+          const cardContent = document.createElement('div');
+          cardContent.classList.add('card-content');
+
+          cardContent.appendChild(createStatusBarSection(locale, data));
+          cardContent.appendChild(createStatSection(locale, data));
+          return cardContent;
+        }
+
+        function createCardEl(locale, data) {
+          const card = document.createElement('div');
+          const title = document.createElement('div');
+          card.classList.add('card');
+          card.dataset.locale = locale;
+          title.classList.add('title');
+          title.textContent = \`\${locale} details\`;
+
+          // fire menu selection event on clicking the card
+          card.addEventListener('click', () => {
+            const previousSelectedSubMenu = document.querySelector(
+              '.sub-menu-item.selected'
+            );
+            if (previousSelectedSubMenu) {
+              window.previousSelectedLocale =
+                previousSelectedSubMenu.dataset.locale;
+            }
 
-              document
-                .querySelector(\`.sub-menu-item[data-locale="\${locale}"]\`)
-                .click();
-            });
+            document
+              .querySelector(\`.sub-menu-item[data-locale="\${locale}"]\`)
+              .click();
+          });
 
-            card.appendChild(title);
-            card.appendChild(generateCardContents(data));
-            return card;
-          }
+          card.appendChild(title);
+          card.appendChild(generateCardContents(locale, data));
+          return card;
+        }
 
-          function renderCards() {
-            // read from global variable appData;
-            const localeInfo = {
-              en_US: {
-                total: 1000,
-                localized: 700,
-                notLocalized: 100,
-                untranslated: 50,
-                encodingIssue: 20,
-                dnt: 15,
-                ignored: 10,
-                autoIgnored: 5,
-                currency: 20,
-                number: 20,
-                percentage: 15,
-                dateTime: 15,
-                date: 15,
-                time: 15,
-                notLocalizedcurrency: 20,
-                notLocalizednumber: 20,
-                notLocalizedpercentage: 15,
-                notLocalizeddateTime: 15,
-                notLocalizeddate: 15,
-                notLocalizedtime: 15,
-              },
-              fr_FR: {
-                total: 1000,
-                localized: 700,
-                notLocalized: 100,
-                untranslated: 50,
-                encodingIssue: 20,
-                dnt: 15,
-                ignored: 10,
-                autoIgnored: 5,
-                currency: 20,
-                number: 20,
-                percentage: 15,
-                dateTime: 15,
-                date: 15,
-                time: 15,
-                notLocalizedCurrency: 20,
-                notLocalizedNumber: 20,
-                notLocalizedPercentage: 15,
-                notLocalizedDateTime: 15,
-                notLocalizedDate: 15,
-                notLocalizedTime: 15,
-              },
-            };
+        function renderCards() {
+          // read from global variable appData;
+          const localeInfo = DataStore.getLocalesData();
 
-            if (Object.keys(localeInfo).length) {
-              const cardHolder = document.querySelector(
-                "#insights .cards .holder"
+          if (Object.keys(localeInfo).length) {
+            const cardHolder = document.querySelector(
+              '#insights .cards .holder'
+            );
+            for (const locale in localeInfo) {
+              const cardEl = createCardEl(
+                locale,
+                DataStore.getStatByLocale(locale)
               );
-              for (const locale in localeInfo) {
-                const cardEl = createCardEl(locale, localeInfo[locale]);
-                cardHolder.appendChild(cardEl);
-              }
+              cardHolder.appendChild(cardEl);
             }
           }
-        });
-      })();
-`;
+        }
+      });
+    })();`;
 exports.default = _default;

package/dist/utils/reportFactory/html/template/javascript/menuBar.js

@@ -4,22 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _default = () => `(() => {
+var _default = metaData => `(() => {
         // for sidebar menu
         const loadContent = (section, highlightMenu = false) => {
           if (highlightMenu) {
             document
               .querySelector('li[data-page="overview"]')
-              ?.classList.add("selected");
+              ?.classList.add('selected');
           }
 
-          const contents = document.querySelectorAll(".content");
+          const contents = document.querySelectorAll('.content');
           contents.forEach((content) => {
             content.id !== section
-              ? content.classList.remove("active")
-              : content.classList.add("active");
+              ? content.classList.remove('active')
+              : content.classList.add('active');
 
-            section === "overview" &&
+            section === 'overview' &&
               window.persistOverviewCharts &&
               window.persistOverviewCharts();
 
@@ -27,92 +27,97 @@ var _default = () => `(() => {
           });
         };
 
-        document.addEventListener("DOMContentLoaded", function () {
+        document.addEventListener('DOMContentLoaded', function () {
           const createMenuItems = (() => {
-            const ul = document.querySelector(".sidebar .submenu");
+            const ul = document.querySelector('.sidebar .submenu');
             const createListItems = (locale) => {
-              const li = document.createElement("li");
-              li.classList.add("sub-menu-item");
+              const li = document.createElement('li');
+              li.classList.add('sub-menu-item');
               li.dataset.locale = locale;
 
-              const a = document.createElement("a");
-              a.href = "#";
+              const a = document.createElement('a');
+              a.href = '#';
               a.textContent = locale;
 
               li.appendChild(a);
               return li;
             };
 
-            for (const locale of Object.keys(DataStore.getLocalesData())) {
+            for (const locale of DataStore.getLocales()) {
               ul.appendChild(createListItems(locale));
             }
           })();
 
-          const menuItems = document.querySelectorAll(".menu-item"),
-            submenuItems = document.querySelectorAll(".sub-menu-item");
+          const menuItems = document.querySelectorAll('.menu-item'),
+            submenuItems = document.querySelectorAll('.sub-menu-item');
 
           menuItems.forEach((item) => {
-            item.addEventListener("click", function (event) {
+            item.addEventListener('click', function (event) {
               const selectedMenuItem = document.querySelector(
-                  ".menu-item.selected"
+                  '.menu-item.selected'
                 ),
-                selectedSubmenu = document.querySelector(".submenu.active"),
+                selectedSubmenu = document.querySelector('.submenu.active'),
                 page = item.dataset.page;
 
               if (selectedMenuItem) {
-                selectedMenuItem.classList.remove("selected");
+                selectedMenuItem.classList.remove('selected');
               }
 
               if (selectedSubmenu) {
-                selectedSubmenu.classList.remove("active");
+                selectedSubmenu.classList.remove('active');
               }
 
-              if (item.classList.contains("has-submenu")) {
+              if (item.classList.contains('has-submenu')) {
                 event.preventDefault();
-                item.classList.add("selected");
-                const submenu = item.querySelector(".submenu");
-                submenu.classList.add("active");
+                item.classList.add('selected');
+                const submenu = item.querySelector('.submenu');
+                submenu.classList.add('active');
               } else {
-                item.classList.add("selected");
+                item.classList.add('selected');
               }
 
               if (selectedSubmenu) {
                 selectedSubmenu
-                  .querySelectorAll(".sub-menu-item")
+                  .querySelectorAll('.sub-menu-item')
                   .forEach((submenuItem) => {
                     submenuItem.textContent !== item.textContent &&
-                      submenuItem.classList.remove("selected");
+                      submenuItem.classList.remove('selected');
                   });
               }
 
               loadContent(page);
             });
 
-            loadContent("overview", true);
+            loadContent('overview', true);
           });
 
           submenuItems.forEach((sItem) => {
-            sItem.addEventListener("click", function (event) {
+            sItem.addEventListener('click', function (event) {
               const selectedSubMenuItem = document.querySelector(
-                ".sub-menu-item.selected"
+                '.sub-menu-item.selected'
               );
               event.preventDefault();
               event.stopPropagation();
 
               if (selectedSubMenuItem) {
-                selectedSubMenuItem.classList.remove("selected");
+                selectedSubMenuItem.classList.remove('selected');
                 window.previousSelectedLocale =
                   selectedSubMenuItem.dataset.locale;
               }
 
-              sItem.classList.add("selected");
-              loadContent("locale");
+              sItem.classList.add('selected');
+              loadContent('locale');
             });
           });
 
           // update footer info
-          const footer = document.querySelector(".sidebar .footer");
-          footer.textContent = \`${new Date().getFullYear()} @ Zeesoft. All rights reserved.\`;
+          const footer = document.querySelector('.sidebar .footer');
+          footer.textContent = \`\${new Date().getFullYear()} @ Zeesoft. All rights reserved.\`;
+
+          // update project info
+          document.querySelector(
+            'header .logo'
+          ).innerHTML = \`zQA Report | \${DataStore.getAppName()}<span class="project-info"><span class="time">Report generated at: \${DataStore.getTimestamp()}</span></span>\`;
         });
       })();`;
 exports.default = _default;