diff --git a/webv2/src/pages/faq/faq-data.ts b/webv2/src/pages/faq/faq-data.ts new file mode 100644 index 000000000..df04e5f91 --- /dev/null +++ b/webv2/src/pages/faq/faq-data.ts @@ -0,0 +1,44 @@ +import type { DictionaryKeys } from 'src/components/locale/dictionary'; + +type FaqPageData = Array<{ + title: DictionaryKeys<'faq-topic'>; + questions: Array<{ + question: DictionaryKeys<'faq-topic'>; + answer: DictionaryKeys<'faq-topic'>; + }>; +}>; + +export const faqPageData: FaqPageData = [ + { + title: 'faq-topic-1', + questions: [ + { question: 'faq-topic-1-question-1', answer: 'faq-topic-1-answer-1' }, + { question: 'faq-topic-1-question-2', answer: 'faq-topic-1-answer-2' }, + { question: 'faq-topic-1-question-3', answer: 'faq-topic-1-answer-3' }, + ], + }, + { + title: 'faq-topic-2', + questions: [ + { question: 'faq-topic-2-question-1', answer: 'faq-topic-2-answer-1' }, + { question: 'faq-topic-2-question-2', answer: 'faq-topic-2-answer-2' }, + { question: 'faq-topic-2-question-3', answer: 'faq-topic-2-answer-3' }, + ], + }, + { + title: 'faq-topic-3', + questions: [ + { question: 'faq-topic-3-question-1', answer: 'faq-topic-3-answer-1' }, + { question: 'faq-topic-3-question-2', answer: 'faq-topic-3-answer-2' }, + { question: 'faq-topic-3-question-3', answer: 'faq-topic-3-answer-3' }, + ], + }, + { + title: 'faq-topic-4', + questions: [ + { question: 'faq-topic-4-question-1', answer: 'faq-topic-4-answer-1' }, + { question: 'faq-topic-4-question-2', answer: 'faq-topic-4-answer-2' }, + { question: 'faq-topic-4-question-3', answer: 'faq-topic-4-answer-3' }, + ], + }, +]; diff --git a/webv2/src/pages/faq/page.tsx b/webv2/src/pages/faq/page.tsx index 44114c3ed..07b799cbc 100644 --- a/webv2/src/pages/faq/page.tsx +++ b/webv2/src/pages/faq/page.tsx @@ -1,9 +1,33 @@ -import { Text } from 'src/components/text'; +import { Locale, localize } from 'src/components/locale'; +import { faqPageData } from './faq-data'; +import { Markdown } from 'src/components/makrdown'; export default function Page(): JSX.Element { return ( -
- FAQ Page +
+
+

+ +

+ {faqPageData.map(({ title, questions }, categoryIndex) => ( +
+

+ +

+ {questions.map(({ question, answer }, questionIndex) => ( +
+ +
+ +
+
+ +
+
+ ))} +
+ ))} +
); }