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/components/chat/ChatMessage.vue

@@ -6,7 +6,8 @@
   >
     <div
       class="max-w-[85%] md:max-w-[75%] rounded-2xl px-4 py-3 transition-all duration-300"
-      :class="bubbleClasses"
+      :class="[bubbleClasses, { 'cursor-pointer': hasContext }]"
+      @click="handleBubbleClick"
     >
       <p class="text-sm leading-relaxed whitespace-pre-wrap break-words"
          :class="isDark ? 'text-white/90' : 'text-gray-800'">{{ displayText }}</p>
@@ -65,6 +66,8 @@ const inlineFilms = computed(() => {
   return resolveFilms(ids)
 })
 
+const hasContext = computed(() => !isUser.value && inlineFilms.value.length > 0)
+
 const displayText = computed(() => {
   if (isUser.value) return props.message.content
   return stripFilmTags(props.message.content)
@@ -83,4 +86,8 @@ function handleFilmSelect(film: Film) {
 function openPanel() {
   updatePanelFromText(props.message.content)
 }
+
+function handleBubbleClick() {
+  if (hasContext.value) openPanel()
+}
 </script>