wcz-layout
Version:
31 lines (21 loc) • 3.13 kB
Markdown
File HTTP streaming, signed URL
# Internationalization (attach template project)
Read https://tanstack.com/router/latest/docs/guide/internationalization-i18n
Please research on what works best with tanstack-start (i18n or Paraglide) and implement that.
I'm about to raise a major version, so don't be afraid of big architecture change. I'm into the best tool for my use-case.
What I need:
- SSR implementation to tanstack-start (correct hydratation).
- Browser language detection.
- In `LayoutProvider` I'd like to set that language correctly into `zod`, `dayjs` and `LocalizationProvider`.
- It would be great, if user changing the language would not refresh the state (for example half-written form), but also change immediately the three libraries language.
- Be able to get user language on server (for example if I send some mail on server, it can be written in user selected language.)
- Because this is library published on npm, it would be nice if I would be able to merge locale translation keys with this project and the project where this library will be. So in `src/lib/locales` there is "Layout" object - which is just used in this project, but right now this object must be manully copied to any other project, otherwise the layout will show no translation. I would like to get rid of needing this particular object in template (keep it only in this project). But project specific translation keys will be in the same file in that particular project.
- Keep typesafety, right now it's only for English in `src/types/i18next`. If possible, expand to all available languages in `src/lib/locales/*`.
- Add into general skill, if user want's another language, here are some instructions, and put under references the language. It will be about the project as I have template. So adding file into `src/lib/locales/*` should automatically refresh the server and new language will show up, then I needs to be added in `useTheme` and also in `__root.tsx` for dayjs. I think that's it (with current implementation, before you've made some changes - but please try to keep it simple, do the logic mostly in here in layout - to have shared config across all apps).
# Environment variables
Read https://tanstack.com/start/latest/docs/framework/react/guide/environment-variables#runtime-validation
Please research if I can replace `@t3-oss/env-core` in `src/env.ts` with this tanstack-start & zod native approach.
It would be nice to keep current typesafety + runtime validation, while shrinking the dependency list. This package is still in 0.x.x version anyway, it's not even first major.
Note that there is one catch that in that. This project is public npm library and has it's own environments. That's why currently I have for example `AI_BASE_URL` optional, because as it was built and installed in template project, the project itself doesn't need that, but this library needs it for some page functionality. So the thing is, that every project should have it's own required environment variables.
# Material UI 10
One of the changes (instead of "react-number-format"): https://mui.com/material-ui/react-number-field/