Refactor code and improve translations setup

The commit refactors the import paths, streamlining the file structure. Removed unused imports and shifted a few components in the modules. Also, the translation setup in the FAQ page was improved for better readability and maintainability. Placeholder content has been added to policy pages as well.

apps/web/app/(marketing)/(legal)/cookie-policy/page.tsx

@@ -15,11 +15,13 @@ async function CookiePolicyPage() {
 
   return (
     <div>
-      <div className={'container mx-auto'}>
+      <SitePageHeader
-        <SitePageHeader
+        title={t(`marketing:cookiePolicy`)}
-          title={t(`marketing:cookiePolicy`)}
+        subtitle={t(`marketing:cookiePolicyDescription`)}
-          subtitle={t(`marketing:cookiePolicyDescription`)}
+      />
-        />
+
+      <div className={'container mx-auto py-8'}>
+        <div>Your terms of service content here</div>
       </div>
     </div>
   );

apps/web/app/(marketing)/(legal)/privacy-policy/page.tsx

@@ -14,12 +14,14 @@ async function PrivacyPolicyPage() {
   const { t } = await createI18nServerInstance();
 
   return (
-    <div className={'mt-8'}>
+    <div>
-      <div className={'container mx-auto'}>
+      <SitePageHeader
-        <SitePageHeader
+        title={t('marketing:privacyPolicy')}
-          title={t('marketing:privacyPolicy')}
+        subtitle={t('marketing:privacyPolicyDescription')}
-          subtitle={t('marketing:privacyPolicyDescription')}
+      />
-        />
+
+      <div className={'container mx-auto py-8'}>
+        <div>Your terms of service content here</div>
       </div>
     </div>
   );

apps/web/app/(marketing)/(legal)/terms-of-service/page.tsx

@@ -1,3 +1,5 @@
+import { PageBody } from '@kit/ui/page';
+
 import { SitePageHeader } from '~/(marketing)/_components/site-page-header';
 import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
 import { withI18n } from '~/lib/i18n/with-i18n';
@@ -14,12 +16,14 @@ async function TermsOfServicePage() {
   const { t } = await createI18nServerInstance();
 
   return (
-    <div className={'mt-8'}>
+    <div>
-      <div className={'container mx-auto'}>
+      <SitePageHeader
-        <SitePageHeader
+        title={t(`marketing:termsOfService`)}
-          title={t(`marketing:termsOfService`)}
+        subtitle={t(`marketing:termsOfServiceDescription`)}
-          subtitle={t(`marketing:termsOfServiceDescription`)}
+      />
-        />
+
+      <div className={'container mx-auto py-8'}>
+        <div>Your terms of service content here</div>
       </div>
     </div>
   );

apps/web/app/(marketing)/contact/page.tsx

@@ -18,7 +18,7 @@ async function ContactPage() {
   const { t } = await createI18nServerInstance();
 
   return (
-    <div className={'mt-8'}>
+    <div>
       <SitePageHeader
         title={t(`marketing:contact`)}
         subtitle={t(`marketing:contactDescription`)}

apps/web/app/(marketing)/docs/layout.tsx

@@ -1,4 +1,4 @@
-import { Cms, createCmsClient } from '@kit/cms';
+import { Cms } from '@kit/cms';
 
 import { DocsNavigation } from '~/(marketing)/docs/_components/docs-navigation';
 import { getDocs } from '~/(marketing)/docs/_lib/server/docs.loader';

apps/web/app/(marketing)/docs/page.tsx

@@ -1,14 +1,12 @@
-import { unstable_cache as cache } from 'next/cache';
-
-import { createCmsClient } from '@kit/cms';
 import { PageBody } from '@kit/ui/page';
 
-import { SitePageHeader } from '~/(marketing)/_components/site-page-header';
-import { DocsCards } from '~/(marketing)/docs/_components/docs-cards';
-import { getDocs } from '~/(marketing)/docs/_lib/server/docs.loader';
 import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
 import { withI18n } from '~/lib/i18n/with-i18n';
 
+import { SitePageHeader } from '../_components/site-page-header';
+import { DocsCards } from './_components/docs-cards';
+import { getDocs } from './_lib/server/docs.loader';
+
 export const generateMetadata = async () => {
   const { t } = await createI18nServerInstance();
 

apps/web/app/(marketing)/faq/page.tsx

@@ -20,11 +20,12 @@ export const generateMetadata = async () => {
 async function FAQPage() {
   const { t } = await createI18nServerInstance();
 
-  // replace this content
+  // replace this content with translations
-  // with translations
   const faqItems = [
     {
+      // or: t('marketing:faq.question1')
       question: `Do you offer a free trial?`,
+      // or: t('marketing:faq.answer1')
       answer: `Yes, we offer a 14-day free trial. You can cancel at any time during the trial period and you won't be charged.`,
     },
     {
@@ -124,7 +125,7 @@ function FaqItem({
             'hover:underline-none cursor-pointer font-sans font-medium'
           }
         >
-          {item.question}
+          <Trans i18nKey={item.question} defaults={item.question} />
         </h2>
 
         <div>
@@ -134,10 +135,9 @@ function FaqItem({
         </div>
       </summary>
 
-      <div
+      <div className={'flex flex-col space-y-2 py-1 text-muted-foreground'}>
-        className={'flex flex-col space-y-2 py-1 text-muted-foreground'}
+        <Trans i18nKey={item.answer} defaults={item.answer} />
-        dangerouslySetInnerHTML={{ __html: item.answer }}
+      </div>
-      />
     </details>
   );
 }