Current state with latest updates

resources/js/Pages/Academy/Billing/Account.jsx

@@ -1,6 +1,7 @@
 import React, { useState, useRef, useEffect } from 'react'
-import { Head, Link, useForm, usePage } from '@inertiajs/react'
+import { Link, useForm, usePage } from '@inertiajs/react'
 import AccessBadge from '../../../components/academy/billing/AccessBadge'
+import SeoHead from '../../../components/seo/SeoHead'
 
 function formatDate(iso) {
   if (!iso) return null
@@ -11,7 +12,7 @@ function formatDate(iso) {
   }
 }
 
-export default function AcademyBillingAccount({ currentTier, isSubscribed, subscription, activePlan = null, links = {} }) {
+export default function AcademyBillingAccount({ seo, currentTier, isSubscribed, subscription, activePlan = null, links = {} }) {
   const { flash, auth } = usePage().props
   const { data, setData, post, processing } = useForm({
     issue_type: 'billing',
@@ -84,7 +85,7 @@ export default function AcademyBillingAccount({ currentTier, isSubscribed, subsc
 
   return (
     <main className="min-h-screen bg-[radial-gradient(circle_at_top_left,_rgba(56,189,248,0.14),_transparent_24%),radial-gradient(circle_at_bottom_right,_rgba(251,191,36,0.14),_transparent_26%),linear-gradient(180deg,_#07111f_0%,_#0f172a_45%,_#111827_100%)] px-4 py-8 sm:px-6 lg:px-8">
-      <Head title="Academy Subscription" />
+      <SeoHead seo={seo || {}} title="Academy Subscription" />
 
       <div className="mx-auto max-w-[1280px] space-y-8">
         {flash?.error ? (
@@ -280,4 +281,4 @@ export default function AcademyBillingAccount({ currentTier, isSubscribed, subsc
       </div>
     </main>
   )
-}
+}