From db71ab9f184e818ceac40f88371dafbaa938f069 Mon Sep 17 00:00:00 2001 From: DIYgod Date: Mon, 8 May 2023 00:22:23 +0100 Subject: [PATCH] refactor: remove next-i18next --- package.json | 1 - pnpm-lock.yaml | 39 ------- src/components/common/AchievementItem.tsx | 2 +- src/components/common/AchievementModal.tsx | 2 +- src/components/common/CharacterCard.tsx | 2 +- src/components/common/FollowingButton.tsx | 2 +- src/components/common/FollowingCount.tsx | 2 +- src/components/common/PatronButton.tsx | 2 +- src/components/common/PatronModal.tsx | 2 +- .../dashboard/DashboardLayout.server.tsx | 16 --- src/components/dashboard/DashboardMain.tsx | 3 +- src/components/dashboard/ImportPreview.tsx | 2 +- src/components/dashboard/PagesManager.tsx | 8 +- .../PagesManagerBatchSelectActionTab.tsx | 4 +- src/components/dashboard/PagesManagerMenu.tsx | 4 +- src/components/dashboard/PublishButton.tsx | 3 +- src/components/dashboard/SettingsLayout.tsx | 3 +- src/components/main/MainLayout.tsx | 2 +- src/components/site/SiteLayout.server.tsx | 101 ------------------ src/components/ui/BoxRadio.tsx | 4 +- src/components/ui/EditorToolbar.tsx | 2 +- src/models/home.model.ts | 2 +- 22 files changed, 26 insertions(+), 182 deletions(-) delete mode 100644 src/components/dashboard/DashboardLayout.server.tsx delete mode 100644 src/components/site/SiteLayout.server.tsx diff --git a/package.json b/package.json index 99a9a397..5e304546 100644 --- a/package.json +++ b/package.json @@ -89,7 +89,6 @@ "mermaid": "10.1.0", "nanoid": "4.0.2", "next": "13.4.1", - "next-i18next": "^13.2.2", "nextjs-toploader": "^1.3.2", "node-id3": "^0.2.6", "pangu": "^4.0.7", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 20e3d4cb..f91a7bbf 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -187,9 +187,6 @@ dependencies: next: specifier: 13.4.1 version: 13.4.1(@babel/core@7.21.8)(react-dom@18.2.0)(react@18.2.0) - next-i18next: - specifier: ^13.2.2 - version: 13.2.2(i18next@22.4.15)(next@13.4.1)(react-i18next@12.2.2)(react@18.2.0) nextjs-toploader: specifier: ^1.3.2 version: 1.3.2(next@13.4.1)(react-dom@18.2.0)(react@18.2.0) @@ -4758,13 +4755,6 @@ packages: dependencies: '@types/unist': 2.0.6 - /@types/hoist-non-react-statics@3.3.1: - resolution: {integrity: sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==} - dependencies: - '@types/react': 18.2.6 - hoist-non-react-statics: 3.3.2 - dev: false - /@types/js-cookie@2.2.7: resolution: {integrity: sha512-aLkWa0C0vO5b4Sr798E26QgOkss68Un0bLjs7u9qxzPT5CG+8DuNTffWES58YzJs3hrVAOs1wonycqEBqNJubA==} dev: false @@ -6673,11 +6663,6 @@ packages: browserslist: 4.21.5 dev: true - /core-js@3.30.1: - resolution: {integrity: sha512-ZNS5nbiSwDTq4hFosEDqm65izl2CWmLz0hARJMyNQBgkUZMIF51cQiMvIQKA6hvuaeWxQDP3hEedM1JZIgTldQ==} - requiresBuild: true - dev: false - /core-util-is@1.0.3: resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==} dev: true @@ -9075,10 +9060,6 @@ packages: hasBin: true dev: true - /i18next-fs-backend@2.1.1: - resolution: {integrity: sha512-FTnj+UmNgT3YRml5ruRv0jMZDG7odOL/OP5PF5mOqvXud2vHrPOOs68Zdk6iqzL47cnnM0ZVkK2BAvpFeDJToA==} - dev: false - /i18next-resources-to-backend@1.1.3: resolution: {integrity: sha512-iDJITrMHoKLUa3B2wippgH62yM4f4wCEofeTj55rML9i7QrMDGKdr8FGCnSNNxRQzvW4546Qx6v2/xY3dAhvUA==} dependencies: @@ -10845,26 +10826,6 @@ packages: resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==} dev: true - /next-i18next@13.2.2(i18next@22.4.15)(next@13.4.1)(react-i18next@12.2.2)(react@18.2.0): - resolution: {integrity: sha512-t0WU6K+HJoq2nVQ0n6OiiEZja9GyMqtDSU74FmOafgk4ljns+iZ18bsNJiI8rOUXfFfkW96ea1N7D5kbMyT+PA==} - engines: {node: '>=14'} - peerDependencies: - i18next: ^22.0.6 - next: '>= 12.0.0' - react: '>= 17.0.2' - react-i18next: ^12.2.0 - dependencies: - '@babel/runtime': 7.21.0 - '@types/hoist-non-react-statics': 3.3.1 - core-js: 3.30.1 - hoist-non-react-statics: 3.3.2 - i18next: 22.4.15 - i18next-fs-backend: 2.1.1 - next: 13.4.1(@babel/core@7.21.8)(react-dom@18.2.0)(react@18.2.0) - react: 18.2.0 - react-i18next: 12.2.2(i18next@22.4.15)(react-dom@18.2.0)(react@18.2.0) - dev: false - /next-pwa@5.6.0(@babel/core@7.21.8)(esbuild@0.17.18)(next@13.4.1)(webpack@5.82.0): resolution: {integrity: sha512-XV8g8C6B7UmViXU8askMEYhWwQ4qc/XqJGnexbLV68hzKaGHZDMtHsm2TNxFcbR7+ypVuth/wwpiIlMwpRJJ5A==} peerDependencies: diff --git a/src/components/common/AchievementItem.tsx b/src/components/common/AchievementItem.tsx index cf26507f..1009bae2 100644 --- a/src/components/common/AchievementItem.tsx +++ b/src/components/common/AchievementItem.tsx @@ -1,4 +1,3 @@ -import { useTranslation } from "next-i18next" import { useState } from "react" import { Indicator } from "@mantine/core" @@ -6,6 +5,7 @@ import { Indicator } from "@mantine/core" import { AchievementModal } from "~/components/common/AchievementModal" import { Image } from "~/components/ui/Image" import { useDate } from "~/hooks/useDate" +import { useTranslation } from "~/lib/i18n/client" import type { AchievementSection } from "~/models/site.model" export const Badge = ({ diff --git a/src/components/common/AchievementModal.tsx b/src/components/common/AchievementModal.tsx index 40fb81a3..7dfc4c94 100644 --- a/src/components/common/AchievementModal.tsx +++ b/src/components/common/AchievementModal.tsx @@ -1,4 +1,3 @@ -import { useTranslation } from "next-i18next" import Tilt from "react-parallax-tilt" import { Modal, Stepper } from "@mantine/core" @@ -8,6 +7,7 @@ import { BlockchainIcon } from "~/components/icons/BlockchainIcon" import { Button } from "~/components/ui/Button" import { Image } from "~/components/ui/Image" import { useDate } from "~/hooks/useDate" +import { useTranslation } from "~/lib/i18n/client" import { cn } from "~/lib/utils" import type { AchievementSection } from "~/models/site.model" import { useMintAchievement } from "~/queries/site" diff --git a/src/components/common/CharacterCard.tsx b/src/components/common/CharacterCard.tsx index 773247e9..a7f82639 100644 --- a/src/components/common/CharacterCard.tsx +++ b/src/components/common/CharacterCard.tsx @@ -1,4 +1,3 @@ -import { useTranslation } from "next-i18next" import { useEffect, useState } from "react" import { FollowingButton } from "~/components/common/FollowingButton" @@ -6,6 +5,7 @@ import { FollowingCount } from "~/components/common/FollowingCount" import { Titles } from "~/components/common/Titles" import { Avatar } from "~/components/ui/Avatar" import { useDate } from "~/hooks/useDate" +import { useTranslation } from "~/lib/i18n/client" import type { ExpandedCharacter } from "~/lib/types" import { cn } from "~/lib/utils" import * as siteModel from "~/models/site.model" diff --git a/src/components/common/FollowingButton.tsx b/src/components/common/FollowingButton.tsx index 6b69dbe2..31328bdb 100644 --- a/src/components/common/FollowingButton.tsx +++ b/src/components/common/FollowingButton.tsx @@ -1,4 +1,3 @@ -import { Trans, useTranslation } from "next-i18next" import { useEffect } from "react" import { toast } from "react-hot-toast" @@ -6,6 +5,7 @@ import { Button } from "~/components/ui/Button" import type { Variant } from "~/components/ui/Button" import { UniLink } from "~/components/ui/UniLink" import { SITE_URL } from "~/lib/env" +import { Trans, useTranslation } from "~/lib/i18n/client" import { ExpandedCharacter } from "~/lib/types" import { cn } from "~/lib/utils" import { diff --git a/src/components/common/FollowingCount.tsx b/src/components/common/FollowingCount.tsx index 6e24e51c..36c25dc8 100644 --- a/src/components/common/FollowingCount.tsx +++ b/src/components/common/FollowingCount.tsx @@ -1,8 +1,8 @@ -import { useTranslation } from "next-i18next" import { useState } from "react" import { CharacterList } from "~/components/common/CharacterList" import { Button } from "~/components/ui/Button" +import { useTranslation } from "~/lib/i18n/client" import { useGetSiteSubscriptions, useGetSiteToSubscriptions, diff --git a/src/components/common/PatronButton.tsx b/src/components/common/PatronButton.tsx index 8a4e566a..5892c07f 100644 --- a/src/components/common/PatronButton.tsx +++ b/src/components/common/PatronButton.tsx @@ -1,8 +1,8 @@ -import { useTranslation } from "next-i18next" import { useState } from "react" import { PatronModal } from "~/components/common/PatronModal" import { Button } from "~/components/ui/Button" +import { useTranslation } from "~/lib/i18n/client" import { ExpandedCharacter } from "~/lib/types" import { cn } from "~/lib/utils" diff --git a/src/components/common/PatronModal.tsx b/src/components/common/PatronModal.tsx index 6787fa43..d36fb409 100644 --- a/src/components/common/PatronModal.tsx +++ b/src/components/common/PatronModal.tsx @@ -1,5 +1,4 @@ import confetti from "canvas-confetti" -import { useTranslation } from "next-i18next" import { useEffect, useRef, useState } from "react" import { toast } from "react-hot-toast" @@ -11,6 +10,7 @@ import { Button } from "~/components/ui/Button" import { Modal } from "~/components/ui/Modal" import { CSB_SCAN, MIRA_LINK } from "~/lib/env" import { getSiteLink } from "~/lib/helpers" +import { useTranslation } from "~/lib/i18n/client" import { ExpandedCharacter, ExpandedNote } from "~/lib/types" import { useGetTips, useTipCharacter } from "~/queries/site" diff --git a/src/components/dashboard/DashboardLayout.server.tsx b/src/components/dashboard/DashboardLayout.server.tsx deleted file mode 100644 index 91387c77..00000000 --- a/src/components/dashboard/DashboardLayout.server.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { serverSideTranslations } from "next-i18next/serverSideTranslations" - -import { languageDetector } from "~/lib/language-detector" - -export const getServerSideProps = async (ctx: any) => { - return { - props: { - ...(await serverSideTranslations(languageDetector(ctx), [ - "common", - "dashboard", - "index", - "site", - ])), - }, - } -} diff --git a/src/components/dashboard/DashboardMain.tsx b/src/components/dashboard/DashboardMain.tsx index 5b72c644..ebbaecb2 100644 --- a/src/components/dashboard/DashboardMain.tsx +++ b/src/components/dashboard/DashboardMain.tsx @@ -1,6 +1,5 @@ -import { useTranslation } from "next-i18next" - import { useIsMobileLayout } from "~/hooks/useMobileLayout" +import { useTranslation } from "~/lib/i18n/client" import { cn } from "~/lib/utils" export const DashboardMain: React.FC<{ diff --git a/src/components/dashboard/ImportPreview.tsx b/src/components/dashboard/ImportPreview.tsx index 6f3934eb..40ee0296 100644 --- a/src/components/dashboard/ImportPreview.tsx +++ b/src/components/dashboard/ImportPreview.tsx @@ -1,8 +1,8 @@ import type { NoteMetadata } from "crossbell.js" -import { useTranslation } from "next-i18next" import { useState } from "react" import { useDate } from "~/hooks/useDate" +import { useTranslation } from "~/lib/i18n/client" import { PageContent } from "../common/PageContent" diff --git a/src/components/dashboard/PagesManager.tsx b/src/components/dashboard/PagesManager.tsx index 7c0b02fd..978377b1 100644 --- a/src/components/dashboard/PagesManager.tsx +++ b/src/components/dashboard/PagesManager.tsx @@ -1,5 +1,4 @@ import { nanoid } from "nanoid" -import { Trans, useTranslation } from "next-i18next" import Link from "next/link" import { useParams, @@ -13,6 +12,7 @@ import { Menu } from "@headlessui/react" import { useQueryClient } from "@tanstack/react-query" import { useDate } from "~/hooks/useDate" +import { Trans, useTranslation } from "~/lib/i18n/client" import { getPageVisibility } from "~/lib/page-helpers" import { readFiles } from "~/lib/read-files" import { setStorage } from "~/lib/storage" @@ -48,7 +48,8 @@ export const PagesManager: React.FC<{ [searchParams], ) - const { t } = useTranslation(["dashboard", "site"]) + const { t } = useTranslation("dashboard") + const { t: siteT } = useTranslation("site") const date = useDate() const pages = useGetPagesBySite({ @@ -355,7 +356,7 @@ export const PagesManager: React.FC<{ onClick={pages.fetchNextPage as () => void} isLoading={pages.isFetchingNextPage} > - {t("load more", { + {siteT("load more", { name: t( isPost ? "post" @@ -365,7 +366,6 @@ export const PagesManager: React.FC<{ : ""), ), count: (pages.data?.pages?.[0].count || 0) - currentLength, - ns: "site", })} )} diff --git a/src/components/dashboard/PagesManagerBatchSelectActionTab.tsx b/src/components/dashboard/PagesManagerBatchSelectActionTab.tsx index 9a90ed05..1f3f4c3c 100644 --- a/src/components/dashboard/PagesManagerBatchSelectActionTab.tsx +++ b/src/components/dashboard/PagesManagerBatchSelectActionTab.tsx @@ -1,4 +1,3 @@ -import { useTranslation } from "next-i18next" import { useParams } from "next/navigation" import React, { useState } from "react" import toast from "react-hot-toast" @@ -8,6 +7,7 @@ import { useQueryClient } from "@tanstack/react-query" import { type TabItem, Tabs } from "~/components/ui/Tabs" import { APP_NAME } from "~/lib/env" +import { useTranslation } from "~/lib/i18n/client" import { delStorage, getStorage, setStorage } from "~/lib/storage" import { ExpandedNote } from "~/lib/types" import { useCreateOrUpdatePage, useDeletePage } from "~/queries/page" @@ -23,7 +23,7 @@ export const PagesManagerBatchSelectActionTab: React.FC<{ batchSelected: (string | number)[] setBatchSelected: (selected: string[]) => void }> = ({ isPost, isNotxLogContent, pages, batchSelected, setBatchSelected }) => { - const { t } = useTranslation(["dashboard", "site"]) + const { t } = useTranslation("dashboard") const params = useParams() const subdomain = params?.subdomain as string diff --git a/src/components/dashboard/PagesManagerMenu.tsx b/src/components/dashboard/PagesManagerMenu.tsx index 1e501b9e..a0659a69 100644 --- a/src/components/dashboard/PagesManagerMenu.tsx +++ b/src/components/dashboard/PagesManagerMenu.tsx @@ -1,4 +1,3 @@ -import { useTranslation } from "next-i18next" import { useParams, useRouter } from "next/navigation" import { FC, useEffect, useState } from "react" import toast from "react-hot-toast" @@ -9,6 +8,7 @@ import { useQueryClient } from "@tanstack/react-query" import { useGetState } from "~/hooks/useGetState" import { APP_NAME } from "~/lib/env" import { getNoteSlugFromNote, getTwitterShareUrl } from "~/lib/helpers" +import { useTranslation } from "~/lib/i18n/client" import { delStorage, getStorage, setStorage } from "~/lib/storage" import { ExpandedNote } from "~/lib/types" import { useCreateOrUpdatePage, useDeletePage } from "~/queries/page" @@ -35,7 +35,7 @@ export const PagesManagerMenu: FC<{ page: ExpandedNote onClick: () => void }> = ({ isPost, page, onClick: onClose }) => { - const { t } = useTranslation(["dashboard", "site"]) + const { t } = useTranslation("dashboard") const isCrossbell = !page.metadata?.content?.sources?.includes("xlog") const router = useRouter() diff --git a/src/components/dashboard/PublishButton.tsx b/src/components/dashboard/PublishButton.tsx index 34f46c14..c05c0308 100644 --- a/src/components/dashboard/PublishButton.tsx +++ b/src/components/dashboard/PublishButton.tsx @@ -1,7 +1,8 @@ -import { useTranslation } from "next-i18next" import { useEffect, useRef, useState } from "react" import useOnClickOutside from "use-onclickoutside" +import { useTranslation } from "~/lib/i18n/client" + import { Button, ButtonGroup } from "../ui/Button" import { DeleteConfirmationModal } from "./DeleteConfirmationModal" diff --git a/src/components/dashboard/SettingsLayout.tsx b/src/components/dashboard/SettingsLayout.tsx index a8e0dada..10c3099d 100644 --- a/src/components/dashboard/SettingsLayout.tsx +++ b/src/components/dashboard/SettingsLayout.tsx @@ -1,9 +1,10 @@ -import { useTranslation } from "next-i18next" import { useParams, usePathname } from "next/navigation" import React from "react" import { useXSettingsModal } from "@crossbell/connect-kit" +import { useTranslation } from "~/lib/i18n/client" + import { type TabItem, Tabs } from "../ui/Tabs" import { DashboardMain } from "./DashboardMain" diff --git a/src/components/main/MainLayout.tsx b/src/components/main/MainLayout.tsx index 23829400..75420e7a 100644 --- a/src/components/main/MainLayout.tsx +++ b/src/components/main/MainLayout.tsx @@ -1,4 +1,3 @@ -import { useTranslation } from "next-i18next" import { useRouter } from "next/navigation" import { Logo } from "~/components/common/Logo" @@ -10,6 +9,7 @@ import { TWITTER_LINK, } from "~/lib/env" import { getSiteLink } from "~/lib/helpers" +import { useTranslation } from "~/lib/i18n/client" import { cn } from "~/lib/utils" import { ConnectButton } from "../common/ConnectButton" diff --git a/src/components/site/SiteLayout.server.tsx b/src/components/site/SiteLayout.server.tsx deleted file mode 100644 index b4baa8a4..00000000 --- a/src/components/site/SiteLayout.server.tsx +++ /dev/null @@ -1,101 +0,0 @@ -import { serverSideTranslations } from "next-i18next/serverSideTranslations" - -import { QueryClient, dehydrate } from "@tanstack/react-query" - -import { languageDetector } from "~/lib/language-detector" -import { notFound } from "~/lib/server-side-props" -import { PageVisibilityEnum } from "~/lib/types" -import { fetchGetPage, prefetchGetPagesBySite } from "~/queries/page.server" -import { - fetchGetSite, - prefetchGetSiteSubscriptions, - prefetchGetSiteToSubscriptions, -} from "~/queries/site.server" - -export const getServerSideProps = async ( - ctx: any, - queryClient: QueryClient, - options?: { - limit?: number - useStat?: boolean - skipPages?: boolean - preview?: boolean - }, -) => { - const domainOrSubdomain = ctx.params!.site as string - const pageSlug = ctx.params!.page as string - const tag = ctx.params!.tag as string - const site = await fetchGetSite(domainOrSubdomain, queryClient) - - if (site?.characterId) { - await Promise.all([ - prefetchGetSiteSubscriptions( - { - characterId: site.characterId, - }, - queryClient, - ), - prefetchGetSiteToSubscriptions( - { - characterId: site.characterId, - }, - queryClient, - ), - new Promise(async (resolve, reject) => { - if (options?.preview) { - // do nothing - } else if (pageSlug) { - try { - const page = await fetchGetPage( - { - characterId: site.characterId, - slug: pageSlug, - ...(options?.useStat && { - useStat: true, - }), - }, - queryClient, - ) - - if ( - !page || - new Date(page!.metadata?.content?.date_published || "") > - new Date() - ) { - reject(notFound()) - } - } catch (error) { - reject(error) - } - } else { - if (!options?.skipPages) { - await prefetchGetPagesBySite( - { - characterId: site.characterId, - ...(options?.limit && { limit: options.limit }), - type: "post", - visibility: PageVisibilityEnum.Published, - ...(tag && { tags: [tag] }), - ...(options?.useStat && { - useStat: true, - }), - }, - queryClient, - ) - } - } - resolve(null) - }), - ]) - } - - return { - props: { - ...(await serverSideTranslations(languageDetector(ctx), [ - "common", - "site", - ])), - dehydratedState: JSON.parse(JSON.stringify(dehydrate(queryClient))), - }, - } -} diff --git a/src/components/ui/BoxRadio.tsx b/src/components/ui/BoxRadio.tsx index c86fe09c..444e234f 100644 --- a/src/components/ui/BoxRadio.tsx +++ b/src/components/ui/BoxRadio.tsx @@ -1,5 +1,4 @@ import { nanoid } from "nanoid" -import { useTranslation } from "next-i18next" import React, { ChangeEvent, Dispatch, @@ -10,6 +9,7 @@ import React, { } from "react" import { Input } from "~/components/ui/Input" +import { useTranslation } from "~/lib/i18n/client" import { cn } from "~/lib/utils" export type RadioItem = { @@ -23,7 +23,7 @@ export const BoxRadio: React.FC<{ setValue: Dispatch> items: RadioItem[] }> = ({ value, setValue, items }) => { - const { t } = useTranslation(["common"]) + const { t } = useTranslation("common") const randomId = useMemo(() => nanoid(), []) const [isCustom, setIsCustom] = useState(false) diff --git a/src/components/ui/EditorToolbar.tsx b/src/components/ui/EditorToolbar.tsx index 579a4058..ad200326 100644 --- a/src/components/ui/EditorToolbar.tsx +++ b/src/components/ui/EditorToolbar.tsx @@ -1,4 +1,3 @@ -import { useTranslation } from "next-i18next" import { FC, memo, useCallback, useState } from "react" import { usePopper } from "react-popper" @@ -6,6 +5,7 @@ import { EditorView } from "@codemirror/view" import { Popover } from "@headlessui/react" import { ICommand } from "~/editor" +import { useTranslation } from "~/lib/i18n/client" import { Tooltip } from "./Tooltip" diff --git a/src/models/home.model.ts b/src/models/home.model.ts index ffc9c9bd..5437958f 100644 --- a/src/models/home.model.ts +++ b/src/models/home.model.ts @@ -330,7 +330,7 @@ export const getShowcase = async () => { .toPromise() result.data?.characters?.forEach((site: any) => { - if (site.metadata.content) { + if (site.metadata?.content) { site.metadata.content.name = site.metadata?.content?.name || site.handle } else { site.metadata.content = {