diff --git a/packages/app/src/components/chat/ChatMessage.vue b/packages/app/src/components/chat/ChatMessage.vue index d77482a3..6cbd83af 100644 --- a/packages/app/src/components/chat/ChatMessage.vue +++ b/packages/app/src/components/chat/ChatMessage.vue @@ -6,7 +6,8 @@ >

{{ displayText }}

@@ -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() +} diff --git a/packages/app/src/composables/useContentPanel.ts b/packages/app/src/composables/useContentPanel.ts index 67a05304..9076b3d8 100644 --- a/packages/app/src/composables/useContentPanel.ts +++ b/packages/app/src/composables/useContentPanel.ts @@ -7,15 +7,20 @@ const panelFilms = ref([]) const selectedFilm = ref(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 }