@crowdin/app-project-module 0.92.0 → 0.94.0

package/out/types.d.ts

@@ -261,7 +261,7 @@ export interface ClientConfig extends ImagePath {
     /**
      * property that tells backend that AiProvider and AiPromptProvider modules can cooperate only with each one
      */
-    restrictAiToSameApp: boolean;
+    restrictAiToSameApp?: boolean;
 }
 export interface Environments {
     environments?: Environment | Environment[];

package/out/views/main.handlebars

@@ -287,6 +287,7 @@
                                 {{#if dependencySettings}}
                                     data-dependency="{{dependencySettings}}"
                                 {{/if}}
+                                onchange="settingsFieldChange(this)"
                             >
                             </crowdin-checkbox>
                         {{/ifeq}}
@@ -312,6 +313,7 @@
                                     data-dependency="{{dependencySettings}}"
                                 {{/if}}
                                 is-position-fixed
+                                onchange="settingsFieldChange(this)"
                             >
                                 {{#each options}}
                                     <option
@@ -340,6 +342,7 @@
                                     data-dependency="{{dependencySettings}}"
                                 {{/if}}
                                 value="{{#if defaultValue}}{{defaultValue}}{{/if}}"
+                                onchange="settingsFieldChange(this)"
                             >
                             </crowdin-input>
                         {{/ifeq}}
@@ -357,7 +360,9 @@
                                 {{#if dependencySettings}}
                                     data-dependency="{{dependencySettings}}"
                                 {{/if}}
-                                value="{{#if defaultValue}}{{defaultValue}}{{/if}}">
+                                value="{{#if defaultValue}}{{defaultValue}}{{/if}}"
+                                onchange="settingsFieldChange(this)"
+                            >
                             </crowdin-textarea>
                         {{/ifeq}}
                         {{#ifeq type "notice"}}
@@ -457,7 +462,7 @@
 <script type="text/javascript">
     document.body.addEventListener('refreshFilesList', (e) => {
         if (e.detail.refreshIntegration) {
-            getIntegrationData(true);
+            getIntegrationData({ hardReload: true });
         } else if (e.detail.refreshCrowdin) {
             getCrowdinData();
         }
@@ -468,7 +473,7 @@
         }
         {{#if integrationOneLevelFetching}}
             if (event.detail.componentId === 'integration-files' && event.detail.isOpen) {
-                getIntegrationData(false, event.detail.id);
+                getIntegrationData({ parentId: event.detail.id, recursion: event.detail.recursion });
             }
         {{/if}}
     });
@@ -479,7 +484,7 @@
     });
     {{#if integrationSearchListener}}
         document.body.addEventListener("integrationFilterChange", (event) => {
-            getIntegrationData(false, 0, event.detail);
+            getIntegrationData({ search: event.detail });
         })
     {{/if}}
     const appComponent = document.querySelector('crowdin-simple-integration');
@@ -516,7 +521,7 @@
     let fileToSync = [];
 
     getCrowdinData();
-    getIntegrationData();
+    getIntegrationData({});
     getActiveJobs();
 
     function integrationLogout() {
@@ -583,12 +588,12 @@
             .finally(() => (appComponent.setAttribute('is-crowdin-loading', false)));
     }
 
-    function getIntegrationData(hardReload = false, parentId = '', search = '', page = 0) {
+    function getIntegrationData({ hardReload = false, parentId = '', search = '', page = 0, recursion = false } = {}, recursionState = null) {
         appComponent.setAttribute('is-integration-loading', true);
-        checkOrigin()
+        return checkOrigin()
             .then(restParams => fetch(`api/integration/data${restParams}&parent_id=${encodeURIComponent(parentId)}&search=${encodeURIComponent(search)}&page=${page}`))
             .then(checkResponse)
-            .then((res) => {
+            .then(async (res) => {
                 const files = res.data;
                 const stopPagination = res.stopPagination;
                 const tree = files.map(e => {
@@ -642,12 +647,61 @@
                     const openIds = files.filter(e => !e.type).map(e => e.id);
                     appComponent.setIntegrationOpenedFolders(openIds);
                 }
+
+                if (recursion) {
+                    if (!recursionState) {
+                        recursionState = {
+                            openedFolders: new Set(),
+                            calls: 0,
+                            setLoading(isLoading) {
+                                appComponent.setAttribute('is-integration-loading', isLoading);
+                            },
+                        };
+                        recursionState.setLoading(true);
+                    }
+
+                    if (parentId) {
+                        recursionState.openedFolders.add(parentId);
+                    }
+
+                    const folderItems = files.filter(isFolder);
+
+                    if (folderItems.length === 0) {
+                        return Promise.resolve();
+                    }
+
+                    folderItems.forEach(folder => recursionState.openedFolders.add(folder.id));
+
+                    const currentOpenedFolders = await appComponent.getIntegrationOpenedFolders();
+                    appComponent.setIntegrationOpenedFolders([...currentOpenedFolders, ...recursionState.openedFolders]);
+
+                    const recursivePromises = folderItems.map(async folder => {
+                        recursionState.calls++;
+
+                        try {
+                            return getIntegrationData({ parentId: folder.id, recursion: true }, recursionState);
+                        } finally {
+                            recursionState.calls--;
+                            if (recursionState.calls === 0) {
+                                recursionState.setLoading(false);
+                            }
+                        }
+                    });
+
+                    return Promise.all(recursivePromises);
+                }
             })
             {{#or withCronSync webhooks}}
                 .then(() => getSyncSettings('integration'))
             {{/or}}
             .catch(e => catchRejection(e, 'Can\'t fetch {{name}} templates'))
-            .finally(() => (appComponent.setAttribute('is-integration-loading', false)));
+            .finally(() => {
+                if (!recursionState && !recursion) {
+                    appComponent.setAttribute('is-integration-loading', false);
+                } else if (recursionState && recursionState.calls === 0) {
+                    appComponent.setAttribute('is-integration-loading', false);
+                }
+            });
     }
 
     function getSyncSettings(provider) {
@@ -1315,6 +1369,7 @@
                     });
             });
 
+            let isValidationError = false;
             settingsSaveBtn.setAttribute('disabled', true);
             checkOrigin()
                 .then(restParams => fetch('api/settings' + restParams, {
@@ -1327,15 +1382,33 @@
                     showToast('Settings successfully saved');
                     config = configReq;
                 })
-                .catch(e => catchRejection(e, 'Can\'t save settings'))
+                .catch(e => {
+                    if (e?.error && e?.error?.type === 'validation_error') {
+                        Object.keys(e?.error?.details).forEach(key => {
+                            const el = document.getElementById(`${key}-settings`);
+                            if (el) {
+                                el.setAttribute('error', 'true');
+                                el.setAttribute('error-text', e?.error?.details[key]);
+                            }
+                        });
+
+                        isValidationError = true;
+                        showToast(e?.error?.details?.message || 'Can\'t save settings');
+                        settingsSaveBtn.removeAttribute('disabled');
+                        return;
+                    }
+                    catchRejection(e, 'Can\'t save settings')
+                })
                 .finally(() => {
                     unsetLoader('#settings-modal');
                     settingsSaveBtn.removeAttribute('disabled');
-                    closeModal(settingsModal);
-                    {{#if reloadOnConfigSave}}
-                        getIntegrationData(true);
-                        getCrowdinData();
-                    {{/if}}
+                    if (!isValidationError) {
+                        closeModal(settingsModal);
+                        {{#if reloadOnConfigSave}}
+                            getIntegrationData({ hardReload: true });
+                            getCrowdinData();
+                        {{/if}}
+                    }
                 });
         }
     {{else}}
@@ -1375,7 +1448,7 @@
 
     {{#if integrationPagination}}
         document.body.addEventListener('fileListEnd', (e) => {
-            getIntegrationData(false, 0, '', e.detail.page)
+            getIntegrationData({ page: e.detail.page });
         })
     {{/if}}
 
@@ -1770,6 +1843,15 @@
       modal.style.display = 'none';
       modal.close()
     }
+
+    function settingsFieldChange(el) {
+        el.removeAttribute('error');
+        el.removeAttribute('error-text');
+    }
+
+    function isFolder(e) {
+      return !e.type && (e.nodeType === undefined || e.nodeType === folderType || e.nodeType === branchType);
+    }
 </script>
 
 </html>

package/out/views/partials/head.handlebars

@@ -26,24 +26,28 @@
                 crossorigin="anonymous"
             ></script>
             <script>
-                Sentry.init({
-                    dsn: "{{sentryData.dsn}}",
-                    environment: "frontend",
-                    replaysSessionSampleRate: 0,
-                    replaysOnErrorSampleRate: 1.0,
-                    integrations: [new Sentry.Replay()],
-                });
+                if (typeof Sentry !== 'undefined') {
+                    Sentry.init({
+                        dsn: "{{sentryData.dsn}}",
+                        environment: "frontend",
+                        replaysSessionSampleRate: 0,
+                        replaysOnErrorSampleRate: 1.0,
+                        integrations: [new Sentry.Replay()],
+                    });
 
-                Sentry.configureScope(function(scope) {
-                    scope.setTag("identifier", "{{sentryData.appIdentifier}}");
+                    Sentry.configureScope(function(scope) {
+                        scope.setTag("identifier", "{{sentryData.appIdentifier}}");
 
-                    AP.getContext(contextData => {
-                        const { user_id, ...rest } = contextData;
+                        AP.getContext(contextData => {
+                            const { user_id, ...rest } = contextData;
 
-                        user_id && scope.setUser({ id: user_id });
-                        scope.setTags(rest);
+                            user_id && scope.setUser({ id: user_id });
+                            scope.setTags(rest);
+                        });
                     });
-                });
+                } else {
+                    console.warn('Sentry is not available. This might be due to ad/tracking blockers or network issues.');
+                }
             </script>
         {{/if}}
 </head>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crowdin/app-project-module",
-  "version": "0.92.0",
+  "version": "0.94.0",
   "description": "Module that generates for you all common endpoints for serving standalone Crowdin App",
   "main": "out/index.js",
   "types": "out/index.d.ts",