feat(chat): enhance ChatMessage component with context-aware film interaction

- Updated ChatMessage component to support click interactions for film context.
- Added computed property to determine if a message has associated films.
- Refactored film ID extraction to normalize film IDs for consistency.

Made-with: Cursor

packages/app/src/composables/useContentPanel.ts

@@ -7,15 +7,20 @@ const panelFilms = ref<Film[]>([])
 const selectedFilm = ref<Film | null>(null)
 const panelTitle = ref('Recommended Films')
 
-const FILM_TAG_RE = /\[\[film:(f\d+)\]\]/g
+const FILM_TAG_RE = /\[\[film:(f?\d+)\]\]/gi
 
 export function useContentPanel() {
+  function normalizeFilmId(raw: string): string {
+    return raw.startsWith('f') ? raw : `f${raw}`
+  }
+
   function extractFilmIds(text: string): string[] {
     const ids: string[] = []
     let match: RegExpExecArray | null
-    const re = new RegExp(FILM_TAG_RE.source, 'g')
+    const re = new RegExp(FILM_TAG_RE.source, 'gi')
     while ((match = re.exec(text)) !== null) {
-      if (!ids.includes(match[1])) ids.push(match[1])
+      const id = normalizeFilmId(match[1])
+      if (!ids.includes(id)) ids.push(id)
     }
     return ids
   }