Skip to content

Commit 481b0df

Browse files
resir014zainfathoni
resir014
and
zainfathoni
authored
docs: translate MDX components (#606)
Co-authored-by: Zain Fathoni <me@zainf.dev>
1 parent f258c86 commit 481b0df

19 files changed

+48
-46
lines changed

‎src/components/DocsFooter.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ export const DocsPageFooter = memo<DocsPageFooterProps>(
3030
<div className="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-2 gap-4 py-4 md:py-12">
3131
{prevRoute?.path ? (
3232
<FooterLink
33-
type="Previous"
33+
type="Sebelumnya"
3434
title={prevRoute.title}
3535
href={prevRoute.path}
3636
/>
@@ -40,7 +40,7 @@ export const DocsPageFooter = memo<DocsPageFooterProps>(
4040

4141
{nextRoute?.path ? (
4242
<FooterLink
43-
type="Next"
43+
type="Selanjutnya"
4444
title={nextRoute.title}
4545
href={nextRoute.path}
4646
/>
@@ -63,20 +63,20 @@ function FooterLink({
6363
}: {
6464
href: string;
6565
title: string;
66-
type: 'Previous' | 'Next';
66+
type: 'Sebelumnya' | 'Selanjutnya';
6767
}) {
6868
return (
6969
<NextLink
7070
href={href}
7171
className={cn(
7272
'flex gap-x-4 md:gap-x-6 items-center w-full md:w-80 px-4 md:px-5 py-6 border-2 border-transparent text-base leading-base text-link dark:text-link-dark rounded-lg group focus:text-link dark:focus:text-link-dark focus:bg-highlight focus:border-link dark:focus:bg-highlight-dark dark:focus:border-link-dark focus:border-opacity-100 focus:border-2 focus:ring-1 focus:ring-offset-4 focus:ring-blue-40 active:ring-0 active:ring-offset-0 hover:bg-gray-5 dark:hover:bg-gray-80',
7373
{
74-
'flex-row-reverse justify-self-end text-end': type === 'Next',
74+
'flex-row-reverse justify-self-end text-end': type === 'Selanjutnya',
7575
}
7676
)}>
7777
<IconNavArrow
7878
className="text-tertiary dark:text-tertiary-dark inline group-focus:text-link dark:group-focus:text-link-dark"
79-
displayDirection={type === 'Previous' ? 'start' : 'end'}
79+
displayDirection={type === 'Sebelumnya' ? 'start' : 'end'}
8080
/>
8181
<span>
8282
<span className="block no-underline text-sm tracking-wide text-secondary dark:text-secondary-dark uppercase font-bold group-focus:text-link dark:group-focus:text-link-dark group-focus:text-opacity-100">

‎src/components/MDX/BlogCard.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ function BlogCard({title, badge, date, icon, url, children}: BlogCardProps) {
5959
{date}
6060
{badge ? (
6161
<div className="h-fit px-1 bg-highlight dark:bg-highlight-dark rounded uppercase text-link dark:text-link-dark font-bold tracking-wide text-xs whitespace-nowrap">
62-
New
62+
Baru
6363
</div>
6464
) : null}
6565
</div>
@@ -68,7 +68,7 @@ function BlogCard({title, badge, date, icon, url, children}: BlogCardProps) {
6868
</span>
6969
{children != null && (
7070
<div className="text-link text-base dark:text-link-dark hover:underline mt-4">
71-
Read more
71+
Baca lebih lanjut
7272
</div>
7373
)}
7474
</div>

‎src/components/MDX/Challenges/Challenge.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ export function Challenge({
5050
className="text-xl text-primary dark:text-primary-dark mb-2 mt-0 font-medium"
5151
id={currentChallenge.id}>
5252
<div className="font-bold block md:inline">
53-
{isRecipes ? 'Example' : 'Challenge'} {currentChallenge.order} of{' '}
53+
{isRecipes ? 'Contoh' : 'Tantangan'} {currentChallenge.order} dari{' '}
5454
{totalChallenges}
5555
<span className="text-primary dark:text-primary-dark">: </span>
5656
</div>
@@ -63,14 +63,14 @@ export function Challenge({
6363
<div>
6464
<Button className="me-2" onClick={toggleHint} active={showHint}>
6565
<IconHint className="me-1.5" />{' '}
66-
{showHint ? 'Hide hint' : 'Show hint'}
66+
{showHint ? 'Sembunyikan petunjuk' : 'Tampilkan petunjuk'}
6767
</Button>
6868
<Button
6969
className="me-2"
7070
onClick={toggleSolution}
7171
active={showSolution}>
7272
<IconSolution className="me-1.5" />{' '}
73-
{showSolution ? 'Hide solution' : 'Show solution'}
73+
{showSolution ? 'Sembunyikan jawaban' : 'Tampilkan jawaban'}
7474
</Button>
7575
</div>
7676
) : (
@@ -80,7 +80,7 @@ export function Challenge({
8080
onClick={toggleSolution}
8181
active={showSolution}>
8282
<IconSolution className="me-1.5" />{' '}
83-
{showSolution ? 'Hide solution' : 'Show solution'}
83+
{showSolution ? 'Sembunyikan jawaban' : 'Tampilkan jawaban'}
8484
</Button>
8585
)
8686
)}
@@ -94,7 +94,7 @@ export function Challenge({
9494
)}
9595
onClick={handleClickNextChallenge}
9696
active>
97-
Next {isRecipes ? 'Example' : 'Challenge'}
97+
{isRecipes ? 'Contoh' : 'Tantangan'} Selanjutnya
9898
<IconArrowSmall displayDirection="end" className="block ms-1.5" />
9999
</Button>
100100
)}
@@ -104,12 +104,12 @@ export function Challenge({
104104
{showSolution && (
105105
<div className="mt-6">
106106
<h3 className="text-2xl font-bold text-primary dark:text-primary-dark">
107-
Solution
107+
Jawaban
108108
</h3>
109109
{currentChallenge.solution}
110110
<div className="flex justify-between items-center mt-4">
111111
<Button onClick={() => setShowSolution(false)}>
112-
Close solution
112+
Tutup jawaban
113113
</Button>
114114
{hasNextChallenge && (
115115
<Button
@@ -118,7 +118,7 @@ export function Challenge({
118118
)}
119119
onClick={handleClickNextChallenge}
120120
active>
121-
Next Challenge
121+
Tantangan Selanjutnya
122122
<IconArrowSmall
123123
displayDirection="end"
124124
className="block ms-1.5"

‎src/components/MDX/Challenges/Challenges.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ export function Challenges({
7878
children,
7979
isRecipes,
8080
noTitle,
81-
titleText = isRecipes ? 'Try out some examples' : 'Try out some challenges',
81+
titleText = isRecipes ? 'Coba contoh berikut' : 'Coba tantangan berikut',
8282
titleId = isRecipes ? 'examples' : 'challenges',
8383
}: ChallengesProps) {
8484
const challenges = parseChallengeContents(children);

‎src/components/MDX/ConsoleBlock.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ function ConsoleBlock({level = 'error', children}: ConsoleBlockProps) {
4545
</div>
4646
<div className="flex text-sm px-4">
4747
<div className="border-b-2 border-gray-300 dark:border-gray-90 text-tertiary dark:text-tertiary-dark">
48-
Console
48+
Konsol
4949
</div>
5050
<div className="px-4 py-2 flex">
5151
<Box className="me-2 bg-gray-300 dark:bg-gray-70" />

‎src/components/MDX/ExpandableCallout.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,15 +19,15 @@ interface ExpandableCalloutProps {
1919

2020
const variantMap = {
2121
deprecated: {
22-
title: 'Deprecated',
22+
title: 'Tidak Digunakan',
2323
Icon: IconWarning,
2424
containerClasses: 'bg-red-5 dark:bg-red-60 dark:bg-opacity-20',
2525
textColor: 'text-red-50 dark:text-red-40',
2626
overlayGradient:
2727
'linear-gradient(rgba(249, 247, 243, 0), rgba(249, 247, 243, 1)',
2828
},
2929
note: {
30-
title: 'Note',
30+
title: 'Catatan',
3131
Icon: IconNote,
3232
containerClasses:
3333
'bg-green-5 dark:bg-green-60 dark:bg-opacity-20 text-primary dark:text-primary-dark text-lg',
@@ -45,15 +45,15 @@ const variantMap = {
4545
'linear-gradient(rgba(245, 249, 248, 0), rgba(245, 249, 248, 1)',
4646
},
4747
pitfall: {
48-
title: 'Pitfall',
48+
title: 'Sandungan',
4949
Icon: IconPitfall,
5050
containerClasses: 'bg-yellow-5 dark:bg-yellow-60 dark:bg-opacity-20',
5151
textColor: 'text-yellow-50 dark:text-yellow-40',
5252
overlayGradient:
5353
'linear-gradient(rgba(249, 247, 243, 0), rgba(249, 247, 243, 1)',
5454
},
5555
wip: {
56-
title: 'Under Construction',
56+
title: 'Dalam Pengembangan',
5757
Icon: IconNote,
5858
containerClasses: 'bg-yellow-5 dark:bg-yellow-60 dark:bg-opacity-20',
5959
textColor: 'text-yellow-50 dark:text-yellow-40',

‎src/components/MDX/ExpandableExample.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -71,13 +71,13 @@ function ExpandableExample({children, excerpt, type}: ExpandableExampleProps) {
7171
{isDeepDive && (
7272
<>
7373
<IconDeepDive className="inline me-2 dark:text-purple-30 text-purple-40" />
74-
Deep Dive
74+
Pendalaman
7575
</>
7676
)}
7777
{isExample && (
7878
<>
7979
<IconCodeBlock className="inline me-2 dark:text-yellow-30 text-yellow-50" />
80-
Example
80+
Contoh
8181
</>
8282
)}
8383
</h5>
@@ -101,7 +101,7 @@ function ExpandableExample({children, excerpt, type}: ExpandableExampleProps) {
101101
<span className="me-1">
102102
<IconChevron displayDirection={isExpanded ? 'up' : 'down'} />
103103
</span>
104-
{isExpanded ? 'Hide Details' : 'Show Details'}
104+
{isExpanded ? 'Sembunyikan Detil' : 'Tampilkan Detil'}
105105
</Button>
106106
</summary>
107107
<div

‎src/components/MDX/Heading.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,9 @@ const Heading = forwardRefWithAs<HeadingProps, 'div'>(function Heading(
1717
{as: Comp = 'div', className, children, id, isPageAnchor = true, ...props},
1818
ref
1919
) {
20-
let label = 'Link for this heading';
20+
let label = 'Tautan untuk tajuk ini';
2121
if (typeof children === 'string') {
22-
label = 'Link for ' + children;
22+
label = 'Tautan untuk ' + children;
2323
}
2424

2525
return (

‎src/components/MDX/MDXComponents.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -117,16 +117,16 @@ function LearnMore({
117117
<section className="p-8 mt-16 mb-16 flex flex-row shadow-inner-border dark:shadow-inner-border-dark justify-between items-center bg-card dark:bg-card-dark rounded-2xl">
118118
<div className="flex-col">
119119
<h2 className="text-primary font-display dark:text-primary-dark font-bold text-2xl leading-tight">
120-
Ready to learn this topic?
120+
Siap mempelajari topik ini?
121121
</h2>
122122
{children}
123123
{path ? (
124124
<ButtonLink
125125
className="mt-1"
126-
label="Read More"
126+
label="Baca Lebih Lanjut"
127127
href={path}
128128
type="primary">
129-
Read More
129+
Baca Lebih Lanjut
130130
<IconNavArrow displayDirection="end" className="inline ms-1" />
131131
</ButtonLink>
132132
) : null}
@@ -140,7 +140,7 @@ function LearnMore({
140140
function ReadBlogPost({path}: {path: string}) {
141141
return (
142142
<ButtonLink className="mt-1" label="Read Post" href={path} type="primary">
143-
Read Post
143+
Baca Postingan
144144
<IconNavArrow displayDirection="end" className="inline ms-1" />
145145
</ButtonLink>
146146
);
@@ -177,7 +177,7 @@ function YouWillLearn({
177177
children: any;
178178
isChapter?: boolean;
179179
}) {
180-
let title = isChapter ? 'In this chapter' : 'You will learn';
180+
let title = isChapter ? 'Dalam bab ini' : 'Anda akan mempelajari';
181181
return <SimpleCallout title={title}>{children}</SimpleCallout>;
182182
}
183183

@@ -197,7 +197,7 @@ function AuthorCredit({
197197
<div className="sr-only group-hover:not-sr-only group-focus-within:not-sr-only hover:sr-only">
198198
<p className="bg-card dark:bg-card-dark text-center text-sm text-secondary dark:text-secondary-dark leading-tight p-2 rounded-lg absolute start-1/2 -top-4 -translate-x-1/2 -translate-y-full group-hover:flex group-hover:opacity-100 after:content-[''] after:absolute after:start-1/2 after:top-[95%] after:-translate-x-1/2 after:border-8 after:border-x-transparent after:border-b-transparent after:border-t-card after:dark:border-t-card-dark opacity-0 transition-opacity duration-300">
199199
<cite>
200-
Illustrated by{' '}
200+
Ilustrasi oleh{' '}
201201
{authorLink ? (
202202
<a
203203
target="_blank"
@@ -365,7 +365,7 @@ function YouTubeIframe(props: any) {
365365
frameBorder="0"
366366
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
367367
allowFullScreen
368-
title="YouTube video player"
368+
title="Pemutar video YouTube"
369369
{...props}
370370
/>
371371
</div>

‎src/components/MDX/Recap.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ function Recap({children}: RecapProps) {
1313
return (
1414
<section>
1515
<H2 isPageAnchor id="recap">
16-
Recap
16+
Rekap
1717
</H2>
1818
{children}
1919
</section>

‎src/components/MDX/Sandpack/Console.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -162,7 +162,7 @@ export const SandpackConsole = ({visible}: {visible: boolean}) => {
162162
className="flex items-center p-1"
163163
onClick={() => setIsExpanded(!isExpanded)}>
164164
<IconChevron displayDirection={isExpanded ? 'down' : 'right'} />
165-
<span className="ps-1 text-sm">Console ({logs.length})</span>
165+
<span className="ps-1 text-sm">Konsol ({logs.length})</span>
166166
</button>
167167
<button
168168
className="p-1"

‎src/components/MDX/Sandpack/CustomPreset.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,9 @@ const SandboxShell = memo(function SandboxShell({
118118
className="inline me-1.5 text-xl"
119119
displayDirection={isExpanded ? 'up' : 'down'}
120120
/>
121-
{isExpanded ? 'Show less' : 'Show more'}
121+
{isExpanded
122+
? 'Tampilkan lebih sedikit'
123+
: 'Tampilkan lebih banyak'}
122124
</span>
123125
</button>
124126
)}

‎src/components/MDX/Sandpack/DownloadButton.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,9 +101,9 @@ ${css}
101101
<button
102102
className="text-sm text-primary dark:text-primary-dark inline-flex items-center hover:text-link duration-100 ease-in transition mx-1"
103103
onClick={downloadHTML}
104-
title="Download Sandbox"
104+
title="Unduh Sandbox"
105105
type="button">
106-
<IconDownload className="inline me-1" /> Download
106+
<IconDownload className="inline me-1" /> Unduh
107107
</button>
108108
);
109109
}

‎src/components/MDX/Sandpack/LoadingOverlay.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export const LoadingOverlay = ({
6363
opacity: stillLoading ? 1 : 0,
6464
transition: `opacity ${FADE_ANIMATION_DURATION}ms ease-out`,
6565
}}>
66-
<div className="sp-cube-wrapper" title="Open in CodeSandbox">
66+
<div className="sp-cube-wrapper" title="Buka di CodeSandbox">
6767
<OpenInCodeSandboxButton />
6868
<div className="sp-cube">
6969
<div className="sp-sides">

‎src/components/MDX/Sandpack/OpenInCodeSandboxButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export const OpenInCodeSandboxButton = () => {
99
return (
1010
<UnstyledOpenInCodeSandboxButton
1111
className="text-sm text-primary dark:text-primary-dark inline-flex items-center hover:text-link duration-100 ease-in transition mx-1 ms-2 md:ms-1"
12-
title="Open in CodeSandbox">
12+
title="Buka di CodeSandbox">
1313
<IconNewPage
1414
className="inline mx-1 relative top-[1px]"
1515
width="1em"

‎src/components/MDX/TeamMember.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ export function TeamMember({
6363
{twitter && (
6464
<div className="me-4">
6565
<ExternalLink
66-
aria-label="React on Twitter"
66+
aria-label="Profil Twitter"
6767
href={`https://twitter.com/${twitter}`}
6868
className="hover:text-primary dark:text-primary-dark flex flex-row items-center">
6969
<IconTwitter className="pe-2" />
@@ -74,7 +74,7 @@ export function TeamMember({
7474
{github && (
7575
<div className="me-4">
7676
<ExternalLink
77-
aria-label="GitHub Profile"
77+
aria-label="Profil GitHub"
7878
href={`https://github.com/${github}`}
7979
className="hover:text-primary dark:text-primary-dark flex flex-row items-center">
8080
<IconGitHub className="pe-2" /> {github}
@@ -83,7 +83,7 @@ export function TeamMember({
8383
)}
8484
{personal && (
8585
<ExternalLink
86-
aria-label="Personal Site"
86+
aria-label="Situs Pribadi"
8787
href={`https://${personal}`}
8888
className="hover:text-primary dark:text-primary-dark flex flex-row items-center">
8989
<IconLink className="pe-2" /> {personal}

‎src/components/MDX/TerminalBlock.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ function TerminalBlock({level = 'info', children}: TerminalBlockProps) {
6565
setCopied(true);
6666
}}>
6767
<IconCopy className="inline-flex me-2 self-center" />{' '}
68-
{copied ? 'Copied' : 'Copy'}
68+
{copied ? 'Tersalin' : 'Salin'}
6969
</button>
7070
</div>
7171
</div>

‎src/components/MDX/YouWillLearnCard.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ function YouWillLearnCard({title, path, children}: YouWillLearnCardProps) {
2828
type="primary"
2929
size="md"
3030
label={title}>
31-
Read More
31+
Baca Lebih Lanjut
3232
<IconNavArrow displayDirection="end" className="inline ms-1" />
3333
</ButtonLink>
3434
</div>

‎src/utils/prepareMDX.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ function getTableOfContents(children, depth) {
6565
if (anchors.length > 0) {
6666
anchors.unshift({
6767
url: '#',
68-
text: 'Overview',
68+
text: 'Ikhtisar',
6969
depth: 2,
7070
});
7171
}

0 commit comments

Comments
 (0)