Extract strings for carry-on-page

Refs: #1817
PREreview · Dec 6, 2024 · ee56370 · ee56370
1 parent 8b1baa9
commit ee56370
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 14 deletions.
diff --git a/locales/en-US/write-review.json b/locales/en-US/write-review.json
@@ -253,5 +253,14 @@
   },
   "sureYouWantToRemove": {
     "message": "Are you sure you want to remove {authorName}?"
+  },
+  "writeAPrereview": {
+    "message": "Write a PREreview"
+  },
+  "continueWord": {
+    "message": "Continue"
+  },
+  "asYouHaveAlreadyStarted": {
+    "message": "As you’ve already started a PREreview of <cite>{preprintTitle}</cite>, we’ll take you to the next step so you can carry&nbsp;on."
   }
 }
diff --git a/src/write-review/start-page/carry-on-page.ts b/src/write-review/start-page/carry-on-page.ts
@@ -1,29 +1,40 @@
 import { format } from 'fp-ts-routing'
 import rtlDetect from 'rtl-detect'
-import { html, plainText } from '../../html.js'
+import { html, plainText, rawHtml } from '../../html.js'
+import { translate, type SupportedLocale } from '../../locales/index.js'
 import type { PreprintTitle } from '../../preprint.js'
 import { StreamlinePageResponse } from '../../response.js'
 import { preprintReviewsMatch, writeReviewStartMatch } from '../../routes.js'
-import { type Form, nextFormMatch } from '../form.js'
+import { nextFormMatch, type Form } from '../form.js'
 
-export const carryOnPage = (preprint: PreprintTitle, form: Form) =>
-  StreamlinePageResponse({
-    title: plainText`Write a PREreview`,
+const cite = (lang: PreprintTitle['language']) => (text: string) =>
+  `<cite lang="${lang}" dir="${rtlDetect.getLangDir(lang)}">${text}</cite>`
+
+export const carryOnPage = (preprint: PreprintTitle, form: Form, locale: SupportedLocale) => {
+  const t = translate(locale)
+  return StreamlinePageResponse({
+    title: plainText`${t('write-review', 'writeAPrereview')()}`,
     nav: html`
-      <a href="${format(preprintReviewsMatch.formatter, { id: preprint.id })}" class="back">Back to preprint</a>
+      <a href="${format(preprintReviewsMatch.formatter, { id: preprint.id })}" class="back"
+        >${t('write-review', 'backToPreprint')()}</a
+      >
     `,
     main: html`
-      <h1>Write a PREreview</h1>
+      <h1>${t('write-review', 'writeAPrereview')()}</h1>
 
       <p>
-        As you’ve already started a PREreview of
-        <cite lang="${preprint.language}" dir="${rtlDetect.getLangDir(preprint.language)}">${preprint.title}</cite>,
-        we’ll take you to the next step so you can carry&nbsp;on.
+        ${rawHtml(
+          t(
+            'write-review',
+            'asYouHaveAlreadyStarted',
+          )({ preprintTitle: preprint.title.toString(), cite: cite(preprint.language) }),
+        )}
       </p>
 
       <a href="${format(nextFormMatch(form).formatter, { id: preprint.id })}" role="button" draggable="false"
-        >Continue</a
+        >${t('write-review', 'continueWord')()}</a
       >
     `,
     canonical: format(writeReviewStartMatch.formatter, { id: preprint.id }),
   })
+}
diff --git a/src/write-review/start-page/index.ts b/src/write-review/start-page/index.ts
@@ -4,6 +4,7 @@ import * as RTE from 'fp-ts/lib/ReaderTaskEither.js'
 import { pipe } from 'fp-ts/lib/function.js'
 import { P, match } from 'ts-pattern'
 import { havingProblemsPage, pageNotFound } from '../../http-error.js'
+import { DefaultLocale } from '../../locales/index.js'
 import { type GetPreprintEnv, getPreprint } from '../../preprint.js'
 import { LogInResponse, type PageResponse, RedirectResponse, type StreamlinePageResponse } from '../../response.js'
 import { writeReviewReviewTypeMatch, writeReviewStartMatch } from '../../routes.js'
@@ -42,6 +43,7 @@ export const writeReviewStart = ({
             pipe(RTE.fromNullable('no-session' as const)(user), RTE.chainEitherKW(ensureUserIsNotAnAuthor(preprint))),
           ),
           RTE.bindW('form', ({ user }) => getForm(user.orcid, preprint.id)),
+          RTE.apS('locale', RTE.of(DefaultLocale)),
           RTE.matchW(
             error =>
               match(error)
@@ -54,8 +56,12 @@ export const writeReviewStart = ({
                 )
                 .with('form-unavailable', P.instanceOf(Error), () => havingProblemsPage)
                 .exhaustive(),
-            ({ form }) =>
-              carryOnPage({ id: preprint.id, language: preprint.title.language, title: preprint.title.text }, form),
+            ({ form, locale }) =>
+              carryOnPage(
+                { id: preprint.id, language: preprint.title.language, title: preprint.title.text },
+                form,
+                locale,
+              ),
           ),
         ),
     ),

diff --git a/visual-regression/write-review/write-review-start.spec.ts b/visual-regression/write-review/write-review-start.spec.ts
@@ -1,12 +1,13 @@
 import { Doi } from 'doi-ts'
 import { html } from '../../src/html.js'
+import { DefaultLocale } from '../../src/locales/index.js'
 import type { PreprintTitle } from '../../src/preprint.js'
 import type { Form } from '../../src/write-review/form.js'
 import { carryOnPage } from '../../src/write-review/start-page/carry-on-page.js'
 import { expect, test } from '../base.js'
 
 test('content looks right', async ({ showPage }) => {
-  const response = carryOnPage(preprint, form)
+  const response = carryOnPage(preprint, form, DefaultLocale)
 
   const content = await showPage(response)