-
Notifications
You must be signed in to change notification settings - Fork 8
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into tina/nov-ug-livestream-link-update
- Loading branch information
Showing
31 changed files
with
1,208 additions
and
221 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,148 @@ | ||
| "use client"; | ||
|
|
||
| import ArticleAuthor from "@/components/articles/articleAuthor"; | ||
| import { componentRenderer } from "@/components/blocks/mdxComponentRenderer"; | ||
| import { CallToAction } from "@/components/callToAction/callToAction"; | ||
| import { PreFooter } from "@/components/layout/footer/pre-footer"; | ||
| import SidebarPanel from "@/components/sidebar/sidebarPanel"; | ||
| import { SectionColor } from "@/components/util/constants/styles"; | ||
| import { Container } from "@/components/util/container"; | ||
| import { Section } from "@/components/util/section"; | ||
| import client from "@/tina/client"; | ||
| import { Breadcrumbs } from "app/components/breadcrumb"; | ||
| import classNames from "classnames"; | ||
| import Image from "next/image"; | ||
| import { tinaField } from "tinacms/dist/react"; | ||
| import { TinaMarkdown } from "tinacms/dist/rich-text"; | ||
| export type ArticleData = Awaited< | ||
| ReturnType<typeof client.queries.articlesContentQuery> | ||
| >; | ||
|
|
||
| export type ArticlePageProps = { | ||
| tinaProps: { data: ArticleData["data"] }; | ||
| props: { filename: string; indexPageTitle: string }; | ||
| }; | ||
|
|
||
| const ArticlePage = ({ props, tinaProps }: ArticlePageProps) => { | ||
| const { data } = tinaProps; | ||
| const showCallToAction = data.articles.callToAction.showCallToAction; | ||
| const azureBannerColor = showCallToAction | ||
| ? SectionColor.Default | ||
| : SectionColor.LightGray; | ||
| const { author } = data.articles; | ||
| return ( | ||
| <> | ||
| {data.articles.bannerImg && ( | ||
| <Container className="prose flex-1" size="custom"> | ||
| <div data-tina-field={tinaField(data.articles, "bannerImg")}> | ||
| <Image | ||
| src={data.articles.bannerImg} | ||
| width={1312} | ||
| height={0} | ||
| alt="SSW Industry Banner" | ||
| sizes="100vw" | ||
| /> | ||
| </div> | ||
| </Container> | ||
| )} | ||
| {data.articles.seo?.showBreadcrumb === null || | ||
| (data.articles.seo?.showBreadcrumb && ( | ||
| <Section className="mx-auto w-full max-w-9xl px-8 py-5"> | ||
| <Breadcrumbs | ||
| path={props.filename} | ||
| title={data.articles.seo?.title} | ||
| seoSchema={data.articles.seo} | ||
| additionalReplacements={[ | ||
| { | ||
| from: "articles", | ||
| to: props.indexPageTitle, | ||
| }, | ||
| ]} | ||
| /> | ||
| </Section> | ||
| ))} | ||
|
|
||
| {data.articles.title && ( | ||
| <Section | ||
| className="mx-auto w-full max-w-9xl px-8" | ||
| data-tina-field={tinaField(data.articles, "title")} | ||
| > | ||
| <h1 data-tina-field={tinaField} className="mt-4 py-2"> | ||
| {data.articles.title} | ||
| </h1> | ||
| </Section> | ||
| )} | ||
| {!!data.articles.author && ( | ||
| <Section className="mx-auto w-full max-w-9xl px-8"> | ||
| <ArticleAuthor | ||
| name={author?.presenter?.name} | ||
| position={author?.position} | ||
| image={author?.profileImg} | ||
| url={author?.presenter?.peopleProfileURL} | ||
| /> | ||
| </Section> | ||
| )} | ||
| {data.articles.subTitle && ( | ||
| <section | ||
| className={classNames( | ||
| "prose mx-auto w-full max-w-9xl flex-row px-8 pb-8 prose-h1:my-0 prose-h1:pt-8 prose-h2:mt-8 prose-img:my-0 lg:flex" | ||
| )} | ||
| > | ||
| <div data-tina-field={tinaField(data.articles, "subTitle")}> | ||
| <TinaMarkdown | ||
| content={data.articles.subTitle} | ||
| components={componentRenderer} | ||
| /> | ||
| </div> | ||
| {data.articles.sidebarPanel?.showSidebarPanel && ( | ||
| <div className="w-full px-16 lg:shrink lg:pl-16 lg:pr-0"> | ||
| <SidebarPanel | ||
| title={data.articles.sidebarPanel?.title} | ||
| tinaFields={{ | ||
| title: tinaField(data.articles.sidebarPanel, "title"), | ||
| description: tinaField( | ||
| data.articles.sidebarPanel, | ||
| "description" | ||
| ), | ||
| }} | ||
| description={data.articles.sidebarPanel?.description} | ||
| actionUrl={data.articles.sidebarPanel?.actionUrl} | ||
| actionText={data.articles.sidebarPanel?.actionText} | ||
| /> | ||
| </div> | ||
| )} | ||
| </section> | ||
| )} | ||
|
|
||
| {data.articles.callToAction?.showCallToAction && ( | ||
| <CallToAction | ||
| animated={data.articles?.callToAction?.animated} | ||
| tinaFields={{ | ||
| subTitle: tinaField(data.articles?.callToAction, "subTitle"), | ||
| buttonSubtitle: tinaField( | ||
| data.articles?.callToAction, | ||
| "buttonSubtitle" | ||
| ), | ||
| }} | ||
| subTitle={data.articles?.callToAction?.subTitle} | ||
| buttonText={data.articles?.callToAction?.buttonText} | ||
| buttonSubtitle={data.articles?.callToAction?.buttonSubtitle} | ||
| > | ||
| {data.articles?.callToAction?.title && ( | ||
| <h2 | ||
| className="callToAction" | ||
| data-tina-field={tinaField(data.articles?.callToAction, "title")} | ||
| > | ||
| {data.articles?.callToAction?.title} | ||
| </h2> | ||
| )} | ||
| </CallToAction> | ||
| )} | ||
| {data.articles.showAzureFooter && ( | ||
| <PreFooter backgroundColor={azureBannerColor} /> | ||
| )} | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| export default ArticlePage; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,53 @@ | ||
| import client from "@/tina/client"; | ||
| import { TinaClient, UseTinaProps } from "app/tina-client"; | ||
| import { TODAY } from "hooks/useFetchEvents"; | ||
| import { useSEO } from "hooks/useSeo"; | ||
| import { Metadata } from "next"; | ||
| import ArticlePage, { ArticleData, ArticlePageProps } from "."; | ||
| const getData = async ( | ||
| filename: string | ||
| ): Promise<{ | ||
| props: UseTinaProps & ArticlePageProps["props"]; | ||
| }> => { | ||
| const tinaProps = await getArticle(filename); | ||
| tinaProps.data.articlesIndex.title; | ||
| return { | ||
| props: { | ||
| data: tinaProps.data, | ||
| query: tinaProps.query, | ||
| variables: tinaProps.variables, | ||
| indexPageTitle: tinaProps.data.articlesIndex.title, | ||
| filename, | ||
| }, | ||
| }; | ||
| }; | ||
|
|
||
| export async function generateMetadata({ | ||
| params, | ||
| }: { | ||
| params: { filename: string }; | ||
| }): Promise<Metadata> { | ||
| const tinaProps = await getArticle(params.filename); | ||
| const seo = tinaProps.data.articles.seo; | ||
| seo.canonical = `${tinaProps.data.global.header.url}articles/${params.filename}`; | ||
| // eslint-disable-next-line react-hooks/rules-of-hooks | ||
| const { seoProps } = useSEO(seo); | ||
| return { | ||
| ...seoProps, | ||
| }; | ||
| } | ||
| const getArticle = async (filename: string): Promise<ArticleData> => { | ||
| const data = await client.queries.articlesContentQuery({ | ||
| relativePath: `${filename}.mdx`, | ||
| date: TODAY.toISOString(), | ||
| }); | ||
| return data; | ||
| }; | ||
|
|
||
| const Article = async ({ params }: { params: { filename: string } }) => { | ||
| const { props } = await getData(params.filename); | ||
|
|
||
| return <TinaClient Component={ArticlePage} props={props}></TinaClient>; | ||
| }; | ||
|
|
||
| export default Article; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,10 +1,15 @@ | ||
| import { BuiltOnAzure } from "@/components/blocks/builtOnAzure"; | ||
| import { SectionColor } from "@/components/util/constants/styles"; | ||
| import { Section } from "@/components/util/section"; | ||
|
|
||
| export const PreFooter = () => { | ||
| export const PreFooter = ({ | ||
| backgroundColor = SectionColor.LightGray, | ||
| }: { | ||
| backgroundColor?: SectionColor; | ||
| }) => { | ||
| return ( | ||
| <Section className="w-full flex-none"> | ||
| <BuiltOnAzure data={{ backgroundColor: "lightgray" }} /> | ||
| <BuiltOnAzure data={{ backgroundColor }} /> | ||
| </Section> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.