From 18f7bce2f4506d12112c42a7909765fe12613629 Mon Sep 17 00:00:00 2001
From: Andri Purnomo
Date: Mon, 1 May 2023 13:54:03 +0700
Subject: [PATCH 1/7] docs: translation for useId
---
src/content/reference/react/useId.md | 62 ++++++++++++++--------------
1 file changed, 31 insertions(+), 31 deletions(-)
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index 4ea029f27a..7a064059e2 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -4,8 +4,7 @@ title: useId
-`useId` is a React Hook for generating unique IDs that can be passed to accessibility attributes.
-
+`useId` adalah React Hook untuk menghasilkan ID unik yang dapat diteruskan ke atribut aksesibilitas.
```js
const id = useId()
```
@@ -16,11 +15,11 @@ const id = useId()
---
-## Reference {/*reference*/}
+## Referensi {/*reference*/}
### `useId()` {/*useid*/}
-Call `useId` at the top level of your component to generate a unique ID:
+Panggil `useId` di tingkat atas komponen Anda untuk menghasilkan ID unik:
```js
import { useId } from 'react';
@@ -30,35 +29,35 @@ function PasswordField() {
// ...
```
-[See more examples below.](#usage)
+[Lihat lebih banyak contoh di bawah ini.](#usage)
-#### Parameters {/*parameters*/}
+#### Parameter {/*parameters*/}
-`useId` does not take any parameters.
+`useId` tidak mengambil parameter apapun.
#### Returns {/*returns*/}
-`useId` returns a unique ID string associated with this particular `useId` call in this particular component.
+`useId` mengembalikan string ID unik yang terkait dengan panggilan `useId` tertentu dalam komponen khusus ini.
#### Caveats {/*caveats*/}
-* `useId` is a Hook, so you can only call it **at the top level of your component** or your own Hooks. You can't call it inside loops or conditions. If you need that, extract a new component and move the state into it.
+* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat atas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam loop atau kondisi. Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.
-* `useId` **should not be used to generate keys** in a list. [Keys should be generated from your data.](/learn/rendering-lists#where-to-get-your-key)
+* `useId` **tidak boleh digunakan untuk menghasilkan *key*** dalam daftar. [*Key* harus dihasilkan dari data Anda.](/learn/rendering-lists#where-to-get-your-key)
---
-## Usage {/*usage*/}
+## Pengunaan {/*usage*/}
-**Do not call `useId` to generate keys in a list.** [Keys should be generated from your data.](/learn/rendering-lists#where-to-get-your-key)
+**Jangan panggil `useId` untuk menghasilkan *key* dalam daftar.** [*Key* harus dihasilkan dari data Anda](/learn/rendering-lists#where-to-get-your-key)
-### Generating unique IDs for accessibility attributes {/*generating-unique-ids-for-accessibility-attributes*/}
+### Menghasilkan ID unik untuk atribut aksesibilitas {/*generating-unique-ids-for-accessibility-attributes*/}
-Call `useId` at the top level of your component to generate a unique ID:
+Panggil `useId` di tingkat atas komponen Anda untuk menghasilkan ID unik:
```js [[1, 4, "passwordHintId"]]
import { useId } from 'react';
@@ -68,7 +67,7 @@ function PasswordField() {
// ...
```
-You can then pass the generated ID to different attributes:
+Anda kemudian dapat meneruskan ID yang dihasilkan ke atribut yang berbeda:
```js [[1, 2, "passwordHintId"], [1, 3, "passwordHintId"]]
<>
@@ -77,11 +76,11 @@ You can then pass the generated ID to different at
>
```
-**Let's walk through an example to see when this is useful.**
+**Mari telusuri contoh untuk melihat kapan ini berguna.**
-[HTML accessibility attributes](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) like [`aria-describedby`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-describedby) let you specify that two tags are related to each other. For example, you can specify that an element (like an input) is described by another element (like a paragraph).
+[Atribut aksesibilitas HTML](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) seperti [`aria-describedby`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-describedby) membiarkan Anda menentukan bahwa dua tag terkait satu sama lain. Misalnya, Anda dapat menentukan bahwa suatu elemen (seperti input) dijelaskan oleh elemen lain (seperti paragraf).
-In regular HTML, you would write it like this:
+Dalam HTML biasa, Anda akan menulisnya seperti ini:
```html {5,8}
```
-However, hardcoding IDs like this is not a good practice in React. A component may be rendered more than once on the page--but IDs have to be unique! Instead of hardcoding an ID, generate a unique ID with `useId`:
+Namun, memaksakan ID seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat dirender lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, buat ID unik dengan `useId`:
```js {4,11,14}
import { useId } from 'react';
@@ -163,33 +162,34 @@ input { margin: 5px; }
-[Watch this video](https://www.youtube.com/watch?v=0dNzNcuEuOo) to see the difference in the user experience with assistive technologies.
+[Tonton video ini](https://www.youtube.com/watch?v=0dNzNcuEuOo) untuk melihat perbedaan pengalaman pengguna dengan teknologi bantu.
-With [server rendering](/reference/react-dom/server), **`useId` requires an identical component tree on the server and the client**. If the trees you render on the server and the client don't match exactly, the generated IDs won't match.
+Dengan [rendering server](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di server dan klien**. Jika pohon yang Anda render di server dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.
-#### Why is useId better than an incrementing counter? {/*why-is-useid-better-than-an-incrementing-counter*/}
+#### Mengapa useId lebih baik daripada penghitung kenaikan? {/*why-is-useid-better-than-an-incrementing-counter*/}
+
+Anda mungkin bertanya-tanya mengapa `useId` lebih baik daripada menambahkan variabel global seperti `nextId++`.
-You might be wondering why `useId` is better than incrementing a global variable like `nextId++`.
+Manfaat utama `useId` adalah React memastikan bahwa ia bekerja dengan [rendering server.](/reference/react-dom/server) Selama rendering server, komponen Anda menghasilkan keluaran HTML. Kemudian, pada klien, [hidrasi](/reference/react-dom/client/hydrateRoot) melampirkan *event handler* Anda ke HTML yang dihasilkan. Agar hidrasi berfungsi, output klien harus cocok dengan HTML server.
-The primary benefit of `useId` is that React ensures that it works with [server rendering.](/reference/react-dom/server) During server rendering, your components generate HTML output. Later, on the client, [hydration](/reference/react-dom/client/hydrateRoot) attaches your event handlers to the generated HTML. For hydration to work, the client output must match the server HTML.
+Ini sangat sulit untuk menjamin dengan penghitung kenaikan karena urutan di mana komponen klien terhidrasi mungkin tidak sesuai dengan urutan di mana HTML server dipancarkan. Dengan memanggil `useId`, Anda memastikan bahwa hidrasi akan berfungsi, dan hasilnya akan cocok antara server dan klien.
-This is very difficult to guarantee with an incrementing counter because the order in which the client components are hydrated may not match the order in which the server HTML was emitted. By calling `useId`, you ensure that hydration will work, and the output will match between the server and the client.
-Inside React, `useId` is generated from the "parent path" of the calling component. This is why, if the client and the server tree are the same, the "parent path" will match up regardless of rendering order.
+Di dalam React, `useId` dihasilkan dari “jalur induk” dari komponen pemanggil. Inilah sebabnya, jika klien dan pohon server sama, "jalur induk" akan cocok terlepas dari urutan rendering.
---
-### Generating IDs for several related elements {/*generating-ids-for-several-related-elements*/}
+### Menghasilkan ID untuk beberapa elemen terkait {/*generating-ids-for-several-related-elements*/}
-If you need to give IDs to multiple related elements, you can call `useId` to generate a shared prefix for them:
+Jika Anda perlu memberikan ID ke beberapa elemen terkait, Anda dapat memanggil `useId` untuk menghasilkan prefiks bersama untuknya:
@@ -216,13 +216,13 @@ input { margin: 5px; }
-This lets you avoid calling `useId` for every single element that needs a unique ID.
+Ini memungkinkan Anda menghindari pemanggilan `useId` untuk setiap elemen yang membutuhkan ID unik.
---
-### Specifying a shared prefix for all generated IDs {/*specifying-a-shared-prefix-for-all-generated-ids*/}
+### Menentukan prefiks bersama untuk semua ID yang dihasilkan {/*specifying-a-shared-prefix-for-all-generated-ids*/}
-If you render multiple independent React applications on a single page, pass `identifierPrefix` as an option to your [`createRoot`](/reference/react-dom/client/createRoot#parameters) or [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) calls. This ensures that the IDs generated by the two different apps never clash because every identifier generated with `useId` will start with the distinct prefix you've specified.
+Jika Anda merender beberapa aplikasi React independen pada satu halaman, berikan `identifierPrefix` sebagai opsi untuk panggilan [`createRoot`](/reference/react-dom/client/createRoot#parameters) atau [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) Anda. Hal ini memastikan bahwa ID yang dihasilkan oleh dua aplikasi berbeda tidak pernah berbenturan karena setiap pengenal yang dibuat dengan `useId` akan dimulai dengan awalan berbeda yang telah Anda tentukan.
From 3201ad8cc93e86e14b46934acd74ecd9c5128a36 Mon Sep 17 00:00:00 2001
From: Andri Purnomo
Date: Mon, 1 May 2023 18:57:26 +0700
Subject: [PATCH 2/7] docs: update title
---
src/content/reference/react/useId.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index 7a064059e2..046e408216 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -35,7 +35,7 @@ function PasswordField() {
`useId` tidak mengambil parameter apapun.
-#### Returns {/*returns*/}
+#### Kembalian {/*returns*/}
`useId` mengembalikan string ID unik yang terkait dengan panggilan `useId` tertentu dalam komponen khusus ini.
From 77be94391ca9d3c471926aad3f646b90febcbd6c Mon Sep 17 00:00:00 2001
From: Andri Purnomo
Date: Mon, 1 May 2023 19:04:14 +0700
Subject: [PATCH 3/7] docs: make merender text to have dash and italic
---
src/content/reference/react/useId.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index 046e408216..54ff4afe8b 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -222,7 +222,7 @@ Ini memungkinkan Anda menghindari pemanggilan `useId` untuk setiap elemen yang m
### Menentukan prefiks bersama untuk semua ID yang dihasilkan {/*specifying-a-shared-prefix-for-all-generated-ids*/}
-Jika Anda merender beberapa aplikasi React independen pada satu halaman, berikan `identifierPrefix` sebagai opsi untuk panggilan [`createRoot`](/reference/react-dom/client/createRoot#parameters) atau [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) Anda. Hal ini memastikan bahwa ID yang dihasilkan oleh dua aplikasi berbeda tidak pernah berbenturan karena setiap pengenal yang dibuat dengan `useId` akan dimulai dengan awalan berbeda yang telah Anda tentukan.
+Jika Anda me-*render* beberapa aplikasi React independen pada satu halaman, berikan `identifierPrefix` sebagai opsi untuk panggilan [`createRoot`](/reference/react-dom/client/createRoot#parameters) atau [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) Anda. Hal ini memastikan bahwa ID yang dihasilkan oleh dua aplikasi berbeda tidak pernah berbenturan karena setiap pengenal yang dibuat dengan `useId` akan dimulai dengan awalan berbeda yang telah Anda tentukan.
From a494d224f6bd42c36e628811fd30ce693e4897f0 Mon Sep 17 00:00:00 2001
From: Andri Purnomo
Date: Wed, 3 May 2023 08:34:50 +0700
Subject: [PATCH 4/7] docs: update wording by feedback
---
src/content/reference/react/useId.md | 14 +++++++-------
1 file changed, 7 insertions(+), 7 deletions(-)
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index 54ff4afe8b..b5ed3e23b4 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -41,7 +41,7 @@ function PasswordField() {
#### Caveats {/*caveats*/}
-* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat atas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam loop atau kondisi. Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.
+* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat teratas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam perulangan (*loop*) atau kondisi (*conditions*). Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.
* `useId` **tidak boleh digunakan untuk menghasilkan *key*** dalam daftar. [*Key* harus dihasilkan dari data Anda.](/learn/rendering-lists#where-to-get-your-key)
@@ -78,7 +78,7 @@ Anda kemudian dapat meneruskan ID yang dihasilkan
**Mari telusuri contoh untuk melihat kapan ini berguna.**
-[Atribut aksesibilitas HTML](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) seperti [`aria-describedby`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-describedby) membiarkan Anda menentukan bahwa dua tag terkait satu sama lain. Misalnya, Anda dapat menentukan bahwa suatu elemen (seperti input) dijelaskan oleh elemen lain (seperti paragraf).
+[Atribut aksesibilitas HTML](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA) seperti [`aria-describedby`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-describedby) membiarkan Anda menentukan bahwa dua *tag* terkait satu sama lain. Misalnya, Anda dapat menentukan bahwa suatu elemen (seperti sebuah masukan (`input`)) dijelaskan oleh elemen lain (seperti sebuah paragraf (`p`)).
Dalam HTML biasa, Anda akan menulisnya seperti ini:
@@ -95,7 +95,7 @@ Dalam HTML biasa, Anda akan menulisnya seperti ini:
```
-Namun, memaksakan ID seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat dirender lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, buat ID unik dengan `useId`:
+Namun, menuliskan ID secara langsung di dalam kode (*hardcoding*) seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat dirender lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, buat ID unik dengan `useId`:
```js {4,11,14}
import { useId } from 'react';
@@ -119,7 +119,7 @@ function PasswordField() {
}
```
-Now, even if `PasswordField` appears multiple times on the screen, the generated IDs won't clash.
+Sekarang, meskipun `PasswordField` muncul beberapa kali di layar, ID yang dihasilkan tidak akan berbenturan.
@@ -178,7 +178,7 @@ Anda mungkin bertanya-tanya mengapa `useId` lebih baik daripada menambahkan vari
Manfaat utama `useId` adalah React memastikan bahwa ia bekerja dengan [rendering server.](/reference/react-dom/server) Selama rendering server, komponen Anda menghasilkan keluaran HTML. Kemudian, pada klien, [hidrasi](/reference/react-dom/client/hydrateRoot) melampirkan *event handler* Anda ke HTML yang dihasilkan. Agar hidrasi berfungsi, output klien harus cocok dengan HTML server.
-Ini sangat sulit untuk menjamin dengan penghitung kenaikan karena urutan di mana komponen klien terhidrasi mungkin tidak sesuai dengan urutan di mana HTML server dipancarkan. Dengan memanggil `useId`, Anda memastikan bahwa hidrasi akan berfungsi, dan hasilnya akan cocok antara server dan klien.
+Hal ini sangat sulit untuk dijamin dengan penghitung kenaikan karena urutan di mana komponen klien terhidrasi mungkin tidak sesuai dengan urutan di mana HTML dari *server* dipancarkan. Dengan memanggil `useId`, Anda memastikan bahwa hidrasi akan berfungsi, dan hasilnya akan cocok antara *server* dan klien.
Di dalam React, `useId` dihasilkan dari “jalur induk” dari komponen pemanggil. Inilah sebabnya, jika klien dan pohon server sama, "jalur induk" akan cocok terlepas dari urutan rendering.
@@ -189,7 +189,7 @@ Di dalam React, `useId` dihasilkan dari “jalur induk” dari komponen pemanggi
### Menghasilkan ID untuk beberapa elemen terkait {/*generating-ids-for-several-related-elements*/}
-Jika Anda perlu memberikan ID ke beberapa elemen terkait, Anda dapat memanggil `useId` untuk menghasilkan prefiks bersama untuknya:
+Jika Anda perlu memberikan ID ke beberapa elemen terkait, Anda dapat memanggil `useId` untuk menghasilkan awalan bersama untuk mereka:
@@ -220,7 +220,7 @@ Ini memungkinkan Anda menghindari pemanggilan `useId` untuk setiap elemen yang m
---
-### Menentukan prefiks bersama untuk semua ID yang dihasilkan {/*specifying-a-shared-prefix-for-all-generated-ids*/}
+### Menentukan awalan bersama untuk semua ID yang dihasilkan {/*specifying-a-shared-prefix-for-all-generated-ids*/}
Jika Anda me-*render* beberapa aplikasi React independen pada satu halaman, berikan `identifierPrefix` sebagai opsi untuk panggilan [`createRoot`](/reference/react-dom/client/createRoot#parameters) atau [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) Anda. Hal ini memastikan bahwa ID yang dihasilkan oleh dua aplikasi berbeda tidak pernah berbenturan karena setiap pengenal yang dibuat dengan `useId` akan dimulai dengan awalan berbeda yang telah Anda tentukan.
From a190873e85b8210bfcfccd5e7b00f9983da7309e Mon Sep 17 00:00:00 2001
From: Andri Purnomo
Date: Mon, 8 May 2023 19:17:28 +0700
Subject: [PATCH 5/7] docs: update render word to be italic
---
src/content/reference/react/useId.md | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index b5ed3e23b4..b0162b2b8a 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -95,7 +95,7 @@ Dalam HTML biasa, Anda akan menulisnya seperti ini:
```
-Namun, menuliskan ID secara langsung di dalam kode (*hardcoding*) seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat dirender lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, buat ID unik dengan `useId`:
+Namun, menuliskan ID secara langsung di dalam kode (*hardcoding*) seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat di-*render* lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, buat ID unik dengan `useId`:
```js {4,11,14}
import { useId } from 'react';
@@ -166,7 +166,7 @@ input { margin: 5px; }
-Dengan [rendering server](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di server dan klien**. Jika pohon yang Anda render di server dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.
+Dengan [rendering server](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di server dan klien**. Jika pohon yang Anda *render* di server dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.
From 63f6c52902617019c5abc681b009fb99396e42f2 Mon Sep 17 00:00:00 2001
From: Andri Purnomo
Date: Wed, 10 May 2023 08:49:59 +0700
Subject: [PATCH 6/7] docs: update word server and rendering to be italic
---
src/content/reference/react/useId.md | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index b0162b2b8a..a899d996a4 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -41,7 +41,7 @@ function PasswordField() {
#### Caveats {/*caveats*/}
-* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat teratas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam perulangan (*loop*) atau kondisi (*conditions*). Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.
+* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat teratas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam perulangan (*loops*) atau kondisi (*conditions*). Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.
* `useId` **tidak boleh digunakan untuk menghasilkan *key*** dalam daftar. [*Key* harus dihasilkan dari data Anda.](/learn/rendering-lists#where-to-get-your-key)
@@ -166,7 +166,7 @@ input { margin: 5px; }
-Dengan [rendering server](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di server dan klien**. Jika pohon yang Anda *render* di server dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.
+Dengan [*server rendering*](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di *server* dan klien**. Jika pohon yang Anda *render* di *server* dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.
@@ -176,12 +176,12 @@ Dengan [rendering server](/reference/react-dom/server), **`useId` membutuhkan po
Anda mungkin bertanya-tanya mengapa `useId` lebih baik daripada menambahkan variabel global seperti `nextId++`.
-Manfaat utama `useId` adalah React memastikan bahwa ia bekerja dengan [rendering server.](/reference/react-dom/server) Selama rendering server, komponen Anda menghasilkan keluaran HTML. Kemudian, pada klien, [hidrasi](/reference/react-dom/client/hydrateRoot) melampirkan *event handler* Anda ke HTML yang dihasilkan. Agar hidrasi berfungsi, output klien harus cocok dengan HTML server.
+Manfaat utama `useId` adalah React memastikan bahwa ia bekerja dengan [*server rendering*.](/reference/react-dom/server) Selama *server rendering*, komponen Anda menghasilkan keluaran HTML. Kemudian, pada klien, [hidrasi](/reference/react-dom/client/hydrateRoot) melampirkan *event handler* Anda ke HTML yang dihasilkan. Agar hidrasi berfungsi, output klien harus cocok dengan HTML dari *server*.
Hal ini sangat sulit untuk dijamin dengan penghitung kenaikan karena urutan di mana komponen klien terhidrasi mungkin tidak sesuai dengan urutan di mana HTML dari *server* dipancarkan. Dengan memanggil `useId`, Anda memastikan bahwa hidrasi akan berfungsi, dan hasilnya akan cocok antara *server* dan klien.
-Di dalam React, `useId` dihasilkan dari “jalur induk” dari komponen pemanggil. Inilah sebabnya, jika klien dan pohon server sama, "jalur induk" akan cocok terlepas dari urutan rendering.
+Di dalam React, `useId` dihasilkan dari “jalur induk” dari komponen pemanggil. Inilah sebabnya, jika pohon di klien dan *server* sama, "jalur induk" akan cocok terlepas dari urutan *rendering*.
From 2d1dfa9baad86bb71ea9fc73e6372b20d94d749c Mon Sep 17 00:00:00 2001
From: Zain Fathoni
Date: Sun, 30 Jul 2023 17:16:28 +0800
Subject: [PATCH 7/7] Update src/content/reference/react/useId.md
---
src/content/reference/react/useId.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/content/reference/react/useId.md b/src/content/reference/react/useId.md
index a899d996a4..7bb4f96131 100644
--- a/src/content/reference/react/useId.md
+++ b/src/content/reference/react/useId.md
@@ -19,7 +19,7 @@ const id = useId()
### `useId()` {/*useid*/}
-Panggil `useId` di tingkat atas komponen Anda untuk menghasilkan ID unik:
+Panggil `useId` di tingkat teratas komponen Anda untuk menghasilkan ID unik:
```js
import { useId } from 'react';