Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New Arabic Translation Progress #464

Open
gaearon opened this issue Apr 25, 2023 · 90 comments
Open

New Arabic Translation Progress #464

gaearon opened this issue Apr 25, 2023 · 90 comments

Comments

@gaearon
Copy link
Member

gaearon commented Apr 25, 2023

Maintainer List

For New Translators

To translate a page:

  1. Check that no one else has claimed your page in the checklist and comments below.
  2. Comment below with the name of the page you would like to translate. Please take only one page at a time.
  3. Clone this repo, translate your page, and submit a pull request!

Before contributing, read the glossary and style guide (once they exist) to understand how to translate various technical and React-specific terms.

Please be prompt with your translations! If you find that you can't commit anymore, let the maintainers know so they can assign the page to someone else.

For Maintainers

When someone volunteers, edit this issue with the username of the volunteer, and with the PR. Ex:

- [ ] Quick Start (@tesseralis) #12345

When PRs are merged, make sure to mark that page as completed!

Main Content

To do before releasing as an "official" translation. Please translate these pages first.

Note that each section has an index page, which needs to be translated too.

Learn React

API Reference

Navigation and UI

We suggest to leave most of the UI translation until the end. We plan to do some invasive changes to the website folder layout and components, so postponing this until your translation is almost complete would make it easier to merge the changes from our side later. It might make sense to translate the homepage above the fold early, but leave the rest for later. As individual pages get translated, you can change the page titles in the corresponding sidebar files. Finally, when you're translating the navigation, make sure to test both desktop and mobile layouts.

  • Homepage (currently in HomeContent.js)
  • Sidebars (currently in src/sidebar*.json)
  • Top-level navigation (currently in TopNav.tsx)

When You're Ready...

After everything above is translated, add your language to deployedLanguages in Seo.tsx of the original reactjs/react.dev repository.

Secondary Content

These API pages should ideally be translated too, but they're less urgent and can be done after the others:

  • Legacy React APIs
    • Children
    • cloneElement
    • Component
    • createElement
    • createFactory
    • createRef
    • isValidElement
    • PureComponent

Optional Content

These aren't the main translation targets, but if you'd like to do them, feel free to expand the list to include their subpages:

  • Community
  • Blog
  • Warnings
@gaearon
Copy link
Member Author

gaearon commented Apr 25, 2023

@asantarissy @iRayan7 @aladin002dz @Fcmam5 @mohshbool @3imed-jaberi @splimter

Could you please confirm whether you'd be able to steer the effort on this translation? If not, please send a PR to remove yourself from https://github.com/reactjs/translations.react.dev/blob/main/langs/ar.json so that we know which maintainers are active. If there are no active maintainers, we'll put out a call looking for someone to take this on. Thank you!

@aalhommada
Copy link
Contributor

aalhommada commented Apr 25, 2023

I would like to transplant the page : API reference/ react:Hooks / useCallback
or the Api reference / Hooks index page .

@Yarob50
Copy link
Contributor

Yarob50 commented Apr 26, 2023

I would like to start by translating the quick start / index page.
image

@hAbuMustafa
Copy link
Contributor

hAbuMustafa commented Apr 26, 2023

I would start with "Thinking in React".
Is there a glossary or style guide ready for use yet?

@3imed-jaberi
Copy link
Member

@gaearon I confirm my participation here as a maintainer.
About the team, I will notify them, and once I get feedback I will update the maintainer list.

Thanks!

@3imed-jaberi
Copy link
Member

I would like to transplant the page : API reference/ react:Hooks / useCallback or the Api reference / Hooks index page .

@aalhommada, you should take one page each time. So, can you mention which of them you will take?

@aalhommada
Copy link
Contributor

@3imed-jaberi I will begin with the index .

@3imed-jaberi
Copy link
Member

I would start with "Thinking in React". Is there a glossary or style guide ready for use yet?

@hAbuMustafa, you can follow our glossary here and don't forget to open PR and feel free to mark it as a draft once you be done.

assigned.

@3imed-jaberi
Copy link
Member

I would like to start by translating the quick start / index page. image

@Yarob50 waiting for your PR 🔥

assigned.

@3imed-jaberi
Copy link
Member

@aalhommada, waiting for your PR 🔥

assigned.

@3imed-jaberi
Copy link
Member

Please open PR and mark them as DRAFT or with [WIP] under you're done with it. This will help us on pages managment like identifying which pages are already picked.

@aalhommada
Copy link
Contributor

Can I ask here if I have a question , or is there any another channel ( slack , Discord..) ?
I see also that there is some efforts have been already done here
is that still effective ?

@abdllahdev
Copy link
Contributor

Hi @3imed-jaberi, I would like to translate Describing the UI

@Yarob50
Copy link
Contributor

Yarob50 commented Apr 26, 2023

I would like to start by translating the quick start / index page. image

@Yarob50 waiting for your PR 🔥

assigned.

Thanks @3imed-jaberi,
I opened a draft PR and here is the link to it:
#465

I also added a question about the rtl issue.

@aalhommada
Copy link
Contributor

I would like to start by translating the quick start / index page. image

@Yarob50 waiting for your PR 🔥

assigned.

Thanks @3imed-jaberi, I opened a draft PR and here is the link to it: #465

I also added a question about the rtl issue.

React Docs use Nextjs and tailwind css , I had this issue in two language blog , and it has been solved like :

<div dir={router.locale === "ar" ? "rtl" : "ltr"}>{children}</div>

and to avoid been the code block to the right , just adjust tailwind style as this :

 <article className="prose prose-neutral prose-lg prose-pre:[direction:ltr]">
        <MDXRemote {...source} />
  </article>

@Yarob50
Copy link
Contributor

Yarob50 commented Apr 27, 2023

Thanks @aalhommada,
but the question is: where is the proper place to add the styling and whether or not we should add it ourselves as I assume that it should be added in one place and shared with all of our branches rather than each one defining it in his own way.

@AbdulrehmanSuliman
Copy link

Hi I would like to translate the Installation section @3imed-jaberi

@hAbuMustafa
Copy link
Contributor

hAbuMustafa commented Apr 27, 2023

@hAbuMustafa, you can follow our glossary here...

Hello, everyone,
I've made this little project using the glossary highlighted here before.

Feel free to give it a visit and contribute to the page code.

@hAbuMustafa
Copy link
Contributor

I ran across a 'Pitfall' piece that doesn't seem to be translatable in the markdown file.
Since it is a React component anyway, is there a way to pass the translation to the "h3" element inside? (like passing a prop with the translation local={"مسقط!"}?)

image

image

image

@hAbuMustafa
Copy link
Contributor

I'm done with my assignment ("Thinking in React") @3imed-jaberi .

I have a few notes though:

  1. The page is going to need the RTL styling for sure. Maybe we can suggest adding the following to the Arabic version:
body {
    direction: rtl;
}

.sp-editor, code, pre {
    direction: initial;
}

Or, we can use the HTML dir attribute somehow, but it would be rather harder to exclude elements like code and sandpack components.

  1. There are a few un-exposed text for translation. As I mentioned before, the sections like "Pitfall" and "Deep-dive" with its button state "hide/show details". How can we translate those?

  2. there are so many terms that are not provided in the glossary provided before (the softvenue one). How can we have a common gorund on that?

@AhmedBaset
Copy link
Collaborator

@Yarob50 I'd like to translate Tutorial: Tic Tac Toe.

@Mhmd3ssam
Copy link

Mhmd3ssam commented Apr 29, 2023

@Yarob50 @3imed-jaberi I'd like to translate State as a Snapshot

@AbdulrehmanSuliman
Copy link

Hi I would like to translate the Installation section @3imed-jaberi

@Yarob50

@I-3B
Copy link
Contributor

I-3B commented Apr 30, 2023

Hi there! @Yarob50 @3imed-jaberi
I would like to translate "Start a New React Project"

@3imed-jaberi
Copy link
Member

All asked pages are assigned.

🚨 Please don't forget to open the PR as a draft to confirm your assignment.

@abdllahdev
Copy link
Contributor

@3imed-jaberi I think you forgot to assign this page Describing the UI for me

@AhmedBaset
Copy link
Collaborator

Is there any way to speed up installing process

Consider using Yarn instead of npm. Yarn is renowned for its faster and more efficient dependency management. Simply replace the command npm install with yarn install.

@mahmood601
Copy link
Contributor

Is there any way to speed up installing process

Consider using Yarn instead of npm. Yarn is renowned for its faster and more efficient dependency management. Simply replace the command npm install with yarn install.

I have tried yarn. It was also so slow then I used pnpm and the problem was solved. Thanks 👍
I'd to translate rendering lists, please! 🥺

@AhmedBaset
Copy link
Collaborator

AhmedBaset commented Jul 10, 2023

I'd to translate rendering lists
Go ahead
Remember to not add pnpm-lock.yaml to git.

@mahmood601
Copy link
Contributor

I'd to translate rendering lists
Go ahead
Remember to not add pnpm-lock.yaml to git.

I have added it to .gitignore

@mahmood601
Copy link
Contributor

Hello 👋
I'd to translate kepping components pure please 🥺

@mahmood601
Copy link
Contributor

Hello 👋
I'd to translate kepping components pure please 🥺

I have checked it and I noticed it translated to arabic but why it contains words in English 😕

@AhmedBaset
Copy link
Collaborator

Hello 👋
I'd to translate kepping components pure please 🥺

I have checked it and I noticed it translated to arabic but why it contains words in English 😕

Hey @mahmood601
Keeping Components Pure is NOT translated yet.
You are assigned to it now.

@mahmood601
Copy link
Contributor

Hello 👋
I'd to translate kepping components pure please 🥺

I have checked it and I noticed it translated to arabic but why it contains words in English 😕

Hey @mahmood601
Keeping Components Pure is NOT translated yet.
You are assigned to it now.

Thanks 👍

@mrlahmar
Copy link
Contributor

Hi @A7med3bdulBaset ,

Just a quick friendly reminder: Could you please update the conditional rendering as done #503 ? It seems to have been missed. Thank you!

@mahmood601
Copy link
Contributor

@A7med3bdulBaset I'm sorry but I can't complete translation keeping components pure I will have an exam next month, I so sorry 😞

@AhmedBaset
Copy link
Collaborator

@A7med3bdulBaset I'm sorry but I can't complete translation keeping components pure I will have an exam next month, I so sorry 😞

No problem at all
May God grant you success

@tmtm8976
Copy link
Contributor

tmtm8976 commented Aug 3, 2023

hi I would like to translate Passing Props to a Component

@r-m169
Copy link

r-m169 commented Aug 7, 2023

hi i would like to translate useState

@tmtm8976
Copy link
Contributor

tmtm8976 commented Aug 8, 2023

I Will take keeping components pure

@AhmedBaset
Copy link
Collaborator

AhmedBaset commented Aug 9, 2023

@tmtm8976
Go ahead,
There is a PR for this page that requires updates and the contributor isn't active.
You can benefit from it.

@Rumbustious
Copy link
Contributor

I would like to work on Managing State section

@AhmedBaset
Copy link
Collaborator

I would like to work on Managing State section

@Rumbustious Go ahead

@abdllahdev
Copy link
Contributor

Hi @A7med3bdulBaset, sorry I wasn't very active lately. Can you please assign Adding Interactivity to me?

I created a Darft PR here.

@AhmedBaset
Copy link
Collaborator

Hi @A7med3bdulBaset, sorry I wasn't very active lately. Can you please assign Adding Interactivity to me?

I created a Darft PR here.

Go ahead. You are assigned

SN: You don't have to apologize

@AhmedBaset
Copy link
Collaborator

AhmedBaset commented Aug 15, 2023

Good News:

Hey there, My PR to handle RTL styles has been merged. Now we can read the docs in RTL styles.

To get the update to your local env:

  • Navigate to your forked repo: https://github.com/{YOUR_USERNAMD}/ar.react.dev
  • Click Sync fork
  • Run git pull origin main

Sidenote:
There're some styles were not implemented correctly. So #6226 addresses them.

Update: The second PR was also merged to react.dev. Our repo will get it in the sync PR on next Monday.

@bil3zy
Copy link

bil3zy commented Aug 22, 2023

AlSalam, I would like to translate Responding to Events.

@AhmedBaset
Copy link
Collaborator

AlSalam, I would like to translate Responding to Events.

You are assigned. If this is the first time to collaborate here, take this PR as a guide

@mahmood601
Copy link
Contributor

Hi everyone
This translation has many improvements from last month, that's powerful 🥰
However, I would to translate using typescript please 🥺❤️

@tmtm8976
Copy link
Contributor

Hi there, I would like to take: State: A Component's Memory

@mahmood601
Copy link
Contributor

How to translate argument 🤔

@AhmedBaset
Copy link
Collaborator

Hi there, I would like to take: State: A Component's Memory

معامل

@TutTrue
Copy link

TutTrue commented May 7, 2024

Hi there, i would like to translate useMemo

@AhmedBaset
Copy link
Collaborator

Hi there, i would like to translate useMemo

Go ahead

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests