x

apps/spa/src/components/DynamicRichText.tsx

@@ -0,0 +1,34 @@
+import type { PageSection } from '@homaroma/types';
+import { useTranslation } from 'react-i18next';
+import { getLocalizedField } from '../utils/localization';
+
+interface DynamicRichTextProps {
+  section: PageSection;
+}
+
+export default function DynamicRichText({ section }: DynamicRichTextProps) {
+  const { i18n } = useTranslation();
+  const lang = i18n.language;
+  const payload = section.payload || {};
+  
+  const title = getLocalizedField(payload.title, lang);
+  const content = getLocalizedField(payload.content, lang);
+
+  if (!content) return null;
+
+  return (
+    <section className="ui-section-band bg-pop-bg relative">
+      <div className="ui-section-inner space-y-6">
+        {title && (
+          <h2 className="font-serif text-3xl font-semibold text-pop-black md:text-4xl text-center">
+            {title}
+          </h2>
+        )}
+        <div 
+          className="ui-prose text-base font-light leading-relaxed text-pop-black/80 md:text-lg max-w-3xl mx-auto"
+          dangerouslySetInnerHTML={{ __html: content }}
+        />
+      </div>
+    </section>
+  );
+}