@crowdin/app-project-module 2.8.0 → 2.9.0

package/out/static/ui/main.bundle.js

@@ -17758,9 +17758,37 @@
   }
 
   /// <reference path="../../../../ui/types.d.ts" />
+  const APPLICATION_SETTINGS_DESCRIPTION = 'This can be configured in organization settings (Apps section).';
+  // Crowdin only widens visibility for users the current mode doesn't already cover, so a
+  // share with someone who is an admin already leaves an admins-only app untouched. Per-user
+  // admin status isn't exposed to the dialog, hence copy that states the rule rather than
+  // promising a switch.
+  function getVisibilityDescription({ isAdmin, currentAccessMode }) {
+      if (!isAdmin) {
+          return `${APPLICATION_SETTINGS_DESCRIPTION} Only organization admins have permission to update this setting.`;
+      }
+      if (currentAccessMode === 'owner') {
+          return ('This app is currently available to organization admins only. If any of the users listed here is ' +
+              'not an admin, sharing switches it to Custom Access — all admins keep access, and these users are ' +
+              'added. If they are all admins already, the visibility setting stays unchanged.');
+      }
+      if (currentAccessMode === 'restricted') {
+          return "These users will be added to this app's Custom Access list.";
+      }
+      return APPLICATION_SETTINGS_DESCRIPTION;
+  }
   function usePermissions({ userId, hasOrganization, permissionsModalRef }) {
       const usersSelectRef = reactExports.useRef(null);
+      const connectionOwnerIdRef = reactExports.useRef(null);
+      const initialManagerIdsRef = reactExports.useRef(new Set());
+      // Distinguishes a deliberate self-removal from a save that merely never included the user.
+      const actingUserPreselectedRef = reactExports.useRef(false);
+      // Monotonic ids so out-of-order validations and slow loads can't clobber newer state.
+      const checkUsersSeqRef = reactExports.useRef(0);
+      const permissionsOpenSeqRef = reactExports.useRef(0);
       const [isLoading, setIsLoading] = reactExports.useState(false);
+      // Gates Save until the user list loads, so a failed load can't save an empty list.
+      const [isPermissionsLoaded, setIsPermissionsLoaded] = reactExports.useState(false);
       const [permissionUserOptions, setPermissionUserOptions] = reactExports.useState([]);
       const [permissionsSelectedValue, setPermissionsSelectedValue] = reactExports.useState('[]');
       const [permissionsSummary, setPermissionsSummary] = reactExports.useState(null);
@@ -17776,7 +17804,10 @@
           if (!selectElement) {
               return;
           }
-          const handleChange = () => checkUsers();
+          const handleChange = () => {
+              enforceOwnerPresence();
+              checkUsers();
+          };
           selectElement.addEventListener('change', handleChange);
           return () => selectElement.removeEventListener('change', handleChange);
       }, []);
@@ -17797,44 +17828,101 @@
           setIsPermissionsConfirmVisible(true);
           (_a = permissionsModalRef.current) === null || _a === void 0 ? void 0 : _a.removeAttribute('body-overflow-unset');
       }
+      // The backend force-keeps the owner anyway, so bounce the removal back instead of
+      // silently dropping it on save.
+      function enforceOwnerPresence() {
+          const select = usersSelectRef.current;
+          const ownerId = connectionOwnerIdRef.current;
+          if (!select || !ownerId || !initialManagerIdsRef.current.has(ownerId)) {
+              return;
+          }
+          let current = [];
+          try {
+              const parsed = JSON.parse(select.value);
+              current = (Array.isArray(parsed) ? parsed : []).map((id) => `${id}`);
+          }
+          catch {
+              current = [];
+          }
+          if (!current.includes(ownerId)) {
+              select.value = JSON.stringify([...current, ownerId]);
+              showToast("The integration owner can't be removed from the access list.");
+          }
+      }
       async function showPermissionsDialog() {
+          var _a;
           hideConfirmUsersBlock();
           openModal(permissionsModalRef.current);
           setIsLoading(true);
           setPermissionsSelectedValue('[]');
+          // Reset before the async load, so a change event mid-load can't act on the
+          // previous session's state.
+          setIsPermissionsLoaded(false);
+          connectionOwnerIdRef.current = null;
+          initialManagerIdsRef.current = new Set();
+          actingUserPreselectedRef.current = false;
+          checkUsersSeqRef.current++;
+          const openSeq = ++permissionsOpenSeqRef.current;
           try {
-              const [managers, users] = await Promise.all([
-                  new Promise((resolve) => {
+              const [usersData, users] = await Promise.all([
+                  new Promise((resolve, reject) => {
                       checkOrigin()
                           .then((restParams) => fetch('api/users' + restParams))
                           .then(checkResponse)
-                          .then((res) => resolve(JSON.stringify(res.data.managers)));
+                          .then((res) => resolve(res.data))
+                          .catch(reject);
                   }),
+                  // Includes the current user, so a share auto-includes the person doing it.
                   new Promise((resolve) => {
-                      AP.getUsers((res) => {
-                          const users = Object.values(res).filter((user) => user.id !== Number(userId));
-                          resolve(users);
-                      });
+                      AP.getUsers((res) => resolve(Object.values(res)));
                   }),
               ]);
-              const parsedManagers = (JSON.parse(managers) || []);
+              if (openSeq !== permissionsOpenSeqRef.current) {
+                  return;
+              }
+              const { managers, ownerId } = usersData || {};
+              const parsedManagers = (managers || []);
               const validUserIds = new Set(users.map((user) => `${user.id}`));
-              const filteredManagers = parsedManagers.filter((id) => validUserIds.has(id));
+              const storedManagers = parsedManagers.filter((id) => validUserIds.has(id));
+              // Ids are compared as strings; a missing owner id must stay null, not become "undefined".
+              connectionOwnerIdRef.current = (_a = ownerId === null || ownerId === void 0 ? void 0 : ownerId.toString()) !== null && _a !== void 0 ? _a : null;
+              // Baseline for telling additions from removals: stored managers plus the owner
+              // (who always has access). The acting user is deliberately NOT seeded.
+              initialManagerIdsRef.current = new Set(storedManagers);
+              if (connectionOwnerIdRef.current && validUserIds.has(connectionOwnerIdRef.current)) {
+                  initialManagerIdsRef.current.add(connectionOwnerIdRef.current);
+              }
+              const preselected = new Set(storedManagers);
+              if (validUserIds.has(`${userId}`)) {
+                  preselected.add(`${userId}`);
+                  actingUserPreselectedRef.current = true;
+              }
+              if (connectionOwnerIdRef.current && validUserIds.has(connectionOwnerIdRef.current)) {
+                  preselected.add(connectionOwnerIdRef.current);
+              }
               setPermissionUserOptions(users.map((user) => ({
                   id: String(user.id),
                   label: getUserFullName(user),
               })));
-              setPermissionsSelectedValue(JSON.stringify(filteredManagers));
+              setPermissionsSelectedValue(JSON.stringify([...preselected]));
+              setIsPermissionsLoaded(true);
           }
           catch (e) {
-              catchRejection(e, "Can't fetch users");
+              if (openSeq === permissionsOpenSeqRef.current) {
+                  catchRejection(e, "Can't fetch users");
+              }
           }
           finally {
-              setTimeout(() => setIsLoading(false), 500);
+              if (openSeq === permissionsOpenSeqRef.current) {
+                  setTimeout(() => setIsLoading(false), 500);
+              }
           }
       }
       async function checkUsers() {
           setIsLoading(true);
+          // Stamped on every invocation, the empty-selection early-return included, so a
+          // cleared selection also invalidates a validation still in flight.
+          const seq = ++checkUsersSeqRef.current;
           const select = usersSelectRef.current;
           if (select.value === '[]') {
               hideConfirmUsersBlock();
@@ -17846,11 +17934,12 @@
           const emails = users.filter((id) => !parseInt(id));
           try {
               const [appManagers, checkUsersResponse, allUsers] = await Promise.all([
-                  new Promise((resolve) => {
+                  new Promise((resolve, reject) => {
                       checkOrigin()
                           .then((restParams) => fetch('api/users' + restParams))
                           .then(checkResponse)
-                          .then((usersResponse) => resolve(usersResponse.data.managers));
+                          .then((usersResponse) => resolve(usersResponse.data.managers))
+                          .catch(reject);
                   }),
                   new Promise((resolve) => {
                       AP.validateUsers({ user_ids, emails }, (res) => resolve(res.data));
@@ -17859,6 +17948,9 @@
                       AP.getUsers((res) => resolve(res));
                   }),
               ]);
+              if (seq !== checkUsersSeqRef.current) {
+                  return;
+              }
               const newUserEmails = checkUsersResponse.newUserEmails.map((email) => ({ name: email }));
               const newProjectManagers = [
                   ...newUserEmails,
@@ -17873,30 +17965,54 @@
               const newApplicationManagers = [
                   ...newUserEmails,
                   ...Object.values(allUsers)
-                      .filter((user) => users.some((id) => +id === user.id) && !appManagers.some((id) => +id === user.id))
+                      .filter((user) => users.some((id) => +id === user.id) &&
+                      !appManagers.some((id) => +id === user.id) &&
+                      // The owner always has access, so they are never a genuine grant.
+                      `${user.id}` !== connectionOwnerIdRef.current)
                       .map((user) => ({ name: getUserFullName(user) })),
               ];
-              prepareUsersConfirmBlock({
-                  ...checkUsersResponse,
-                  newUserEmails,
-                  newProjectManagers,
-                  newApplicationAccessUsers,
-                  newApplicationManagers,
-              });
+              // The preview is only meaningful for users being granted access; pure removals
+              // are still saved, just without it. Compared against the freshly-fetched managers
+              // rather than an open-time snapshot, so users added by email are caught too.
+              const storedManagerSet = new Set(appManagers.map((id) => `${id}`));
+              const hasAdditions = users
+                  .map((id) => `${id}`)
+                  .some((id) => id !== connectionOwnerIdRef.current && !storedManagerSet.has(id));
+              if (hasAdditions) {
+                  prepareUsersConfirmBlock({
+                      ...checkUsersResponse,
+                      newUserEmails,
+                      newProjectManagers,
+                      newApplicationAccessUsers,
+                      newApplicationManagers,
+                  });
+              }
+              else {
+                  hideConfirmUsersBlock();
+              }
           }
           catch (e) {
-              catchRejection(e, (e === null || e === void 0 ? void 0 : e.error) || "Can't invite users");
+              if (seq === checkUsersSeqRef.current) {
+                  catchRejection(e, (e === null || e === void 0 ? void 0 : e.error) || "Can't invite users");
+              }
           }
           finally {
-              setTimeout(() => setIsLoading(false), 500);
+              if (seq === checkUsersSeqRef.current) {
+                  setTimeout(() => setIsLoading(false), 500);
+              }
           }
       }
       function inviteUsers() {
+          var _a;
           setIsLoading(true);
           const select = usersSelectRef.current;
           const users = JSON.parse(select.value);
           const user_ids = users.filter((id) => parseInt(id));
           const emails = users.filter((id) => !parseInt(id));
+          // The backend force-keeps the acting user unless this flag says otherwise, so an
+          // acting user who is merely absent (e.g. not returned by AP.getUsers) stays protected.
+          const actingUserId = (_a = userId === null || userId === void 0 ? void 0 : userId.toString()) !== null && _a !== void 0 ? _a : null;
+          const allowSelfRemoval = actingUserPreselectedRef.current && !!actingUserId && !users.some((id) => `${id}` === actingUserId);
           AP.inviteUsers({ user_ids, emails }, async (res) => {
               var _a;
               if (!res.success) {
@@ -17909,7 +18025,7 @@
                   const inviteRes = await checkResponse(await fetch('api/invite-users' + restParams, {
                       method: 'POST',
                       headers: { 'Content-Type': 'application/json' },
-                      body: JSON.stringify(res.data),
+                      body: JSON.stringify({ ...res.data, allowSelfRemoval }),
                   }));
                   if (!inviteRes.success) {
                       catchRejection(inviteRes, (inviteRes === null || inviteRes === void 0 ? void 0 : inviteRes.message) || "Can't invite users");
@@ -17930,8 +18046,10 @@
       function prepareUsersConfirmBlock(usersData) {
           showConfirmUsersBlock();
           const toNames = (users = []) => users.map((user) => user.name);
-          const applicationSettingsDescription = 'This can be configured in organization settings (Apps section).';
           const hasApplicationAccessUsers = usersData.newApplicationAccessUsers.length > 0;
+          const visibilityDescription = hasApplicationAccessUsers
+              ? getVisibilityDescription(usersData)
+              : APPLICATION_SETTINGS_DESCRIPTION;
           setPermissionsSummary({
               ...(hasOrganization
                   ? {
@@ -17960,11 +18078,7 @@
                           : 'actionRequired'
                       : 'granted',
                   users: toNames(usersData.newApplicationAccessUsers),
-                  description: hasApplicationAccessUsers
-                      ? usersData.isAdmin
-                          ? applicationSettingsDescription
-                          : `${applicationSettingsDescription} Only organization admins have permission to update this setting.`
-                      : applicationSettingsDescription,
+                  description: visibilityDescription,
                   isWarning: hasApplicationAccessUsers && !usersData.isAdmin,
               },
               applicationCredentials: {
@@ -17976,6 +18090,7 @@
       return {
           usersSelectRef,
           isLoading,
+          isPermissionsLoaded,
           permissionUserOptions,
           permissionsSelectedValue,
           permissionsSummary,
@@ -19250,12 +19365,12 @@
               ? 'mt-1 text-xs text-[var(--crowdin-warning)]'
               : 'mt-1 text-xs text-[var(--crowdin-text-muted)]', children: row.description }));
   }
-  const PermissionsModal = ({ modalRef, usersSelectRef, isLoading, permissionUserOptions, isConfirmVisible, permissionsSummary, hasOrganization, zenModeUrl, onSave, }) => {
+  const PermissionsModal = ({ modalRef, usersSelectRef, isLoading, permissionUserOptions, isConfirmVisible, permissionsSummary, hasOrganization, zenModeUrl, saveDisabled, onSave, }) => {
       return (jsxRuntimeExports.jsxs("crowdin-modal", { ref: modalRef, style: { display: 'none' }, id: "permissions-modal", "modal-title": "Share", "close-button-title": "Close", "close-button": true, "body-overflow-unset": true, children: [jsxRuntimeExports.jsx("div", { className: isLoading ? 'absolute inset-0 z-[4] flex items-center justify-center bg-white/30' : 'hidden', children: jsxRuntimeExports.jsx("crowdin-progress-indicator", {}) }), jsxRuntimeExports.jsxs("div", { children: [jsxRuntimeExports.jsx("div", { children: jsxRuntimeExports.jsx("crowdin-users-select", { ref: usersSelectRef, "allow-new-options": true, "is-multi": true, "is-searchable": true, id: "users", label: "Users", "help-text": "Search for members by name, username, email, or invite new ones using their email.", "is-position-fixed": true, children: permissionUserOptions.map((option) => (jsxRuntimeExports.jsx("option", { value: option.id, children: option.label }, option.id))) }, "users") }), jsxRuntimeExports.jsxs("div", { children: [jsxRuntimeExports.jsx("div", { className: isConfirmVisible ? 'mt-4' : 'hidden', children: jsxRuntimeExports.jsxs("table", { className: "w-full border-separate border-spacing-0", children: [jsxRuntimeExports.jsx("thead", { children: jsxRuntimeExports.jsxs("tr", { children: [jsxRuntimeExports.jsx("th", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left text-sm", style: { width: '40%' }, children: "Access" }), jsxRuntimeExports.jsx("th", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left text-sm", style: { width: '35%' }, children: "Users" }), jsxRuntimeExports.jsx("th", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-right text-sm", style: { width: '20%' }, children: "Upcoming changes" })] }) }), jsxRuntimeExports.jsxs("tbody", { children: [hasOrganization && (jsxRuntimeExports.jsxs("tr", { children: [jsxRuntimeExports.jsxs("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: [jsxRuntimeExports.jsx("crowdin-p", { children: "Registration in Organization" }), renderPermissionRowDescription(permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.organization)] }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: renderPermissionUsers(permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.organization) }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-right align-top", children: (permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.organization) &&
                                                                   renderPermissionStatus(permissionsSummary.organization.status) })] })), jsxRuntimeExports.jsxs("tr", { children: [jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: jsxRuntimeExports.jsx("crowdin-p", { children: "Project Manager Access" }) }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: renderPermissionUsers(permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.project) }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-right align-top", children: (permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.project) &&
                                                                   renderPermissionStatus(permissionsSummary.project.status) })] }), jsxRuntimeExports.jsxs("tr", { children: [jsxRuntimeExports.jsxs("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: [jsxRuntimeExports.jsx("crowdin-p", { children: "Application Visibility Access" }), renderPermissionRowDescription(permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.applicationSettings)] }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: renderPermissionUsers(permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.applicationSettings) }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-right align-top", children: (permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.applicationSettings) &&
                                                                   renderPermissionStatus(permissionsSummary.applicationSettings.status) })] }), jsxRuntimeExports.jsxs("tr", { children: [jsxRuntimeExports.jsxs("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: [jsxRuntimeExports.jsx("crowdin-p", { children: "Access to the Integration" }), jsxRuntimeExports.jsx("div", { className: "mt-1 text-xs text-[var(--crowdin-text-muted)]", children: "This provides access to sync files and modify the current integration settings." })] }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-left align-top", children: renderPermissionUsers(permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.applicationCredentials) }), jsxRuntimeExports.jsx("td", { className: "border-b border-[var(--crowdin-border-color)] p-4 text-right align-top", children: (permissionsSummary === null || permissionsSummary === void 0 ? void 0 : permissionsSummary.applicationCredentials) &&
-                                                                  renderPermissionStatus(permissionsSummary.applicationCredentials.status) })] })] })] }) }), zenModeUrl && (jsxRuntimeExports.jsx("div", { className: "mt-4", children: jsxRuntimeExports.jsx("crowdin-input", { "with-fixed-height": true, label: "Zen Mode link", "help-text": "This focused view allows you to concentrate solely on the Integrations section, eliminating other distractions.", value: zenModeUrl, name: "zenModeLink", "with-copy-button": true }) }))] })] }), jsxRuntimeExports.jsx("div", { slot: "footer", children: jsxRuntimeExports.jsx("crowdin-button", { id: "confirm-users-btn", outlined: true, onClick: onSave, children: "Save" }) })] }));
+                                                                  renderPermissionStatus(permissionsSummary.applicationCredentials.status) })] })] })] }) }), zenModeUrl && (jsxRuntimeExports.jsx("div", { className: "mt-4", children: jsxRuntimeExports.jsx("crowdin-input", { "with-fixed-height": true, label: "Zen Mode link", "help-text": "This focused view allows you to concentrate solely on the Integrations section, eliminating other distractions.", value: zenModeUrl, name: "zenModeLink", "with-copy-button": true }) }))] })] }), jsxRuntimeExports.jsx("div", { slot: "footer", children: jsxRuntimeExports.jsx("crowdin-button", { id: "confirm-users-btn", outlined: true, onClick: onSave, ...(saveDisabled ? { disabled: true } : {}), children: "Save" }) })] }));
   };
 
   const ScheduleModal = ({ modalRef, selectedFilesCheckboxRef, allFolderFilesCheckboxRef, newFilesCheckboxRef, scheduleModalState, isSaveDisabled, onChangeOptions, onSave, }) => {
@@ -19514,7 +19629,7 @@
       return (jsxRuntimeExports.jsxs("div", { children: [jsxRuntimeExports.jsxs("div", { className: "mx-auto max-w-[1420px] px-6 py-4", children: [jsxRuntimeExports.jsx(TopBar, { notice: notice, isNoticeVisible: isNoticeVisible, checkSubscription: checkSubscription, subscriptionInfo: subscriptionInfo, isErrorLogsVisible: isErrorLogsVisible, isManager: isManager, infoModal: infoModal, hasSettings: !!configurationFields, isOwner: isOwner, onCloseNotice: closeAlert, onShowIntegration: showIntegration, onShowErrorLogs: showErrorLogs, onShowPermissions: permissions.showPermissionsDialog, onOpenInfoModal: () => openModal(infoModalRef.current), onOpenSettings: () => {
                               openModal(settingsModalRef.current);
                               settings.fillSettingsForm();
-                          }, onLogout: integrationLogout }), jsxRuntimeExports.jsx(IntegrationView, { appComponentRef: appComponent, userErrorsTableRef: userErrorsTableRef, name: name, isErrorLogsVisible: isErrorLogsVisible, syncNewElements: syncNewElements, withCronSync: withCronSync, webhooks: webhooks, integrationOneLevelFetching: integrationOneLevelFetching, integrationSearchListener: integrationSearchListener, integrationPagination: integrationPagination, filtering: filtering, integrationButtonMenuItems: integrationButtonMenuItems, crowdinButtonMenuItems: crowdinButtonMenuItems })] }), jsxRuntimeExports.jsx("crowdin-toasts", {}), jsxRuntimeExports.jsx("crowdin-async-progress", { ref: asyncProgressRef, cancelAsyncAction: "" }), jsxRuntimeExports.jsx(SubscriptionModal, { modalRef: subscriptionModal, subscriptionLink: subscriptionLink, name: name, onLogout: integrationLogout }), jsxRuntimeExports.jsx(PermissionsModal, { modalRef: permissionsModalRef, usersSelectRef: permissions.usersSelectRef, isLoading: permissions.isLoading, permissionUserOptions: permissions.permissionUserOptions, isConfirmVisible: permissions.isPermissionsConfirmVisible, permissionsSummary: permissions.permissionsSummary, hasOrganization: hasOrganization, zenModeUrl: zenModeUrl, onSave: permissions.inviteUsers }), excludedTargetLanguages && (jsxRuntimeExports.jsx(ExcludedLanguagesModal, { modalRef: syncOps.languageModalRef, languageSelectRef: syncOps.languageSelectRef, languageModalState: syncOps.languageModalState, onUpdateTargetLanguages: syncOps.updateCrowdinFilesTargetLanguages, onSyncToCrowdin: syncOps.uploadFilesToCrowdinWithExcludedLanguages })), infoModal && jsxRuntimeExports.jsx(InfoModal, { modalRef: infoModalRef, infoModal: infoModal }), configurationFields && (jsxRuntimeExports.jsx(SettingsModal, { modalRef: settingsModalRef, isLoading: settings.isLoading, configurationFields: configurationFields, isSaveDisabled: settings.isSettingsSaveDisabled, settingsFieldChange: settings.settingsFieldChange, registerSettingsField: settings.registerSettingsField, onSave: settings.saveSettings })), ((syncNewElements === null || syncNewElements === void 0 ? void 0 : syncNewElements.crowdin) || (syncNewElements === null || syncNewElements === void 0 ? void 0 : syncNewElements.integration)) && (jsxRuntimeExports.jsx(ScheduleModal, { modalRef: scheduleModalRef, selectedFilesCheckboxRef: schedule.selectedFilesCheckboxRef, allFolderFilesCheckboxRef: schedule.allFolderFilesCheckboxRef, newFilesCheckboxRef: schedule.newFilesCheckboxRef, scheduleModalState: schedule.scheduleModalState, isSaveDisabled: schedule.isScheduleSaveDisabled, onChangeOptions: schedule.onChangeAutoSynchronizationOptions, onSave: schedule.saveScheduleSync })), jsxRuntimeExports.jsx(UserErrorDetailModal, { modalRef: userErrorDetailModalRef, selectedUserError: selectedUserError })] }));
+                          }, onLogout: integrationLogout }), jsxRuntimeExports.jsx(IntegrationView, { appComponentRef: appComponent, userErrorsTableRef: userErrorsTableRef, name: name, isErrorLogsVisible: isErrorLogsVisible, syncNewElements: syncNewElements, withCronSync: withCronSync, webhooks: webhooks, integrationOneLevelFetching: integrationOneLevelFetching, integrationSearchListener: integrationSearchListener, integrationPagination: integrationPagination, filtering: filtering, integrationButtonMenuItems: integrationButtonMenuItems, crowdinButtonMenuItems: crowdinButtonMenuItems })] }), jsxRuntimeExports.jsx("crowdin-toasts", {}), jsxRuntimeExports.jsx("crowdin-async-progress", { ref: asyncProgressRef, cancelAsyncAction: "" }), jsxRuntimeExports.jsx(SubscriptionModal, { modalRef: subscriptionModal, subscriptionLink: subscriptionLink, name: name, onLogout: integrationLogout }), jsxRuntimeExports.jsx(PermissionsModal, { modalRef: permissionsModalRef, usersSelectRef: permissions.usersSelectRef, isLoading: permissions.isLoading, permissionUserOptions: permissions.permissionUserOptions, isConfirmVisible: permissions.isPermissionsConfirmVisible, permissionsSummary: permissions.permissionsSummary, hasOrganization: hasOrganization, zenModeUrl: zenModeUrl, saveDisabled: !permissions.isPermissionsLoaded, onSave: permissions.inviteUsers }), excludedTargetLanguages && (jsxRuntimeExports.jsx(ExcludedLanguagesModal, { modalRef: syncOps.languageModalRef, languageSelectRef: syncOps.languageSelectRef, languageModalState: syncOps.languageModalState, onUpdateTargetLanguages: syncOps.updateCrowdinFilesTargetLanguages, onSyncToCrowdin: syncOps.uploadFilesToCrowdinWithExcludedLanguages })), infoModal && jsxRuntimeExports.jsx(InfoModal, { modalRef: infoModalRef, infoModal: infoModal }), configurationFields && (jsxRuntimeExports.jsx(SettingsModal, { modalRef: settingsModalRef, isLoading: settings.isLoading, configurationFields: configurationFields, isSaveDisabled: settings.isSettingsSaveDisabled, settingsFieldChange: settings.settingsFieldChange, registerSettingsField: settings.registerSettingsField, onSave: settings.saveSettings })), ((syncNewElements === null || syncNewElements === void 0 ? void 0 : syncNewElements.crowdin) || (syncNewElements === null || syncNewElements === void 0 ? void 0 : syncNewElements.integration)) && (jsxRuntimeExports.jsx(ScheduleModal, { modalRef: scheduleModalRef, selectedFilesCheckboxRef: schedule.selectedFilesCheckboxRef, allFolderFilesCheckboxRef: schedule.allFolderFilesCheckboxRef, newFilesCheckboxRef: schedule.newFilesCheckboxRef, scheduleModalState: schedule.scheduleModalState, isSaveDisabled: schedule.isScheduleSaveDisabled, onChangeOptions: schedule.onChangeAutoSynchronizationOptions, onSave: schedule.saveScheduleSync })), jsxRuntimeExports.jsx(UserErrorDetailModal, { modalRef: userErrorDetailModalRef, selectedUserError: selectedUserError })] }));
   };
 
   initializeCrowdinIframeContext();