Make it easier to evolve by treating the locale like a regular depend…

…ency

Refs #1817, #1834, f256f32

src/home-page/home-page.ts

@@ -6,7 +6,7 @@ import rtlDetect from 'rtl-detect'
 import { match } from 'ts-pattern'
 import { getClubName } from '../club-details.js'
 import { type Html, html, plainText, rawHtml } from '../html.js'
-import { translate } from '../locales/index.js'
+import { type SupportedLocale, translate } from '../locales/index.js'
 import * as assets from '../manifest.json'
 import { PageResponse } from '../response.js'
 import {
@@ -27,19 +27,21 @@ import type { RecentReviewRequest } from './recent-review-requests.js'
 export const createPage = ({
  canRequestReviews,
  canSeeGatesLogo,
+ locale,
  recentPrereviews,
  recentReviewRequests,
  statistics,
 }: {
  canRequestReviews: boolean
  canSeeGatesLogo: boolean
+ locale: SupportedLocale
  recentPrereviews: ReadonlyArray<RecentPrereview>
  recentReviewRequests: ReadonlyArray<RecentReviewRequest>
  statistics: { prereviews: number; servers: number; users: number }
 }) =>
  PageResponse({
- title: locale => plainText`PREreview: ${translate(locale, 'home-page', 'slogan')({ swoosh: identity })}`,
- main: locale => html`
+ title: plainText`PREreview: ${translate(locale, 'home-page', 'slogan')({ swoosh: identity })}`,
+ main: html`
  <div class="hero">
  <h1>${rawHtml(translate(locale, 'home-page', 'slogan')({ swoosh: text => `<em>${text}</em>` }))}</h1>
  <p>${translate(locale, 'home-page', 'heroText')()}</p>

src/home-page/index.ts

@@ -6,6 +6,7 @@ import {
  canRequestReviews,
  canSeeGatesLogo,
 } from '../feature-flags.js'
+import type { SupportedLocale } from '../locales/index.js'
 import type { PageResponse } from '../response.js'
 import type { User } from '../user.js'
 import { createPage } from './home-page.js'
@@ -16,8 +17,10 @@ export { type RecentPrereview } from './recent-prereviews.js'
 export { type RecentReviewRequest } from './recent-review-requests.js'
 
 export const home = ({
+ locale,
  user,
 }: {
+ locale: SupportedLocale
  user?: User
 }): RT.ReaderTask<
  CanRequestReviewsEnv & GetRecentPrereviewsEnv & GetRecentReviewRequestsEnv & CanSeeGatesLogoEnv,
@@ -30,5 +33,6 @@ export const home = ({
  RT.apSW('canSeeGatesLogo', RT.fromReader(canSeeGatesLogo)),
  RT.apSW('recentReviewRequests', getRecentReviewRequests()),
  RT.let('statistics', () => ({ prereviews: 931, servers: 24, users: 2834 })),
+ RT.let('locale', () => locale),
  RT.map(createPage),
  )

src/router.ts

@@ -94,6 +94,7 @@ import {
  isLegacyCompatiblePrereview,
 } from './legacy-prereview.js'
 import { liveReviews } from './live-reviews.js'
+import { DefaultLocale } from './locales/index.js'
 import {
  type IsUserBlockedEnv,
  type OrcidOAuthEnv,
@@ -437,6 +438,7 @@ const router: P.Parser<RM.ReaderMiddleware<RouterEnv, StatusOpen, ResponseEnded,
  pipe(
  RM.of({}),
  RM.apS('user', maybeGetUser),
+ RM.apS('locale', RM.of(DefaultLocale)),
  RM.bindW('response', RM.fromReaderTaskK(home)),
  RM.ichainW(handleResponse),
  ),

test/fc.ts

@@ -27,6 +27,7 @@ import {
 } from 'node-mocks-http'
 import { type Orcid, isOrcid } from 'orcid-id-ts'
 import { type Uuid, isUuid } from 'uuid-ts'
+import type { SupportedLocale } from '../assets/locales/index.js'
 import type {
  AssignedAuthorInvite,
  AuthorInvite,
@@ -47,6 +48,7 @@ import type { Email } from '../src/email.js'
 import { type Html, type PlainText, sanitizeHtml, html as toHtml, plainText as toPlainText } from '../src/html.js'
 import type { IsOpenForRequests } from '../src/is-open-for-requests.js'
 import type { Languages } from '../src/languages.js'
+import { DefaultLocale } from '../src/locales/index.js'
 import type { Location } from '../src/location.js'
 import * as assets from '../src/manifest.json'
 import type { OrcidToken } from '../src/orcid-token.js'
@@ -250,6 +252,8 @@ export const locale = (): fc.Arbitrary<string> =>
  'zh-Hans-CN',
  )
 
+export const supportedLocale = (): fc.Arbitrary<SupportedLocale> => constant(DefaultLocale)
+
 export const pageResponse = ({
  canonical,
  status,

test/home-page/home.test.ts

@@ -8,12 +8,12 @@ import * as _ from '../../src/home-page/index.js'
 import { homeMatch } from '../../src/routes.js'
 import * as fc from '../fc.js'
 
-test.prop([fc.option(fc.user(), { nil: undefined }), fc.boolean(), fc.boolean()])(
+test.prop([fc.supportedLocale(), fc.option(fc.user(), { nil: undefined }), fc.boolean(), fc.boolean()])(
  'home',
- async (user, canUserRequestReviews, canSeeGatesLogo) => {
+ async (locale, user, canUserRequestReviews, canSeeGatesLogo) => {
  const canRequestReviews = jest.fn<CanRequestReviewsEnv['canRequestReviews']>(_ => canUserRequestReviews)
 
- const actual = await _.home({ user })({
+ const actual = await _.home({ locale, user })({
  getRecentPrereviews: () => T.of([]),
  canRequestReviews,
  canSeeGatesLogo,
@@ -25,8 +25,8 @@ test.prop([fc.option(fc.user(), { nil: undefined }), fc.boolean(), fc.boolean()]
  canonical: format(homeMatch.formatter, {}),
  current: 'home',
  status: Status.OK,
- title: expect.any(Function),
- main: expect.any(Function),
+ title: expect.stringContaining('PREreview'),
+ main: expect.anything(),
  skipToLabel: 'main',
  js: [],
  })

visual-regression/home-page/home-page.spec.ts

@@ -1,5 +1,6 @@
 import { Temporal } from '@js-temporal/polyfill'
 import type { Doi } from 'doi-ts'
+import { DefaultLocale } from '../../assets/locales/index.js'
 import { createPage } from '../../src/home-page/home-page.js'
 import type { RecentPrereview } from '../../src/home-page/index.js'
 import type { RecentReviewRequest } from '../../src/home-page/recent-review-requests.js'
@@ -21,6 +22,7 @@ test('content looks right', async ({ showPage }) => {
  recentReviewRequest5,
  ],
  statistics,
+ locale: DefaultLocale,
  })
 
  const content = await showPage(response)
@@ -35,6 +37,7 @@ test('content looks right when empty', async ({ showPage }) => {
  canSeeGatesLogo: false,
  recentReviewRequests: [],
  statistics,
+ locale: DefaultLocale,
  })
 
  const content = await showPage(response)
@@ -49,6 +52,7 @@ test('content looks right when reviews can be requested', async ({ showPage }) =
  canSeeGatesLogo: false,
  recentReviewRequests: [recentReviewRequest1],
  statistics,
+ locale: DefaultLocale,
  })
 
  const content = await showPage(response)