Skip to content

Commit 63274a1

Browse files
3w36zj63w36zj6
committed
refactor: improve translation structure and type definitions
1 parent 9cf0f7a commit 63274a1

14 files changed

+127
-126
lines changed

‎website/src/components/templates/BaseTemplate.tsx‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { html } from "hono/html";
22
import type { FC, PropsWithChildren } from "hono/jsx";
33
import { basePath, originUrl, typstOfficialDocsUrl } from "../../metadata";
4-
import { Translation, t } from "../../translations";
4+
import { Translation, translation } from "../../translation";
55
import type { Page } from "../../types/model";
66
import { joinPath, removeBasePath } from "../../utils/path";
77
import { getTranslationStatus } from "../../utils/translationStatus";
@@ -55,19 +55,19 @@ export const BaseTemplate: FC<BaseTemplateProps> = ({
5555
removeBasePath(basePath, route),
5656
);
5757
return (
58-
<html lang={t("lang")} class="scroll-pt-24">
58+
<html lang={translation.htmlLang()} class="scroll-pt-24">
5959
<head>
6060
<meta charSet="utf-8" />
6161
<title>
62-
{title} – {t("documentationTitle")}
62+
{title} – {translation.documentationTitle()}
6363
</title>
6464
<meta name="description" content={description} />
6565
<meta name="viewport" content="width=device-width,initial-scale=1" />
6666
<meta name="theme-color" content="#239dad" />
6767
<meta property="og:url" content={absoluteRouteUrl} />
6868
<meta
6969
property="og:title"
70-
content={`${title} – ${t("documentationTitle")}`}
70+
content={`${title} – ${translation.documentationTitle()}`}
7171
/>
7272
<meta property="og:site_name" content="Typst" />
7373
<meta property="og:description" content={description} />
@@ -181,7 +181,7 @@ export const BaseTemplate: FC<BaseTemplateProps> = ({
181181
type="button"
182182
class="text-gray-600"
183183
x-on:click="sidebarOpen = false"
184-
aria-label={t("ariaCloseMenu")}
184+
aria-label={translation.closeMenu()}
185185
>
186186
<div class="w-6 h-6 text-gray-600 hover:text-gray-800 transition-colors">
187187
<CloseIcon />
@@ -221,7 +221,7 @@ export const BaseTemplate: FC<BaseTemplateProps> = ({
221221
<div class="w-4 h-4 mr-1 ">
222222
<WorldIcon />
223223
</div>
224-
<Translation translationKey="originalArticle" />
224+
<Translation translationKey="openOfficialDocs" />
225225
</a>
226226
</div>
227227
)}
@@ -241,7 +241,7 @@ export const BaseTemplate: FC<BaseTemplateProps> = ({
241241
<WorldIcon />
242242
</div>
243243
<span class="text-sm font-medium text-gray-800 group-hover:text-gray-900 transition-colors">
244-
<Translation translationKey="originalArticle" />
244+
<Translation translationKey="openOfficialDocs" />
245245
</span>
246246
<div class="w-4 h-4 ml-2 text-gray-400 transition-colors">
247247
<ChevronRightIcon />
@@ -264,7 +264,7 @@ export const BaseTemplate: FC<BaseTemplateProps> = ({
264264
</strong>
265265
</div>
266266
<p class="text-sm text-gray-600">
267-
<Translation translationKey="learnTypst" />
267+
<Translation translationKey="tutorialDescription" />
268268
</p>
269269
</a>
270270
<a
@@ -276,11 +276,11 @@ export const BaseTemplate: FC<BaseTemplateProps> = ({
276276
<InfoCircleIcon />
277277
</div>
278278
<strong class="text-base font-semibold text-gray-800">
279-
<Translation translationKey="referenceTo" />
279+
<Translation translationKey="reference" />
280280
</strong>
281281
</div>
282282
<p class="text-sm text-gray-600">
283-
<Translation translationKey="reference" />
283+
<Translation translationKey="referenceDescription" />
284284
</p>
285285
</a>
286286
</div>

‎website/src/components/templates/CategoryTemplate.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { FC } from "hono/jsx";
2-
import { Translation } from "../../translations";
2+
import { Translation } from "../../translation";
33
import type { CategoryBody, Page } from "../../types/model";
44
import { HtmlContent } from "../ui/HtmlContent";
55
import BaseTemplate, { type BaseTemplateProps } from "./BaseTemplate";

‎website/src/components/templates/FuncTemplate.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { FC } from "hono/jsx";
2-
import { Translation, t } from "../../translations";
2+
import { Translation } from "../../translation";
33
import type { Func, FuncBody, Page } from "../../types/model";
44
import {
55
FunctionDefinition,
@@ -104,7 +104,7 @@ function ScopedDefinitions({
104104
// Therefore, it is sufficient to only annotate the direct `parent`.
105105
<>
106106
<code>{parent.name}</code>
107-
<Translation translationKey="definitionOf" />
107+
<Translation translationKey="definitionOf" name={parent.name} />
108108
</>
109109
) : (
110110
<Translation translationKey="definition" />

‎website/src/components/templates/TypeTemplate.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { FC } from "hono/jsx";
2-
import { Translation } from "../../translations";
2+
import { Translation } from "../../translation";
33
import type { Page, TypeBody } from "../../types/model";
44
import { FunctionDisplay, Tooltip } from "../ui";
55
import { HtmlContent } from "../ui/HtmlContent";

‎website/src/components/ui/FunctionDisplay.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { FC } from "hono/jsx";
2-
import { Translation } from "../../translations";
2+
import { Translation } from "../../translation";
33
import type { Func } from "../../types/model";
44
import { ChevronRightIcon } from "../icons";
55
import { FunctionDefinition } from "./FunctionDefinition";

‎website/src/components/ui/FunctionParameters.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { FC } from "hono/jsx";
22
import { basePath } from "../../metadata";
3-
import { Translation } from "../../translations";
3+
import { Translation } from "../../translation";
44
import type { Func } from "../../types/model";
55
import { joinPath } from "../../utils/path";
66
import { ChevronRightIcon } from "../icons";

‎website/src/components/ui/Tooltip.tsx‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { FC, JSX, JSXNode } from "hono/jsx";
2-
import { Translation, TranslationProps, t } from "../../translations";
2+
import { Translation, TranslationProps, translation } from "../../translation";
33
import { CloseIcon, HelpCircleIcon } from "../icons";
44

55
type TooltipProps = {
@@ -17,65 +17,65 @@ type TooltipProps = {
1717
const tooltipContent: Record<
1818
TooltipProps["kind"],
1919
{
20-
label: JSXNode;
21-
desc: JSXNode;
20+
label: ReturnType<typeof Translation>;
21+
desc: ReturnType<typeof Translation>;
2222
isShowLabel: boolean;
2323
bgColor: string;
2424
textColor: string;
2525
}
2626
> = {
2727
element: {
2828
label: <Translation translationKey="elementFunction" />,
29-
desc: <Translation translationKey="elementFunctionDesc" />,
29+
desc: <Translation translationKey="elementFunctionDescription" />,
3030
isShowLabel: true,
3131
bgColor: "bg-blue-50",
3232
textColor: "text-blue-700",
3333
},
3434
contextual: {
3535
label: <Translation translationKey="contextFunction" />,
36-
desc: <Translation translationKey="contextFunctionDesc" />,
36+
desc: <Translation translationKey="contextFunctionDescription" />,
3737
isShowLabel: true,
3838
bgColor: "bg-indigo-50",
3939
textColor: "text-indigo-700",
4040
},
4141
definitions: {
4242
label: <Translation translationKey="definitionTooltip" />,
43-
desc: <Translation translationKey="definitionTooltipDesc" />,
43+
desc: <Translation translationKey="definitionTooltipDescription" />,
4444
isShowLabel: false,
4545
bgColor: "bg-gray-100",
4646
textColor: "text-gray-700",
4747
},
4848
parameters: {
4949
label: <Translation translationKey="argument" />,
50-
desc: <Translation translationKey="argumentDesc" />,
50+
desc: <Translation translationKey="argumentDescription" />,
5151
isShowLabel: false,
5252
bgColor: "bg-gray-100",
5353
textColor: "text-gray-700",
5454
},
5555
variadic: {
5656
label: <Translation translationKey="variadic" />,
57-
desc: <Translation translationKey="variadicDesc" />,
57+
desc: <Translation translationKey="variadicDescription" />,
5858
isShowLabel: true,
5959
bgColor: "bg-green-50",
6060
textColor: "text-green-700",
6161
},
6262
settable: {
6363
label: <Translation translationKey="settable" />,
64-
desc: <Translation translationKey="settableDesc" />,
64+
desc: <Translation translationKey="settableDescription" />,
6565
isShowLabel: true,
6666
bgColor: "bg-amber-50",
6767
textColor: "text-amber-700",
6868
},
6969
positional: {
7070
label: <Translation translationKey="positional" />,
71-
desc: <Translation translationKey="positionalDesc" />,
71+
desc: <Translation translationKey="positionalDescription" />,
7272
isShowLabel: true,
7373
bgColor: "bg-purple-50",
7474
textColor: "text-purple-700",
7575
},
7676
required: {
7777
label: <Translation translationKey="required" />,
78-
desc: <Translation translationKey="requiredDesc" />,
78+
desc: <Translation translationKey="requiredDescription" />,
7979
isShowLabel: true,
8080
bgColor: "bg-rose-50",
8181
textColor: "text-rose-700",
@@ -101,7 +101,7 @@ export const Tooltip: FC<TooltipProps> = ({ kind }) => {
101101
<button
102102
type="button"
103103
class="w-4 h-4 hover:bg-black/10 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 cursor-pointer"
104-
aria-label={`${content.label}${t("ariaShowInformation")}`}
104+
aria-label={`${content.label}${translation.showInformation({ name: String(content.label) })}`}
105105
tabindex={0}
106106
{...{ "x-on:click": "helpOpen = true" }}
107107
{...{ "x-on:keydown.enter": "helpOpen = true" }}
@@ -146,7 +146,7 @@ export const Tooltip: FC<TooltipProps> = ({ kind }) => {
146146
{...{ "x-on:click": "helpOpen = false" }}
147147
{...{ "x-on:keydown.enter": "helpOpen = false" }}
148148
{...{ "x-on:keydown.space": "helpOpen = false" }}
149-
aria-label={t("ariaClose")}
149+
aria-label={translation.close()}
150150
>
151151
<div class="w-6 h-6">
152152
<CloseIcon />

‎website/src/components/ui/common/Header.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {
55
typstOfficialUrl,
66
version,
77
} from "../../../metadata";
8-
import { Translation, t } from "../../../translations";
8+
import { Translation, translation } from "../../../translation";
99
import { calculateTranslationProgressRate } from "../../../utils/translationStatus";
1010
import {
1111
DiscordIcon,
@@ -112,7 +112,7 @@ export const Header = () => {
112112
href={typstOfficialDocsUrl}
113113
class="text-sm text-gray-600 hover:text-gray-800 transition-colors"
114114
>
115-
<Translation translationKey="typstOfficialDoc" />
115+
<Translation translationKey="typstOfficialDocs" />
116116
</a>
117117
</li>
118118
</ul>
@@ -137,7 +137,7 @@ export const Header = () => {
137137
type="button"
138138
class="p-2 text-gray-600 hover:text-gray-800 transition-colors"
139139
x-on:click="searchOpen = true"
140-
aria-label={t("ariaOpenSearch")}
140+
aria-label={translation.openSearch()}
141141
>
142142
<div class="w-6 h-6 text-gray-600 hover:text-gray-800 transition-colors">
143143
<SearchIcon />
@@ -147,7 +147,7 @@ export const Header = () => {
147147
type="button"
148148
class="p-1 bg-white rounded-md border border-gray-200"
149149
x-on:click="sidebarOpen = !sidebarOpen"
150-
aria-label={t("ariaOpenMenu")}
150+
aria-label={translation.openMenu()}
151151
>
152152
<div class="w-6 h-6 text-gray-600 hover:text-gray-800 transition-colors">
153153
<MenuIcon />

‎website/src/components/ui/common/SearchWindow.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { FC } from "hono/jsx";
22
import { basePath } from "../../../metadata";
3-
import { Translation, t } from "../../../translations";
3+
import { Translation, translation } from "../../../translation";
44
import { joinPath } from "../../../utils/path";
55
import { CloseIcon } from "../../icons";
66

@@ -24,7 +24,7 @@ export const SearchWindow: FC = () => {
2424
type="button"
2525
class="text-gray-400 hover:text-gray-600"
2626
x-on:click="searchOpen = false"
27-
aria-label={t("ariaCloseSearch")}
27+
aria-label={translation.closeSearch()}
2828
>
2929
<div class="w-6 h-6 text-gray-600 hover:text-gray-800 transition-colors">
3030
<CloseIcon />

‎website/src/components/ui/common/SiteNoticeBanner.tsx‎

Lines changed: 6 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {
55
typstOfficialDocsUrl,
66
version,
77
} from "../../../metadata";
8-
import { Translation } from "../../../translations";
8+
import { Translation } from "../../../translation";
99
import { InfoCircleIcon } from "../../icons";
1010

1111
export const SiteNoticeBanner = () => {
@@ -45,25 +45,17 @@ export const SiteNoticeBanner = () => {
4545
<InfoCircleIcon />
4646
</div>
4747
<strong>
48-
<Translation translationKey="information" /> / Info
48+
<Translation translationKey="siteNoticeBannerTitle" />
4949
</strong>
5050
</span>
5151
<span class="hidden sm:flex items-center">
5252
<span class="inline-block w-px h-12 bg-neutral-200 mx-3" />
5353
</span>
5454
<span class="block flex-1 pt-1 pb-2 leading-normal sm:inline sm:pt-0 sm:pb-0">
55-
<Translation translationKey="banner" version={version} />
56-
<br />
57-
This site provides a Japanese translation of the{" "}
58-
<a href={typstOfficialDocsUrl}>Typst v{version} documentation</a>{" "}
59-
maintained by the "
60-
<a href={githubOrganizationUrl}>Typst Japanese Community</a>" with
61-
permission from Typst GmbH. We recommend using this alongside the{" "}
62-
<a href={typstOfficialDocsUrl}>official documentation</a>. We
63-
welcome contributions through Issues and Pull Requests on{" "}
64-
<a href={githubRepositoryUrl}>our GitHub repository</a> for both
65-
translation improvements and website enhancements. Feel free to join{" "}
66-
<a href={discordServerUrl}>our Discord server "Kumihan Club"</a>.
55+
<Translation
56+
translationKey="siteNoticeBannerDescription"
57+
version={version}
58+
/>
6759
</span>
6860
</div>
6961
</div>

0 commit comments

Comments
 (0)