feat: render portfolio routes from live localized database content

src/components/EducationSection.tsx

@@ -1,11 +1,9 @@
 import Image from 'next/image';
-import { getEducation } from '@/data/education';
-import { messagesByLocale, type Locale } from '@/i18n/content';
+import type { PortfolioProps } from '@/server/content';
 import styles from './EducationSection.module.css';
 
-export const EducationSection = ({ locale }: { locale: Locale }) => {
-  const education = getEducation(locale);
-  const copy = messagesByLocale[locale].education;
+export const EducationSection = ({ portfolio }: PortfolioProps) => {
+  const copy = portfolio.messages.education;
 
   return (
     <section id="education" className={styles.educationSection}>
@@ -18,7 +16,7 @@ export const EducationSection = ({ locale }: { locale: Locale }) => {
         </div>
 
         {/* Degree Card */}
-        <div className={styles.card} data-reveal-group>
+        {portfolio.education.map(education => <div key={education.id} className={styles.card} data-reveal-group>
           <div className={styles.crestCol} data-reveal="image">
             <div className={styles.crestContainer}>
               <Image
@@ -37,7 +35,7 @@ export const EducationSection = ({ locale }: { locale: Locale }) => {
             <div className={styles.date}>{education.date}</div>
             <p className={styles.description}>{education.description}</p>
           </div>
-        </div>
+        </div>)}
       </div>
     </section>
   );