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

feat: Add type safety for timeZone parameter #359

Merged
merged 15 commits into from
Jun 29, 2023

Conversation

AhmedBaset
Copy link
Contributor

@AhmedBaset AhmedBaset commented Jun 27, 2023

This PR introduces type safety for the timeZone parameter instead of using string as the type. It enhances the developer experience by ensuring that only valid time zone values are accepted and providing better code completion and type-checking support.

Changes Made:

  • Create a TimeZone type that is a union of all valid time zone values in /use-intl/src/core/utils/TimeZones.tsx
  • Update the timeZone parameter in these files:
    • IntlConfig
    • DateTimeFormatOptions
    • createFormatter
    • convertFormatsToIntlMessageFormats

Data Source:

Time zone values sourced from tz database.

@vercel
Copy link

vercel bot commented Jun 27, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
example-next-13-next-auth ✅ Ready (Inspect) Visit Preview 💬 Add feedback Mar 19, 2024 3:06pm
next-intl-docs ❌ Failed (Inspect) Mar 19, 2024 3:06pm
next-intl-example-next-13 ✅ Ready (Inspect) Visit Preview 💬 Add feedback Mar 19, 2024 3:06pm

@vercel
Copy link

vercel bot commented Jun 27, 2023

@A7med3bdulBaset is attempting to deploy a commit to the next-intl Team on Vercel.

A member of the Team first needs to authorize it.

Copy link
Owner

@amannn amannn left a comment

Choose a reason for hiding this comment

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

Hey and many thanks for this PR! This is a great DX improvement! 🙌

I've added a few nits, also I think CI isn't passing yet. I've just approved the main workflow, please have a look in regard to failed linting and type checking!

packages/use-intl/src/core/DateTimeFormatOptions.tsx Outdated Show resolved Hide resolved
| "UTC"
| "W-SU"
| "WET"
| "Zulu";
Copy link
Owner

Choose a reason for hiding this comment

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

I'm wondering if we should allow unknown strings here too (see this trick).

The benefit of allowing unknown strings is that we don't have to publish a new version in case our list gets outdated. This might even be critical for users on outdated versions, if we've released breaking changes in the meantime, otherwise we'd have to backport changed time zones. AFAIK React does this too, e.g. for ARIA roles.

The downside is of course that we don't fail for invalid time zones.

However, JavaScript runtimes throw an error for unknown time zones:

Screenshot 2023-06-28 at 17 09 31

(I've supplied "Unknown" in this example)

Therefore, I'd say we should support unknown strings.

import useIntlContext from './useIntlContext';

export default function useTimeZone() {
export default function useTimeZone(): TimeZone {
Copy link
Owner

Choose a reason for hiding this comment

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

The return type is wrong, also undefined is allowed. Better just let TypeScript infer the return type and don't annotate it additionally!

@AhmedBaset
Copy link
Contributor Author

AhmedBaset commented Jun 28, 2023

TODOs:

  • Check failed CI
  • Move out of utils
  • Use default export/import
  • Rename the file to match the import name
  • Allow unknown strings
  • Remove return type

Since You are using spaces for indentation not tabs, and no space inside curly braces, I think this is the best way to go. In general, It's OPEN-SOURCE, so We have to have a consistent config file
🔴 Move out of utils
🔴 Use default export/import
🔴 Rename file to be singular
🔴 Allow unknown strings
- Change import to default
- fix linting errors
- Change import to default
- Edit import path to exclude `utils`
- fix linting errors
- Change import to default
- Edit import path to exclude `utils`
- fix linting errors
- Change import to default
- Edit import path to exclude `utils`
- fix linting errors
@AhmedBaset
Copy link
Contributor Author

AhmedBaset commented Jun 28, 2023

All Done and Ready for Review
All CI checks passed! other than the Vercel deployment, which requires an authorized user to approve.

I ran locally

pnpm build && pnpm lint && pnpm test

and all tests passed.

Copy link
Owner

@amannn amannn left a comment

Choose a reason for hiding this comment

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

Looks fantastic, thank you so much! 🙌

I've left one minor note about the prettier configs. If you could remove them, we can merge this PR!

packages/next-intl/prettier.config.js Outdated Show resolved Hide resolved
@AhmedBaset AhmedBaset requested a review from amannn June 29, 2023 11:59
@amannn
Copy link
Owner

amannn commented Jun 29, 2023

Looks great, will be released in a minute!

Are you interested in adopting this in the RSC support branch as well (e.g. i18n.ts)?

@AhmedBaset
Copy link
Contributor Author

Are you interested in adopting this in the RSC support branch as well (e.g. i18n.ts)?

WIP

@AhmedBaset
Copy link
Contributor Author

AhmedBaset commented Jun 29, 2023

It seems like Eslint doesn't have configurations for .tsx files

Alert

I still propose to include config files for formatting, linting, and settings. In the final It's OPEN-source. Also, in the .gitignore file we should remove .vscode from ignored files.

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.

2 participants