From 59a58a027b3f0c7270140118bc9f36a7ee79d334 Mon Sep 17 00:00:00 2001 From: Gorbachev Egor <7gorbachevm@gmail.com> Date: Sat, 23 Dec 2023 13:19:11 +0700 Subject: [PATCH] Adjust UI --- src/screens/deck-catalog/deck-catalog.tsx | 5 ++- src/screens/deck-review/deck-finished.tsx | 16 ++-------- src/screens/deck-review/repeat-all-screen.tsx | 7 ++++- .../deck-review/want-more-cards-button.tsx | 31 +++++++++++++++++++ src/translations/t.ts | 22 ++++++------- 5 files changed, 52 insertions(+), 29 deletions(-) create mode 100644 src/screens/deck-review/want-more-cards-button.tsx diff --git a/src/screens/deck-catalog/deck-catalog.tsx b/src/screens/deck-catalog/deck-catalog.tsx index 878a6035..9bdb483b 100644 --- a/src/screens/deck-catalog/deck-catalog.tsx +++ b/src/screens/deck-catalog/deck-catalog.tsx @@ -18,8 +18,7 @@ import { NoDecksMatchingFilters } from "./no-decks-matching-filters.tsx"; import { deckListStore } from "../../store/deck-list-store.ts"; import { DeckAddedLabel } from "./deck-added-label.tsx"; import { t, translateCategory } from "../../translations/t.ts"; -import { util } from "zod"; -import objectValues = util.objectValues; +import { enumValues } from "../../lib/typescript/enum-values.ts"; export const DeckCatalog = observer(() => { const store = useDeckCatalogStore(); @@ -69,7 +68,7 @@ export const DeckCatalog = observer(() => { value={store.filters.language.value} onChange={store.filters.language.onChange} - options={objectValues(LanguageFilter).map((key) => ({ + options={enumValues(LanguageFilter).map((key) => ({ value: key, label: languageFilterToNativeName(key), }))} diff --git a/src/screens/deck-review/deck-finished.tsx b/src/screens/deck-review/deck-finished.tsx index fa935dae..1bbc36c1 100644 --- a/src/screens/deck-review/deck-finished.tsx +++ b/src/screens/deck-review/deck-finished.tsx @@ -7,10 +7,9 @@ import { useMount } from "../../lib/react/use-mount.ts"; import { screenStore } from "../../store/screen-store.ts"; import { useMainButton } from "../../lib/telegram/use-main-button.tsx"; import { useTelegramProgress } from "../../lib/telegram/use-telegram-progress.tsx"; -import { theme } from "../../ui/theme.tsx"; import { t } from "../../translations/t.ts"; -import { translateNewCardsCount } from "../../translations/translate-new-cards-count.tsx"; import { getEncouragingMessage } from "../../translations/get-encouraging-message.tsx"; +import { WantMoreCardsButton } from "./want-more-cards-button.tsx"; type Props = { type: "deck" | "repeat_all"; @@ -43,18 +42,7 @@ export const DeckFinished = observer((props: Props) => {

{type === "repeat_all" && newCardsCount ? (

- {t("review_finished_want_more")}{" "} - { - screenStore.go({ type: "main" }); - }} - > - {newCardsCount} {translateNewCardsCount(newCardsCount)} - {" "} - {t("review_finished_to_review")} +

) : (

{getEncouragingMessage()} 😊

diff --git a/src/screens/deck-review/repeat-all-screen.tsx b/src/screens/deck-review/repeat-all-screen.tsx index fdc98b25..cf5fe68d 100644 --- a/src/screens/deck-review/repeat-all-screen.tsx +++ b/src/screens/deck-review/repeat-all-screen.tsx @@ -7,6 +7,8 @@ import { Review } from "./review.tsx"; import React from "react"; import { Hint } from "../../ui/hint.tsx"; import { t } from "../../translations/t.ts"; +import { WantMoreCardsButton } from "./want-more-cards-button.tsx"; +import { css } from "@emotion/css"; export const RepeatAllScreen = observer(() => { const reviewStore = useReviewStore(); @@ -30,8 +32,11 @@ export const RepeatAllScreen = observer(() => { } return ( -
+
{t("no_cards_to_review_all")} + + +
); }); diff --git a/src/screens/deck-review/want-more-cards-button.tsx b/src/screens/deck-review/want-more-cards-button.tsx new file mode 100644 index 00000000..53debac9 --- /dev/null +++ b/src/screens/deck-review/want-more-cards-button.tsx @@ -0,0 +1,31 @@ +import { observer } from "mobx-react-lite"; +import { t } from "../../translations/t.ts"; +import { css } from "@emotion/css"; +import { theme } from "../../ui/theme.tsx"; +import { screenStore } from "../../store/screen-store.ts"; +import { translateNewCardsCount } from "../../translations/translate-new-cards-count.tsx"; +import React from "react"; + +type Props = { newCardsCount: number }; + +export const WantMoreCardsButton = observer((props: Props) => { + const { newCardsCount } = props; + + return ( + <> + {t("review_finished_want_more")}{" "} + { + screenStore.go({ type: "main" }); + }} + > + {newCardsCount} {translateNewCardsCount(newCardsCount)} + {" "} + {t("review_finished_to_review")} + + ); +}); diff --git a/src/translations/t.ts b/src/translations/t.ts index 76251c9d..9fe91332 100644 --- a/src/translations/t.ts +++ b/src/translations/t.ts @@ -129,21 +129,21 @@ const ru: Translation = { cards: "Карточки", search_card: "Поиск карточки", card_sort_by_date: "Дата", - card_sort_by_front: "Лицевая сторона", - card_sort_by_back: "Обратная сторона", - sort_by: "Сортировать", + card_sort_by_front: "Вопрос", + card_sort_by_back: "Ответ", + sort_by: "Сортировка", title: "Название", description: "Описание", speaking_cards: "Озвучка карточек", voice_language: "Язык озвучки", - card_speak_side: "Озвучить сторону", - card_speak_side_front: "Лицевую", - card_speak_side_back: "Обратную", + card_speak_side: "Сторона карточки", + card_speak_side_front: "Лицевая", + card_speak_side_back: "Обратная", card_speak_description: "Позволяет улучшить произношение", review_deck_finished: `Вы прошли эту колоду 🎉`, review_all_cards: `Вы повторили все карточки на сегодня 🎉`, - review_finished_want_more: "Хотите больше? У вас есть", - review_finished_to_review: "для повторения", + review_finished_want_more: "Хотите ещё? У вас есть", + review_finished_to_review: "для изучения", review_deck: "Повторить колоду", cards_to_repeat: "Карточек для повторения", cards_new: "Новых", @@ -154,9 +154,9 @@ const ru: Translation = { "Вы уверены, что хотите удалить колоду из своей коллекции? Это действие нельзя отменить", delete: "Удалить", no_cards_to_review_in_deck: `Отличная работа! 🌟 Вы прошли все карточки в этой колоде. Возвращайтесь позже за новыми.`, - no_cards_to_review_all: `Отличная работа! 🌟 Вы повторили все карточки на сегодня. Возвращайтесь позже за новыми.`, - review_need_to_repeat: "Нужно повторить", - review_right: "Помню", + no_cards_to_review_all: `Отличная работа! 🌟 Вы повторили все карточки на сегодня`, + review_need_to_repeat: "Не помню", + review_right: "Помню хорошо", review_show_answer: "Показать ответ", share: "Поделиться", warning_telegram_outdated_title: "Ваш Телеграм устарел",