feat(chat): refactor application dialogs, add deployable app dialog draft (Issue #2353)

apps/chat/.env.development

@@ -91,7 +91,7 @@ DIAL_ROLES_FIELD="dial_roles"
 
 
 # Application UI settings
-ENABLED_FEATURES="conversations-section,prompts-section,top-settings,top-clear-conversation,top-chat-info,top-chat-model-settings,empty-chat-settings,header,footer,request-api-key,report-an-issue,likes,conversations-sharing,prompts-sharing,input-files,attachments-manager,conversations-publishing,prompts-publishing,custom-logo,input-links,custom-applications,message-templates,marketplace,quick-apps"
+ENABLED_FEATURES="conversations-section,prompts-section,top-settings,top-clear-conversation,top-chat-info,top-chat-model-settings,empty-chat-settings,header,footer,request-api-key,report-an-issue,likes,conversations-sharing,prompts-sharing,input-files,attachments-manager,conversations-publishing,prompts-publishing,custom-logo,input-links,custom-applications,message-templates,marketplace,quick-apps,code-apps"
 NEXT_PUBLIC_APP_NAME="Local Development APP Name"
 NEXT_PUBLIC_DEFAULT_SYSTEM_PROMPT=""
 NEXT_PUBLIC_DEFAULT_TEMPERATURE="1"

apps/chat/src/components/Chat/ModelList.tsx

@@ -11,7 +11,11 @@ import { useTranslation } from 'next-i18next';
 
 import classNames from 'classnames';
 
-import { getModelDescription, isQuickApp } from '@/src/utils/app/application';
+import {
+  getApplicationType,
+  getModelDescription,
+  isApplicationStatusUpdating,
+} from '@/src/utils/app/application';
 import {
   getOpenAIEntityFullName,
   groupModelsAndSaveOrder,
@@ -37,10 +41,9 @@ import { SettingsSelectors } from '@/src/store/settings/settings.reducers';
 
 import { DESCRIPTION_DELIMITER_REGEX } from '@/src/constants/chat';
 
-import { QuickAppDialog } from '@/src/components/Common/QuickAppDialog';
+import { ApplicationWizard } from '@/src/components/Common/ApplicationWizard/ApplicationWizard';
 
 import { ModelIcon } from '../Chatbar/ModelIcon';
-import { ApplicationDialog } from '../Common/ApplicationDialog';
 import { ConfirmDialog } from '../Common/ConfirmDialog';
 import ContextMenu from '../Common/ContextMenu';
 import { DisableOverlay } from '../Common/DisableOverlay';
@@ -113,6 +116,7 @@ const ModelGroup = ({
 
   const description = getModelDescription(currentEntity);
   const isPublicEntity = isEntityPublic(currentEntity);
+  const isModifyDisabled = isApplicationStatusUpdating(currentEntity);
 
   const handleSelectVersion = useCallback(
     (entity: DialAIEntityModel) => onSelect(entity.id),
@@ -125,6 +129,7 @@ const ModelGroup = ({
         name: t('Edit'),
         dataQa: 'edit',
         display: !isPublicEntity,
+        disabled: isModifyDisabled,
         Icon: IconPencilMinus,
         onClick: (e: React.MouseEvent) => {
           e.stopPropagation();
@@ -157,6 +162,7 @@ const ModelGroup = ({
       {
         name: t('Delete'),
         dataQa: 'delete',
+        disabled: isModifyDisabled && !isPublicEntity,
         display: !isPublicEntity,
         Icon: IconTrashX,
         onClick: (e: React.MouseEvent) => {
@@ -174,6 +180,7 @@ const ModelGroup = ({
       handleEdit,
       handlePublish,
       handleOpenDeleteConfirmModal,
+      isModifyDisabled,
     ],
   );
 
@@ -342,11 +349,7 @@ export const ModelList = ({
   const handleEdit = useCallback(
     (currentEntity: DialAIEntityModel) => {
       dispatch(ApplicationActions.get(currentEntity.id));
-      handleOpenApplicationModal(
-        isQuickApp(currentEntity)
-          ? ApplicationType.QUICK_APP
-          : ApplicationType.CUSTOM_APP,
-      );
+      handleOpenApplicationModal(getApplicationType(currentEntity));
     },
     [dispatch, handleOpenApplicationModal],
   );
@@ -441,24 +444,15 @@ export const ModelList = ({
           onClose={handleConfirmDialogClose}
         />
       )}
-      {applicationModal &&
-        applicationModal.type === ApplicationType.CUSTOM_APP && (
-          <ApplicationDialog
-            isOpen={applicationModal.type === ApplicationType.CUSTOM_APP}
-            onClose={handleCloseApplicationDialog}
-            currentReference={currentEntity?.reference}
-            isEdit
-          />
-        )}
-      {applicationModal &&
-        applicationModal.type === ApplicationType.QUICK_APP && (
-          <QuickAppDialog
-            isOpen={applicationModal.type === ApplicationType.QUICK_APP}
-            onClose={handleCloseApplicationDialog}
-            currentReference={currentEntity?.reference}
-            isEdit
-          />
-        )}
+      {!!applicationModal && (
+        <ApplicationWizard
+          isOpen={!!applicationModal}
+          onClose={handleCloseApplicationDialog}
+          type={applicationModal.type}
+          currentReference={currentEntity?.reference}
+          isEdit
+        />
+      )}
       {publishAction && entityForPublish && entityForPublish.id && (
         <PublishModal
           entity={entityForPublish}