diff --git a/web/app/components/explore/try-app/preview/basic-app-preview.tsx b/web/app/components/explore/try-app/preview/basic-app-preview.tsx
index cbc56377fd..c118b8e51e 100644
--- a/web/app/components/explore/try-app/preview/basic-app-preview.tsx
+++ b/web/app/components/explore/try-app/preview/basic-app-preview.tsx
@@ -29,7 +29,7 @@ import { basePath } from '@/utils/var'
 import { useTextGenerationCurrentProviderAndModelAndModelList } from '../../../header/account-setting/model-provider-page/hooks'
 
 type Props = {
-  appId: string
+  readonly appId: string
 }
 
 const defaultModelConfig = {
diff --git a/web/app/components/explore/try-app/preview/flow-app-preview.tsx b/web/app/components/explore/try-app/preview/flow-app-preview.tsx
index 89a68a2ec1..fa7232e930 100644
--- a/web/app/components/explore/try-app/preview/flow-app-preview.tsx
+++ b/web/app/components/explore/try-app/preview/flow-app-preview.tsx
@@ -7,8 +7,8 @@ import WorkflowPreview from '@/app/components/workflow/workflow-preview'
 import { useGetTryAppFlowPreview } from '@/service/use-try-app'
 
 type Props = {
-  appId: string
-  className?: string
+  readonly appId: string
+  readonly className?: string
 }
 
 const FlowAppPreview: FC<Props> = ({
diff --git a/web/app/components/explore/try-app/preview/index.tsx b/web/app/components/explore/try-app/preview/index.tsx
index 3acaf63117..91a6bc42e2 100644
--- a/web/app/components/explore/try-app/preview/index.tsx
+++ b/web/app/components/explore/try-app/preview/index.tsx
@@ -6,8 +6,8 @@ import BasicAppPreview from './basic-app-preview'
 import FlowAppPreview from './flow-app-preview'
 
 type Props = {
-  appId: string
-  appDetail: TryAppInfo
+  readonly appId: string
+  readonly appDetail: TryAppInfo
 }
 
 const Preview: FC<Props> = ({