Remove duplication

Refs #1834
PREreview · Aug 5, 2024 · cebb8d8 · cebb8d8
1 parent 7d7e70d
commit cebb8d8
Show file tree

Hide file tree

Showing 3 changed files with 85 additions and 75 deletions.
diff --git a/src/response.ts b/src/response.ts
@@ -19,7 +19,7 @@ import { type Page, type TemplatePageEnv, templatePage } from './page.js'
 import { type PublicUrlEnv, toUrl } from './public-url.js'
 import { orcidCodeMatch } from './routes.js'
 import { isCacheable } from './status-code.js'
-import { type GetUserOnboardingEnv, maybeGetUserOnboarding } from './user-onboarding.js'
+import { type GetUserOnboardingEnv, type UserOnboarding, maybeGetUserOnboarding } from './user-onboarding.js'
 import type { User } from './user.js'
 
 export type Response =
@@ -162,6 +162,62 @@ const FlashMessageD = D.literal(
  'avatar-removed',
 )
 
+export const toPage = ({
+ locale = DefaultLocale,
+ message,
+ userOnboarding,
+ response,
+ user,
+}: {
+ locale?: SupportedLocale
+ message?: D.TypeOf<typeof FlashMessageD>
+ userOnboarding?: UserOnboarding
+ response: PageResponse | StreamlinePageResponse | TwoUpPageResponse
+ user?: User | undefined
+}): Page =>
+ response._tag === 'TwoUpPageResponse'
+ ? {
+ // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+ locale: locale !== DefaultLocale ? locale : undefined,
+ title: response.title,
+ description: response.description,
+ content: html`
+ <h1 class="visually-hidden">${response.h1}</h1>
+
+ <aside id="preprint-details" tabindex="0" aria-label="Preprint details">${response.aside}</aside>
+
+ <main id="prereviews">${message ? showFlashMessage(message, locale) : ''} ${response.main}</main>
+ `,
+ skipLinks: [
+ [html`Skip to preprint details`, '#preprint-details'],
+ [html`Skip to PREreviews`, '#prereviews'],
+ ],
+ js: message ? (['notification-banner.js'] as const) : [],
+ type: 'two-up',
+ user,
+ userOnboarding,
+ }
+ : {
+ // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+ locale: locale !== DefaultLocale ? locale : undefined,
+ title: response.title,
+ description: response.description,
+ content: html`
+ ${response.nav ? html` <nav>${response.nav}</nav>` : ''}
+
+ <main id="${response.skipToLabel}">${message ? showFlashMessage(message, locale) : ''}${response.main}</main>
+ `,
+ skipLinks: [
+ [rawHtml(translate(locale, 'skip-links', response.skipToLabel)()), `#${response.skipToLabel}`],
+ ...(response._tag === 'PageResponse' && response.extraSkipLink ? [response.extraSkipLink] : []),
+ ],
+ current: response.current,
+ js: response.js.concat(...(message ? (['notification-banner.js'] as const) : [])),
+ type: response._tag === 'StreamlinePageResponse' ? 'streamline' : undefined,
+ user,
+ userOnboarding,
+ }
+
 export const handlePageResponse = ({
  response,
  user,
@@ -195,29 +251,8 @@ export const handlePageResponse = ({
  ),
  RM.bindW(
  'body',
- RM.fromReaderK(({ locale, message, userOnboarding }) =>
- templatePage({
- // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
- locale: locale !== DefaultLocale ? locale : undefined,
- title: response.title,
- description: response.description,
- content: html`
- ${response.nav ? html` <nav>${response.nav}</nav>` : ''}
-
- <main id="${response.skipToLabel}">
- ${message ? showFlashMessage(message, locale) : ''} ${response.main}
- </main>
- `,
- skipLinks: [
- [rawHtml(translate(locale, 'skip-links', response.skipToLabel)()), `#${response.skipToLabel}`],
- ...(response._tag === 'PageResponse' && response.extraSkipLink ? [response.extraSkipLink] : []),
- ],
- current: response.current,
- js: response.js.concat(...(message ? (['notification-banner.js'] as const) : [])),
- type: response._tag === 'StreamlinePageResponse' ? 'streamline' : undefined,
- user,
- userOnboarding,
- }),
+ RM.fromReaderK(({ locale, userOnboarding, message }) =>
+ templatePage(toPage({ locale, userOnboarding, message, response, user })),
  ),
  ),
  RM.ichainFirst(() => RM.status(response.status)),
@@ -277,28 +312,16 @@ const handleTwoUpPageResponse = ({
  ),
  RM.bindW(
  'body',
- RM.fromReaderK(({ locale, message, userOnboarding }) =>
- templatePage({
- // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
- locale: locale !== DefaultLocale ? locale : undefined,
- title: response.title,
- description: response.description,
- content: html`
- <h1 class="visually-hidden">${response.h1}</h1>
-
- <aside id="preprint-details" tabindex="0" aria-label="Preprint details">${response.aside}</aside>
-
- <main id="prereviews">${message ? showFlashMessage(message, locale) : ''} ${response.main}</main>
- `,
- skipLinks: [
- [html`Skip to preprint details`, '#preprint-details'],
- [html`Skip to PREreviews`, '#prereviews'],
- ],
- js: message ? (['notification-banner.js'] as const) : [],
- type: 'two-up',
- user,
- userOnboarding,
- }),
+ RM.fromReaderK(({ locale, userOnboarding, message }) =>
+ templatePage(
+ toPage({
+ locale,
+ userOnboarding,
+ message,
+ response,
+ user,
+ }),
+ ),
  ),
  ),
  RM.ichainFirst(() => RM.status(Status.OK)),

diff --git a/visual-regression/base.ts b/visual-regression/base.ts
@@ -1,16 +1,16 @@
 import { type Locator, test as baseTest } from '@playwright/test'
 import path from 'path'
 import { P, match } from 'ts-pattern'
-import { type Html, html } from '../src/html.js'
+import type { Html } from '../src/html.js'
 import { type Page, page as templatePage } from '../src/page.js'
-import type { PageResponse, StreamlinePageResponse, TwoUpPageResponse } from '../src/response.js'
+import { PageResponse, type StreamlinePageResponse, type TwoUpPageResponse, toPage } from '../src/response.js'
 
 export { expect } from '@playwright/test'
 
 interface ShowPage {
  showPage(
  response: PageResponse | StreamlinePageResponse,
- extra?: Pick<Page, 'skipLinks' | 'user' | 'userOnboarding'>,
+ extra?: Omit<Partial<Parameters<typeof toPage>[0]>, 'response'>,
  ): Promise<Locator>
 
  showTwoUpPage(response: TwoUpPageResponse): Promise<[Locator, Locator]>
@@ -44,18 +44,17 @@ export const test = baseTest.extend<ShowPage>({
  },
  showPage: async ({ page, showHtml, templatePage }, use) => {
  await use(async function showPage(response, extra = {}) {
- const content = html`
- ${response.nav ? html` <nav>${response.nav}</nav>` : ''}
-
- <main id="${response.skipToLabel}">${response.main}</main>
- `
-
- const pageHtml = templatePage({
- ...extra,
- content,
- title: response.title,
- js: response.js,
- })
+ const pageHtml = templatePage(
+ toPage({
+ ...extra,
+ response: PageResponse({
+ title: response.title,
+ main: response.main,
+ nav: response.nav,
+ js: response.js,
+ }),
+ }),
+ )
 
  await showHtml(pageHtml)
 
@@ -64,19 +63,7 @@ export const test = baseTest.extend<ShowPage>({
  },
  showTwoUpPage: async ({ page, showHtml, templatePage }, use) => {
  await use(async response => {
- const content = html`
- <h1 class="visually-hidden">${response.h1}</h1>
-
- <aside id="preprint-details" tabindex="0" aria-label="Preprint details">${response.aside}</aside>
-
- <main id="prereviews">${response.main}</main>
- `
-
- const pageHtml = templatePage({
- content,
- title: response.title,
- type: 'two-up',
- })
+ const pageHtml = templatePage(toPage({ response }))
 
  await showHtml(pageHtml)
 

diff --git a/visual-regression/skip-link.spec.ts b/visual-regression/skip-link.spec.ts
@@ -8,7 +8,7 @@ test('visibly hidden when not focussed', async ({ showPage }) => {
  title: plainText('Something'),
  })
 
- const content = await showPage(response, { skipLinks: [[html`Skip to main content`, `#${response.skipToLabel}`]] })
+ const content = await showPage(response)
  const page = content.page()
 
  const skipLink = page.getByRole('link', { name: 'Skip to main content' })