Merge pull request #57 from pythonkr/add-sponsor-menu

후원사 메뉴 추가

Author: constmoon

frontend/assets/styles/markdown.ts

@@ -22,6 +22,11 @@ const MarkdownStyle = styled.div`
     li {
         margin: 0.3rem 0.6rem;
         padding: 0;
+    }
+    ol li {
+        list-style: numeric;
+    }
+    ul li {
         list-style: circle;
     }
     hr {

frontend/data/enums/PageName.ts

@@ -6,7 +6,9 @@ export enum PageName {
     Contribute = 'Contribute',
     Sponsor = 'Sponsor',
     SponsorProspectus = 'SponsorProspectus',
+    SponsorJoin = 'SponsorJoin',
     SponsorBenefit = 'SponsorBenefit',
+    SponsorFaq = 'SponsorFaq',
     SponsorTerms = 'SponsorTerms',
     CoC = 'CoC'
 }

frontend/locales/en/error.ts

@@ -1,4 +1,4 @@
 export default {
     notFound: "Can't find this page",
-    default: 'Server error has occurred'
+    serverError: 'Server error has occurred'
 }

frontend/locales/en/pageTitle.ts

@@ -8,7 +8,9 @@ export default {
     [PageName.Contribute]: 'Contribution',
     [PageName.Sponsor]: 'Sponsor',
     [PageName.SponsorProspectus]: 'Prospectus',
+    [PageName.SponsorJoin]: 'Join as Sponsor',
     [PageName.SponsorBenefit]: 'Benefit',
+    [PageName.SponsorFaq]: 'FAQ',
     [PageName.SponsorTerms]: 'Terms of Sponsor',
     [PageName.CoC]: 'CoC'
 }

frontend/locales/ko/error.ts

@@ -1,4 +1,4 @@
 export default {
     notFound: '페이지를 찾을 수 없습니다.',
-    default: '서버에서 문제가 발생했습니다.'
+    serverError: '서버에서 문제가 발생했습니다.'
 }

frontend/locales/ko/pageTitle.ts

@@ -8,7 +8,9 @@ export default {
     [PageName.Contribute]: '기여하기',
     [PageName.Sponsor]: '후원하기',
     [PageName.SponsorProspectus]: '후원사 안내',
+    [PageName.SponsorJoin]: '후원사로 참여하기',
     [PageName.SponsorBenefit]: '후원사 혜택 설명',
+    [PageName.SponsorFaq]: '자주 묻는 질문',
     [PageName.SponsorTerms]: '후원사 약관',
     [PageName.CoC]: '행동 강령'
 }

frontend/pages/api/sponsor.ts

@@ -30,6 +30,34 @@ export const getSponsorBenefit = async (): Promise<IContents> => {
     }
 }
 
+export const getSponsorJoin = async (): Promise<IContents> => {
+    const response = await axios.get(
+        `https://api.2022.pycon.kr/api/content/sponsor-join`
+    )
+    const data: IApiContents = response.data
+
+    return {
+        content: {
+            ko: data.content,
+            en: data.eng_content
+        }
+    }
+}
+
+export const getSponsorFaq = async (): Promise<IContents> => {
+    const response = await axios.get(
+        `https://api.2022.pycon.kr/api/content/sponsor-faq`
+    )
+    const data: IApiContents = response.data
+
+    return {
+        content: {
+            ko: data.content,
+            en: data.eng_content
+        }
+    }
+}
+
 export const getSponsorTerms = async (): Promise<IContents> => {
     const response = await axios.get(
         `https://api.2022.pycon.kr/api/content/terms-of-sponsor`

frontend/pages/coc/index.tsx

@@ -10,14 +10,18 @@ import matter from 'gray-matter'
 import ReactMarkdown from 'react-markdown'
 import HeadingComponents from '../../components/core/MarkdownHeadings'
 import MarkdownStyle from '../../assets/styles/markdown'
+import remarkGfm from 'remark-gfm'
 
 const CoC: NextPage = (props: any) => {
     const { t } = useTranslation()
 
     return (
         <div>
             <MarkdownStyle>
-                <ReactMarkdown components={HeadingComponents}>
+                <ReactMarkdown
+                    components={HeadingComponents}
+                    remarkPlugins={[remarkGfm]}
+                >
                     {props.content}
                 </ReactMarkdown>
             </MarkdownStyle>

frontend/pages/sponsor/benefit.tsx

@@ -3,10 +3,11 @@ import type { NextPage, GetServerSideProps } from 'next'
 import { PageName } from '../../data/enums/PageName'
 import { SponsorPage } from '../../interfaces/PageProps'
 import { GetServerSidePropsContext } from 'next'
-import { getSponsorBenefit, getSponsorTerms } from '../api/sponsor'
+import { getSponsorBenefit } from '../api/sponsor'
 import ReactMarkdown from 'react-markdown'
 import HeadingComponents from '../../components/core/MarkdownHeadings'
 import MarkdownStyle from '../../assets/styles/markdown'
+import remarkGfm from 'remark-gfm'
 
 interface SponsorBenefitPage extends SponsorPage {
     locale: string
@@ -16,7 +17,10 @@ const SponsorBenefit: NextPage = (props: SponsorBenefitPage) => {
     return (
         <div>
             <MarkdownStyle>
-                <ReactMarkdown components={HeadingComponents}>
+                <ReactMarkdown
+                    components={HeadingComponents}
+                    remarkPlugins={[remarkGfm]}
+                >
                     {props.content[props.locale]}
                 </ReactMarkdown>
             </MarkdownStyle>

frontend/pages/sponsor/faq.tsx

@@ -0,0 +1,48 @@
+import React from 'react'
+import type { NextPage, GetServerSideProps } from 'next'
+import { PageName } from '../../data/enums/PageName'
+import { SponsorPage } from '../../interfaces/PageProps'
+import { GetServerSidePropsContext } from 'next'
+import { getSponsorFaq } from '../api/sponsor'
+import ReactMarkdown from 'react-markdown'
+import HeadingComponents from '../../components/core/MarkdownHeadings'
+import MarkdownStyle from '../../assets/styles/markdown'
+import PageTitle from '../../components/core/PageTitle'
+import remarkGfm from 'remark-gfm'
+
+interface SponsorSponsorFaqPage extends SponsorPage {
+    locale: string
+}
+
+const SponsorFaq: NextPage = (props: SponsorSponsorFaqPage) => {
+    return (
+        <div>
+            <PageTitle title={props.pageName} />
+            <MarkdownStyle>
+                <ReactMarkdown
+                    components={HeadingComponents}
+                    remarkPlugins={[remarkGfm]}
+                >
+                    {props.content[props.locale]}
+                </ReactMarkdown>
+            </MarkdownStyle>
+        </div>
+    )
+}
+
+export const getServerSideProps: GetServerSideProps = async (
+    context: GetServerSidePropsContext
+) => {
+    const { locale } = context
+    const content = await getSponsorFaq()
+
+    return {
+        props: {
+            title: PageName.SponsorFaq,
+            locale,
+            ...content
+        }
+    }
+}
+
+export default SponsorFaq