fix(chat): disable editing main fields of a logged-in toolset (Issue #5109) (#7124)

Co-authored-by: Magomed-Elbi_Dzhukalaev <magomed-elbi_dzhukalaev@epam.com>

Author: Gimir

apps/chat/public/locales/en/common.json

@@ -235,5 +235,6 @@
   "Limit exceeded": "Limit exceeded",
   "\"{{name}}\" has already been shared with the maximum specified number of users.": "\"{{name}}\" has already been shared with the maximum specified number of users.",
   "\"{{name}}\" version {{version}} has already been shared with the maximum specified number of users.": "\"{{name}}\" version {{version}} has already been shared with the maximum specified number of users.",
-  "Sharing failed. You are only allowed to share applications with resources from \"My files\"": "Sharing failed. You are only allowed to share applications with resources from \"My files\""
+  "Sharing failed. You are only allowed to share applications with resources from \"My files\"": "Sharing failed. You are only allowed to share applications with resources from \"My files\"",
+  "Log out before editing toolset": "Log out before editing toolset"
 }

apps/chat/src/components/ToolsetEditor/EditorForm/SettingsForm.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import {
   Controller,
   useFormContext,
@@ -10,6 +10,8 @@ import classNames from 'classnames';
 
 import { useTranslation } from '@/src/hooks/useTranslation';
 
+import { isToolsetSignedIn } from '@/src/utils/app/toolsets';
+
 import { DropdownSelectorOption } from '@/src/types/common';
 import { Translation } from '@/src/types/translation';
 
@@ -104,6 +106,7 @@ export const SettingsForm = ({ isToolsetPublic }: SettingsFormProps) => {
   const { t } = useTranslation(Translation.Common);
 
   const toolset = useAppSelector(ToolsetSelectors.selectToolsetDetails);
+  const isLoggedIn = toolset && isToolsetSignedIn(toolset);
   const { register, clearErrors, setValue, control } =
     useFormContext<ToolsetEditorForm>();
   const { errors } = useFormState<ToolsetEditorForm>({ control });
@@ -119,6 +122,13 @@ export const SettingsForm = ({ isToolsetPublic }: SettingsFormProps) => {
     }
   }, [clearErrors, endpointField, setValue]);
 
+  const disabledReason = useMemo(() => {
+    if (isToolsetPublic) return PUBLIC_TOOLSET_TOOLTIP;
+    if (isLoggedIn) return t(CommonI18nKeys.LogOutBeforeEditingToolset);
+
+    return undefined;
+  }, [isLoggedIn, isToolsetPublic, t]);
+
   return (
     <div
       className="flex size-full grow flex-col space-y-4 divide-y divide-tertiary overflow-hidden overflow-y-auto bg-layer-2 py-4 xl:py-5"
@@ -135,8 +145,8 @@ export const SettingsForm = ({ isToolsetPublic }: SettingsFormProps) => {
           placeholder={t(CommonI18nKeys.EnterEndpoint)}
           id="endpoint"
           error={errors.endpoint?.message}
-          tooltip={isToolsetPublic ? PUBLIC_TOOLSET_TOOLTIP : undefined}
-          disabled={isToolsetPublic}
+          tooltip={disabledReason}
+          disabled={!!disabledReason}
         />
         <Controller
           name="protocol"
@@ -155,8 +165,8 @@ export const SettingsForm = ({ isToolsetPublic }: SettingsFormProps) => {
               id="protocol"
               options={protocolOptions}
               closeMenuOnSelect
-              tooltip={isToolsetPublic ? PUBLIC_TOOLSET_TOOLTIP : undefined}
-              isDisabled={isToolsetPublic}
+              tooltip={disabledReason}
+              isDisabled={!!disabledReason}
             />
           )}
         />

apps/chat/src/constants/i18n.ts

@@ -325,6 +325,7 @@ export enum CommonI18nKeys {
   ShareLimitExceeded = '"{{name}}" has already been shared with the maximum specified number of users.',
   ShareLimitExceededWithVersion = '"{{name}}" version {{version}} has already been shared with the maximum specified number of users.',
   ShareApplicationWithPublicResourcesFailed = 'Sharing failed. You are only allowed to share applications with resources from "My files"',
+  LogOutBeforeEditingToolset = 'Log out before editing toolset',
 }
 
 // errors.json