feat: initial i18n marketing implementation (#1223)

## Description

This PR introduces an initial i18n implementation using
[Lingui](https://lingui.dev).

We plan to combine it with Crowdin which will provide AI translations
when PRs are merged into main.

We plan to rollout i18n to only marketing for now, and will review how
everything goes before continuing to introduce it into the main
application.

## Reasoning

Why not use i18n-next or other alternatives?

To hopefully provide the best DX we chose Lingui because it allows us to
simply wrap text that we want to translate in tags, instead of forcing
users to do things such as:

- Update the text to `t('some-text')`
- Extract it to the file
- The text becomes a bit unreadable unless done correctly

Yes, plugins such as i18n-ally and Sherlock exist to simplify these
chores, but these require the user to be correctly setup in vscode, and
it also does not seem to provide the required configurations for our
multi app and multi UI package setup.

## Super simple demo

```html
// Before
<p>Text to update</p>

// After
<p>
  <Trans>Text to update</Trans>
</p>
```

## Related Issue

Relates to #885 but is only for marketing for now.

Another branch is slowly being prepared for the changes required for the
web application while we wait to see how this goes for marketing.

## Changes Made

Our configuration does not follow the general standard since we have
translations that cross:
- Web app
- Marketing app
- Constants package
- UI package

This means we want to separate translations into:
1. Marketing - Only translations extracted from `apps/marketing`
2. Web - Only translations extracted from `apps/web`
3. Common - Translations from `packages/constants` and `packages/ui`

Then we bundle, compile and minify the translations for production as
follows:
1. Marketing = Marketing + Common
2. Web = Web + Common

This allows us to only load the required translations when running each
application.

Overall general changes: 
- Add i18n to marketing
- Add core i18n setup to web
- Add pre-commit hook and GH action to extract any new <Trans> tags into
the translation files

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit


- **New Features**
- Added Romanian localization for marketing messages to improve
accessibility for Romanian-speaking users.
- Introduced German and English translation modules and PO files to
enhance the application's internationalization capabilities.
- Integrated internationalization support in the RootLayout component
for dynamic language settings based on server-side configurations.
- Enhanced the Enterprise component with translation support to adapt to
user language preferences.
- Added a `<meta>` tag to prevent Google from translating the page
content, supporting internationalization efforts.

- **Bug Fixes**
- Resolved minor issues related to the structure and accessibility of
translation files.

- **Chores**
- Updated project dependencies to support the new localization features
and ensure stability.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Lucas Smith <me@lucasjamessmith.me>
Co-authored-by: Crowdin Bot <support+bot@crowdin.com>
Co-authored-by: github-actions <github-actions@documenso.com>
This commit is contained in:
David Nguyen
2024-07-26 14:56:42 +10:00
committed by GitHub
parent 277a870580
commit 1028184cf2
71 changed files with 5491 additions and 478 deletions

View File

@ -0,0 +1,38 @@
# Extract and compile translations for all PRs.
name: 'Extract and compile translations'
on:
workflow_call:
pull_request:
branches: ['main']
concurrency:
group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
cancel-in-progress: true
jobs:
extract_translations:
name: Extract and compile translations
runs-on: ubuntu-latest
permissions:
contents: write
steps:
- name: Checkout
uses: actions/checkout@v4
with:
ref: ${{ github.event.pull_request.head.ref }}
- uses: ./.github/actions/node-install
- name: Extract and compile translations
run: |
npm run translate:extract
npm run translate:compile
- name: Check and commit any files created
run: |
git config --global user.name 'github-actions'
git config --global user.email 'github-actions@documenso.com'
git add packages/lib/translations
git diff --staged --quiet --exit-code || (git commit -m "chore: extract translations" && git push)

View File

@ -0,0 +1,51 @@
# This is similar to the "Pull Translations" workflow, but without the conditional check to allow us to
# forcefully pull down translations from Crowdin and create a PR regardless if all the translations are fulfilled.
#
# Intended to be used when we manually update translations in Crowdin UI and want to pull those down when
# they already exist.
name: 'Force pull translations'
on:
workflow_dispatch:
workflow_call:
concurrency:
group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
cancel-in-progress: true
jobs:
pull_translations:
name: Force pull translations
runs-on: ubuntu-latest
environment: Translations
permissions:
contents: write
pull-requests: write
steps:
- name: Checkout
uses: actions/checkout@v4
- uses: ./.github/actions/node-install
- name: Pull translations from Crowdin
uses: crowdin/github-action@v2
with:
upload_sources: false
upload_translations: false
download_translations: true
export_only_approved: false
localization_branch_name: chore/translations
commit_message: 'chore: add translations'
pull_request_title: 'chore: add translations'
env:
# A classic GitHub Personal Access Token with the 'repo' scope selected (the user should have write access to the repository).
GITHUB_TOKEN: ${{ secrets.GH_PAT }}
# A numeric ID, found at https://crowdin.com/project/<projectName>/tools/api
CROWDIN_PROJECT_ID: ${{ secrets.CROWDIN_PROJECT_ID }}
# Visit https://crowdin.com/settings#api-key to create this token
CROWDIN_PERSONAL_TOKEN: ${{ secrets.CROWDIN_PERSONAL_TOKEN }}

View File

@ -3,11 +3,10 @@
name: 'Pull translations'
on:
schedule:
- cron: '0 */2 * * *' # Every two hours.
workflow_dispatch:
workflow_call:
# Cron disabled until i18n PR is landed.
# schedule:
# - cron: '0 */2 * * *' # Every two hours.
concurrency:
group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
@ -17,6 +16,7 @@ jobs:
pull_translations:
name: Pull translations
runs-on: ubuntu-latest
environment: Translations
permissions:
contents: write
pull-requests: write
@ -46,7 +46,7 @@ jobs:
env:
# A classic GitHub Personal Access Token with the 'repo' scope selected (the user should have write access to the repository).
GITHUB_TOKEN: ${{ secrets.GITHUB_CROWDIN_TOKEN }}
GITHUB_TOKEN: ${{ secrets.GH_PAT }}
# A numeric ID, found at https://crowdin.com/project/<projectName>/tools/api
CROWDIN_PROJECT_ID: ${{ secrets.CROWDIN_PROJECT_ID }}

View File

@ -3,9 +3,8 @@ name: 'Extract and upload translations'
on:
workflow_dispatch:
workflow_call:
# Disabled until i18n PR is landed.
# push:
# branches: ['main']
push:
branches: ['main']
concurrency:
group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
@ -15,6 +14,7 @@ jobs:
extract_translations:
name: Extract and upload translations
runs-on: ubuntu-latest
environment: Translations
permissions:
contents: write
steps: