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.

Sign up for GitHub

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

Jump to bottom

Fetch translation file from filesystem directly #2053

Draft
wants to merge 1 commit into
base: create-use-app-origin-hook
Choose a base branch
from
Draft

Fetch translation file from filesystem directly #2053

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 17 additions & 2 deletions packages/template-retail-react-app/app/utils/locale.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,16 +17,31 @@ import fetch from 'cross-fetch'
* @returns {Promise<Object>} The messages (compiled in AST format) in the given locale.
* If the translation file is not found, return an empty object (so react-intl would fall back to the inline messages)
*/
export const fetchTranslations = async (locale) => {
export const fetchTranslations = async (locale, origin) => {
const targetLocale =
typeof window === 'undefined'
? process.env.USE_PSEUDOLOCALE === 'true'
? 'en-XA'
: locale
: locale

const isServerSide = typeof window === 'undefined'

try {
const file = `${getAppOrigin()}${getAssetUrl(
if (isServerSide && process.env.NODE_ENV === 'production') {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

FYI currently, fetchTranslations is called only on the server side. So this is the if-condition that will be reached.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

We called the fetchTranslations from within the App component. See

pwa-kit/packages/template-retail-react-app/app/components/_app/index.jsx

Line 169 in 88361bb

return fetchTranslations(targetLocale)

// Fetch from the filesystem directly
const _require = eval('require')
console.log(
'--- trying to get translation file',
`./static/translations/compiled/${targetLocale}.json`
)
const json = _require(`./static/translations/compiled/${targetLocale}.json`)
console.log('--- resulting json', json)
return json
}

// Otherwise, fetch from the network
const file = `${origin || getAppOrigin()}${getAssetUrl(
`static/translations/compiled/${targetLocale}.json`
)}`
const response = await fetch(file)
Expand Down
Loading