WIP

2025-10-12 19:28:43 +09:00 · 2021-12-11 18:07:22 +09:00
parent c856a34867
commit d9559dd072
46 changed files with 218 additions and 300 deletions
--- a/pages/404.js
+++ b/pages/404.js
@@ -1,29 +0,0 @@
-// Base layout
-import Layout from "./components/Layout"
-
-// React Router
-import { useRouter } from 'next/router'
-
-// Next.js
-import Link from 'next/link'
-import useTranslation from 'next-translate/useTranslation'
-
-export default function Custom404(props) {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("404")
-
-  return (
-    <Layout title="404">
-      <div className="text-center mb-10 mt-10">
-      <p className="text-3xl">404</p>
-      <p className="text-xl">{t('caption')}</p>
-      <Link href="/">
-        <a>
-            <p className="mt-5">{t('return')}</p>
-        </a>
-      </Link>
-      </div>
-    </Layout>
-  )
-}
--- a/pages/components/Discord/DiscordPlaying.js
+++ b/pages/components/Discord/DiscordPlaying.js
@@ -4,9 +4,6 @@ import useTranslation from 'next-translate/useTranslation'
 import { useRouter } from 'next/router'

 function App (){
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("common")
  const [data, setData] = useState({ hits: [] });
  useEffect(() => {
    const fetchData = async () => {
--- a/pages/components/Footer/Footer.js
+++ b/pages/components/Footer/Footer.js
@@ -1,13 +1,9 @@
 import "tailwindcss/tailwind.css";
 import Link from 'next/link';
-import useTranslation from 'next-translate/useTranslation'
-import { useRouter } from 'next/router'
-export default function Footer(props) {
-    
-    const router = useRouter()
-    const { locale, locales, defaultLocale, pathname } = router
-    const { t, lang } = useTranslation("common")
+// i18n
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';

+export default function Footer(props) {
    return (
      <>
        <div className="container mx-auto px-6">
--- a/pages/components/LangSelector.js
+++ b/pages/components/LangSelector.js
@@ -6,9 +6,6 @@ import { faLanguage } from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'

 const Dropdown = ({ color }) => {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-
  // dropdown props
  const [dropdownPopoverShow, setDropdownPopoverShow] = React.useState(false);
  const btnDropdownRef = React.createRef();
--- a/pages/components/Layout.js
+++ b/pages/components/Layout.js
@@ -1,21 +1,19 @@
+// Next.js
 import Head from "next/head"
+
+// Tailwind CSS
 import "tailwindcss/tailwind.css";
-import useTranslation from 'next-translate/useTranslation'
-import { useRouter } from 'next/router'
+
+// React
 import React, { useEffect, useState } from 'react'
+
+// Components
 import Footer from "./Footer/Footer"
 import Navbar from "./Navbar"

 const Layout = (props) => {
  const { title, children } = props
  const siteTitle = "yude.jp"
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-
-  const { t, lang } = useTranslation("common")
-  const footer = t('footer')
-  const source = t('source')
-  const tos = t('tos')
  return (
    <div className="page">
      <Head>
--- a/pages/components/Minecraft.js
+++ b/pages/components/Minecraft.js
@@ -6,10 +6,6 @@ import Image from 'next/image'
 import { list } from 'postcss';

 export default function Minecraft(props) {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("minecraft")
-
  const [data, setData] = useState({ hits: [] });

  useEffect(() => {
--- a/pages/components/Minecraft/Online.js
+++ b/pages/components/Minecraft/Online.js
@@ -6,9 +6,6 @@ import LastPlayed from './LastPlayed'

 function App (props) {
  const uuid = props;
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("common")  
  const [data, setData] = useState({ hits: [] });

  useEffect(() => {
--- a/pages/components/Navbar.js
+++ b/pages/components/Navbar.js
@@ -16,7 +16,8 @@ const Navbar = () => {
        </Link>
            <div className="absolute right-0">
                <ThemeSelector />
-                <LangSelector />
+                {/* <LangSelector /> */}
+                <LanguageSwitcher lang="ja" />
            </div>
      </nav>
      </>
--- a/pages/components/Profile/PublicKeys.js
+++ b/pages/components/Profile/PublicKeys.js
@@ -8,8 +8,6 @@ import Link from 'next/link'
 export default function Modal() {
  const [showModal, setShowModal] = React.useState(false);
  const router = useRouter()
-  const { t, lang } = useTranslation("common")
-  const { locale, locales, defaultLocale, pathname } = router
  const close = t('common:close')
  const keys = t('profile:keys')
  const view = t('profile:view')
--- a/pages/components/Profile/Spotify.js
+++ b/pages/components/Profile/Spotify.js
@@ -4,9 +4,6 @@ import useTranslation from 'next-translate/useTranslation'
 import { useRouter } from 'next/router'

 function App () {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("common")  
  const [data, setData] = useState({ hits: [] });
  useEffect(() => {
    const fetchData = async () => {
--- a/pages/components/Profile/WakaTime.js
+++ b/pages/components/Profile/WakaTime.js
@@ -6,10 +6,7 @@ import { useRouter } from 'next/router'

 export default function Modal() {
  const [showModal, setShowModal] = React.useState(false);
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("common")
-  const close = t('common:close')
+  
  return (
    <>
      <button
--- a/pages/components/ThemeSelector.js
+++ b/pages/components/ThemeSelector.js
@@ -7,9 +7,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'

 const ThemeSelector = (props) => {
  const { title, children } = props
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  
  const [isMounted, setIsMounted] = useState(false);
  const { theme, setTheme, getTheme } = useTheme();
  useEffect(() => {
--- a/pages/hcunews.js
+++ b/pages/hcunews.js
@@ -1,8 +1,12 @@
 // Base layout
 import Layout from "./components/Layout"

-// React, i18n
-import useTranslation from 'next-translate/useTranslation'
+// i18n
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();
+
+// React
 import React from "react"
 import ReactMarkdown from "react-markdown"

--- a/pages/house.js
+++ b/pages/house.js
@@ -1,12 +1,15 @@
+// Base layout
 import Layout from "./components/Layout"
-import useTranslation from 'next-translate/useTranslation'
+
+// i18n
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();
+
+// Next.js router
 import { useRouter } from 'next/router'

 export default function About(props) {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("house")
-
  return (
    <Layout title={t('house')}>
      <div>
--- a/pages/index.js
+++ b/pages/index.js
@@ -13,7 +13,7 @@ import Image from 'next/image'
 import Link from 'next/link'

 // i18n
-import useTranslation from 'next-translate/useTranslation'
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';

 // React Router
 import { useRouter } from 'next/router'
@@ -24,10 +24,8 @@ import { faDiscord, faGit, faMastodon, faGithub } from '@fortawesome/free-brands
 import { faBook, faUser, faServer, faHouseUser, faHeart } from '@fortawesome/free-solid-svg-icons'

 export default function Index(props) {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("index")
-
+  const { t } = useTranslation();
+  const [query] = useLanguageQuery();
  return (
    <>
      <Layout title={t('home')}>
--- a/pages/minecraft.js
+++ b/pages/minecraft.js
@@ -6,7 +6,9 @@ import React, { useState, useEffect } from 'react';
 import { useRouter } from 'next/router'

 // i18n
-import useTranslation from 'next-translate/useTranslation'
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();

 // Next.js
 import Image from 'next/image'
@@ -29,12 +31,6 @@ import en from '../docs/minecraft/en.md'
 import { NextSeo } from 'next-seo';

 export default function About(props) {
-    const router = useRouter()
-    
-    // i18n
-    const { locale, locales, defaultLocale, pathname } = router
-    const { t, lang } = useTranslation("minecraft")
-    
    // Copy server address to clipboard
    const copyText = () => {
      navigator.clipboard.writeText("yude.jp");
--- a/pages/mutual.js
+++ b/pages/mutual.js
@@ -2,7 +2,9 @@
 import Layout from "./components/Layout"

 // i18n
-import useTranslation from 'next-translate/useTranslation'
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();

 // React Router etc.
 import { useRouter } from 'next/router'
@@ -18,9 +20,6 @@ import en from '../docs/mutual/en.md'
 import { NextSeo } from 'next-seo';

 export default function Tos(props) {
-    const router = useRouter()
-    const { locale, locales, defaultLocale, pathname } = router
-    const { t, lang } = useTranslation("common")
    return(
          <>
            <NextSeo
--- a/pages/posts.js
+++ b/pages/posts.js
@@ -4,9 +4,13 @@ import Layout from "./components/Layout"
 // Next.js
 import Link from "next/link";

-// i18n
+// React
 import { useRouter } from 'next/router'
-import useTranslation from 'next-translate/useTranslation'
+
+// i18n
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();

 // microCMS library
 import { client } from "../libs/client";
@@ -15,9 +19,6 @@ import { client } from "../libs/client";
 import { NextSeo } from 'next-seo';

 export default function Home({ blog }) {
-    const router = useRouter()
-    const { locale, locales, defaultLocale, pathname } = router
-    const { t, lang } = useTranslation("common")
    return (
          <>
          <NextSeo
--- a/pages/profile.js
+++ b/pages/profile.js
@@ -2,7 +2,9 @@
 import Layout from "./components/Layout"

 // i18n
-import useTranslation from 'next-translate/useTranslation'
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();

 // Font Awesome
 import { faDiscord, faTwitter, faGithub, faKeybase, faInstagram, faMastodon, faSteam, faAmazon } from '@fortawesome/free-brands-svg-icons'
@@ -30,9 +32,6 @@ import NintendoSW from "./components/Profile/NintendoSW"
 import { NextSeo } from 'next-seo';

 export default function Profile(props) {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("profile")

  return (
    <>
--- a/pages/server.js
+++ b/pages/server.js
@@ -2,7 +2,9 @@
 import Layout from "./components/Layout"

 // i18n
-import useTranslation from 'next-translate/useTranslation'
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();

 // React Router
 import { useRouter } from 'next/router'
@@ -11,10 +13,6 @@ import { useRouter } from 'next/router'
 import { NextSeo } from 'next-seo';

 export default function Server(props) {
-  const router = useRouter()
-  const { locale, locales, defaultLocale, pathname } = router
-  const { t, lang } = useTranslation("server")
-
  return (
    <>
      <NextSeo
--- a/pages/tos.js
+++ b/pages/tos.js
@@ -1,16 +1,22 @@
+// Base layout
 import Layout from "./components/Layout"
-import useTranslation from 'next-translate/useTranslation'
+
+// i18n
+import { useTranslation, useLanguageQuery, LanguageSwitcher } from 'next-export-i18n';
+const { t } = useTranslation();
+const [query] = useLanguageQuery();
+
+// Next.js, React
 import { useRouter } from 'next/router'
 import React from "react"
+
+// React Markdown
 import ReactMarkdown from "react-markdown"
 import gfm from 'remark-gfm';
 import ja from '../docs/tos/ja.md'
 import en from '../docs/tos/en.md'

 export default function Tos(props) {
-    const router = useRouter()
-    const { locale, locales, defaultLocale, pathname } = router
-    const { t, lang } = useTranslation("tos")
    return(
        <Layout title={t('tos')}>
        <div>