diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/i18n/en.json | 4 | ||||
| -rw-r--r-- | src/i18n/fr.json | 4 | ||||
| -rw-r--r-- | src/pages/contact.tsx | 88 | ||||
| -rw-r--r-- | src/services/graphql/mutators/send-email.test.ts | 23 | ||||
| -rw-r--r-- | src/services/graphql/mutators/send-email.ts | 31 | ||||
| -rw-r--r-- | src/types/index.ts | 1 | ||||
| -rw-r--r-- | src/types/swr.ts | 5 |
7 files changed, 80 insertions, 76 deletions
diff --git a/src/i18n/en.json b/src/i18n/en.json index 820902b..248c7db 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -187,10 +187,6 @@ "defaultMessage": "Comment:", "description": "CommentForm: comment label" }, - "AN9iy7": { - "defaultMessage": "Contact", - "description": "ContactPage: page title" - }, "AXe1Iz": { "defaultMessage": "Pagination", "description": "BlogPage: pagination accessible name" diff --git a/src/i18n/fr.json b/src/i18n/fr.json index 3628763..4e8da8e 100644 --- a/src/i18n/fr.json +++ b/src/i18n/fr.json @@ -187,10 +187,6 @@ "defaultMessage": "Commentaire :", "description": "CommentForm: comment label" }, - "AN9iy7": { - "defaultMessage": "Contact", - "description": "ContactPage: page title" - }, "AXe1Iz": { "defaultMessage": "Pagination", "description": "BlogPage: pagination accessible name" diff --git a/src/pages/contact.tsx b/src/pages/contact.tsx index b10d161..9394ee8 100644 --- a/src/pages/contact.tsx +++ b/src/pages/contact.tsx @@ -1,7 +1,5 @@ -/* eslint-disable max-statements */ import type { GetStaticProps } from 'next'; import Head from 'next/head'; -import { useRouter } from 'next/router'; import Script from 'next/script'; import { useCallback } from 'react'; import { useIntl } from 'react-intl'; @@ -17,7 +15,7 @@ import { PageSidebar, } from '../components'; import { meta } from '../content/pages/contact.mdx'; -import { sendMail } from '../services/graphql'; +import { sendEmail } from '../services/graphql'; import type { NextPageWithLayout } from '../types'; import { CONFIG } from '../utils/config'; import { ROUTES } from '../utils/constants'; @@ -37,22 +35,42 @@ const ContactPage: NextPageWithLayout = () => { url: ROUTES.CONTACT, }); - const pageTitle = intl.formatMessage({ - defaultMessage: 'Contact', - description: 'ContactPage: page title', - id: 'AN9iy7', - }); - const socialMediaTitle = intl.formatMessage({ - defaultMessage: 'Find me elsewhere', - description: 'ContactPage: social media widget title', - id: 'Qh2CwH', - }); + const messages = { + form: intl.formatMessage({ + defaultMessage: 'Contact form', + description: 'Contact: form accessible name', + id: 'bPv0VG', + }), + widgets: { + socialMedia: { + github: intl.formatMessage({ + defaultMessage: 'Github profile', + description: 'ContactPage: Github profile link', + id: '75FYp7', + }), + gitlab: intl.formatMessage({ + defaultMessage: 'Gitlab profile', + description: 'ContactPage: Gitlab profile link', + id: '1V3CJf', + }), + linkedIn: intl.formatMessage({ + defaultMessage: 'LinkedIn profile', + description: 'ContactPage: LinkedIn profile link', + id: 'Q3oEQn', + }), + title: intl.formatMessage({ + defaultMessage: 'Find me elsewhere', + description: 'ContactPage: social media widget title', + id: 'Qh2CwH', + }), + }, + }, + }; - const { asPath } = useRouter(); const webpageSchema = getWebPageSchema({ description: seo.description, locale: CONFIG.locales.defaultLocale, - slug: asPath, + slug: ROUTES.CONTACT, title: seo.title, updateDate: dates.update, }); @@ -62,30 +80,10 @@ const ContactPage: NextPageWithLayout = () => { id: 'contact', kind: 'contact', locale: CONFIG.locales.defaultLocale, - slug: asPath, + slug: ROUTES.CONTACT, title, }); const schemaJsonLd = getSchemaJson([webpageSchema, contactSchema]); - const githubLabel = intl.formatMessage({ - defaultMessage: 'Github profile', - description: 'ContactPage: Github profile link', - id: '75FYp7', - }); - const gitlabLabel = intl.formatMessage({ - defaultMessage: 'Gitlab profile', - description: 'ContactPage: Gitlab profile link', - id: '1V3CJf', - }); - const linkedinLabel = intl.formatMessage({ - defaultMessage: 'LinkedIn profile', - description: 'ContactPage: LinkedIn profile link', - id: 'Q3oEQn', - }); - const formName = intl.formatMessage({ - defaultMessage: 'Contact form', - description: 'Contact: form accessible name', - id: 'bPv0VG', - }); const submitMail: ContactFormSubmit = useCallback( async ({ email, message, name, object }) => { @@ -98,7 +96,7 @@ const ContactPage: NextPageWithLayout = () => { replyTo, subject: object, }; - const { message: mutationMessage, sent } = await sendMail(mailData); + const { message: mutationMessage, sent } = await sendEmail(mailData); if (sent) { return { @@ -129,7 +127,7 @@ const ContactPage: NextPageWithLayout = () => { ); const page = { title: `${seo.title} - ${CONFIG.name}`, - url: `${CONFIG.url}${asPath}`, + url: `${CONFIG.url}${ROUTES.CONTACT}`, }; return ( @@ -156,34 +154,32 @@ const ContactPage: NextPageWithLayout = () => { id="schema-breadcrumb" type="application/ld+json" /> - <PageHeader heading={pageTitle} intro={intro} /> + <PageHeader heading={title} intro={intro} /> <PageBody> - <ContactForm aria-label={formName} onSubmit={submitMail} /> + <ContactForm aria-label={messages.form} onSubmit={submitMail} /> </PageBody> <PageSidebar> <SocialMediaWidget heading={ - <Heading isFake level={3}> - {socialMediaTitle} - </Heading> + <Heading level={2}>{messages.widgets.socialMedia.title}</Heading> } media={[ { icon: 'Github', id: 'github', - label: githubLabel, + label: messages.widgets.socialMedia.github, url: 'https://github.com/ArmandPhilippot', }, { icon: 'Gitlab', id: 'gitlab', - label: gitlabLabel, + label: messages.widgets.socialMedia.gitlab, url: 'https://gitlab.com/ArmandPhilippot', }, { icon: 'LinkedIn', id: 'linkedin', - label: linkedinLabel, + label: messages.widgets.socialMedia.linkedIn, url: 'https://www.linkedin.com/in/armandphilippot', }, ]} diff --git a/src/services/graphql/mutators/send-email.test.ts b/src/services/graphql/mutators/send-email.test.ts new file mode 100644 index 0000000..dbba7ad --- /dev/null +++ b/src/services/graphql/mutators/send-email.test.ts @@ -0,0 +1,23 @@ +import { describe, expect, it } from '@jest/globals'; +import { type SendEmailInput, sendEmail } from './send-email'; + +describe('send-email', () => { + it('successfully sends an email', async () => { + const email: SendEmailInput = { + body: 'Natus soluta et.', + clientMutationId: 'qui', + replyTo: 'Nina.Jerde@example.net', + subject: 'quaerat odio veritatis', + }; + const result = await sendEmail(email); + + // eslint-disable-next-line @typescript-eslint/no-magic-numbers + expect.assertions(5); + + expect(result.clientMutationId).toBe(email.clientMutationId); + expect(result.message).toBeDefined(); + expect(result.origin).toBeDefined(); + expect(result.replyTo).toBe(email.replyTo); + expect(result.sent).toBe(true); + }); +}); diff --git a/src/services/graphql/mutators/send-email.ts b/src/services/graphql/mutators/send-email.ts index 45b6fca..82c974b 100644 --- a/src/services/graphql/mutators/send-email.ts +++ b/src/services/graphql/mutators/send-email.ts @@ -1,21 +1,20 @@ -import { fetchGraphQL, getGraphQLUrl } from 'src/utils/helpers'; +import type { Nullable } from '../../../types'; +import { fetchGraphQL, getGraphQLUrl } from '../../../utils/helpers'; -type SentEmail = { - clientMutationId: string; +export type SendEmail = { + clientMutationId: Nullable<string>; message: string; origin: string; replyTo: string; sent: boolean; }; -type SendEmailResponse = { - sendEmail: SentEmail; +export type SendEmailResponse = { + sendEmail: SendEmail; }; -const sendMailMutation = `mutation SendEmail($body: String, $clientMutationId: String, $replyTo: String, $subject: String) { - sendEmail( - input: {body: $body, clientMutationId: $clientMutationId, replyTo: $replyTo, subject: $subject} - ) { +const sendEmailMutation = `mutation SendEmail($input: SendEmailInput!) { + sendEmail(input: $input) { clientMutationId message origin @@ -25,24 +24,24 @@ const sendMailMutation = `mutation SendEmail($body: String, $clientMutationId: S } }`; -export type SendMailInput = { +export type SendEmailInput = { body: string; clientMutationId: string; replyTo: string; - subject: string; + subject?: string; }; /** * Send an email using GraphQL API. * - * @param {SendMailInput} data - The mail data. - * @returns {Promise<SentEmail>} The mutation response. + * @param {SendEmailInput} input - The mail input. + * @returns {Promise<SendEmail>} The mutation response. */ -export const sendMail = async (data: SendMailInput): Promise<SentEmail> => { +export const sendEmail = async (input: SendEmailInput): Promise<SendEmail> => { const response = await fetchGraphQL<SendEmailResponse>({ - query: sendMailMutation, + query: sendEmailMutation, url: getGraphQLUrl(), - variables: { ...data }, + variables: { input }, }); return response.sendEmail; diff --git a/src/types/index.ts b/src/types/index.ts index d6e4a6a..dd807e6 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -2,4 +2,3 @@ export * from './app'; export * from './data'; export * from './generics'; export * from './gql'; -export * from './swr'; diff --git a/src/types/swr.ts b/src/types/swr.ts deleted file mode 100644 index 4da6b2c..0000000 --- a/src/types/swr.ts +++ /dev/null @@ -1,5 +0,0 @@ -export type SWRResult<T> = { - data?: T; - isLoading: boolean; - isError: boolean; -}; |