Merge pull request #411 from ltmylinh/ltmylinh/fix-conflict

Resolve a confilct

src/components/MDX/ExpandableExample.tsx

@@ -70,24 +70,14 @@ function ExpandableExample({children, excerpt, type}: ExpandableExampleProps) {
           })}>
           {isDeepDive && (
             <>
-<<<<<<< HEAD
-              <IconDeepDive className="inline mr-2 dark:text-purple-30 text-purple-40" />
-              Tìm hiểu sâu
-=======
               <IconDeepDive className="inline me-2 dark:text-purple-30 text-purple-40" />
-              Deep Dive
->>>>>>> 7bdbab144e09d4edf793ff5128080eb1dba79be4
+              Tìm hiểu sâu
             </>
           )}
           {isExample && (
             <>
-<<<<<<< HEAD
-              <IconCodeBlock className="inline mr-2 dark:text-yellow-30 text-yellow-50" />
-              Ví dụ
-=======
               <IconCodeBlock className="inline me-2 dark:text-yellow-30 text-yellow-50" />
-              Example
->>>>>>> 7bdbab144e09d4edf793ff5128080eb1dba79be4
+              Ví dụ
             </>
           )}
         </h5>

src/content/community/meetups.md

@@ -124,13 +124,8 @@ Bạn đã có React.js meetup tại quốc gia của bạn chưa? Thêm nó và
 * [Kuala Lumpur](https://www.kl-react.com/)
 * [Penang](https://www.facebook.com/groups/reactpenang/)
 
-<<<<<<< HEAD
-## Hà Lan {/*netherlands*/}
-* [Amsterdam](https://www.meetup.com/React-Amsterdam/)
-=======
 ## Netherlands {/*netherlands*/}
 * [Amsterdam](https://guild.host/react-amsterdam)
->>>>>>> 7bdbab144e09d4edf793ff5128080eb1dba79be4
 
 ## New Zealand {/*new-zealand*/}
 * [Wellington](https://www.meetup.com/React-Wellington/)

src/content/learn/state-as-a-snapshot.md

@@ -74,20 +74,10 @@ Chúng ta sẽ xem xét kỹ hơn mối quan hệ giữa state và re-render tro
 
 Không giống như một bức ảnh hay một khung hình phim, snapshot UI bạn trả về có tính tương tác. Nó bao gồm logic như event handler chỉ định điều gì xảy ra khi input thay đổi. React cập nhật màn hình để phù hợp với snapshot này và kết nối các event handler. Kết quả là, khi nhấn nút sẽ kích hoạt event handler từ JSX của bạn.
 
-<<<<<<< HEAD
 Khi React re-render một component:
 1. React gọi lại hàm của bạn.
 2. Hàm của bạn trả về một snapshot JSX mới.
 3. React cập nhật màn hình sao cho tương đồng với snapshot bạn đã trả về.
-=======
-Unlike a photograph or a movie frame, the UI "snapshot" you return is interactive. It includes logic like event handlers that specify what happens in response to inputs. React updates the screen to match this snapshot and connects the event handlers. As a result, pressing a button will trigger the click handler from your JSX.
-
-When React re-renders a component:
-
-1. React calls your function again.
-2. Your function returns a new JSX snapshot.
-3. React then updates the screen to match the snapshot your function returned.
->>>>>>> 7bdbab144e09d4edf793ff5128080eb1dba79be4
 
 <IllustrationBlock sequential>
     <Illustration caption="React thực thi hàm của bạn" src="/images/docs/illustrations/i_render1.png" />

src/content/learn/your-first-component.md

@@ -211,11 +211,7 @@ Khi mà một component con cần dữ liệu từ cha, [hãy truyền nó qua p
 
 #### Sử dụng Component từ đầu đến cuối {/*components-all-the-way-down*/}
 
-<<<<<<< HEAD
-Ứng dụng React của bạn bắt đầu từ một component "gốc" (root). Thường thì component này được tạo ra tự động khi mà bạn bắt đầu một dự án mới. Ví dụ, nếu bạn dùng [CodeSandbox](https://codesandbox.io/) hay [Create React App](https://create-react-app.dev/), component gốc sẽ được định nghĩa ở `src/App.js`. Nếu bạn sử dụng framework [Next.js](https://nextjs.org/), component gốc sẽ được định nghĩa ở `pages/index.js`. Trong những ví dụ này, bạn đã export các component gốc.
-=======
-Your React application begins at a "root" component. Usually, it is created automatically when you start a new project. For example, if you use [CodeSandbox](https://codesandbox.io/) or if you use the framework [Next.js](https://nextjs.org/), the root component is defined in `pages/index.js`. In these examples, you've been exporting root components.
->>>>>>> 7bdbab144e09d4edf793ff5128080eb1dba79be4
+Ứng dụng React của bạn bắt đầu từ một component "gốc" (root). Thường thì component này được tạo ra tự động khi mà bạn bắt đầu một dự án mới. Ví dụ, nếu bạn dùng [CodeSandbox](https://codesandbox.io/) hay nếu bạn sử dụng framework [Next.js](https://nextjs.org/), component gốc sẽ được định nghĩa ở `pages/index.js`. Trong những ví dụ này, bạn đã export các component gốc.
 
 Hầu hết các ứng dụng React đều sử dụng component từ đầu đến cuối. Điều này có nghĩa là bạn không chỉ sử dụng component cho những phần có thể tái sử dụng như các nút (button) mà còn cho các phần lớn hơn như sidebar, các danh sách và đích đến cuối, các trang hoàn chỉnh! Component là một cách tiện lợi để tổ chức code UI và markup, ngay cả khi một số chúng chỉ được sử dụng một lần.
 

src/content/reference/react/lazy.md

@@ -32,11 +32,7 @@ const MarkdownPreview = lazy(() => import('./MarkdownPreview.js'));
 
 #### Tham số {/*parameters*/}
 
-<<<<<<< HEAD
-* `load`: Một function trả về một [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) hoặc một *thenable* (một đối tượng giống Promise với một phương thức `then`). React sẽ không gọi hàm `load` cho tới khi bạn render component được trả về. Sau khi React gọi `load` lần đầu tiên, React sẽ đợi cho tới khi hàm này được giải quyết xong (resolve), sau đó sẽ render giá trị được giải quyết như một React component. Cả Promise được trả về và giá trị đã được giải quyết của Promise đó đều được lưu lại, nên React sẽ không gọi `load` thêm nữa. Nếu Promise từ chối, React sẽ `throw` lý do từ chối cho Error Boundary gần nhất để xử lý.
-=======
-* `load`: A function that returns a [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) or another *thenable* (a Promise-like object with a `then` method). React will not call `load` until the first time you attempt to render the returned component. After React first calls `load`, it will wait for it to resolve, and then render the resolved value's `.default` as a React component. Both the returned Promise and the Promise's resolved value will be cached, so React will not call `load` more than once. If the Promise rejects, React will `throw` the rejection reason for the nearest Error Boundary to handle.
->>>>>>> 7bdbab144e09d4edf793ff5128080eb1dba79be4
+* `load`: Một function trả về một [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) hoặc một *thenable* (một đối tượng giống Promise với một phương thức `then`). React sẽ không gọi hàm `load` cho tới khi bạn render component được trả về. Sau khi React gọi `load` lần đầu tiên, React sẽ đợi cho tới khi hàm này được giải quyết xong (resolve), sau đó sẽ render giá trị `.default` như một React component. Cả Promise được trả về và giá trị đã được giải quyết của Promise đó đều được lưu lại, nên React sẽ không gọi `load` thêm nữa. Nếu Promise từ chối, React sẽ `throw` lý do từ chối cho Error Boundary gần nhất để xử lý.
 
 #### Giá trị trả về {/*returns*/}
 
@@ -74,11 +70,7 @@ import { lazy } from 'react';
 const MarkdownPreview = lazy(() => import('./MarkdownPreview.js'));
 ```
 
-<<<<<<< HEAD
-Đoạn code này phụ thuộc vào [dynamic `import()`,](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import) có thể sẽ cần được hỗ trợ bởi bundler hoặc framework của bạn.
-=======
-This code relies on [dynamic `import()`,](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import) which might require support from your bundler or framework. Using this pattern requires that the lazy component you're importing was exported as the `default` export.
->>>>>>> 7bdbab144e09d4edf793ff5128080eb1dba79be4
+Đoạn code này phụ thuộc vào [dynamic `import()`,](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import) có thể sẽ cần được hỗ trợ bởi bundler hoặc framework của bạn. Sử dụng mẫu này yêu cầu lazy component mà bạn đang import phải được export bằng `default`.
 
 Bây giờ code của component sẽ tải khi được yêu cầu, bạn sẽ cần phải xác định cái gì sẽ được hiển thị khi component đang được tải. Bạn có thể làm điều này bằng việc bọc lazy component hoặc bất kì phần tử cha của nó vào trong [`<Suspense>`](/reference/react/Suspense):