diff --git a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx
index 892b561a9e..44bf008f58 100644
--- a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx
+++ b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/page.tsx
@@ -2,7 +2,7 @@ import React from 'react'
 import ChartView from './chartView'
 import CardView from './cardView'
 import { getLocaleOnServer } from '@/i18n/server'
-import { useTranslation } from '@/i18n/i18next-serverside-config'
+import { useTranslation as translate } from '@/i18n/i18next-serverside-config'
 import ApikeyInfoPanel from '@/app/components/app/overview/apikey-info-panel'
 
 export type IDevelopProps = {
@@ -13,7 +13,11 @@ const Overview = async ({
   params: { appId },
 }: IDevelopProps) => {
   const locale = getLocaleOnServer()
-  const { t } = await useTranslation(locale, 'app-overview')
+  /*
+    rename useTranslation to avoid lint error
+    please check: https://github.com/i18next/next-13-app-dir-i18next-example/issues/24
+  */
+  const { t } = await translate(locale, 'app-overview')
   return (
     <div className="h-full px-16 py-6 overflow-scroll">
       <ApikeyInfoPanel />
diff --git a/web/app/components/base/notion-page-selector/page-selector/index.tsx b/web/app/components/base/notion-page-selector/page-selector/index.tsx
index 101640172e..2aa8582505 100644
--- a/web/app/components/base/notion-page-selector/page-selector/index.tsx
+++ b/web/app/components/base/notion-page-selector/page-selector/index.tsx
@@ -67,7 +67,7 @@ const recursivePushInParentDescendants = (
   }
 }
 
-const Item = memo(({ index, style, data }: ListChildComponentProps<{
+const ItemComponent = ({ index, style, data }: ListChildComponentProps<{
   dataList: NotionPageItem[]
   handleToggle: (index: number) => void
   checkedIds: Set<string>
@@ -150,7 +150,8 @@ const Item = memo(({ index, style, data }: ListChildComponentProps<{
       }
     </div>
   )
-}, areEqual)
+}
+const Item = memo(ItemComponent, areEqual)
 
 const PageSelector = ({
   value,
diff --git a/web/app/components/datasets/documents/detail/completed/index.tsx b/web/app/components/datasets/documents/detail/completed/index.tsx
index 5bd80ede2b..af720fd5fd 100644
--- a/web/app/components/datasets/documents/detail/completed/index.tsx
+++ b/web/app/components/datasets/documents/detail/completed/index.tsx
@@ -55,7 +55,7 @@ type ISegmentDetailProps = {
 /**
  * Show all the contents of the segment
  */
-export const SegmentDetail: FC<ISegmentDetailProps> = memo(({
+const SegmentDetailComponent: FC<ISegmentDetailProps> = ({
   segInfo,
   archived,
   onChangeSwitch,
@@ -196,7 +196,8 @@ export const SegmentDetail: FC<ISegmentDetailProps> = memo(({
       </div>
     </div>
   )
-})
+}
+export const SegmentDetail = memo(SegmentDetailComponent)
 
 export const splitArray = (arr: any[], size = 3) => {
   if (!arr || !arr.length)
diff --git a/web/app/components/datasets/documents/detail/new-segment-modal.tsx b/web/app/components/datasets/documents/detail/new-segment-modal.tsx
index d4b2662f44..4c54ffa3a1 100644
--- a/web/app/components/datasets/documents/detail/new-segment-modal.tsx
+++ b/web/app/components/datasets/documents/detail/new-segment-modal.tsx
@@ -19,7 +19,7 @@ type NewSegmentModalProps = {
   onSave: () => void
 }
 
-const NewSegmentModal: FC<NewSegmentModalProps> = memo(({
+const NewSegmentModal: FC<NewSegmentModalProps> = ({
   isShow,
   onCancel,
   docForm,
@@ -152,6 +152,6 @@ const NewSegmentModal: FC<NewSegmentModalProps> = memo(({
       </div>
     </Modal>
   )
-})
+}
 
-export default NewSegmentModal
+export default memo(NewSegmentModal)