feat: refactor menus

frontend/src/app/recollections/RecollectionLayout.tsx

@@ -6,6 +6,8 @@ import React, { useEffect } from 'react'
 import { Link, useParams } from 'react-router-dom'
 import { usePlatform } from '@/app/kosmos/KosmosContext'
 import { RecollectionMenubarProvider } from './RecollectionMenubarContext'
+import { RecollectionTitleDataProvider } from './RecollectionTitleDataContext'
+import { RecollectionTitleContent } from './RecollectionTitleContent'
 import { RecollectionMenubar } from './RecollectionMenubar'
 import { FlippingCardView } from './FlippingCardView'
 
@@ -33,12 +35,15 @@ export function RecollectionLayout() {
 
   return (
     <RecollectionMenubarProvider>
-      <div className="flex min-h-0 flex-1 flex-col">
-        <RecollectionMenubar />
-        <div className="flex min-h-0 flex-1 flex-col overflow-hidden">
-          <FlippingCardView />
+      <RecollectionTitleDataProvider>
+        <RecollectionTitleContent />
+        <div className="flex min-h-0 flex-1 flex-col">
+          <RecollectionMenubar />
+          <div className="flex min-h-0 flex-1 flex-col overflow-hidden">
+            <FlippingCardView />
+          </div>
         </div>
-      </div>
+      </RecollectionTitleDataProvider>
     </RecollectionMenubarProvider>
   )
 }