Created navbar ru localization
This commit is contained in:
parent
c99e9217f1
commit
3f9a76815e
@ -59,5 +59,29 @@
|
||||
"services": {
|
||||
"fork": "Не удалось выполнить авторизацию в сервисе"
|
||||
}
|
||||
},
|
||||
"articlePage": {
|
||||
"abstract": "Введение",
|
||||
"keywords": "Ключевые слова"
|
||||
},
|
||||
"navbar": {
|
||||
"createNew": "Создать статью",
|
||||
"about": {
|
||||
"navTitle": "О проекте",
|
||||
"aboutProject": "О Scipaper",
|
||||
"contacts": "Контакты",
|
||||
"help": "Помощь"
|
||||
},
|
||||
"library": {
|
||||
"navTitle": "Моя библиотека",
|
||||
"publications": "Публикации",
|
||||
"favorites": "Избранное",
|
||||
"collections": "Коллекции",
|
||||
"recentViewed": "История"
|
||||
},
|
||||
"auth": {
|
||||
"signIn": "Вход",
|
||||
"signUp": "Регистрация"
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -37,7 +37,7 @@ export const ArticleSearchResult = ({ searchItem }: Props) => {
|
||||
<Article.SubscriptionsButtons />
|
||||
</div>
|
||||
|
||||
<Article.Title linkTo={searchItem.id} className="text-2xl">
|
||||
<Article.Title linkTo={`/article/${searchItem.id}`} className="text-2xl">
|
||||
{searchItem.title}
|
||||
</Article.Title>
|
||||
<Article.Authors emphasis="low" className="flex flex-wrap flex-row">
|
||||
|
||||
@ -8,10 +8,13 @@ import Container from "components/Container";
|
||||
import NotFound from "./NotFound";
|
||||
import { SVGSearch } from "components/icons";
|
||||
import BaseLayout from "components/BaseLayout";
|
||||
import Typography from "components/typography/Typography";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
const AnArticle = () => {
|
||||
const store = useArticleStore();
|
||||
const { article, hasError, shouldShowLoading } = useArticleViewModel(store);
|
||||
const { i18n, t } = useTranslation();
|
||||
|
||||
const { id } = useParams();
|
||||
const newId = `${id}`;
|
||||
@ -46,9 +49,13 @@ const AnArticle = () => {
|
||||
<ArticlePart.Article.InteractionButtons emphasis="high" />
|
||||
{article?.tags && (
|
||||
<div className="keywords my-10 flex flex-col gap-2">
|
||||
<ArticlePart.Article.Title className="text-2xl">
|
||||
Keywords
|
||||
</ArticlePart.Article.Title>
|
||||
<Typography
|
||||
className="text-2xl"
|
||||
fontWeightVariant="semibold"
|
||||
>
|
||||
{t('articlePage.keywords')}
|
||||
</Typography>
|
||||
|
||||
|
||||
<ArticlePart.Article.Keywords className="transition ease-in-out delay-50">
|
||||
{article?.tags}
|
||||
@ -56,9 +63,12 @@ const AnArticle = () => {
|
||||
</div>
|
||||
)}
|
||||
<div className="abstract my-10 flex flex-col gap-2">
|
||||
<ArticlePart.Article.Title className="text-2xl">
|
||||
Abstract
|
||||
</ArticlePart.Article.Title>
|
||||
<Typography
|
||||
className="text-2xl"
|
||||
fontWeightVariant="semibold"
|
||||
>
|
||||
{t('articlePage.abstract')}
|
||||
</Typography>
|
||||
<ArticlePart.Article.Description>
|
||||
{article?.summary !== undefined ? (
|
||||
article?.summary
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import classNames from "classnames";
|
||||
import { useState } from "react";
|
||||
import { useState, useTransition } from "react";
|
||||
/* -------------------------------------------------------------------------- */
|
||||
/* Components */
|
||||
/* -------------------------------------------------------------------------- */
|
||||
@ -23,11 +23,14 @@ import {
|
||||
SVGFile,
|
||||
SVGEye,
|
||||
} from "components/icons";
|
||||
import i18n from "localization/i18n";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
const Header = () => {
|
||||
const [authenticated, setAuthenticated] = useState(false);
|
||||
const onClick = () => setAuthenticated(true);
|
||||
const [notification, setNotification] = useState(false);
|
||||
const { t, i18n } = useTranslation();
|
||||
|
||||
/* -------------------------------------------------------------------------- */
|
||||
/* Implement Header Component */
|
||||
@ -66,36 +69,36 @@ const Header = () => {
|
||||
className="text-blue-500 px-4 font-bold uppercase"
|
||||
to="/create-new"
|
||||
>
|
||||
Create new
|
||||
{t('navbar.createNew')}
|
||||
</RouterLink>
|
||||
{/* Link Create now - end - */}
|
||||
|
||||
{/* Dropdown Menu My library - start - */}
|
||||
<ContextMenu
|
||||
emphasis="high"
|
||||
button="My library"
|
||||
button={t('navbar.library.navTitle')}
|
||||
className="border-none uppercase"
|
||||
>
|
||||
<ContextMenuAction
|
||||
caption="My Publications"
|
||||
caption={t('navbar.library.publications')}
|
||||
action={() => console.log("My publications")}
|
||||
icon={<SVGFile className="stroke-black " />}
|
||||
></ContextMenuAction>
|
||||
|
||||
<ContextMenuAction
|
||||
caption="My Favorites"
|
||||
caption={t('navbar.library.favorites')}
|
||||
action={() => console.log("My Favorites")}
|
||||
icon={<SVGFavoriteOutlined className="stroke-black" />}
|
||||
></ContextMenuAction>
|
||||
|
||||
<ContextMenuAction
|
||||
caption="My Collections"
|
||||
caption={t('navbar.library.collections')}
|
||||
action={() => console.log("My Collections")}
|
||||
icon={<SVGFolder className="stroke-black fill-black" />}
|
||||
></ContextMenuAction>
|
||||
|
||||
<ContextMenuAction
|
||||
caption="Recent Viewed"
|
||||
caption={t('navbar.library.recentViewed')}
|
||||
action={() => console.log("Recent Viewed")}
|
||||
icon={<SVGEye className="stroke-black " />}
|
||||
></ContextMenuAction>
|
||||
@ -105,21 +108,21 @@ const Header = () => {
|
||||
{/* Dropdown Menu About - start - */}
|
||||
<ContextMenu
|
||||
emphasis="high"
|
||||
button="About"
|
||||
button={t('navbar.about.navTitle')}
|
||||
className="border-none uppercase"
|
||||
>
|
||||
<ContextMenuAction
|
||||
caption="About Freeland"
|
||||
caption={t('navbar.about.aboutProject')}
|
||||
action={() => console.log("About Freeland")}
|
||||
></ContextMenuAction>
|
||||
|
||||
<ContextMenuAction
|
||||
caption="Contact Us"
|
||||
caption={t('navbar.about.contacts')}
|
||||
action={() => console.log("Contact Us")}
|
||||
></ContextMenuAction>
|
||||
|
||||
<ContextMenuAction
|
||||
caption="Help"
|
||||
caption={t('navbar.about.help')}
|
||||
action={() => console.log("Help")}
|
||||
></ContextMenuAction>
|
||||
</ContextMenu>
|
||||
@ -132,38 +135,38 @@ const Header = () => {
|
||||
<div className="flex items-center font-bold text-sm gap-1 md:gap-2 ">
|
||||
{!authenticated
|
||||
? [
|
||||
<Button
|
||||
emphasis="low"
|
||||
onClick={onClick}
|
||||
className="text-xs sm:px-4 sm:text-sm "
|
||||
>
|
||||
Sign in
|
||||
</Button>,
|
||||
<Button
|
||||
emphasis="medium"
|
||||
className="hidden md:flex"
|
||||
onClick={onClick}
|
||||
>
|
||||
Sign up
|
||||
</Button>,
|
||||
]
|
||||
<Button
|
||||
emphasis="low"
|
||||
onClick={onClick}
|
||||
className="text-xs sm:px-4 sm:text-sm "
|
||||
>
|
||||
{t('navbar.auth.signIn')}
|
||||
</Button>,
|
||||
<Button
|
||||
emphasis="medium"
|
||||
className="hidden md:flex"
|
||||
onClick={onClick}
|
||||
>
|
||||
{t('navbar.auth.signUp')}
|
||||
</Button>,
|
||||
]
|
||||
: [
|
||||
<Button emphasis="low">
|
||||
<Button.Icon>
|
||||
{!notification ? (
|
||||
<SVGBell className="h-6 w-6 fill-gray-900 stroke-gray-900" />
|
||||
) : (
|
||||
<SVGBellNotification className="h-6 w-6 fill-gray-900 stroke-gray-900" />
|
||||
)}
|
||||
</Button.Icon>
|
||||
</Button>,
|
||||
<Button emphasis="low">
|
||||
<Button.Icon>
|
||||
{!notification ? (
|
||||
<SVGBell className="h-6 w-6 fill-gray-900 stroke-gray-900" />
|
||||
) : (
|
||||
<SVGBellNotification className="h-6 w-6 fill-gray-900 stroke-gray-900" />
|
||||
)}
|
||||
</Button.Icon>
|
||||
</Button>,
|
||||
|
||||
<Button emphasis="low" className="hidden lg:flex">
|
||||
<Button.Icon>
|
||||
<Avatar className="bg-[rgb(255,122,69)] text-white">K</Avatar>
|
||||
</Button.Icon>
|
||||
</Button>,
|
||||
]}
|
||||
<Button emphasis="low" className="hidden lg:flex">
|
||||
<Button.Icon>
|
||||
<Avatar className="bg-[rgb(255,122,69)] text-white">K</Avatar>
|
||||
</Button.Icon>
|
||||
</Button>,
|
||||
]}
|
||||
{/* Burger component will be shown for the small screens */}
|
||||
<Navbar className="block lg:hidden" />
|
||||
</div>
|
||||
|
||||
@ -16,6 +16,7 @@ import AccountSettings from "pages/Information/AccountSettings";
|
||||
import { store } from "store/store";
|
||||
import { Provider } from "react-redux";
|
||||
import { SearchResultsPage } from "pages/SearchResultsPage";
|
||||
import AnArticle from "components/fetchAnArticle/AnArticle";
|
||||
|
||||
const rootElement = document.getElementById("root");
|
||||
if (!rootElement) throw new Error("Failed to find the root element");
|
||||
@ -32,6 +33,7 @@ root.render(
|
||||
<Route path="/terms-of-use" element={<TermsOfUse />} />
|
||||
<Route path="/privacy-policy" element={<PrivacyPolicy />} />
|
||||
<Route path="/cookies-policy" element={<CookiesPolicy />} />
|
||||
<Route path="/article/:id" element={<AnArticle />} />
|
||||
<Route path="/account">
|
||||
<Route path="settings" element={<AccountSettings />} />
|
||||
</Route>
|
||||
|
||||
@ -18,11 +18,11 @@ export const languages: Record<Langs, Lang> = {
|
||||
},
|
||||
};
|
||||
export const popularLangKeys = ["ru", "en"];
|
||||
const fallbackLng: Langs = "en";
|
||||
const fallbackLng: Langs = "ru";
|
||||
|
||||
i18n
|
||||
.use(Backend)
|
||||
.use(LanguageDetector)
|
||||
// .use(LanguageDetector)
|
||||
.use(initReactI18next)
|
||||
.init({
|
||||
debug: process.env.NODE_ENV === "development" ? true : false,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user