diff --git a/web/app/components/datasets/documents/detail/completed/index.tsx b/web/app/components/datasets/documents/detail/completed/index.tsx
index f169222071..f4bde5c32e 100644
--- a/web/app/components/datasets/documents/detail/completed/index.tsx
+++ b/web/app/components/datasets/documents/detail/completed/index.tsx
@@ -239,7 +239,7 @@ const Completed: FC<ICompletedProps> = ({
   // the current segment id and whether to show the modal
   const [currSegment, setCurrSegment] = useState<{ segInfo?: SegmentDetailModel; showModal: boolean }>({ showModal: false })
 
-  const [searchValue, setSearchValue] = useState() // the search value
+  const [searchValue, setSearchValue] = useState<string>() // the search value
   const [selectedStatus, setSelectedStatus] = useState<boolean | 'all'>('all') // the selected status, enabled/disabled/undefined
 
   const [lastSegmentsRes, setLastSegmentsRes] = useState<SegmentsResponse | undefined>(undefined)
diff --git a/web/app/components/header/account-setting/key-validator/index.tsx b/web/app/components/header/account-setting/key-validator/index.tsx
index 59a6c53a57..d87b411cbf 100644
--- a/web/app/components/header/account-setting/key-validator/index.tsx
+++ b/web/app/components/header/account-setting/key-validator/index.tsx
@@ -100,7 +100,7 @@ const KeyValidator = ({
                   className='mb-4'
                   name={form.title}
                   placeholder={form.placeholder}
-                  value={value[form.key] || ''}
+                  value={value[form.key] as string || ''}
                   onChange={v => handleChange(form, v)}
                   onFocus={() => handleFocus(form)}
                   validating={validating}
diff --git a/web/context/datasets-context.tsx b/web/context/datasets-context.tsx
index a954d612d4..ba708233be 100644
--- a/web/context/datasets-context.tsx
+++ b/web/context/datasets-context.tsx
@@ -12,7 +12,7 @@ export type DatasetsContextValue = {
 const DatasetsContext = createContext<DatasetsContextValue>({
   datasets: [],
   mutateDatasets: () => {},
-  currentDataset: undefined
+  currentDataset: undefined,
 })
 
 export const useDatasetsContext = () => useContext(DatasetsContext)
diff --git a/web/context/debug-configuration.ts b/web/context/debug-configuration.ts
index 8877d4405b..6015d77e52 100644
--- a/web/context/debug-configuration.ts
+++ b/web/context/debug-configuration.ts
@@ -92,6 +92,12 @@ const DebugConfigurationContext = createContext<IDebugConfiguration>({
       prompt_template: '',
       prompt_variables: [],
     },
+    opening_statement: null,
+    more_like_this: null,
+    suggested_questions_after_answer: null,
+    speech_to_text: null,
+    retriever_resource: null,
+    dataSets: [],
   },
   setModelConfig: () => { },
   dataSets: [],
diff --git a/web/models/debug.ts b/web/models/debug.ts
index 93516dc545..be2d14b527 100644
--- a/web/models/debug.ts
+++ b/web/models/debug.ts
@@ -35,24 +35,18 @@ export type SpeechToTextConfig = MoreLikeThisConfig
 
 export type CitationConfig = MoreLikeThisConfig
 
+export type RetrieverResourceConfig = MoreLikeThisConfig
+
 // frontend use. Not the same as backend
 export type ModelConfig = {
   provider: string // LLM Provider: for example "OPENAI"
   model_id: string
   configs: PromptConfig
   opening_statement: string | null
-  more_like_this: {
-    enabled: boolean
-  } | null
-  suggested_questions_after_answer: {
-    enabled: boolean
-  } | null
-  speech_to_text: {
-    enabled: boolean
-  } | null
-  retriever_resource: {
-    enabled: boolean
-  } | null
+  more_like_this: MoreLikeThisConfig | null
+  suggested_questions_after_answer: SuggestedQuestionsAfterAnswerConfig | null
+  speech_to_text: SpeechToTextConfig | null
+  retriever_resource: RetrieverResourceConfig | null
   dataSets: any[]
 }