diff --git a/packages/app/src/components/404/index.tsx b/packages/app/src/components/404/index.tsx
index 7df644bbf..8ed423280 100644
--- a/packages/app/src/components/404/index.tsx
+++ b/packages/app/src/components/404/index.tsx
@@ -1,5 +1,5 @@
 import { NotFoundTitle, PageContainer } from './styles';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 export const NotfoundPage = () => {
   const { t } = useTranslation();
   return (
diff --git a/packages/app/src/components/contact-modal/index.tsx b/packages/app/src/components/contact-modal/index.tsx
index 0cb97f117..3cd4d04f8 100644
--- a/packages/app/src/components/contact-modal/index.tsx
+++ b/packages/app/src/components/contact-modal/index.tsx
@@ -23,7 +23,7 @@ import {
   StyledModalFooter,
 } from './style';
 import bg from '@/components/contact-modal/bg.png';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 const linkList = [
   {
     icon: <GithubIcon />,
diff --git a/packages/app/src/components/editor-mode-switch/index.tsx b/packages/app/src/components/editor-mode-switch/index.tsx
index 2e8ccfdcf..5fe4217c3 100644
--- a/packages/app/src/components/editor-mode-switch/index.tsx
+++ b/packages/app/src/components/editor-mode-switch/index.tsx
@@ -15,7 +15,7 @@ import { useTheme } from '@/providers/ThemeProvider';
 import { EdgelessIcon, PaperIcon } from './Icons';
 import useCurrentPageMeta from '@/hooks/use-current-page-meta';
 import { usePageHelper } from '@/hooks/use-page-helper';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 const PaperItem = ({ active }: { active?: boolean }) => {
   const {
     theme: {
diff --git a/packages/app/src/components/header/QuickSearchButton.tsx b/packages/app/src/components/header/QuickSearchButton.tsx
index 0c1732adb..0b28e43b0 100644
--- a/packages/app/src/components/header/QuickSearchButton.tsx
+++ b/packages/app/src/components/header/QuickSearchButton.tsx
@@ -3,7 +3,7 @@ import { IconButton, IconButtonProps } from '@/ui/button';
 import { Tooltip } from '@/ui/tooltip';
 import { ArrowDownIcon } from '@blocksuite/icons';
 import { useModal } from '@/providers/GlobalModalProvider';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 export const QuickSearchButton = ({
   onClick,
   ...props
diff --git a/packages/app/src/components/header/header-right-items/EditorOptionMenu.tsx b/packages/app/src/components/header/header-right-items/EditorOptionMenu.tsx
index db3e1751f..b4eef4ebf 100644
--- a/packages/app/src/components/header/header-right-items/EditorOptionMenu.tsx
+++ b/packages/app/src/components/header/header-right-items/EditorOptionMenu.tsx
@@ -16,7 +16,7 @@ import { usePageHelper } from '@/hooks/use-page-helper';
 import { useConfirm } from '@/providers/ConfirmProvider';
 import useCurrentPageMeta from '@/hooks/use-current-page-meta';
 import { toast } from '@/ui/toast';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 const PopoverContent = () => {
   const { editor } = useAppState();
   const { toggleFavoritePage, toggleDeletePage } = usePageHelper();
diff --git a/packages/app/src/components/help-island/index.tsx b/packages/app/src/components/help-island/index.tsx
index b904cefb5..d6aad0c89 100644
--- a/packages/app/src/components/help-island/index.tsx
+++ b/packages/app/src/components/help-island/index.tsx
@@ -8,7 +8,7 @@ import {
 import { CloseIcon, ContactIcon, HelpIcon, KeyboardIcon } from './Icons';
 import Grow from '@mui/material/Grow';
 import { Tooltip } from '@/ui/tooltip';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 import { useModal } from '@/providers/GlobalModalProvider';
 import { useTheme } from '@/providers/ThemeProvider';
 import useCurrentPageMeta from '@/hooks/use-current-page-meta';
diff --git a/packages/app/src/components/import/index.tsx b/packages/app/src/components/import/index.tsx
index 96a383dad..8f867d3bf 100644
--- a/packages/app/src/components/import/index.tsx
+++ b/packages/app/src/components/import/index.tsx
@@ -6,7 +6,7 @@ import Loading from '@/components/loading';
 import { usePageHelper } from '@/hooks/use-page-helper';
 import { useAppState } from '@/providers/app-state-provider/context';
 import { useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 // import { Tooltip } from '@/ui/tooltip';
 type ImportModalProps = {
   open: boolean;
diff --git a/packages/app/src/components/page-list/OperationCell.tsx b/packages/app/src/components/page-list/OperationCell.tsx
index d72b99b51..ca59efa60 100644
--- a/packages/app/src/components/page-list/OperationCell.tsx
+++ b/packages/app/src/components/page-list/OperationCell.tsx
@@ -14,7 +14,7 @@ import {
 } from '@blocksuite/icons';
 import { toast } from '@/ui/toast';
 import { usePageHelper } from '@/hooks/use-page-helper';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
   const { id, favorite } = pageMeta;
   const { openPage } = usePageHelper();
diff --git a/packages/app/src/components/page-list/index.tsx b/packages/app/src/components/page-list/index.tsx
index 2d5f13ed5..dca0e15ca 100644
--- a/packages/app/src/components/page-list/index.tsx
+++ b/packages/app/src/components/page-list/index.tsx
@@ -24,7 +24,7 @@ import { useAppState } from '@/providers/app-state-provider/context';
 import { toast } from '@/ui/toast';
 import { usePageHelper } from '@/hooks/use-page-helper';
 import { useTheme } from '@/providers/ThemeProvider';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 const FavoriteTag = ({
   pageMeta: { favorite, id },
 }: {
diff --git a/packages/app/src/components/quick-search/Footer.tsx b/packages/app/src/components/quick-search/Footer.tsx
index 59680216f..14b37561b 100644
--- a/packages/app/src/components/quick-search/Footer.tsx
+++ b/packages/app/src/components/quick-search/Footer.tsx
@@ -4,7 +4,7 @@ import { StyledModalFooterContent } from './style';
 import { useModal } from '@/providers/GlobalModalProvider';
 import { Command } from 'cmdk';
 import { usePageHelper } from '@/hooks/use-page-helper';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 export const Footer = (props: { query: string }) => {
   const { triggerQuickSearchModal } = useModal();
   const { openPage, createPage } = usePageHelper();
diff --git a/packages/app/src/components/quick-search/Results.tsx b/packages/app/src/components/quick-search/Results.tsx
index fc22e9713..a11206f33 100644
--- a/packages/app/src/components/quick-search/Results.tsx
+++ b/packages/app/src/components/quick-search/Results.tsx
@@ -7,7 +7,7 @@ import { useAppState } from '@/providers/app-state-provider';
 import { useRouter } from 'next/router';
 import { useSwitchToConfig } from './config';
 import { NoResultSVG } from './NoResultSVG';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 import usePageHelper from '@/hooks/use-page-helper';
 import usePageMetaList from '@/hooks/use-page-meta-list';
 export const Results = (props: {
diff --git a/packages/app/src/components/quick-search/config.ts b/packages/app/src/components/quick-search/config.ts
index c35636c3c..ce99ad562 100644
--- a/packages/app/src/components/quick-search/config.ts
+++ b/packages/app/src/components/quick-search/config.ts
@@ -1,5 +1,5 @@
 import { AllPagesIcon, FavouritesIcon, TrashIcon } from '@blocksuite/icons';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 
 export const useSwitchToConfig = (
   currentWorkspaceId: string
diff --git a/packages/app/src/components/shortcuts-modal/config.ts b/packages/app/src/components/shortcuts-modal/config.ts
index 95dd4c5b6..90471c1f8 100644
--- a/packages/app/src/components/shortcuts-modal/config.ts
+++ b/packages/app/src/components/shortcuts-modal/config.ts
@@ -1,4 +1,4 @@
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 interface ShortcutTip {
   [x: string]: string;
 }
diff --git a/packages/app/src/components/shortcuts-modal/index.tsx b/packages/app/src/components/shortcuts-modal/index.tsx
index 980f281d7..280adeb7e 100644
--- a/packages/app/src/components/shortcuts-modal/index.tsx
+++ b/packages/app/src/components/shortcuts-modal/index.tsx
@@ -16,7 +16,7 @@ import {
 import Slide from '@mui/material/Slide';
 import { ModalCloseButton } from '@/ui/modal';
 import { getUaHelper } from '@/utils';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 type ModalProps = {
   open: boolean;
   onClose: () => void;
diff --git a/packages/app/src/components/workspace-slider-bar/index.tsx b/packages/app/src/components/workspace-slider-bar/index.tsx
index 533ea4292..de12f6474 100644
--- a/packages/app/src/components/workspace-slider-bar/index.tsx
+++ b/packages/app/src/components/workspace-slider-bar/index.tsx
@@ -30,7 +30,7 @@ import { IconButton } from '@/ui/button';
 import useLocalStorage from '@/hooks/use-local-storage';
 import usePageMetaList from '@/hooks/use-page-meta-list';
 import { usePageHelper } from '@/hooks/use-page-helper';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 
 const FavoriteList = ({ showList }: { showList: boolean }) => {
   const { openPage } = usePageHelper();
diff --git a/packages/app/src/pages/_app.tsx b/packages/app/src/pages/_app.tsx
index 179cae802..cbd7a0299 100644
--- a/packages/app/src/pages/_app.tsx
+++ b/packages/app/src/pages/_app.tsx
@@ -18,7 +18,7 @@ import { useEffect } from 'react';
 import { useAppState } from '@/providers/app-state-provider';
 import { PageLoading } from '@/components/loading';
 import Head from 'next/head';
-import '@/libs/i18n';
+import '@affine/i18n';
 
 const ThemeProvider = dynamic(() => import('@/providers/ThemeProvider'), {
   ssr: false,
diff --git a/packages/app/src/pages/workspace/[workspaceId]/all.tsx b/packages/app/src/pages/workspace/[workspaceId]/all.tsx
index 18f6e2a64..155a4303e 100644
--- a/packages/app/src/pages/workspace/[workspaceId]/all.tsx
+++ b/packages/app/src/pages/workspace/[workspaceId]/all.tsx
@@ -4,7 +4,7 @@ import usePageMetaList from '@/hooks/use-page-meta-list';
 import { PageListHeader } from '@/components/header';
 import { ReactElement } from 'react';
 import WorkspaceLayout from '@/components/workspace-layout';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 const All = () => {
   const pageMetaList = usePageMetaList();
   const { t } = useTranslation();
diff --git a/packages/app/src/pages/workspace/[workspaceId]/favorite.tsx b/packages/app/src/pages/workspace/[workspaceId]/favorite.tsx
index d787f34e1..bc64db309 100644
--- a/packages/app/src/pages/workspace/[workspaceId]/favorite.tsx
+++ b/packages/app/src/pages/workspace/[workspaceId]/favorite.tsx
@@ -4,7 +4,7 @@ import { FavouritesIcon } from '@blocksuite/icons';
 import usePageMetaList from '@/hooks/use-page-meta-list';
 import { ReactElement } from 'react';
 import WorkspaceLayout from '@/components/workspace-layout';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 export const Favorite = () => {
   const pageMetaList = usePageMetaList();
   const { t } = useTranslation();
diff --git a/packages/app/src/pages/workspace/[workspaceId]/trash.tsx b/packages/app/src/pages/workspace/[workspaceId]/trash.tsx
index 2343b3913..07fa7ea1f 100644
--- a/packages/app/src/pages/workspace/[workspaceId]/trash.tsx
+++ b/packages/app/src/pages/workspace/[workspaceId]/trash.tsx
@@ -4,7 +4,7 @@ import { TrashIcon } from '@blocksuite/icons';
 import usePageMetaList from '@/hooks/use-page-meta-list';
 import { ReactElement } from 'react';
 import WorkspaceLayout from '@/components/workspace-layout';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 export const Trash = () => {
   const pageMetaList = usePageMetaList();
   const { t } = useTranslation();
diff --git a/packages/app/src/ui/confirm/Confirm.tsx b/packages/app/src/ui/confirm/Confirm.tsx
index bbffe75f6..c2bc2a338 100644
--- a/packages/app/src/ui/confirm/Confirm.tsx
+++ b/packages/app/src/ui/confirm/Confirm.tsx
@@ -7,7 +7,7 @@ import {
   StyledModalWrapper,
 } from '@/ui/confirm/styles';
 import { Button } from '@/ui/button';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from '@affine/i18n';
 export type ConfirmProps = {
   title?: string;
   content?: string;