From 39679b73e0f0406c496cda8d26680502af844ef2 Mon Sep 17 00:00:00 2001 From: stonek Date: Thu, 31 Aug 2023 17:09:09 +0300 Subject: [PATCH 1/5] [#365] Blog.Add path aliases. Fix paths. Add some entry points (index.ts) --- apps/blog/src/app/[locale]/layout.tsx | 13 +++++----- apps/blog/src/app/[locale]/page.tsx | 2 +- .../src/app/[locale]/posts/[slug]/page.tsx | 20 +++++++------- .../src/app/[locale]/posts/_content/index.ts | 2 +- .../[locale]/posts/_utils/filterBlogPosts.ts | 2 +- .../_utils/isPostShouldBePickedByLocale.ts | 4 +-- apps/blog/src/app/[locale]/posts/layout.tsx | 10 +++---- apps/blog/src/app/[locale]/posts/page.tsx | 18 ++++++------- .../components/PostsList/EmptyPlaceholder.tsx | 5 ++-- apps/blog/src/components/PostsList/index.ts | 1 + apps/blog/src/i18n/index.ts | 26 +++---------------- apps/blog/src/i18n/useTranslation.tsx | 23 ++++++++++++++++ apps/blog/src/middleware.ts | 2 +- apps/blog/src/utils/index.ts | 3 +++ apps/blog/tsconfig.json | 3 ++- apps/blog/vitest.config.ts | 16 ++++++++++++ 16 files changed, 87 insertions(+), 63 deletions(-) create mode 100644 apps/blog/src/components/PostsList/index.ts create mode 100644 apps/blog/src/i18n/useTranslation.tsx create mode 100644 apps/blog/src/utils/index.ts diff --git a/apps/blog/src/app/[locale]/layout.tsx b/apps/blog/src/app/[locale]/layout.tsx index d5f7a50c..272079f9 100644 --- a/apps/blog/src/app/[locale]/layout.tsx +++ b/apps/blog/src/app/[locale]/layout.tsx @@ -2,13 +2,12 @@ import './globals.css' import type { Metadata } from 'next' import localFont from 'next/font/local' import { dir } from 'i18next' -import type { Language } from '../../i18n/i18n.settings' -import { languages } from '../../i18n/i18n.settings' -import { useTranslation } from '../../i18n' -import { LanguageSwitcher } from '../../components/LanguageSwitcher' -import { generateFullUrl } from '../../utils/generateFullUrl' -import { Footer } from '../../components/Footer' -import { Amplitude } from '../../components/Amplitude' +import type { Language } from '@/i18n' +import { languages, useTranslation } from '@/i18n' +import { generateFullUrl } from '@/utils' +import { Amplitude } from '@/components/Amplitude' +import { LanguageSwitcher } from '@/components/LanguageSwitcher' +import { Footer } from '@/components/Footer' type RootLayoutParams = { locale: Language } diff --git a/apps/blog/src/app/[locale]/page.tsx b/apps/blog/src/app/[locale]/page.tsx index a601253b..e0877896 100644 --- a/apps/blog/src/app/[locale]/page.tsx +++ b/apps/blog/src/app/[locale]/page.tsx @@ -1,5 +1,5 @@ import { redirect } from 'next/navigation' -import type { Language } from '../../i18n/i18n.settings' +import type { Language } from '@/i18n' export default function BlogPage({ params: { locale } }: { params: { locale: Language } }) { return redirect(`/${locale}/posts`) diff --git a/apps/blog/src/app/[locale]/posts/[slug]/page.tsx b/apps/blog/src/app/[locale]/posts/[slug]/page.tsx index faea8b21..11cd1a42 100644 --- a/apps/blog/src/app/[locale]/posts/[slug]/page.tsx +++ b/apps/blog/src/app/[locale]/posts/[slug]/page.tsx @@ -3,21 +3,21 @@ import type { Metadata, Route } from 'next' import Image from 'next/image' import type { WithContext, BlogPosting } from 'schema-dts' -import { Mdx } from '../../../../components/Mdx' +import { Mdx } from '@/components/Mdx' import type { BlogPost } from 'contentlayer/generated' import { allBlogPosts, allMemebers } from 'contentlayer/generated' -import { Chip } from '../../../../components/Chip' -import { JsonLDScript } from '../../../../components/JsonLDScript' -import type { Language } from '../../../../i18n/i18n.settings' -import { ChipsRow } from '../../../../components/ChipsRow' -import { formatDate } from '../../../../utils/formatDate' +import { Chip } from '@/components/Chip' +import { JsonLDScript } from '@/components/JsonLDScript' +import type { Language } from '@/i18n' +import { ChipsRow } from '@/components/ChipsRow' +import { formatDate } from '@/utils' import { isPostShouldBePickedByLocale } from '../_utils/isPostShouldBePickedByLocale' import { allBlogPostsWithTranslates } from '../_content' -import { generateFullUrl } from '../../../../utils/generateFullUrl' -import { memeberToPostAuthor } from '../../../../utils/memeberToPostAuthor' -import { TOC } from '../../../../components/TOC' -import { PostAuthor } from '../../../../components/PostAuthor' +import { generateFullUrl } from '@/utils' +import { memeberToPostAuthor } from '@/utils' +import { TOC } from '@/components/TOC' +import { PostAuthor } from '@/components/PostAuthor' interface BlogProps { params: { diff --git a/apps/blog/src/app/[locale]/posts/_content/index.ts b/apps/blog/src/app/[locale]/posts/_content/index.ts index 254e0c9d..cc0ba3e8 100644 --- a/apps/blog/src/app/[locale]/posts/_content/index.ts +++ b/apps/blog/src/app/[locale]/posts/_content/index.ts @@ -1,6 +1,6 @@ import type { BlogPost } from 'contentlayer/generated' import { allBlogPosts } from 'contentlayer/generated' -import type { Language } from '../../../../i18n/i18n.settings' +import type { Language } from '@/i18n' export { allBlogPosts } export type BlogPostWithTranslates = BlogPost & { translates: { [key in Language]?: BlogPost } } diff --git a/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts b/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts index b98274d7..55f53057 100644 --- a/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts +++ b/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts @@ -1,4 +1,4 @@ -import type { Language } from '../../../../i18n/i18n.settings' +import type { Language } from '@/i18n' import { isPostShouldBePickedByLocale } from './isPostShouldBePickedByLocale' import type { BlogPostWithTranslates } from '../_content' diff --git a/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts b/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts index 6f56eb57..3e16845e 100644 --- a/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts +++ b/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts @@ -1,6 +1,6 @@ import type { BlogPostWithTranslates } from '../_content' -import type { Language } from '../../../../i18n/i18n.settings' -import { fallbackLanguage } from '../../../../i18n/i18n.settings' +import type { Language } from '@/i18n' +import { fallbackLanguage } from '@/i18n' export const isPostShouldBePickedByLocale = (post: Pick, locale: Language): boolean => { /** diff --git a/apps/blog/src/app/[locale]/posts/layout.tsx b/apps/blog/src/app/[locale]/posts/layout.tsx index 5249ff3e..9162af48 100644 --- a/apps/blog/src/app/[locale]/posts/layout.tsx +++ b/apps/blog/src/app/[locale]/posts/layout.tsx @@ -2,11 +2,11 @@ import type { ReactNode } from 'react' import type { Metadata } from 'next' import { Suspense } from 'react' -import { Breadcrumbs } from '../../../components/Breadcrumbs' -import type { Language } from '../../../i18n/i18n.settings' -import { useTranslation } from '../../../i18n' -import { generateFullUrl } from '../../../utils/generateFullUrl' -import memebattleLogo from '../../../assets/memebattle-logo.svg' +import { Breadcrumbs } from '@/components/Breadcrumbs' +import type { Language } from '@/i18n' +import { useTranslation } from '@/i18n' +import { generateFullUrl } from '@/utils' +import memebattleLogo from '@/assets/memebattle-logo.svg' export async function generateMetadata({ params }: { params: { locale: Language } }): Promise { // useTranslation on server isn't react hook diff --git a/apps/blog/src/app/[locale]/posts/page.tsx b/apps/blog/src/app/[locale]/posts/page.tsx index be296af0..92b75773 100644 --- a/apps/blog/src/app/[locale]/posts/page.tsx +++ b/apps/blog/src/app/[locale]/posts/page.tsx @@ -2,16 +2,16 @@ import Link from 'next/link' import type { Metadata } from 'next' import { allBlogPostsWithTranslates, uniqTags } from './_content' import { filterBlogPosts } from './_utils/filterBlogPosts' -import { useTranslation } from '../../../i18n' -import type { Language } from '../../../i18n/i18n.settings' -import { SearchInput } from '../../../components/SearchInput' +import { useTranslation } from '@/i18n' +import type { Language } from '@/i18n' +import { SearchInput } from '@/components/SearchInput' import { Suspense } from 'react' -import { formatDate } from '../../../utils/formatDate' -import { TagsSelector } from '../../../components/TagsSelector' -import { ChipsRow } from '../../../components/ChipsRow' -import { Chip } from '../../../components/Chip' -import { EmptyPlaceholder } from '../../../components/PostsList/EmptyPlaceholder' -import { PostsListItem } from '../../../components/PostsListItem' +import { formatDate } from '@/utils' +import { TagsSelector } from '@/components/TagsSelector' +import { ChipsRow } from '@/components/ChipsRow' +import { Chip } from '@/components/Chip' +import { EmptyPlaceholder } from '@/components/PostsList' +import { PostsListItem } from '@/components/PostsListItem' function SearchLoader() { return
diff --git a/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx b/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx index 694b3c90..7bfbb162 100644 --- a/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx +++ b/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx @@ -1,8 +1,9 @@ import Image from 'next/image' import emptyImage from './empty_image.svg' import { Trans } from 'react-i18next/TransWithoutContext' -import { useTranslation } from '../../i18n' -import type { Language } from '../../i18n/i18n.settings' +import { useTranslation } from '@/i18n' +import type { Language } from '@/i18n' + export async function EmptyPlaceholder({ language }: { language: Language }) { const { t } = await useTranslation(language, 'posts') diff --git a/apps/blog/src/components/PostsList/index.ts b/apps/blog/src/components/PostsList/index.ts new file mode 100644 index 00000000..bb75d086 --- /dev/null +++ b/apps/blog/src/components/PostsList/index.ts @@ -0,0 +1 @@ +export { EmptyPlaceholder } from './EmptyPlaceholder' diff --git a/apps/blog/src/i18n/index.ts b/apps/blog/src/i18n/index.ts index 3a61e03f..945c95b7 100644 --- a/apps/blog/src/i18n/index.ts +++ b/apps/blog/src/i18n/index.ts @@ -1,23 +1,3 @@ -import type { CustomTypeOptions } from 'i18next' -import { createInstance } from 'i18next' -import resourcesToBackend from 'i18next-resources-to-backend' -import { initReactI18next } from 'react-i18next/initReactI18next' -import type { Language } from './i18n.settings' -import { getOptions, defaultNS } from './i18n.settings' - -const initI18next = async (lng: string, ns?: string) => { - const i18nInstance = createInstance() - await i18nInstance - .use(initReactI18next) - .use(resourcesToBackend((language: string, namespace: string) => import(`./locales/${language}/${namespace}.json`))) - .init(getOptions(lng, ns)) - return i18nInstance -} - -export async function useTranslation(lng: Language, ns: keyof CustomTypeOptions['resources'] = defaultNS) { - const i18nextInstance = await initI18next(lng, ns) - return { - t: i18nextInstance.getFixedT(lng, ns), - i18n: i18nextInstance, - } -} +export { useTranslation } from './useTranslation' +export { getOptions, languages, fallbackLanguage, defaultNS } from './i18n.settings' +export type { Language } from './i18n.settings' diff --git a/apps/blog/src/i18n/useTranslation.tsx b/apps/blog/src/i18n/useTranslation.tsx new file mode 100644 index 00000000..3a61e03f --- /dev/null +++ b/apps/blog/src/i18n/useTranslation.tsx @@ -0,0 +1,23 @@ +import type { CustomTypeOptions } from 'i18next' +import { createInstance } from 'i18next' +import resourcesToBackend from 'i18next-resources-to-backend' +import { initReactI18next } from 'react-i18next/initReactI18next' +import type { Language } from './i18n.settings' +import { getOptions, defaultNS } from './i18n.settings' + +const initI18next = async (lng: string, ns?: string) => { + const i18nInstance = createInstance() + await i18nInstance + .use(initReactI18next) + .use(resourcesToBackend((language: string, namespace: string) => import(`./locales/${language}/${namespace}.json`))) + .init(getOptions(lng, ns)) + return i18nInstance +} + +export async function useTranslation(lng: Language, ns: keyof CustomTypeOptions['resources'] = defaultNS) { + const i18nextInstance = await initI18next(lng, ns) + return { + t: i18nextInstance.getFixedT(lng, ns), + i18n: i18nextInstance, + } +} diff --git a/apps/blog/src/middleware.ts b/apps/blog/src/middleware.ts index 760964a7..3e17e838 100644 --- a/apps/blog/src/middleware.ts +++ b/apps/blog/src/middleware.ts @@ -1,7 +1,7 @@ import type { NextRequest } from 'next/server' import { NextResponse } from 'next/server' import Negotiator from 'negotiator' -import { fallbackLanguage, languages } from './i18n/i18n.settings' +import { fallbackLanguage, languages } from '@/i18n' export const config = { // matcher: '/:lng*' diff --git a/apps/blog/src/utils/index.ts b/apps/blog/src/utils/index.ts new file mode 100644 index 00000000..d53726fa --- /dev/null +++ b/apps/blog/src/utils/index.ts @@ -0,0 +1,3 @@ +export { memeberToPostAuthor } from './memeberToPostAuthor' +export { formatDate } from './formatDate' +export { generateFullUrl } from './generateFullUrl' diff --git a/apps/blog/tsconfig.json b/apps/blog/tsconfig.json index 85462aca..48e3006d 100644 --- a/apps/blog/tsconfig.json +++ b/apps/blog/tsconfig.json @@ -21,7 +21,8 @@ "paths": { "contentlayer/generated": [ "./.contentlayer/generated" - ] + ], + "@/*": ["./src/*"] }, "types": ["./src/i18n/i18next.d.ts", "vitest/globals"], "plugins": [ diff --git a/apps/blog/vitest.config.ts b/apps/blog/vitest.config.ts index c8eb0bb8..eb151753 100644 --- a/apps/blog/vitest.config.ts +++ b/apps/blog/vitest.config.ts @@ -15,6 +15,22 @@ export default defineConfig({ find: 'contentlayer/generated', replacement: fileURLToPath(new URL('./.contentlayer/generated', import.meta.url)), }, + { + find: './src/components', + replacement: fileURLToPath(new URL('@/components', import.meta.url)), + }, + { + find: './src/utils', + replacement: fileURLToPath(new URL('@/utils', import.meta.url)), + }, + { + find: './src/i18n', + replacement: fileURLToPath(new URL('@/i18n', import.meta.url)), + }, + { + find: './src/assets', + replacement: fileURLToPath(new URL('@/assets', import.meta.url)), + }, ], }, }) From be1a379688c951d2bac3521fae48b2c6f4573aa3 Mon Sep 17 00:00:00 2001 From: stonek Date: Thu, 31 Aug 2023 17:48:53 +0300 Subject: [PATCH 2/5] [#365] Add aliases for tests --- apps/blog/vitest.config.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/apps/blog/vitest.config.ts b/apps/blog/vitest.config.ts index eb151753..c6a50597 100644 --- a/apps/blog/vitest.config.ts +++ b/apps/blog/vitest.config.ts @@ -8,6 +8,11 @@ export default defineConfig({ test: { globals: true, environment: 'jsdom', + alias: { + '@/i18n': new URL('./src/i18n', import.meta.url).pathname, + '@/components': new URL('./src/components', import.meta.url).pathname, + '@/utils': new URL('./src/utils', import.meta.url).pathname, + }, }, resolve: { alias: [ From d22072c04e13e24d9a30e305a77a9624e292a055 Mon Sep 17 00:00:00 2001 From: stonek Date: Sat, 2 Sep 2023 12:41:39 +0300 Subject: [PATCH 3/5] [#365] Fix vite and ts configs for aliases, add vite-tsconfig-paths plugin --- apps/blog/package.json | 1 + apps/blog/src/app/[locale]/posts/layout.tsx | 2 +- apps/blog/vitest.config.ts | 34 ++------------------- yarn.lock | 31 +++++++++++++++++++ 4 files changed, 36 insertions(+), 32 deletions(-) diff --git a/apps/blog/package.json b/apps/blog/package.json index 3f572587..6f3aca25 100644 --- a/apps/blog/package.json +++ b/apps/blog/package.json @@ -45,6 +45,7 @@ "tailwindcss": "^3.3.1", "typescript": "^5.0.4", "unist-util-visit": "^4.1.2", + "vite-tsconfig-paths": "^4.2.0", "vitest": "^0.32.0" } } diff --git a/apps/blog/src/app/[locale]/posts/layout.tsx b/apps/blog/src/app/[locale]/posts/layout.tsx index 9162af48..6305acc5 100644 --- a/apps/blog/src/app/[locale]/posts/layout.tsx +++ b/apps/blog/src/app/[locale]/posts/layout.tsx @@ -18,7 +18,7 @@ export async function generateMetadata({ params }: { params: { locale: Language url: generateFullUrl(`/${params.locale}/posts`), description: t('description'), title: t('title'), - images: [generateFullUrl(memebattleLogo.src)], + images: [generateFullUrl(memebattleLogo)], }, } } diff --git a/apps/blog/vitest.config.ts b/apps/blog/vitest.config.ts index c6a50597..347751a0 100644 --- a/apps/blog/vitest.config.ts +++ b/apps/blog/vitest.config.ts @@ -1,41 +1,13 @@ -import { fileURLToPath } from 'node:url' import { defineConfig } from 'vitest/config' +import tsconfigPaths from 'vite-tsconfig-paths' + import react from '@vitejs/plugin-react' // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], + plugins: [react(), tsconfigPaths()], test: { globals: true, environment: 'jsdom', - alias: { - '@/i18n': new URL('./src/i18n', import.meta.url).pathname, - '@/components': new URL('./src/components', import.meta.url).pathname, - '@/utils': new URL('./src/utils', import.meta.url).pathname, - }, - }, - resolve: { - alias: [ - { - find: 'contentlayer/generated', - replacement: fileURLToPath(new URL('./.contentlayer/generated', import.meta.url)), - }, - { - find: './src/components', - replacement: fileURLToPath(new URL('@/components', import.meta.url)), - }, - { - find: './src/utils', - replacement: fileURLToPath(new URL('@/utils', import.meta.url)), - }, - { - find: './src/i18n', - replacement: fileURLToPath(new URL('@/i18n', import.meta.url)), - }, - { - find: './src/assets', - replacement: fileURLToPath(new URL('@/assets', import.meta.url)), - }, - ], }, }) diff --git a/yarn.lock b/yarn.lock index d108b318..b123a086 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3285,6 +3285,7 @@ __metadata: tailwindcss: ^3.3.1 typescript: ^5.0.4 unist-util-visit: ^4.1.2 + vite-tsconfig-paths: ^4.2.0 vitest: ^0.32.0 languageName: unknown linkType: soft @@ -21930,6 +21931,20 @@ __metadata: languageName: node linkType: hard +"tsconfck@npm:^2.1.0": + version: 2.1.2 + resolution: "tsconfck@npm:2.1.2" + peerDependencies: + typescript: ^4.3.5 || ^5.0.0 + peerDependenciesMeta: + typescript: + optional: true + bin: + tsconfck: bin/tsconfck.js + checksum: 6fd2f7de012a724f6b4bf48ae76cc7dae2b59dd5cad2dc50bac58d224d4ed7d5c43c6b26e55d3e00636f426f8b5373c996523d73b7830d05f8479a9b83282192 + languageName: node + linkType: hard + "tsconfig-paths-webpack-plugin@npm:^4.0.0": version: 4.0.0 resolution: "tsconfig-paths-webpack-plugin@npm:4.0.0" @@ -22906,6 +22921,22 @@ __metadata: languageName: node linkType: hard +"vite-tsconfig-paths@npm:^4.2.0": + version: 4.2.0 + resolution: "vite-tsconfig-paths@npm:4.2.0" + dependencies: + debug: ^4.1.1 + globrex: ^0.1.2 + tsconfck: ^2.1.0 + peerDependencies: + vite: "*" + peerDependenciesMeta: + vite: + optional: true + checksum: 73a8467de72d7ac502328454fd00c19571cd4bad2dd5982643b24718bb95e449a3f4153cfc2d58a358bfc8f37e592fb442fc10884b59ae82138c1329160cd952 + languageName: node + linkType: hard + "vite@npm:^3.0.0 || ^4.0.0, vite@npm:^4.3.9": version: 4.3.9 resolution: "vite@npm:4.3.9" From 5c4ecfdf3d1b2ea496424a257ff852b7de42db2e Mon Sep 17 00:00:00 2001 From: stonek Date: Sun, 3 Sep 2023 16:33:46 +0300 Subject: [PATCH 4/5] [#394] Fix import points i18n and Utils, fix paths with alias --- apps/blog/src/app/[locale]/layout.tsx | 8 +++--- apps/blog/src/app/[locale]/page.tsx | 2 +- .../src/app/[locale]/posts/[slug]/page.tsx | 9 +++---- .../src/app/[locale]/posts/_content/index.ts | 2 +- .../[locale]/posts/_utils/filterBlogPosts.ts | 2 +- .../_utils/isPostShouldBePickedByLocale.ts | 4 +-- apps/blog/src/app/[locale]/posts/layout.tsx | 6 ++--- apps/blog/src/app/[locale]/posts/page.tsx | 5 ++-- .../components/Breadcrumbs/Breadcrumbs.tsx | 2 +- apps/blog/src/components/Footer/Footer.tsx | 4 +-- .../components/LanguageSwitcher/Dropdown.tsx | 2 +- .../LanguageSwitcher/LanguageSwitcher.tsx | 6 ++--- .../components/PostsList/EmptyPlaceholder.tsx | 2 +- apps/blog/src/components/TOC/TOC.tsx | 4 +-- apps/blog/src/i18n/index.ts | 26 ++++++++++++++++--- apps/blog/src/i18n/useTranslation.tsx | 23 ---------------- apps/blog/src/middleware.ts | 2 +- apps/blog/src/utils/formatDate.ts | 2 +- apps/blog/src/utils/index.ts | 3 --- 19 files changed, 55 insertions(+), 59 deletions(-) delete mode 100644 apps/blog/src/i18n/useTranslation.tsx delete mode 100644 apps/blog/src/utils/index.ts diff --git a/apps/blog/src/app/[locale]/layout.tsx b/apps/blog/src/app/[locale]/layout.tsx index 272079f9..82a7a368 100644 --- a/apps/blog/src/app/[locale]/layout.tsx +++ b/apps/blog/src/app/[locale]/layout.tsx @@ -2,12 +2,14 @@ import './globals.css' import type { Metadata } from 'next' import localFont from 'next/font/local' import { dir } from 'i18next' -import type { Language } from '@/i18n' -import { languages, useTranslation } from '@/i18n' -import { generateFullUrl } from '@/utils' + import { Amplitude } from '@/components/Amplitude' import { LanguageSwitcher } from '@/components/LanguageSwitcher' import { Footer } from '@/components/Footer' +import { generateFullUrl } from '@/utils/generateFullUrl' +import { languages } from '@/i18n/i18n.settings' +import type { Language } from '@/i18n/i18n.settings' +import { useTranslation } from '@/i18n' type RootLayoutParams = { locale: Language } diff --git a/apps/blog/src/app/[locale]/page.tsx b/apps/blog/src/app/[locale]/page.tsx index e0877896..fbc937f5 100644 --- a/apps/blog/src/app/[locale]/page.tsx +++ b/apps/blog/src/app/[locale]/page.tsx @@ -1,5 +1,5 @@ import { redirect } from 'next/navigation' -import type { Language } from '@/i18n' +import type { Language } from '@/i18n/i18n.settings' export default function BlogPage({ params: { locale } }: { params: { locale: Language } }) { return redirect(`/${locale}/posts`) diff --git a/apps/blog/src/app/[locale]/posts/[slug]/page.tsx b/apps/blog/src/app/[locale]/posts/[slug]/page.tsx index 11cd1a42..7156f2da 100644 --- a/apps/blog/src/app/[locale]/posts/[slug]/page.tsx +++ b/apps/blog/src/app/[locale]/posts/[slug]/page.tsx @@ -8,16 +8,15 @@ import type { BlogPost } from 'contentlayer/generated' import { allBlogPosts, allMemebers } from 'contentlayer/generated' import { Chip } from '@/components/Chip' import { JsonLDScript } from '@/components/JsonLDScript' -import type { Language } from '@/i18n' import { ChipsRow } from '@/components/ChipsRow' -import { formatDate } from '@/utils' - import { isPostShouldBePickedByLocale } from '../_utils/isPostShouldBePickedByLocale' import { allBlogPostsWithTranslates } from '../_content' -import { generateFullUrl } from '@/utils' -import { memeberToPostAuthor } from '@/utils' import { TOC } from '@/components/TOC' import { PostAuthor } from '@/components/PostAuthor' +import { generateFullUrl } from '@/utils/generateFullUrl' +import { memeberToPostAuthor } from '@/utils/memeberToPostAuthor' +import { formatDate } from '@/utils/formatDate' +import type { Language } from '@/i18n/i18n.settings' interface BlogProps { params: { diff --git a/apps/blog/src/app/[locale]/posts/_content/index.ts b/apps/blog/src/app/[locale]/posts/_content/index.ts index cc0ba3e8..8a154d39 100644 --- a/apps/blog/src/app/[locale]/posts/_content/index.ts +++ b/apps/blog/src/app/[locale]/posts/_content/index.ts @@ -1,6 +1,6 @@ import type { BlogPost } from 'contentlayer/generated' import { allBlogPosts } from 'contentlayer/generated' -import type { Language } from '@/i18n' +import type { Language } from '@/i18n/i18n.settings' export { allBlogPosts } export type BlogPostWithTranslates = BlogPost & { translates: { [key in Language]?: BlogPost } } diff --git a/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts b/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts index 55f53057..5a0f2802 100644 --- a/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts +++ b/apps/blog/src/app/[locale]/posts/_utils/filterBlogPosts.ts @@ -1,6 +1,6 @@ -import type { Language } from '@/i18n' import { isPostShouldBePickedByLocale } from './isPostShouldBePickedByLocale' import type { BlogPostWithTranslates } from '../_content' +import type { Language } from '@/i18n/i18n.settings' export function filterBlogPosts>( blogPosts: T[], diff --git a/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts b/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts index 3e16845e..558a4e3b 100644 --- a/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts +++ b/apps/blog/src/app/[locale]/posts/_utils/isPostShouldBePickedByLocale.ts @@ -1,6 +1,6 @@ import type { BlogPostWithTranslates } from '../_content' -import type { Language } from '@/i18n' -import { fallbackLanguage } from '@/i18n' +import type { Language } from '@/i18n/i18n.settings' +import { fallbackLanguage } from '@/i18n/i18n.settings' export const isPostShouldBePickedByLocale = (post: Pick, locale: Language): boolean => { /** diff --git a/apps/blog/src/app/[locale]/posts/layout.tsx b/apps/blog/src/app/[locale]/posts/layout.tsx index 6305acc5..62434221 100644 --- a/apps/blog/src/app/[locale]/posts/layout.tsx +++ b/apps/blog/src/app/[locale]/posts/layout.tsx @@ -3,10 +3,10 @@ import type { Metadata } from 'next' import { Suspense } from 'react' import { Breadcrumbs } from '@/components/Breadcrumbs' -import type { Language } from '@/i18n' -import { useTranslation } from '@/i18n' -import { generateFullUrl } from '@/utils' import memebattleLogo from '@/assets/memebattle-logo.svg' +import { generateFullUrl } from '@/utils/generateFullUrl' +import type { Language } from '@/i18n/i18n.settings' +import { useTranslation } from '@/i18n' export async function generateMetadata({ params }: { params: { locale: Language } }): Promise { // useTranslation on server isn't react hook diff --git a/apps/blog/src/app/[locale]/posts/page.tsx b/apps/blog/src/app/[locale]/posts/page.tsx index 92b75773..30bac3a0 100644 --- a/apps/blog/src/app/[locale]/posts/page.tsx +++ b/apps/blog/src/app/[locale]/posts/page.tsx @@ -1,17 +1,18 @@ import Link from 'next/link' import type { Metadata } from 'next' + import { allBlogPostsWithTranslates, uniqTags } from './_content' import { filterBlogPosts } from './_utils/filterBlogPosts' import { useTranslation } from '@/i18n' -import type { Language } from '@/i18n' import { SearchInput } from '@/components/SearchInput' import { Suspense } from 'react' -import { formatDate } from '@/utils' import { TagsSelector } from '@/components/TagsSelector' import { ChipsRow } from '@/components/ChipsRow' import { Chip } from '@/components/Chip' import { EmptyPlaceholder } from '@/components/PostsList' import { PostsListItem } from '@/components/PostsListItem' +import { formatDate } from '@/utils/formatDate' +import type { Language } from '@/i18n/i18n.settings' function SearchLoader() { return
diff --git a/apps/blog/src/components/Breadcrumbs/Breadcrumbs.tsx b/apps/blog/src/components/Breadcrumbs/Breadcrumbs.tsx index 751fb253..e0cceade 100644 --- a/apps/blog/src/components/Breadcrumbs/Breadcrumbs.tsx +++ b/apps/blog/src/components/Breadcrumbs/Breadcrumbs.tsx @@ -2,7 +2,7 @@ import Link from 'next/link' import { useSelectedLayoutSegment } from 'next/navigation' -import type { Language } from '../../i18n/i18n.settings' +import type { Language } from '@/i18n/i18n.settings' export function Breadcrumbs({ locale, translates }: { locale: Language; translates: { mainPage: string; posts: string } }) { const segment = useSelectedLayoutSegment() diff --git a/apps/blog/src/components/Footer/Footer.tsx b/apps/blog/src/components/Footer/Footer.tsx index e3d43f09..626c79fa 100644 --- a/apps/blog/src/components/Footer/Footer.tsx +++ b/apps/blog/src/components/Footer/Footer.tsx @@ -1,8 +1,8 @@ import Image from 'next/image' import gitHubLogo from './GitHub_Logo_White.png' -import type { Language } from '../../i18n/i18n.settings' -import { useTranslation } from '../../i18n' +import type { Language } from '@/i18n/i18n.settings' +import { useTranslation } from '@/i18n' import memebattleLogo from '../../assets/memebattle-logo.svg' export async function Footer({ locale }: { locale: Language }) { diff --git a/apps/blog/src/components/LanguageSwitcher/Dropdown.tsx b/apps/blog/src/components/LanguageSwitcher/Dropdown.tsx index 15981a13..3efd3545 100644 --- a/apps/blog/src/components/LanguageSwitcher/Dropdown.tsx +++ b/apps/blog/src/components/LanguageSwitcher/Dropdown.tsx @@ -3,7 +3,7 @@ import Link from 'next/link' import { usePathname, useSearchParams } from 'next/navigation' import * as DropdownMenu from '@radix-ui/react-dropdown-menu' -import type { Language } from '../../i18n/i18n.settings' +import type { Language } from '@/i18n/i18n.settings' import type { ReactNode } from 'react' import { useMemo } from 'react' import type { Route } from 'next' diff --git a/apps/blog/src/components/LanguageSwitcher/LanguageSwitcher.tsx b/apps/blog/src/components/LanguageSwitcher/LanguageSwitcher.tsx index 6fef653f..3467ccc3 100644 --- a/apps/blog/src/components/LanguageSwitcher/LanguageSwitcher.tsx +++ b/apps/blog/src/components/LanguageSwitcher/LanguageSwitcher.tsx @@ -1,6 +1,6 @@ -import type { Language } from '../../i18n/i18n.settings' -import { languages } from '../../i18n/i18n.settings' -import { useTranslation } from '../../i18n' +import type { Language } from '@/i18n/i18n.settings' +import { languages } from '@/i18n/i18n.settings' +import { useTranslation } from '@/i18n' import { Dropdown } from './Dropdown' import { Suspense } from 'react' diff --git a/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx b/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx index 7bfbb162..c27e8d5a 100644 --- a/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx +++ b/apps/blog/src/components/PostsList/EmptyPlaceholder.tsx @@ -2,7 +2,7 @@ import Image from 'next/image' import emptyImage from './empty_image.svg' import { Trans } from 'react-i18next/TransWithoutContext' import { useTranslation } from '@/i18n' -import type { Language } from '@/i18n' +import type { Language } from '@/i18n/i18n.settings' export async function EmptyPlaceholder({ language }: { language: Language }) { const { t } = await useTranslation(language, 'posts') diff --git a/apps/blog/src/components/TOC/TOC.tsx b/apps/blog/src/components/TOC/TOC.tsx index dcf28521..25ba8825 100644 --- a/apps/blog/src/components/TOC/TOC.tsx +++ b/apps/blog/src/components/TOC/TOC.tsx @@ -1,7 +1,7 @@ import clsx from 'clsx' import type { TOCTree, TOCTreeItem } from '../../types' -import { useTranslation } from '../../i18n' -import type { Language } from '../../i18n/i18n.settings' +import { useTranslation } from '@/i18n' +import type { Language } from '@/i18n/i18n.settings' interface TOCProps { toc: TOCTree diff --git a/apps/blog/src/i18n/index.ts b/apps/blog/src/i18n/index.ts index 945c95b7..3a61e03f 100644 --- a/apps/blog/src/i18n/index.ts +++ b/apps/blog/src/i18n/index.ts @@ -1,3 +1,23 @@ -export { useTranslation } from './useTranslation' -export { getOptions, languages, fallbackLanguage, defaultNS } from './i18n.settings' -export type { Language } from './i18n.settings' +import type { CustomTypeOptions } from 'i18next' +import { createInstance } from 'i18next' +import resourcesToBackend from 'i18next-resources-to-backend' +import { initReactI18next } from 'react-i18next/initReactI18next' +import type { Language } from './i18n.settings' +import { getOptions, defaultNS } from './i18n.settings' + +const initI18next = async (lng: string, ns?: string) => { + const i18nInstance = createInstance() + await i18nInstance + .use(initReactI18next) + .use(resourcesToBackend((language: string, namespace: string) => import(`./locales/${language}/${namespace}.json`))) + .init(getOptions(lng, ns)) + return i18nInstance +} + +export async function useTranslation(lng: Language, ns: keyof CustomTypeOptions['resources'] = defaultNS) { + const i18nextInstance = await initI18next(lng, ns) + return { + t: i18nextInstance.getFixedT(lng, ns), + i18n: i18nextInstance, + } +} diff --git a/apps/blog/src/i18n/useTranslation.tsx b/apps/blog/src/i18n/useTranslation.tsx deleted file mode 100644 index 3a61e03f..00000000 --- a/apps/blog/src/i18n/useTranslation.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import type { CustomTypeOptions } from 'i18next' -import { createInstance } from 'i18next' -import resourcesToBackend from 'i18next-resources-to-backend' -import { initReactI18next } from 'react-i18next/initReactI18next' -import type { Language } from './i18n.settings' -import { getOptions, defaultNS } from './i18n.settings' - -const initI18next = async (lng: string, ns?: string) => { - const i18nInstance = createInstance() - await i18nInstance - .use(initReactI18next) - .use(resourcesToBackend((language: string, namespace: string) => import(`./locales/${language}/${namespace}.json`))) - .init(getOptions(lng, ns)) - return i18nInstance -} - -export async function useTranslation(lng: Language, ns: keyof CustomTypeOptions['resources'] = defaultNS) { - const i18nextInstance = await initI18next(lng, ns) - return { - t: i18nextInstance.getFixedT(lng, ns), - i18n: i18nextInstance, - } -} diff --git a/apps/blog/src/middleware.ts b/apps/blog/src/middleware.ts index 3e17e838..58084dcd 100644 --- a/apps/blog/src/middleware.ts +++ b/apps/blog/src/middleware.ts @@ -1,7 +1,7 @@ import type { NextRequest } from 'next/server' import { NextResponse } from 'next/server' import Negotiator from 'negotiator' -import { fallbackLanguage, languages } from '@/i18n' +import { fallbackLanguage, languages } from '@/i18n/i18n.settings' export const config = { // matcher: '/:lng*' diff --git a/apps/blog/src/utils/formatDate.ts b/apps/blog/src/utils/formatDate.ts index c94afc8c..93db27cf 100644 --- a/apps/blog/src/utils/formatDate.ts +++ b/apps/blog/src/utils/formatDate.ts @@ -1,4 +1,4 @@ -import type { Language } from '../i18n/i18n.settings' +import type { Language } from '@/i18n/i18n.settings' export function formatDate(dateString: string, locale: Language) { return new Intl.DateTimeFormat(locale).format(new Date(dateString)) diff --git a/apps/blog/src/utils/index.ts b/apps/blog/src/utils/index.ts deleted file mode 100644 index d53726fa..00000000 --- a/apps/blog/src/utils/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -export { memeberToPostAuthor } from './memeberToPostAuthor' -export { formatDate } from './formatDate' -export { generateFullUrl } from './generateFullUrl' From cfc513f70c3cf0e3c7b0e41ef337b9502cec0593 Mon Sep 17 00:00:00 2001 From: stonek Date: Mon, 4 Sep 2023 13:41:05 +0300 Subject: [PATCH 5/5] [#394] Update vite-tsconfig-paths to 4.2.0 in ligretto-frontend, fix unexpected change in layout.tsx --- apps/blog/src/app/[locale]/posts/layout.tsx | 2 +- apps/ligretto-frontend/package.json | 2 +- yarn.lock | 44 +-------------------- 3 files changed, 4 insertions(+), 44 deletions(-) diff --git a/apps/blog/src/app/[locale]/posts/layout.tsx b/apps/blog/src/app/[locale]/posts/layout.tsx index 62434221..ffec93fe 100644 --- a/apps/blog/src/app/[locale]/posts/layout.tsx +++ b/apps/blog/src/app/[locale]/posts/layout.tsx @@ -18,7 +18,7 @@ export async function generateMetadata({ params }: { params: { locale: Language url: generateFullUrl(`/${params.locale}/posts`), description: t('description'), title: t('title'), - images: [generateFullUrl(memebattleLogo)], + images: [generateFullUrl(memebattleLogo.src)], }, } } diff --git a/apps/ligretto-frontend/package.json b/apps/ligretto-frontend/package.json index 399bcaa5..a3101a9b 100644 --- a/apps/ligretto-frontend/package.json +++ b/apps/ligretto-frontend/package.json @@ -23,7 +23,7 @@ "typescript": "^5.0.4", "vite": "^4.3.9", "vite-plugin-svgr": "^2.2.0", - "vite-tsconfig-paths": "^3.5.0", + "vite-tsconfig-paths": "^4.2.0", "vitest": "^0.32.0" }, "dependencies": { diff --git a/yarn.lock b/yarn.lock index b123a086..4207d53f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2107,13 +2107,6 @@ __metadata: languageName: node linkType: hard -"@cush/relative@npm:^1.0.0": - version: 1.0.0 - resolution: "@cush/relative@npm:1.0.0" - checksum: 708681b61986e5f74e44ca5824503c23adb02c088b998429e8ecbbb8e7a4133b9be491cdb6d2b24b39fd9b55fcef109d41ac4f69b74f1f9466268f3c49c020a5 - languageName: node - linkType: hard - "@discoveryjs/json-ext@npm:^0.5.0, @discoveryjs/json-ext@npm:^0.5.3": version: 0.5.7 resolution: "@discoveryjs/json-ext@npm:0.5.7" @@ -3380,7 +3373,7 @@ __metadata: typescript: ^5.0.4 vite: ^4.3.9 vite-plugin-svgr: ^2.2.0 - vite-tsconfig-paths: ^3.5.0 + vite-tsconfig-paths: ^4.2.0 vitest: ^0.32.0 languageName: unknown linkType: soft @@ -12294,13 +12287,6 @@ __metadata: languageName: node linkType: hard -"glob-regex@npm:^0.3.0": - version: 0.3.2 - resolution: "glob-regex@npm:0.3.2" - checksum: 4f7adee18e750cbc3a328acb879631feca56dbfc03016cec53d5a54e50663ddc96e24e244ec8c1a5ee883515126754d89deb825eba529d32b869a0ae46f95e5c - languageName: node - linkType: hard - "glob-to-regexp@npm:^0.3.0": version: 0.3.0 resolution: "glob-to-regexp@npm:0.3.0" @@ -19295,18 +19281,6 @@ __metadata: languageName: node linkType: hard -"recrawl-sync@npm:^2.0.3": - version: 2.2.2 - resolution: "recrawl-sync@npm:2.2.2" - dependencies: - "@cush/relative": ^1.0.0 - glob-regex: ^0.3.0 - slash: ^3.0.0 - tslib: ^1.9.3 - checksum: ee0a3fdbb6c4fa7124a93ef13b87f69f9a4e7bdd0be157ca98e1951ae8d1a7bbee2ebc25de6946b0b53426f804c712ff32f6c93b916b719e865c90233386a126 - languageName: node - linkType: hard - "redent@npm:^3.0.0": version: 3.0.0 resolution: "redent@npm:3.0.0" @@ -21979,7 +21953,7 @@ __metadata: languageName: node linkType: hard -"tslib@npm:^1.8.1, tslib@npm:^1.9.0, tslib@npm:^1.9.3": +"tslib@npm:^1.8.1, tslib@npm:^1.9.0": version: 1.14.1 resolution: "tslib@npm:1.14.1" checksum: dbe628ef87f66691d5d2959b3e41b9ca0045c3ee3c7c7b906cc1e328b39f199bb1ad9e671c39025bd56122ac57dfbf7385a94843b1cc07c60a4db74795829acd @@ -22907,20 +22881,6 @@ __metadata: languageName: node linkType: hard -"vite-tsconfig-paths@npm:^3.5.0": - version: 3.5.0 - resolution: "vite-tsconfig-paths@npm:3.5.0" - dependencies: - debug: ^4.1.1 - globrex: ^0.1.2 - recrawl-sync: ^2.0.3 - tsconfig-paths: ^4.0.0 - peerDependencies: - vite: ">2.0.0-0" - checksum: d6d4828fdba639445251b3baf06901f2eb46a98b2741ba5e30e3d791c8a25f8533d23df13c5422eece63cf449865750dcd57e825dbe43b5c985e5edf42b17fea - languageName: node - linkType: hard - "vite-tsconfig-paths@npm:^4.2.0": version: 4.2.0 resolution: "vite-tsconfig-paths@npm:4.2.0"