@crowdin/app-project-module 0.87.0 → 0.88.0

package/out/modules/api/api.js

@@ -191,7 +191,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'crowdin-files-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, crowdin_files_1.default)(config, config.projectIntegration));
         /**
          * @openapi
@@ -225,7 +225,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'file-translation-progress-api',
         }), (0, crowdin_file_progress_1.default)(config.projectIntegration));
         /**
          * @openapi
@@ -252,7 +252,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'integration-files-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, integration_data_1.default)(config.projectIntegration));
         /**
          * @openapi
@@ -280,7 +280,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'crowdin-update-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, crowdin_update_1.default)(config, config.projectIntegration));
         /**
          * @openapi
@@ -308,7 +308,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'integration-update-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, integration_update_1.default)(config, config.projectIntegration));
         /**
          * @openapi
@@ -338,7 +338,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'job-get-api',
         }), (0, job_info_1.default)(config));
         /**
          * @openapi
@@ -364,7 +364,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'job-cancel-api',
         }), (0, job_cancel_1.default)(config));
         /**
          * @openapi
@@ -390,7 +390,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'settings-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, settings_1.default)());
         /**
          * @openapi
@@ -413,7 +413,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'settings-update-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, settings_save_1.default)(config, config.projectIntegration));
         /**
          * @openapi
@@ -449,7 +449,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'sync-settings-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, sync_settings_1.default)());
         /**
          * @openapi
@@ -472,7 +472,7 @@ function addDefaultApiEndpoints(app, config) {
             config,
             optional: false,
             checkSubscriptionExpiration: true,
-            moduleKey: config.projectIntegration.key,
+            moduleKey: 'sync-settings-update-api',
         }), (0, integration_credentials_1.default)(config, config.projectIntegration), (0, sync_settings_save_1.default)(config, config.projectIntegration));
         if (config.projectIntegration.loginForm) {
             /**
@@ -497,7 +497,7 @@ function addDefaultApiEndpoints(app, config) {
                 config,
                 optional: false,
                 checkSubscriptionExpiration: true,
-                moduleKey: config.projectIntegration.key,
+                moduleKey: 'login-data',
             }), (req, res) => {
                 var _a, _b;
                 let fields = [];
@@ -527,7 +527,7 @@ function addDefaultApiEndpoints(app, config) {
                 config,
                 optional: false,
                 checkSubscriptionExpiration: false,
-                moduleKey: config.projectIntegration.key,
+                moduleKey: 'login',
             }), (0, integration_login_1.default)(config, config.projectIntegration));
         }
     }

package/out/modules/integration/handlers/main.js

@@ -77,8 +77,8 @@ function handle(config, integration) {
                 options.zenModeUrl = parentUrl.toString();
             }
             const configurationFields = yield integration.getConfiguration(req.crowdinContext.jwtPayload.context.project_id, req.crowdinApiClient, req.integrationCredentials);
-            options.configurationFields = configurationFields;
-            logger(`Adding configuration fields ${JSON.stringify(configurationFields, null, 2)}`);
+            options.configurationFields = (0, defaults_1.groupFieldsByCategory)(configurationFields);
+            logger(`Adding configuration fields ${JSON.stringify(options.configurationFields, null, 2)}`);
         }
         options.infoModal = integration.infoModal;
         options.syncNewElements = integration.syncNewElements;

package/out/modules/integration/types.d.ts

@@ -327,27 +327,23 @@ export interface OAuthLogin {
      */
     performRefreshTokenRequest?: (currentCredentials: any, loginForm?: any) => Promise<any>;
 }
-export interface File {
+export interface BaseTreeItem {
     id: string;
     name: string;
-    type: SourceFilesModel.FileType;
     parentId?: string;
     nodeType?: IntegrationTreeElementType;
     customContent?: string;
     labels?: LabelTreeElement[];
-    failed?: boolean;
-    excludedTargetLanguages?: string[];
+    disabled?: boolean;
+    tooltip?: string;
     path?: string;
 }
-export interface Folder {
-    id: string;
-    name: string;
-    parentId?: string;
-    nodeType?: IntegrationTreeElementType;
-    customContent?: string;
-    labels?: LabelTreeElement[];
-    path?: string;
+export interface File extends BaseTreeItem {
+    type: SourceFilesModel.FileType;
+    failed?: boolean;
+    excludedTargetLanguages?: string[];
 }
+export type Folder = BaseTreeItem;
 export type TreeItem = File | Folder;
 /**
  * 0 - folder
@@ -359,6 +355,7 @@ export type FormEntity = FormField | FormDelimiter;
 export interface FormDelimiter {
     label?: string;
     labelHtml?: string;
+    category?: string;
 }
 export interface FormField {
     key: string;
@@ -398,6 +395,8 @@ export interface FormField {
      * only for notice type
      */
     noIcon?: boolean;
+    category?: string;
+    position?: number;
 }
 type NoticeType = 'info' | 'warning' | 'danger' | 'success' | 'error' | 'dataLostWarning';
 export interface IntegrationCredentials {
@@ -525,4 +524,8 @@ interface LoginFormTokenResponse {
     expires_in: number;
     refresh_token: string;
 }
+export declare enum DefaultCategory {
+    GENERAL = "General Settings",
+    SYNC = "Sync settings"
+}
 export {};

package/out/modules/integration/types.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SyncSchedule = exports.SyncCondition = exports.Provider = void 0;
+exports.DefaultCategory = exports.SyncSchedule = exports.SyncCondition = exports.Provider = void 0;
 var Provider;
 (function (Provider) {
     Provider["CROWDIN"] = "crowdin";
@@ -17,3 +17,8 @@ var SyncSchedule;
     SyncSchedule[SyncSchedule["DISABLED"] = 0] = "DISABLED";
     SyncSchedule[SyncSchedule["ACTIVE"] = 1 || 3 || 6 || 12 || 24] = "ACTIVE";
 })(SyncSchedule = exports.SyncSchedule || (exports.SyncSchedule = {}));
+var DefaultCategory;
+(function (DefaultCategory) {
+    DefaultCategory["GENERAL"] = "General Settings";
+    DefaultCategory["SYNC"] = "Sync settings";
+})(DefaultCategory = exports.DefaultCategory || (exports.DefaultCategory = {}));

package/out/modules/integration/util/defaults.d.ts

@@ -1,6 +1,6 @@
 import Crowdin, { SourceFilesModel } from '@crowdin/crowdin-api-client';
 import { Config } from '../../../types';
-import { IntegrationLogic } from '../types';
+import { FormEntity, FormField, IntegrationLogic } from '../types';
 export declare function getRootFolder(config: Config, integration: IntegrationLogic, client: Crowdin, projectId: number): Promise<SourceFilesModel.Directory | undefined>;
 export declare function getOauthRoute(integration: IntegrationLogic): string;
 export declare function applyIntegrationModuleDefaults(config: Config, integration: IntegrationLogic): void;
@@ -12,3 +12,7 @@ export declare function constructOauthUrl({ config, integration, clientId, login
 }): string | undefined;
 export declare function getOAuthPollingId(clientId: string): string;
 export declare function getOAuthLoginFormId(clientId: string): string;
+export declare function groupFieldsByCategory(fields: FormEntity[]): {
+    name: string;
+    fields: FormField[];
+}[];

package/out/modules/integration/util/defaults.js

@@ -32,8 +32,9 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getOAuthLoginFormId = exports.getOAuthPollingId = exports.constructOauthUrl = exports.applyIntegrationModuleDefaults = exports.getOauthRoute = exports.getRootFolder = void 0;
+exports.groupFieldsByCategory = exports.getOAuthLoginFormId = exports.getOAuthPollingId = exports.constructOauthUrl = exports.applyIntegrationModuleDefaults = exports.getOauthRoute = exports.getRootFolder = void 0;
 const crowdinAppFunctions = __importStar(require("@crowdin/crowdin-apps-functions"));
+const types_1 = require("../types");
 function getRootFolder(config, integration, client, projectId) {
     return __awaiter(this, void 0, void 0, function* () {
         if (!integration.withRootFolder) {
@@ -158,6 +159,7 @@ function applyIntegrationModuleDefaults(config, integration) {
                 label: 'Show In-Context Pseudo Language',
                 type: 'checkbox',
                 defaultValue: 'false',
+                category: types_1.DefaultCategory.GENERAL,
             });
         }
         if (integration.withCronSync || integration.webhooks) {
@@ -167,6 +169,8 @@ function applyIntegrationModuleDefaults(config, integration) {
                 helpText: `Defines how often content is synced between ${config.name} and Crowdin. Make sure Auto Sync is enabled for selected directories and files in the dual pane view.`,
                 type: 'select',
                 defaultValue: '0',
+                category: types_1.DefaultCategory.SYNC,
+                position: 0,
                 options: [
                     {
                         value: '0',
@@ -200,6 +204,8 @@ function applyIntegrationModuleDefaults(config, integration) {
                     label: 'Automatically sync new translations from Crowdin',
                     type: 'checkbox',
                     dependencySettings: JSON.stringify([{ '#schedule-settings': { type: '!equal', value: ['0'] } }]),
+                    category: types_1.DefaultCategory.SYNC,
+                    position: 1,
                 });
             }
             if ((_o = integration.syncNewElements) === null || _o === void 0 ? void 0 : _o.integration) {
@@ -208,6 +214,8 @@ function applyIntegrationModuleDefaults(config, integration) {
                     label: `Automatically sync new content from  ${config.name}`,
                     type: 'checkbox',
                     dependencySettings: JSON.stringify([{ '#schedule-settings': { type: '!equal', value: ['0'] } }]),
+                    category: types_1.DefaultCategory.SYNC,
+                    position: 2,
                 });
             }
             if (integration.uploadTranslations) {
@@ -217,14 +225,20 @@ function applyIntegrationModuleDefaults(config, integration) {
                     key: 'importEqSuggestions',
                     label: 'Add translations that are the same as the source text',
                     type: 'checkbox',
+                    category: types_1.DefaultCategory.SYNC,
+                    position: 3,
                 }, {
                     key: 'autoApproveImported',
                     label: 'Mark added translations as Approved in Crowdin',
                     type: 'checkbox',
+                    category: types_1.DefaultCategory.SYNC,
+                    position: 4,
                 }, {
                     key: 'translateHidden',
                     label: 'Add translations for hidden source strings in Crowdin',
                     type: 'checkbox',
+                    category: types_1.DefaultCategory.SYNC,
+                    position: 5,
                 });
             }
             defaultSettings.push({
@@ -233,6 +247,8 @@ function applyIntegrationModuleDefaults(config, integration) {
                 type: 'select',
                 defaultValue: '0',
                 dependencySettings: JSON.stringify([{ '#schedule-settings': { type: '!equal', value: ['0'] } }]),
+                category: types_1.DefaultCategory.SYNC,
+                position: 6,
                 options: [
                     {
                         value: '0',
@@ -366,3 +382,38 @@ function getOAuthLoginFormId(clientId) {
     return `oauth_form_${clientId}`;
 }
 exports.getOAuthLoginFormId = getOAuthLoginFormId;
+function groupFieldsByCategory(fields) {
+    const groupedFields = fields.reduce((acc, field) => {
+        if ('key' in field) {
+            const category = field.category || types_1.DefaultCategory.GENERAL;
+            if (!acc[category]) {
+                acc[category] = [];
+            }
+            acc[category].push(field);
+        }
+        return acc;
+    }, {});
+    // Sort fields by position within each category
+    Object.keys(groupedFields).forEach((category) => {
+        groupedFields[category].sort((a, b) => {
+            // If neither has position, maintain original order
+            if (!('position' in a) && !('position' in b)) {
+                return 0;
+            }
+            // If only one has position, the one without position goes to the end
+            if (!('position' in a)) {
+                return 1;
+            }
+            if (!('position' in b)) {
+                return -1;
+            }
+            // If both have position, sort by position value (lower numbers first)
+            return (a.position || 0) - (b.position || 0);
+        });
+    });
+    return Object.entries(groupedFields).map(([category, fields]) => ({
+        name: category,
+        fields,
+    }));
+}
+exports.groupFieldsByCategory = groupFieldsByCategory;

package/out/util/handlebars.js

@@ -39,5 +39,8 @@ exports.engine = (0, express_handlebars_1.default)({
         or: function (a, b, options) {
             return a || b ? options.fn(this) : options.inverse(this);
         },
+        incrementedIndex: function (index) {
+            return index + 1;
+        },
     },
 });

package/out/views/main.handlebars

@@ -258,7 +258,11 @@
                 <crowdin-progress-indicator></crowdin-progress-indicator>
             </div>
             <div id="modal-content">
+              <crowdin-tabs tabs-config='[{{#each configurationFields}}"{{name}}"{{#unless @last}},{{/unless}}{{/each}}]' active-tab="1">
                 {{#each configurationFields}}
+                <div slot="tab-{{incrementedIndex @index}}">
+                  <div class="crowdin-form">
+                    {{#each fields}}
                     {{#if key}}
                         {{#ifeq type "checkbox"}}
                             <crowdin-checkbox
@@ -395,7 +399,11 @@
                             data-dependency="{{dependencySettings}}"
                         {{/if}}
                     ></div>
+                    {{/each}}
+                  </div>
+                </div>
                 {{/each}}
+              </crowdin-tabs>
             </div>
             <div slot="footer">
                 <crowdin-button id="settings-save-btn" outlined onclick="saveSettings()">Save</crowdin-button>
@@ -529,6 +537,8 @@
                         id: e.id,
                         customContent: e.customContent,
                         labels: e.labels,
+                        disabled: e.disabled,
+                        tooltip: e.tooltip,
                     };
                     if (e.type) {
                         item.type = e.type;
@@ -584,6 +594,8 @@
                         id: e.id,
                         customContent: e.customContent,
                         labels: e.labels,
+                        disabled: e.disabled,
+                        tooltip: e.tooltip,
                     };
                     if (e.type) {
                         item.isNew = e.isNew;
@@ -1178,26 +1190,31 @@
 
         function saveSettings() {
             setLoader('#settings-modal');
-            const settingsElements = Array.from(document.getElementById('modal-content').children);
+            const settingsElements = Array.from(document.querySelectorAll('#modal-content crowdin-tabs > div'));
             const tags = ['crowdin-checkbox', 'crowdin-select', 'crowdin-input', 'crowdin-textarea'];
             const configReq = {};
-            settingsElements
-                .filter(e => tags.includes(e.tagName.toLowerCase()))
-                .forEach(e => {
-                    const key = e.getAttribute('key');
-                    let value;
-                    if (e.tagName.toLowerCase() === 'crowdin-select') {
-                        value = JSON.parse(e.value);
-                        if (!e.hasAttribute('is-multi')) {
-                            value = value.length > 0 ? value[0] : undefined;
+
+            settingsElements.forEach(tab => {
+                const formElements = Array.from(tab.querySelectorAll('.crowdin-form > *'));
+                formElements
+                    .filter(e => tags.includes(e.tagName.toLowerCase()))
+                    .forEach(e => {
+                        const key = e.getAttribute('key');
+                        let value;
+                        if (e.tagName.toLowerCase() === 'crowdin-select') {
+                            value = JSON.parse(e.value);
+                            if (!e.hasAttribute('is-multi')) {
+                                value = value.length > 0 ? value[0] : undefined;
+                            }
+                        } else if (e.tagName.toLowerCase() === 'crowdin-checkbox') {
+                            value = !!e.checked;
+                        } else {
+                            value = e.value;
                         }
-                    } else if (e.tagName.toLowerCase() === 'crowdin-checkbox') {
-                        value = !!e.checked;
-                    } else {
-                        value = e.value;
-                    }
-                    configReq[key] = value;
-                });
+                        configReq[key] = value;
+                    });
+            });
+
             settingsSaveBtn.setAttribute('disabled', true);
             checkOrigin()
                 .then(restParams => fetch('api/settings' + restParams, {

package/package.json

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