From c3b09df19f3a5b4ff734529ce38f952308f8cda1 Mon Sep 17 00:00:00 2001
From: junkisai <jonki.beam@gmail.com>
Date: Fri, 18 Oct 2024 19:10:14 +0900
Subject: [PATCH 1/3] refactor: move TOC to components

---
 .../components/TableOfContents/TableOfContents.module.css       | 0
 .../components/TableOfContents/TableOfContents.stories.tsx      | 0
 .../posts => }/components/TableOfContents/TableOfContents.tsx   | 0
 .../{features/posts => }/components/TableOfContents/index.ts    | 0
 frontend/apps/service-site/src/components/index.ts              | 1 +
 .../features/posts/components/PostDetailPage/PostDetailPage.tsx | 2 +-
 .../apps/service-site/src/features/posts/components/index.ts    | 1 -
 7 files changed, 2 insertions(+), 2 deletions(-)
 rename frontend/apps/service-site/src/{features/posts => }/components/TableOfContents/TableOfContents.module.css (100%)
 rename frontend/apps/service-site/src/{features/posts => }/components/TableOfContents/TableOfContents.stories.tsx (100%)
 rename frontend/apps/service-site/src/{features/posts => }/components/TableOfContents/TableOfContents.tsx (100%)
 rename frontend/apps/service-site/src/{features/posts => }/components/TableOfContents/index.ts (100%)

diff --git a/frontend/apps/service-site/src/features/posts/components/TableOfContents/TableOfContents.module.css b/frontend/apps/service-site/src/components/TableOfContents/TableOfContents.module.css
similarity index 100%
rename from frontend/apps/service-site/src/features/posts/components/TableOfContents/TableOfContents.module.css
rename to frontend/apps/service-site/src/components/TableOfContents/TableOfContents.module.css
diff --git a/frontend/apps/service-site/src/features/posts/components/TableOfContents/TableOfContents.stories.tsx b/frontend/apps/service-site/src/components/TableOfContents/TableOfContents.stories.tsx
similarity index 100%
rename from frontend/apps/service-site/src/features/posts/components/TableOfContents/TableOfContents.stories.tsx
rename to frontend/apps/service-site/src/components/TableOfContents/TableOfContents.stories.tsx
diff --git a/frontend/apps/service-site/src/features/posts/components/TableOfContents/TableOfContents.tsx b/frontend/apps/service-site/src/components/TableOfContents/TableOfContents.tsx
similarity index 100%
rename from frontend/apps/service-site/src/features/posts/components/TableOfContents/TableOfContents.tsx
rename to frontend/apps/service-site/src/components/TableOfContents/TableOfContents.tsx
diff --git a/frontend/apps/service-site/src/features/posts/components/TableOfContents/index.ts b/frontend/apps/service-site/src/components/TableOfContents/index.ts
similarity index 100%
rename from frontend/apps/service-site/src/features/posts/components/TableOfContents/index.ts
rename to frontend/apps/service-site/src/components/TableOfContents/index.ts
diff --git a/frontend/apps/service-site/src/components/index.ts b/frontend/apps/service-site/src/components/index.ts
index 20ffb49e..70500821 100644
--- a/frontend/apps/service-site/src/components/index.ts
+++ b/frontend/apps/service-site/src/components/index.ts
@@ -4,3 +4,4 @@ export * from './TopCards'
 export * from './ShareIcon'
 export * from './Icons'
 export * from './Badge'
+export * from './TableOfContents'
diff --git a/frontend/apps/service-site/src/features/posts/components/PostDetailPage/PostDetailPage.tsx b/frontend/apps/service-site/src/features/posts/components/PostDetailPage/PostDetailPage.tsx
index 4c60b81a..593987a7 100644
--- a/frontend/apps/service-site/src/features/posts/components/PostDetailPage/PostDetailPage.tsx
+++ b/frontend/apps/service-site/src/features/posts/components/PostDetailPage/PostDetailPage.tsx
@@ -1,3 +1,4 @@
+import { TableOfContents } from '@/components'
 import { type Lang, fallbackLang } from '@/features/i18n'
 import { PostCategories } from '@/features/posts/components/PostCategories'
 import { PostHero } from '@/features/posts/components/PostHero'
@@ -9,7 +10,6 @@ import type { FC } from 'react'
 import { findPostByLangAndSlug, getNextPost, getPrevPost } from '../../utils'
 import { NavNextPost } from '../NavNextPost'
 import { NavPreviousPost } from '../NavPreviousPost'
-import { TableOfContents } from '../TableOfContents'
 import styles from './PostDetailPage.module.css'
 
 const TOC_TARGET_CLASS_NAME = 'target-toc'
diff --git a/frontend/apps/service-site/src/features/posts/components/index.ts b/frontend/apps/service-site/src/features/posts/components/index.ts
index 6920b57e..00e06413 100644
--- a/frontend/apps/service-site/src/features/posts/components/index.ts
+++ b/frontend/apps/service-site/src/features/posts/components/index.ts
@@ -5,7 +5,6 @@ export * from './LinkCard'
 export * from './NavNextPost'
 export * from './NavPreviousPost'
 export * from './Blockquote'
-export * from './TableOfContents'
 export * from './PostHero'
 export * from './BodyText'
 export * from './PostCategories'

From 2bd041c002fee99924afe243ae8d52a601c5f842 Mon Sep 17 00:00:00 2001
From: junkisai <jonki.beam@gmail.com>
Date: Fri, 18 Oct 2024 19:10:32 +0900
Subject: [PATCH 2/3] feat: add margin-top in h2

---
 .../src/features/posts/components/Heading/Heading.module.css    | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/apps/service-site/src/features/posts/components/Heading/Heading.module.css b/frontend/apps/service-site/src/features/posts/components/Heading/Heading.module.css
index 5e09d028..537395d5 100644
--- a/frontend/apps/service-site/src/features/posts/components/Heading/Heading.module.css
+++ b/frontend/apps/service-site/src/features/posts/components/Heading/Heading.module.css
@@ -7,6 +7,7 @@
 }
 
 .h2 {
+  margin-top: var(--spacing-10);
   font-size: var(--font-size-10, 1.5rem);
 }
 
@@ -24,6 +25,7 @@
 
 @media screen and (max-width: 768px) {
   .h2 {
+    margin-top: var(--spacing-20);
     font-size: var(--font-size-8, 1.25rem);
   }
 

From c8ea601e8472ac5285ec8a4ac0b4cea4ebae62cb Mon Sep 17 00:00:00 2001
From: junkisai <jonki.beam@gmail.com>
Date: Fri, 18 Oct 2024 19:10:42 +0900
Subject: [PATCH 3/3] feat: Add privacy page

---
 .../apps/service-site/contentlayer.config.ts  | 18 ++++-
 .../src/app/[lang]/privacy/page.tsx           | 14 ++++
 .../service-site/src/app/privacy/page.tsx     |  5 ++
 .../service-site/src/contents/privacy/en.mdx  | 66 +++++++++++++++++++
 .../service-site/src/contents/privacy/ja.mdx  | 66 +++++++++++++++++++
 .../PrivacyPage/PrivacyPage.module.css        | 55 ++++++++++++++++
 .../PrivacyPage/PrivacyPage.stories.tsx       | 12 ++++
 .../components/PrivacyPage/PrivacyPage.tsx    | 33 ++++++++++
 .../privacy/components/PrivacyPage/index.ts   |  1 +
 .../src/features/privacy/components/index.ts  |  1 +
 .../src/features/privacy/index.ts             |  1 +
 .../privacy/utils/findPrivacyByLang.ts        | 10 +++
 .../src/features/privacy/utils/index.ts       |  1 +
 13 files changed, 282 insertions(+), 1 deletion(-)
 create mode 100644 frontend/apps/service-site/src/app/[lang]/privacy/page.tsx
 create mode 100644 frontend/apps/service-site/src/app/privacy/page.tsx
 create mode 100644 frontend/apps/service-site/src/contents/privacy/en.mdx
 create mode 100644 frontend/apps/service-site/src/contents/privacy/ja.mdx
 create mode 100644 frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.module.css
 create mode 100644 frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.stories.tsx
 create mode 100644 frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.tsx
 create mode 100644 frontend/apps/service-site/src/features/privacy/components/PrivacyPage/index.ts
 create mode 100644 frontend/apps/service-site/src/features/privacy/components/index.ts
 create mode 100644 frontend/apps/service-site/src/features/privacy/index.ts
 create mode 100644 frontend/apps/service-site/src/features/privacy/utils/findPrivacyByLang.ts
 create mode 100644 frontend/apps/service-site/src/features/privacy/utils/index.ts

diff --git a/frontend/apps/service-site/contentlayer.config.ts b/frontend/apps/service-site/contentlayer.config.ts
index d05cb2f1..ebe3944c 100644
--- a/frontend/apps/service-site/contentlayer.config.ts
+++ b/frontend/apps/service-site/contentlayer.config.ts
@@ -56,9 +56,25 @@ export const Post = defineDocumentType(() => ({
   },
 }))
 
+export const Privacy = defineDocumentType(() => ({
+  name: 'Privacy',
+  filePathPattern: 'privacy/*.mdx',
+  contentType: 'mdx',
+  computedFields: {
+    lang: {
+      type: 'string',
+      resolve: (post) => {
+        // ex. segments = [ 'posts', 'en' ]
+        const segments = post._raw.flattenedPath.split('/')
+        return segments[1]
+      },
+    },
+  },
+}))
+
 export default makeSource({
   contentDirPath: 'src/contents',
-  documentTypes: [Post],
+  documentTypes: [Post, Privacy],
   mdx: {
     remarkPlugins: [remarkGfm, remarkBreaks, remarkLinkCard],
     rehypePlugins: [rehypeSlug, rehypePrettyCode],
diff --git a/frontend/apps/service-site/src/app/[lang]/privacy/page.tsx b/frontend/apps/service-site/src/app/[lang]/privacy/page.tsx
new file mode 100644
index 00000000..7e454b72
--- /dev/null
+++ b/frontend/apps/service-site/src/app/[lang]/privacy/page.tsx
@@ -0,0 +1,14 @@
+import type { PageProps } from '@/app/types'
+import { langSchema } from '@/features/i18n'
+import { PrivacyPage } from '@/features/privacy'
+import { object, parse } from 'valibot'
+
+const paramsSchema = object({
+  lang: langSchema,
+})
+
+export default function Page({ params }: PageProps) {
+  const { lang } = parse(paramsSchema, params)
+
+  return <PrivacyPage lang={lang} />
+}
diff --git a/frontend/apps/service-site/src/app/privacy/page.tsx b/frontend/apps/service-site/src/app/privacy/page.tsx
new file mode 100644
index 00000000..52675e5f
--- /dev/null
+++ b/frontend/apps/service-site/src/app/privacy/page.tsx
@@ -0,0 +1,5 @@
+import { PrivacyPage } from '@/features/privacy'
+
+export default function Page() {
+  return <PrivacyPage />
+}
diff --git a/frontend/apps/service-site/src/contents/privacy/en.mdx b/frontend/apps/service-site/src/contents/privacy/en.mdx
new file mode 100644
index 00000000..6803b292
--- /dev/null
+++ b/frontend/apps/service-site/src/contents/privacy/en.mdx
@@ -0,0 +1,66 @@
+Welcome to Liam, a no-code application platform. This Privacy Policy explains how we collect, use, disclose, and safeguard your information when you use our platform.
+
+## Information We Collect
+
+a. Personal Information
+
+- Name
+- Email address
+- Billing information
+- User-generated content
+
+b. Usage Data
+
+- IP address
+- Browser type
+- Pages visited
+- Time spent on platform
+- How We Use Your Information
+
+## How We Use Your Information
+
+We use your information to
+
+- Provide and maintain our services
+- Improve and personalize user experience
+- Process transactions
+- Send administrative information
+- Respond to inquiries and offer support
+- Data Storage and Security
+
+We implement industry-standard security measures to protect your data. Your information is stored on secure servers and is only accessible to authorized personnel.
+
+## Data Storage and Security
+
+We implement industry-standard security measures to protect your data. Your information is stored on secure servers and is only accessible to authorized personnel.
+
+## Third-Party Services
+
+We may use third-party services for analytics, payment processing, and hosting. These services have their own privacy policies.
+
+## Data Retention
+
+We retain your data for as long as your account is active or as needed to provide you services. You may request deletion of your data at any time.
+
+## User Rights
+
+You have the right to
+
+- Access your personal data
+- Correct inaccuracies in your data
+- Request deletion of your data
+- Object to processing of your data
+
+## Children's Privacy
+
+Our platform is not intended for children under 13. We do not knowingly collect data from children under 13.
+
+## Changes to This Policy
+
+We may update this policy from time to time. We will notify you of any changes by posting the new policy on this page.
+
+## Contact Us
+
+If you have any questions about this Privacy Policy, please contact us at [contact email].
+
+Last updated: [Date]
\ No newline at end of file
diff --git a/frontend/apps/service-site/src/contents/privacy/ja.mdx b/frontend/apps/service-site/src/contents/privacy/ja.mdx
new file mode 100644
index 00000000..3315ede3
--- /dev/null
+++ b/frontend/apps/service-site/src/contents/privacy/ja.mdx
@@ -0,0 +1,66 @@
+Liamへようこそ。Liamはノーコードアプリケーションプラットフォームです。このプライバシーポリシーでは、当社のプラットフォームをご利用いただく際に、お客様の情報をどのように収集、使用、開示、保護するかについて説明します。
+
+## 収集する情報
+
+a. 個人情報
+
+- 名前
+- メールアドレス
+- 請求情報
+- ユーザーが生成したコンテンツ
+
+b. Usage Data
+
+- IP address
+- Browser type
+- Pages visited
+- Time spent on platform
+- How We Use Your Information
+
+## How We Use Your Information
+
+We use your information to
+
+- Provide and maintain our services
+- Improve and personalize user experience
+- Process transactions
+- Send administrative information
+- Respond to inquiries and offer support
+- Data Storage and Security
+
+We implement industry-standard security measures to protect your data. Your information is stored on secure servers and is only accessible to authorized personnel.
+
+## Data Storage and Security
+
+We implement industry-standard security measures to protect your data. Your information is stored on secure servers and is only accessible to authorized personnel.
+
+## Third-Party Services
+
+We may use third-party services for analytics, payment processing, and hosting. These services have their own privacy policies.
+
+## Data Retention
+
+We retain your data for as long as your account is active or as needed to provide you services. You may request deletion of your data at any time.
+
+## User Rights
+
+You have the right to
+
+- Access your personal data
+- Correct inaccuracies in your data
+- Request deletion of your data
+- Object to processing of your data
+
+## Children's Privacy
+
+Our platform is not intended for children under 13. We do not knowingly collect data from children under 13.
+
+## Changes to This Policy
+
+We may update this policy from time to time. We will notify you of any changes by posting the new policy on this page.
+
+## Contact Us
+
+If you have any questions about this Privacy Policy, please contact us at [contact email].
+
+Last updated: [Date]
\ No newline at end of file
diff --git a/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.module.css b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.module.css
new file mode 100644
index 00000000..4aed3e4e
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.module.css
@@ -0,0 +1,55 @@
+.wrapper {
+  display: grid;
+  grid-auto-flow: row;
+  gap: var(--spacing-4);
+}
+
+.h1 {
+  margin-top: var(--spacing-10);
+  padding: var(--spacing-5);
+  color: var(--global-foreground, #fff);
+  font-family: var(--message-font, Montserrat);
+  font-size: var(--font-size-14, 2rem);
+}
+
+.container {
+  display: grid;
+  grid-template-rows: auto auto;
+  gap: var(--spacing-10);
+  padding: 0 var(--spacing-4);
+}
+
+@media screen and (min-width: 768px) {
+  .container {
+    padding: 0 var(--spacing-20, 80px);
+  }
+
+  .h1 {
+    padding: var(--spacing-20, 80px);
+    font-size: var(--font-size-18);
+  }
+}
+
+@media screen and (min-width: 1024px) {
+  .wrapper {
+    gap: var(--spacing-20);
+  }
+
+  .h1 {
+    padding: var(--spacing-20);
+    font-size: var(--font-size-18);
+    text-align: center;
+  }
+
+  .container {
+    grid-template-columns: 274px auto;
+    gap: var(--spacing-10, 40px);
+    padding: 0 var(--spacing-20, 80px);
+  }
+
+  .left {
+    position: sticky;
+    top: calc(var(--default-header-height) + var(--spacing-8));
+    align-self: flex-start;
+  }
+}
diff --git a/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.stories.tsx b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.stories.tsx
new file mode 100644
index 00000000..9e54ede8
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.stories.tsx
@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/react'
+
+import { PrivacyPage } from './'
+
+const meta = {
+  component: PrivacyPage,
+} satisfies Meta<typeof PrivacyPage>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {}
diff --git a/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.tsx b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.tsx
new file mode 100644
index 00000000..7fadda58
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/PrivacyPage.tsx
@@ -0,0 +1,33 @@
+import { TableOfContents } from '@/components'
+import { type Lang, fallbackLang } from '@/features/i18n'
+import { MDXContent } from '@/libs/contentlayer'
+import clsx from 'clsx'
+import { notFound } from 'next/navigation'
+import type { FC } from 'react'
+import { findPrivacyByLang } from '../../utils'
+import styles from './PrivacyPage.module.css'
+
+const TOC_TARGET_CLASS_NAME = 'target-toc'
+
+type Props = {
+  lang?: Lang
+}
+
+export const PrivacyPage: FC<Props> = ({ lang }) => {
+  const privacy = findPrivacyByLang({ lang: lang ?? fallbackLang })
+  if (!privacy) notFound()
+
+  return (
+    <article className={clsx(TOC_TARGET_CLASS_NAME, styles.wrapper)}>
+      <h1 className={styles.h1}>Privacy Policy</h1>
+      <div className={styles.container}>
+        <div className={styles.left}>
+          <TableOfContents contentSelector={TOC_TARGET_CLASS_NAME} />
+        </div>
+        <div>
+          <MDXContent code={privacy.body.code} />
+        </div>
+      </div>
+    </article>
+  )
+}
diff --git a/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/index.ts b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/index.ts
new file mode 100644
index 00000000..53fd00da
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/components/PrivacyPage/index.ts
@@ -0,0 +1 @@
+export * from './PrivacyPage'
diff --git a/frontend/apps/service-site/src/features/privacy/components/index.ts b/frontend/apps/service-site/src/features/privacy/components/index.ts
new file mode 100644
index 00000000..53fd00da
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/components/index.ts
@@ -0,0 +1 @@
+export * from './PrivacyPage'
diff --git a/frontend/apps/service-site/src/features/privacy/index.ts b/frontend/apps/service-site/src/features/privacy/index.ts
new file mode 100644
index 00000000..cb64ac1b
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/index.ts
@@ -0,0 +1 @@
+export * from './components'
diff --git a/frontend/apps/service-site/src/features/privacy/utils/findPrivacyByLang.ts b/frontend/apps/service-site/src/features/privacy/utils/findPrivacyByLang.ts
new file mode 100644
index 00000000..a1ea4ec1
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/utils/findPrivacyByLang.ts
@@ -0,0 +1,10 @@
+import type { Lang } from '@/features/i18n'
+import { type Privacy, allPrivacies } from 'contentlayer/generated'
+
+type Params = {
+  lang: Lang
+}
+
+export function findPrivacyByLang({ lang }: Params): Privacy | undefined {
+  return allPrivacies.find((p) => p.lang === lang)
+}
diff --git a/frontend/apps/service-site/src/features/privacy/utils/index.ts b/frontend/apps/service-site/src/features/privacy/utils/index.ts
new file mode 100644
index 00000000..5fd8da14
--- /dev/null
+++ b/frontend/apps/service-site/src/features/privacy/utils/index.ts
@@ -0,0 +1 @@
+export * from './findPrivacyByLang'