Skip to content

Commit 5e3c694

Browse files
JesseWynantsJesseWynants
authored
Merge pull request #941 from prezly/feature/added-contact-us-in-header
added contact us in header when contacts in that language are avaliable
2 parents 65d27d0 + 268b31f commit 5e3c694

7 files changed

Lines changed: 130 additions & 27 deletions

File tree

‎modules/Layout/Contacts/Contacts.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ function Contacts({ contacts }: Props) {
3535
}
3636

3737
return (
38-
<div className={styles.contacts}>
38+
<div id="contacts" className={styles.contacts}>
3939
<div className={styles.container}>
4040
<h2 className={styles.title}>
4141
<FormattedMessage {...translations.contacts.title} />

‎modules/Layout/Header/Header.tsx‎

Lines changed: 34 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@ import { translations } from '@prezly/theme-kit-intl';
22
import {
33
useCategories,
44
useCompanyInformation,
5+
useCurrentLocale,
56
useGetLinkLocaleSlug,
67
useNewsroom,
8+
useNewsroomContext,
79
useSearchSettings,
810
} from '@prezly/theme-kit-nextjs';
911
import classNames from 'classnames';
@@ -14,7 +16,7 @@ import { useEffect, useRef, useState } from 'react';
1416
import { FormattedMessage, useIntl } from 'react-intl';
1517

1618
import { useDevice, useThemeSettings } from '@/hooks';
17-
import { IconClose, IconImage, IconMenu, IconSearch } from '@/icons';
19+
import { IconClose, IconEmail, IconImage, IconMenu, IconSearch } from '@/icons';
1820
import { Button, ButtonLink } from '@/ui';
1921

2022
import CategoriesDropdown from './CategoriesDropdown';
@@ -31,6 +33,8 @@ interface Props {
3133

3234
function Header({ hasError }: Props) {
3335
const { newsroom_logo, display_name, public_galleries_number } = useNewsroom();
36+
const { contacts } = useNewsroomContext();
37+
const currentLocale = useCurrentLocale() as unknown as { localeCode: string };
3438
const { logoSize } = useThemeSettings();
3539
const categories = useCategories();
3640
const { name } = useCompanyInformation();
@@ -154,6 +158,35 @@ function Header({ hasError }: Props) {
154158
>
155159
<div role="none" className={styles.backdrop} onClick={closeMenu} />
156160
<ul id="menu" className={styles.navigationInner}>
161+
{contacts &&
162+
contacts.length > 0 &&
163+
contacts.some((contact) =>
164+
contact.display_locales.some((locale) => {
165+
const normalizedLocaleCode = locale.code.replace(
166+
'_',
167+
'-',
168+
);
169+
const normalizedCurrentLocale =
170+
currentLocale.localeCode.replace('_', '-');
171+
return (
172+
normalizedLocaleCode === normalizedCurrentLocale ||
173+
locale.language_code === currentLocale.localeCode
174+
);
175+
}),
176+
) && (
177+
<li className={styles.navigationItem}>
178+
<ButtonLink
179+
href="#contacts"
180+
variation="navigation"
181+
className={styles.navigationButton}
182+
icon={IconEmail}
183+
>
184+
<FormattedMessage
185+
{...translations.contacts.title}
186+
/>
187+
</ButtonLink>
188+
</li>
189+
)}
157190
{public_galleries_number > 0 && (
158191
<li className={styles.navigationItem}>
159192
<ButtonLink

‎pages/[slug].tsx‎

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { Story as PrezlyStory } from '@prezly/sdk';
22
import { useCurrentStory } from '@prezly/theme-kit-nextjs';
3-
import { getStoryPageServerSideProps } from '@prezly/theme-kit-nextjs/server';
3+
import { getStoryPageServerSideProps, NextContentDelivery } from '@prezly/theme-kit-nextjs/server';
44
import type { NextPage } from 'next';
55
import dynamic from 'next/dynamic';
66

@@ -16,10 +16,22 @@ const StoryPage: NextPage<BasePageProps> = () => {
1616
};
1717

1818
export const getServerSideProps = getStoryPageServerSideProps<BasePageProps>(
19-
async (context, { newsroomContextProps }) => ({
20-
isTrackingEnabled: isTrackingEnabled(context),
21-
translations: await importMessages(newsroomContextProps.localeCode),
22-
}),
19+
async (context, { newsroomContextProps }) => {
20+
const api = NextContentDelivery.initClient(context.req);
21+
const { newsroomContextProps: contextWithContacts } = await api.getNewsroomServerSideProps(
22+
newsroomContextProps.localeCode,
23+
undefined,
24+
true,
25+
);
26+
return {
27+
isTrackingEnabled: isTrackingEnabled(context),
28+
translations: await importMessages(newsroomContextProps.localeCode),
29+
newsroomContextProps: {
30+
...newsroomContextProps,
31+
contacts: contextWithContacts.contacts,
32+
},
33+
};
34+
},
2335
[PrezlyStory.FormatVersion.SLATEJS_V6],
2436
);
2537

‎pages/category/[slug].tsx‎

Lines changed: 22 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
import { type PaginationProps, useCurrentCategory } from '@prezly/theme-kit-nextjs';
2-
import { getCategoryPageServerSideProps } from '@prezly/theme-kit-nextjs/server';
2+
import {
3+
getCategoryPageServerSideProps,
4+
NextContentDelivery,
5+
} from '@prezly/theme-kit-nextjs/server';
36
import dynamic from 'next/dynamic';
47
import type { FunctionComponent } from 'react';
58

@@ -18,11 +21,25 @@ const CategoryPage: FunctionComponent<Props> = ({ stories, pagination }) => {
1821

1922
return <Category category={currentCategory!} stories={stories} pagination={pagination} />;
2023
};
24+
2125
export const getServerSideProps = getCategoryPageServerSideProps<BasePageProps, 'thumbnail_image'>(
22-
async (context, { newsroomContextProps }) => ({
23-
isTrackingEnabled: isTrackingEnabled(context),
24-
translations: await importMessages(newsroomContextProps.localeCode),
25-
}),
26+
async (context, { newsroomContextProps }) => {
27+
const api = NextContentDelivery.initClient(context.req);
28+
const { newsroomContextProps: contextWithContacts } = await api.getNewsroomServerSideProps(
29+
newsroomContextProps.localeCode,
30+
undefined,
31+
true,
32+
);
33+
34+
return {
35+
isTrackingEnabled: isTrackingEnabled(context),
36+
translations: await importMessages(newsroomContextProps.localeCode),
37+
newsroomContextProps: {
38+
...newsroomContextProps,
39+
contacts: contextWithContacts.contacts ?? null,
40+
},
41+
};
42+
},
2643
{ extraStoryFields: ['thumbnail_image'] },
2744
);
2845

‎pages/media/album/[uuid].tsx‎

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {
22
type GalleryAlbumPageProps,
33
getGalleryAlbumPageServerSideProps,
44
} from '@prezly/theme-kit-nextjs/server';
5+
import { NextContentDelivery } from '@prezly/theme-kit-nextjs/server';
56
import dynamic from 'next/dynamic';
67
import type { FunctionComponent } from 'react';
78

@@ -15,10 +16,23 @@ type Props = BasePageProps & GalleryAlbumPageProps;
1516
const GalleryPage: FunctionComponent<Props> = ({ gallery }) => <Gallery gallery={gallery} />;
1617

1718
export const getServerSideProps = getGalleryAlbumPageServerSideProps<BasePageProps>(
18-
async (context, { newsroomContextProps }) => ({
19-
isTrackingEnabled: isTrackingEnabled(context),
20-
translations: await importMessages(newsroomContextProps.localeCode),
21-
}),
19+
async (context, { newsroomContextProps }) => {
20+
const api = NextContentDelivery.initClient(context.req);
21+
const { newsroomContextProps: contextWithContacts } = await api.getNewsroomServerSideProps(
22+
newsroomContextProps.localeCode,
23+
undefined,
24+
true,
25+
);
26+
27+
return {
28+
isTrackingEnabled: isTrackingEnabled(context),
29+
translations: await importMessages(newsroomContextProps.localeCode),
30+
newsroomContextProps: {
31+
...newsroomContextProps,
32+
contacts: contextWithContacts.contacts ?? null,
33+
},
34+
};
35+
},
2236
);
2337

2438
export default GalleryPage;

‎pages/media/index.tsx‎

Lines changed: 18 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import {
22
type GalleryPageProps,
33
getGalleryPageServerSideProps,
44
} from '@prezly/theme-kit-nextjs/server';
5+
import { NextContentDelivery } from '@prezly/theme-kit-nextjs/server';
56
import dynamic from 'next/dynamic';
67
import type { FunctionComponent } from 'react';
78

@@ -17,10 +18,23 @@ const GalleriesPage: FunctionComponent<Props> = ({ galleries, pagination }) => (
1718
);
1819

1920
export const getServerSideProps = getGalleryPageServerSideProps<BasePageProps>(
20-
async (context, { newsroomContextProps }) => ({
21-
isTrackingEnabled: isTrackingEnabled(context),
22-
translations: await importMessages(newsroomContextProps.localeCode),
23-
}),
21+
async (context, { newsroomContextProps }) => {
22+
const api = NextContentDelivery.initClient(context.req);
23+
const { newsroomContextProps: contextWithContacts } = await api.getNewsroomServerSideProps(
24+
newsroomContextProps.localeCode,
25+
undefined,
26+
true,
27+
);
28+
29+
return {
30+
isTrackingEnabled: isTrackingEnabled(context),
31+
translations: await importMessages(newsroomContextProps.localeCode),
32+
newsroomContextProps: {
33+
...newsroomContextProps,
34+
contacts: contextWithContacts.contacts ?? null,
35+
},
36+
};
37+
},
2438
);
2539

2640
export default GalleriesPage;

‎pages/search.tsx‎

Lines changed: 20 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { SearchSettings } from '@prezly/theme-kit-core/server';
2-
import { getSearchPageServerSideProps } from '@prezly/theme-kit-nextjs/server';
2+
import { getSearchPageServerSideProps, NextContentDelivery } from '@prezly/theme-kit-nextjs/server';
33
import dynamic from 'next/dynamic';
44
import { notFound } from 'next/navigation';
55
import type { FunctionComponent } from 'react';
@@ -22,12 +22,25 @@ const SearchResultsPage: FunctionComponent<Props> = ({ searchSettings }) => {
2222
return <SearchPage settings={searchSettings} />;
2323
};
2424

25-
export const getServerSideProps = getSearchPageServerSideProps<ExtraProps>(
26-
async (context, { newsroomContextProps }) => ({
27-
isTrackingEnabled: isTrackingEnabled(context),
28-
translations: await importMessages(newsroomContextProps.localeCode),
29-
searchSettings: newsroomContextProps.searchSettings,
30-
}),
25+
export const getServerSideProps = getSearchPageServerSideProps<BasePageProps>(
26+
async (context, { newsroomContextProps }) => {
27+
const api = NextContentDelivery.initClient(context.req);
28+
const { newsroomContextProps: contextWithContacts } = await api.getNewsroomServerSideProps(
29+
newsroomContextProps.localeCode,
30+
undefined,
31+
true,
32+
);
33+
34+
return {
35+
isTrackingEnabled: isTrackingEnabled(context),
36+
translations: await importMessages(newsroomContextProps.localeCode),
37+
newsroomContextProps: {
38+
...newsroomContextProps,
39+
contacts: contextWithContacts.contacts ?? null,
40+
},
41+
searchSettings: newsroomContextProps.searchSettings,
42+
};
43+
},
3144
);
3245

3346
export default SearchResultsPage;

0 commit comments

Comments
 (0)