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

Custom slot name braces #15

Merged
merged 10 commits into from
Jun 28, 2023
Merged

Custom slot name braces #15

merged 10 commits into from
Jun 28, 2023

Conversation

YehorPytomets
Copy link
Contributor

@YehorPytomets YehorPytomets commented Jun 27, 2023

In this PR I introduce the possibility to provide custom start and end braces (or other string values) used to recognize the end and start of a slot of the TranslationComponent.

This may be useful when default braces ({ and }) are wrongly treated by the Locize service or don't satisfy other needs. In our case, the Locize treated single braces as "wrong" double braces, so we couldn't sync our localization terms with the Locize service without additional refactoring. This service is needed for our translators to edit localization terms and see how it looks in real time. We have to do double refactoring each time before sync. To avoid it, I propose a little change in this repo.

Checklist

  • only relevant code is changed (make a diff before you submit the PR)
  • run tests npm run test
  • tests are included (tested the build of the final commit in real project by replacing the library file)
  • commit message and code follows the Developer's Certification of Origin

Checklist (for documentation change)

  • only relevant documentation part is changed (make a diff before you submit the PR)
  • motivation/reason is provided
  • commit message and code follows the Developer's Certification of Origin

@YehorPytomets
Copy link
Contributor Author

@kkuegler, PTAL

README.md Outdated Show resolved Hide resolved
<i18n>
{
"en": {
"message": "Open the <slot>faq-link</slot> page."
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cool... similar to react-i18next named tags => https://react.i18next.com/latest/trans-component
image

Copy link
Member

@kkuegler kkuegler left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, thanks for the contribution!

I added a few nitpicks here and there :)

README.md Outdated Show resolved Hide resolved
index.ts Outdated Show resolved Hide resolved
index.ts Outdated Show resolved Hide resolved
index.ts Outdated
@@ -5,6 +5,10 @@ declare module 'vue' {
interface ComponentCustomProperties {
$t: TFunction;
$i18next: i18n;
// Optional custom pattern for matching slot start of the `TranslationComponent. Internal.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To me it seems better to not have these internal properties be part of the public ComponentCustomProperties type, as I can't think of a use-case for them in user components, We can just use the internal propertie(s) without declaring them.

index.ts Outdated Show resolved Hide resolved
index.ts Outdated Show resolved Hide resolved
@YehorPytomets
Copy link
Contributor Author

@kkuegler, PTAL again.

@kkuegler
Copy link
Member

Looks good. Thanks again for your PR!

@kkuegler kkuegler merged commit 06b4e8c into i18next:main Jun 28, 2023
@YehorPytomets YehorPytomets deleted the custom-slot-name-braces branch June 29, 2023 11:31
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

Successfully merging this pull request may close these issues.

3 participants