diff --git a/ui/src/components/ai-chat/index.vue b/ui/src/components/ai-chat/index.vue
index a3e3d3d36..bbc950102 100644
--- a/ui/src/components/ai-chat/index.vue
+++ b/ui/src/components/ai-chat/index.vue
@@ -163,13 +163,13 @@ const initialApiFormData = ref({})
 const isUserInput = computed(
   () =>
     props.applicationDetails.work_flow?.nodes?.filter((v: any) => v.id === 'base-node')[0]
-      .properties.user_input_field_list.length > 0
+      ?.properties.user_input_field_list.length > 0
 )
 const isAPIInput = computed(
   () =>
     props.type === 'debug-ai-chat' &&
     props.applicationDetails.work_flow?.nodes?.filter((v: any) => v.id === 'base-node')[0]
-      .properties.api_input_field_list.length > 0
+      ?.properties.api_input_field_list.length > 0
 )
 const showUserInputContent = computed(() => {
   return (
diff --git a/ui/src/views/application-workflow/index.vue b/ui/src/views/application-workflow/index.vue
index f9a309839..d623968a9 100644
--- a/ui/src/views/application-workflow/index.vue
+++ b/ui/src/views/application-workflow/index.vue
@@ -3,7 +3,7 @@
     <div class="header border-b flex-between p-12-24">
       <div class="flex align-center">
         <back-button @click="back"></back-button>
-        <h4>{{ detail?.name }}</h4>
+        <h4 class="ellipsis-1" style="width: 50%" :title="detail?.name">{{ detail?.name }}</h4>
         <div v-if="showHistory && disablePublic">
           <el-text type="info" class="ml-16 color-secondary"
             >{{ $t('views.applicationWorkflow.info.previewVersion') }}
@@ -101,7 +101,7 @@
                 />
               </div>
 
-              <h4>
+              <h4 class="ellipsis" style="max-width: 270px" :title="detail?.name">
                 {{ detail?.name || $t('views.application.applicationForm.form.appName.label') }}
               </h4>
             </div>
@@ -279,7 +279,6 @@ async function publicHandle() {
         return
       }
       applicationApi.putPublishApplication(id as String, obj, loading).then(() => {
-
         application.asyncGetApplicationDetail(id, loading).then((res: any) => {
           detail.value.name = res.data.name
           MsgSuccess(t('views.applicationWorkflow.tip.publicSuccess'))
diff --git a/ui/src/views/chat/embed/index.vue b/ui/src/views/chat/embed/index.vue
index 34063439f..806e6622e 100644
--- a/ui/src/views/chat/embed/index.vue
+++ b/ui/src/views/chat/embed/index.vue
@@ -28,7 +28,9 @@
           />
         </div>
 
-        <h4>{{ applicationDetail?.name }}</h4>
+        <h4 class="ellipsis-1" style="width: 50%" :title="applicationDetail?.name">
+          {{ applicationDetail?.name }}
+        </h4>
       </div>
     </div>
     <div>
diff --git a/ui/src/views/chat/mobile/index.vue b/ui/src/views/chat/mobile/index.vue
index 3748dd1b7..820634f9e 100644
--- a/ui/src/views/chat/mobile/index.vue
+++ b/ui/src/views/chat/mobile/index.vue
@@ -27,7 +27,9 @@
           />
         </div>
 
-        <h4>{{ applicationDetail?.name }}</h4>
+        <h4 class="ellipsis-1" style="width: 66%" :title="applicationDetail?.name">
+          {{ applicationDetail?.name }}
+        </h4>
       </div>
     </div>
     <div>
diff --git a/ui/src/views/chat/pc/index.vue b/ui/src/views/chat/pc/index.vue
index 30fd2fb6b..e51a2b9df 100644
--- a/ui/src/views/chat/pc/index.vue
+++ b/ui/src/views/chat/pc/index.vue
@@ -27,7 +27,9 @@
             :size="32"
           />
         </div>
-        <h4>{{ applicationDetail?.name }}</h4>
+        <h4 class="ellipsis-1" style="width: 66%" :title="applicationDetail?.name">
+          {{ applicationDetail?.name }}
+        </h4>
       </div>
     </div>
     <div>