@adatechnology/conversations-ui 0.5.0 → 0.6.1

package/src/participant/index.ts

@@ -4,6 +4,7 @@ export { DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS, type ParticipantConversations
 export type {
   ParticipantConversationsClassNames,
   ParticipantSubjectGroup,
+  ParticipantSubjectIconRenderer,
   ParticipantInboxView,
   ParticipantInboxSection,
   GroupParticipantConversationsParams,

package/src/participant/participant.types.ts

@@ -8,6 +8,9 @@ export type ParticipantSubjectGroup = {
   readonly icon?: ReactNode
 }
 
+/** Host-drawn icon for a list row; null/undefined falls back to the subject group icon. */
+export type ParticipantSubjectIconRenderer = (conversation: ParticipantConversationSummary) => ReactNode
+
 export type ParticipantInboxSection = {
   /** 'awaiting' | 'closed' | 'other' or the subjectType of a group. */
   readonly key: string
@@ -27,6 +30,10 @@ export type ParticipantInboxView = {
   readonly sections: readonly ParticipantInboxSection[]
   readonly filters: readonly ParticipantInboxFilter[]
   readonly showFilters: boolean
+  /** The filter actually applied: 'all' when the requested one has no conversations left. */
+  readonly activeFilter: string
+  /** The search finds conversations, but none under the active subject filter. */
+  readonly hasMatchesOutsideFilter: boolean
 }
 
 export type GroupParticipantConversationsParams = {
@@ -34,6 +41,8 @@ export type GroupParticipantConversationsParams = {
   readonly subjectGroups: readonly ParticipantSubjectGroup[]
   /** subjectType, or 'all'/undefined for everything. */
   readonly filter?: string
+  /** Narrows the rows only: chips and their counts always describe the whole list. */
+  readonly searchQuery?: string
 }
 
 export type ParticipantConversationsClassNames = {

package/src/participant/participantChannels.test.ts

@@ -0,0 +1,42 @@
+import { describe, expect, it } from 'bun:test'
+
+import { DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS } from './participantLabels'
+import {
+  PARTICIPANT_CHANNEL_ORDER,
+  resolveParticipantChannelLabel,
+  resolveParticipantChannels,
+} from './participantChannels'
+
+const channelsOf = (input: readonly string[] | undefined) =>
+  resolveParticipantChannels(input).map((descriptor) => descriptor.channel)
+
+describe('resolveParticipantChannels', () => {
+  it('returns nothing for absent or empty input', () => {
+    expect(channelsOf(undefined)).toEqual([])
+    expect(channelsOf([])).toEqual([])
+  })
+
+  it('orders deterministically whatever the server order', () => {
+    expect(channelsOf(['webchat', 'email', 'whatsapp', 'app', 'portal'])).toEqual([
+      'app',
+      'whatsapp',
+      'email',
+      'portal',
+      'webchat',
+    ])
+    expect(channelsOf(['whatsapp', 'app'])).toEqual(['app', 'whatsapp'])
+  })
+
+  it('dedupes and ignores unknown channels', () => {
+    expect(channelsOf(['whatsapp', 'whatsapp', 'sms', 'app'])).toEqual(['app', 'whatsapp'])
+  })
+
+  it('maps every channel to an icon and a label', () => {
+    expect(PARTICIPANT_CHANNEL_ORDER).toHaveLength(5)
+    const labels = PARTICIPANT_CHANNEL_ORDER.map((descriptor) =>
+      resolveParticipantChannelLabel(descriptor, DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS),
+    )
+    expect(labels).toEqual(['App', 'WhatsApp', 'Email', 'Portal', 'Web chat'])
+    expect(new Set(PARTICIPANT_CHANNEL_ORDER.map((descriptor) => descriptor.iconName)).size).toBe(5)
+  })
+})

package/src/participant/participantChannels.ts

@@ -0,0 +1,33 @@
+import type { ConversationChannel } from '@adatechnology/conversation-contracts'
+
+import type { ParticipantConversationsLabels } from './participantLabels'
+
+export type ParticipantChannelDescriptor = {
+  readonly channel: ConversationChannel
+  readonly iconName: 'Smartphone' | 'MessageCircle' | 'Mail' | 'Globe' | 'MessagesSquare'
+  readonly labelKey: 'channelApp' | 'channelWhatsapp' | 'channelEmail' | 'channelPortal' | 'channelWebchat'
+}
+
+export const PARTICIPANT_CHANNEL_ORDER: readonly ParticipantChannelDescriptor[] = [
+  { channel: 'app', iconName: 'Smartphone', labelKey: 'channelApp' },
+  { channel: 'whatsapp', iconName: 'MessageCircle', labelKey: 'channelWhatsapp' },
+  { channel: 'email', iconName: 'Mail', labelKey: 'channelEmail' },
+  { channel: 'portal', iconName: 'Globe', labelKey: 'channelPortal' },
+  { channel: 'webchat', iconName: 'MessagesSquare', labelKey: 'channelWebchat' },
+]
+
+/** Stable badge order regardless of the server order; duplicates and unknown values (runtime) are dropped. */
+export function resolveParticipantChannels(
+  channels: readonly string[] | undefined,
+): readonly ParticipantChannelDescriptor[] {
+  if (channels === undefined || channels.length === 0) return []
+  const present = new Set<string>(channels)
+  return PARTICIPANT_CHANNEL_ORDER.filter((descriptor) => present.has(descriptor.channel))
+}
+
+export function resolveParticipantChannelLabel(
+  descriptor: ParticipantChannelDescriptor,
+  labels: ParticipantConversationsLabels,
+): string {
+  return labels[descriptor.labelKey]
+}

package/src/participant/participantGrouping.test.ts

@@ -4,7 +4,9 @@ import type { ParticipantConversationSummary } from '@adatechnology/conversation
 
 import { groupParticipantConversations } from './participantGrouping'
 
-function build(overrides: Partial<ParticipantConversationSummary> & { subjectId: string }): ParticipantConversationSummary {
+function build(
+  overrides: Partial<ParticipantConversationSummary> & { subjectId: string },
+): ParticipantConversationSummary {
   return {
     subjectType: 'invoice',
     subjectLabel: 'Label',
@@ -60,7 +62,12 @@ describe('groupParticipantConversations', () => {
         build({ subjectId: 'a', subjectType: 'zeta', lastMessageAt: null, subjectLabel: 'A' }),
         build({ subjectId: 'b', subjectType: 'zeta', lastMessageAt: '2026-10-01T10:00:00.000Z', subjectLabel: 'Beta' }),
         build({ subjectId: 'c', subjectType: 'zeta', lastMessageAt: '2026-10-02T10:00:00.000Z', subjectLabel: 'Z' }),
-        build({ subjectId: 'd', subjectType: 'zeta', lastMessageAt: '2026-10-01T10:00:00.000Z', subjectLabel: 'Alpha' }),
+        build({
+          subjectId: 'd',
+          subjectType: 'zeta',
+          lastMessageAt: '2026-10-01T10:00:00.000Z',
+          subjectLabel: 'Alpha',
+        }),
       ],
     })
     expect(view.sections[0]?.conversations.map((c) => c.subjectId)).toEqual(['c', 'd', 'b', 'a'])
@@ -133,6 +140,97 @@ describe('groupParticipantConversations', () => {
       ],
     })
     expect(view.sections.map((section) => section.conversations.map((c) => c.subjectId))).toEqual([['2'], ['3']])
-    expect(groupParticipantConversations({ subjectGroups: GROUPS, filter: 'all', conversations: [build({ subjectId: '1' })] }).sections).toHaveLength(1)
+    expect(
+      groupParticipantConversations({
+        subjectGroups: GROUPS,
+        filter: 'all',
+        conversations: [build({ subjectId: '1' })],
+      }).sections,
+    ).toHaveLength(1)
+  })
+})
+
+describe('groupParticipantConversations with a search query', () => {
+  const conversations = [
+    build({ subjectId: '1', subjectType: 'alpha', protocol: '261009-K7M2', unreadCount: 2 }),
+    build({ subjectId: '2', subjectType: 'zeta', protocol: '261008-AB23', unreadCount: 1 }),
+    build({ subjectId: '3', subjectType: 'zeta', protocol: '261007-CD45' }),
+  ]
+  const idsOf = (view: ReturnType<typeof groupParticipantConversations>) =>
+    view.sections.flatMap((section) => section.conversations.map((item) => item.subjectId))
+
+  it('keeps chips and counts computed on the whole list, not on the search result', () => {
+    const view = groupParticipantConversations({
+      conversations,
+      subjectGroups: GROUPS,
+      filter: 'all',
+      searchQuery: 'k7m2',
+    })
+    expect(idsOf(view)).toEqual(['1'])
+    expect(view.showFilters).toBe(true)
+    expect(view.filters.map((filter) => [filter.subjectType, filter.unreadCount])).toEqual([
+      ['all', 3],
+      ['zeta', 1],
+      ['alpha', 2],
+    ])
+  })
+
+  it('chip of another subject plus the protocol of a conversation outside it: chips stay and the view says so', () => {
+    const view = groupParticipantConversations({
+      conversations,
+      subjectGroups: GROUPS,
+      filter: 'zeta',
+      searchQuery: '261009',
+    })
+    expect(view.sections).toEqual([])
+    expect(view.showFilters).toBe(true)
+    expect(view.hasMatchesOutsideFilter).toBe(true)
+  })
+
+  it('a query that matches inside the active filter shows only those rows', () => {
+    const view = groupParticipantConversations({
+      conversations,
+      subjectGroups: GROUPS,
+      filter: 'zeta',
+      searchQuery: 'ab23',
+    })
+    expect(idsOf(view)).toEqual(['2'])
+    expect(view.hasMatchesOutsideFilter).toBe(false)
+  })
+
+  it('a query that matches nothing anywhere is not an outside-filter match', () => {
+    const view = groupParticipantConversations({
+      conversations,
+      subjectGroups: GROUPS,
+      filter: 'zeta',
+      searchQuery: 'zzz',
+    })
+    expect(view.hasMatchesOutsideFilter).toBe(false)
+    expect(view.showFilters).toBe(true)
+  })
+
+  it('without a query nothing is outside the filter', () => {
+    const view = groupParticipantConversations({ conversations, subjectGroups: GROUPS, filter: 'zeta' })
+    expect(view.hasMatchesOutsideFilter).toBe(false)
+  })
+
+  it('a filter pointing at a subject with no conversations behaves as all', () => {
+    const view = groupParticipantConversations({
+      conversations: [build({ subjectId: '1', subjectType: 'zeta' })],
+      subjectGroups: GROUPS,
+      filter: 'alpha',
+    })
+    expect(idsOf(view)).toEqual(['1'])
+    expect(view.activeFilter).toBe('all')
+    expect(view.hasMatchesOutsideFilter).toBe(false)
+  })
+
+  it('keeps a filter that still has conversations as active', () => {
+    const view = groupParticipantConversations({
+      conversations: [build({ subjectId: '1', subjectType: 'zeta' })],
+      subjectGroups: GROUPS,
+      filter: 'zeta',
+    })
+    expect(view.activeFilter).toBe('zeta')
   })
 })

package/src/participant/participantGrouping.ts

@@ -6,6 +6,7 @@ import type {
   ParticipantInboxSection,
   ParticipantInboxView,
 } from './participant.types'
+import { filterConversationsBySearch } from './participantProtocol'
 
 const ALL_FILTER = 'all'
 const SECTION_AWAITING = 'awaiting'
@@ -53,12 +54,18 @@ function buildFilters(
   return { filters: [all, ...groupFilters], showFilters: groupFilters.length >= 2 }
 }
 
+function resolveActiveFilter(params: GroupParticipantConversationsParams): string {
+  const { filter, conversations } = params
+  if (filter === undefined || filter === ALL_FILTER) return ALL_FILTER
+  return conversations.some((conversation) => conversation.subjectType === filter) ? filter : ALL_FILTER
+}
+
 export function groupParticipantConversations(params: GroupParticipantConversationsParams): ParticipantInboxView {
-  const { filter, subjectGroups } = params
-  const isFiltered = filter !== undefined && filter !== ALL_FILTER
-  const visible = isFiltered
-    ? params.conversations.filter((conversation) => conversation.subjectType === filter)
-    : params.conversations
+  const { subjectGroups } = params
+  const filter = resolveActiveFilter(params)
+  const isFiltered = filter !== ALL_FILTER
+  const searched = filterConversationsBySearch(params.conversations, params.searchQuery ?? '')
+  const visible = isFiltered ? searched.filter((conversation) => conversation.subjectType === filter) : searched
   const knownTypes = new Set(subjectGroups.map((group) => group.subjectType))
 
   const buckets = new Map<string, ParticipantConversationSummary[]>()
@@ -67,11 +74,17 @@ export function groupParticipantConversations(params: GroupParticipantConversati
     buckets.set(key, [...(buckets.get(key) ?? []), conversation])
   }
 
-  const orderedKeys = [SECTION_AWAITING, ...subjectGroups.map((group) => group.subjectType), SECTION_OTHER, SECTION_CLOSED]
+  const orderedKeys = [
+    SECTION_AWAITING,
+    ...subjectGroups.map((group) => group.subjectType),
+    SECTION_OTHER,
+    SECTION_CLOSED,
+  ]
   const sections = orderedKeys.flatMap((key) => {
     const bucket = buckets.get(key)
     return bucket === undefined ? [] : [buildSection(key, bucket)]
   })
 
-  return { sections, ...buildFilters(params) }
+  const hasMatchesOutsideFilter = isFiltered && visible.length === 0 && searched.length > 0
+  return { sections, hasMatchesOutsideFilter, activeFilter: filter, ...buildFilters(params) }
 }

package/src/participant/participantLabels.ts

@@ -38,6 +38,21 @@ export type ParticipantConversationsLabels = {
   readonly loading: string
   readonly loadError: string
   readonly loadMore: string
+  readonly searchLabel: string
+  readonly searchPlaceholder: string
+  readonly noResults: string
+  readonly noResultsInFilter: string
+  readonly noResultsLoadedOnly: string
+  /** Spoken before the protocol code, e.g. "Protocol 261009-K7M2". */
+  readonly protocolPrefix: string
+  readonly copyProtocol: string
+  readonly protocolCopied: string
+  readonly channelsGroup: string
+  readonly channelApp: string
+  readonly channelWhatsapp: string
+  readonly channelEmail: string
+  readonly channelPortal: string
+  readonly channelWebchat: string
 }
 
 export const DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS: ParticipantConversationsLabels = {
@@ -79,6 +94,20 @@ export const DEFAULT_PARTICIPANT_CONVERSATIONS_LABELS: ParticipantConversationsL
   loading: 'Loading…',
   loadError: 'Could not load. Check your connection and try again.',
   loadMore: 'Load more',
+  searchLabel: 'Search conversations',
+  searchPlaceholder: 'Search by title or protocol',
+  noResults: 'No conversations found',
+  noResultsInFilter: 'No results in this filter — try All',
+  noResultsLoadedOnly: 'Nothing in the loaded conversations — load more',
+  protocolPrefix: 'Protocol',
+  copyProtocol: 'Copy protocol',
+  protocolCopied: 'Protocol copied',
+  channelsGroup: 'Channels in this conversation',
+  channelApp: 'App',
+  channelWhatsapp: 'WhatsApp',
+  channelEmail: 'Email',
+  channelPortal: 'Portal',
+  channelWebchat: 'Web chat',
 }
 
 export function formatParticipantLabel(template: string, count: number): string {

package/src/participant/participantProtocol.test.ts

@@ -0,0 +1,104 @@
+import { describe, expect, it } from 'bun:test'
+
+import { buildConversation } from './participantFixtures.test-helper'
+import {
+  PROTOCOL_SEARCH_CONVERSATION_THRESHOLD,
+  filterConversationsBySearch,
+  isInboxSearchVisible,
+  matchesProtocolQuery,
+  normalizeProtocolQuery,
+  shouldShowInboxSearch,
+} from './participantProtocol'
+
+describe('normalizeProtocolQuery', () => {
+  it('uppercases and drops dashes and spaces', () => {
+    expect(normalizeProtocolQuery(' 261009-k7 m2 ')).toBe('261009K7M2')
+  })
+})
+
+describe('matchesProtocolQuery', () => {
+  it('matches partially, without dash and without case', () => {
+    expect(matchesProtocolQuery('261009-K7M2', '261009k7')).toBe(true)
+    expect(matchesProtocolQuery('261009-K7M2', 'k7m2')).toBe(true)
+    expect(matchesProtocolQuery('261009-K7M2', '9-k')).toBe(true)
+  })
+
+  it('does not match a different code', () => {
+    expect(matchesProtocolQuery('261009-K7M2', 'ZZZ')).toBe(false)
+  })
+
+  it('an empty query matches everything, even a missing protocol', () => {
+    expect(matchesProtocolQuery(undefined, '')).toBe(true)
+    expect(matchesProtocolQuery('261009-K7M2', '  ')).toBe(true)
+  })
+
+  it('a missing protocol never matches a real query', () => {
+    expect(matchesProtocolQuery(undefined, 'K7')).toBe(false)
+  })
+})
+
+describe('filterConversationsBySearch', () => {
+  const conversations = [
+    buildConversation({ subjectId: '1', subjectLabel: 'Damaged item', protocol: '261009-K7M2' }),
+    buildConversation({ subjectId: '2', subjectLabel: 'Late item' }),
+    buildConversation({ subjectId: '3', subjectLabel: 'Other topic', protocol: '261008-AB23' }),
+  ]
+  const ids = (query: string) => filterConversationsBySearch(conversations, query).map((item) => item.subjectId)
+
+  it('returns everything for an empty query', () => {
+    expect(ids('')).toEqual(['1', '2', '3'])
+    expect(ids('   ')).toEqual(['1', '2', '3'])
+  })
+
+  it('matches the title without accent or case', () => {
+    expect(ids('DAMAGED')).toEqual(['1'])
+    expect(ids('látè')).toEqual(['2'])
+  })
+
+  it('matches the protocol partially, without dash and case', () => {
+    expect(ids('k7m')).toEqual(['1'])
+    expect(ids('261008')).toEqual(['3'])
+    expect(ids('2610')).toEqual(['1', '3'])
+  })
+
+  it('a query of only separators does not match every protocol', () => {
+    expect(ids('-')).toEqual([])
+  })
+
+  it('returns nothing when neither title nor protocol match', () => {
+    expect(ids('zzz')).toEqual([])
+  })
+})
+
+describe('shouldShowInboxSearch', () => {
+  it('shows when some conversation has a protocol', () => {
+    expect(shouldShowInboxSearch([buildConversation({ subjectId: '1', protocol: '261009-K7M2' })])).toBe(true)
+  })
+
+  it('shows beyond the threshold even without protocols', () => {
+    const many = Array.from({ length: PROTOCOL_SEARCH_CONVERSATION_THRESHOLD + 1 }, (_, index) =>
+      buildConversation({ subjectId: String(index) }),
+    )
+    expect(shouldShowInboxSearch(many)).toBe(true)
+    expect(shouldShowInboxSearch(many.slice(0, PROTOCOL_SEARCH_CONVERSATION_THRESHOLD))).toBe(false)
+  })
+
+  it('hides for a short list without protocols', () => {
+    expect(shouldShowInboxSearch([buildConversation({ subjectId: '1' })])).toBe(false)
+  })
+})
+
+describe('isInboxSearchVisible', () => {
+  const short = [buildConversation({ subjectId: '1' })]
+  const withProtocol = [buildConversation({ subjectId: '1', protocol: '261009-K7M2' })]
+
+  it('follows the threshold rule when there is no query', () => {
+    expect(isInboxSearchVisible({ conversations: short, searchQuery: '' })).toBe(false)
+    expect(isInboxSearchVisible({ conversations: withProtocol, searchQuery: '' })).toBe(true)
+  })
+
+  it('stays visible while a query is applied, even if a refresh shrank the list', () => {
+    expect(isInboxSearchVisible({ conversations: short, searchQuery: 'k7' })).toBe(true)
+    expect(isInboxSearchVisible({ conversations: [], searchQuery: 'k7' })).toBe(true)
+  })
+})

package/src/participant/participantProtocol.ts

@@ -0,0 +1,52 @@
+import type { ParticipantConversationSummary } from '@adatechnology/conversation-contracts'
+
+/** Search appears when the list is long even if no conversation carries a protocol. */
+export const PROTOCOL_SEARCH_CONVERSATION_THRESHOLD = 8
+
+export function normalizeProtocolQuery(text: string): string {
+  return text.replace(/[-\s]/g, '').toUpperCase()
+}
+
+export function matchesProtocolQuery(protocol: string | undefined, query: string): boolean {
+  const normalizedQuery = normalizeProtocolQuery(query)
+  if (normalizedQuery === '') return true
+  if (protocol === undefined) return false
+  return normalizeProtocolQuery(protocol).includes(normalizedQuery)
+}
+
+function foldText(text: string): string {
+  return text.normalize('NFD').replace(/\p{M}/gu, '').toLowerCase()
+}
+
+function matchesTitle(subjectLabel: string, query: string): boolean {
+  return foldText(subjectLabel).includes(foldText(query))
+}
+
+export function filterConversationsBySearch(
+  conversations: readonly ParticipantConversationSummary[],
+  query: string,
+): readonly ParticipantConversationSummary[] {
+  const trimmedQuery = query.trim()
+  if (trimmedQuery === '') return conversations
+  const hasProtocolTerm = normalizeProtocolQuery(trimmedQuery) !== ''
+  return conversations.filter(
+    (conversation) =>
+      matchesTitle(conversation.subjectLabel, trimmedQuery) ||
+      (hasProtocolTerm && matchesProtocolQuery(conversation.protocol, trimmedQuery)),
+  )
+}
+
+export type InboxSearchVisibilityParams = {
+  readonly conversations: readonly ParticipantConversationSummary[]
+  readonly searchQuery: string
+}
+
+/** An applied query keeps the field, so a refresh that shrinks the list cannot strand it. */
+export function isInboxSearchVisible({ conversations, searchQuery }: InboxSearchVisibilityParams): boolean {
+  return searchQuery !== '' || shouldShowInboxSearch(conversations)
+}
+
+export function shouldShowInboxSearch(conversations: readonly ParticipantConversationSummary[]): boolean {
+  if (conversations.length > PROTOCOL_SEARCH_CONVERSATION_THRESHOLD) return true
+  return conversations.some((conversation) => conversation.protocol !== undefined)
+}

package/src/participant/participantProtocolCopy.test.ts

@@ -0,0 +1,45 @@
+import { describe, expect, it } from 'bun:test'
+
+import { INITIAL_PROTOCOL_COPY_STATE, copyProtocolToClipboard, protocolCopyReducer } from './participantProtocolCopy'
+
+describe('copyProtocolToClipboard', () => {
+  it('writes the protocol and reports success', async () => {
+    const written: string[] = []
+    const clipboard = { writeText: async (text: string) => void written.push(text) }
+    expect(await copyProtocolToClipboard('261009-K7M2', clipboard)).toBe(true)
+    expect(written).toEqual(['261009-K7M2'])
+  })
+
+  it('reports failure silently when the clipboard rejects', async () => {
+    const clipboard = { writeText: async () => Promise.reject(new Error('denied')) }
+    expect(await copyProtocolToClipboard('261009-K7M2', clipboard)).toBe(false)
+  })
+
+  it('reports failure when there is no clipboard', async () => {
+    expect(await copyProtocolToClipboard('261009-K7M2', undefined)).toBe(false)
+  })
+})
+
+describe('protocolCopyReducer', () => {
+  it('starts not copied', () => {
+    expect(INITIAL_PROTOCOL_COPY_STATE).toEqual({ copyCount: 0, isCopied: false })
+  })
+
+  it('a copy marks it copied and counts it', () => {
+    expect(protocolCopyReducer(INITIAL_PROTOCOL_COPY_STATE, { type: 'copied' })).toEqual({
+      copyCount: 1,
+      isCopied: true,
+    })
+  })
+
+  it('a second copy while still copied bumps the counter so the timer restarts and the notice is announced again', () => {
+    const first = protocolCopyReducer(INITIAL_PROTOCOL_COPY_STATE, { type: 'copied' })
+    const second = protocolCopyReducer(first, { type: 'copied' })
+    expect(second).toEqual({ copyCount: 2, isCopied: true })
+  })
+
+  it('expiry clears the notice and keeps the count', () => {
+    const copied = protocolCopyReducer(INITIAL_PROTOCOL_COPY_STATE, { type: 'copied' })
+    expect(protocolCopyReducer(copied, { type: 'expired' })).toEqual({ copyCount: 1, isCopied: false })
+  })
+})

package/src/participant/participantProtocolCopy.ts

@@ -0,0 +1,32 @@
+export type ProtocolClipboard = {
+  readonly writeText: (text: string) => Promise<void>
+}
+
+/** Failure is silent by design: the protocol stays visible and selectable. */
+export async function copyProtocolToClipboard(
+  protocol: string,
+  clipboard: ProtocolClipboard | undefined,
+): Promise<boolean> {
+  if (clipboard === undefined) return false
+  try {
+    await clipboard.writeText(protocol)
+    return true
+  } catch {
+    return false
+  }
+}
+
+export type ProtocolCopyState = {
+  readonly copyCount: number
+  readonly isCopied: boolean
+}
+
+export type ProtocolCopyAction = { readonly type: 'copied' } | { readonly type: 'expired' }
+
+export const INITIAL_PROTOCOL_COPY_STATE: ProtocolCopyState = { copyCount: 0, isCopied: false }
+
+/** The counter changes on every copy so a repeat inside the window restarts the timer. */
+export function protocolCopyReducer(state: ProtocolCopyState, action: ProtocolCopyAction): ProtocolCopyState {
+  if (action.type === 'copied') return { copyCount: state.copyCount + 1, isCopied: true }
+  return { ...state, isCopied: false }
+}

package/src/participantLayoutShrink.test.ts

@@ -0,0 +1,82 @@
+import { readFileSync } from 'node:fs'
+import { join } from 'node:path'
+import { describe, expect, it } from 'bun:test'
+
+import { splitBlocks } from './cssBlocks.test-helper'
+
+const CSS = readFileSync(join(import.meta.dir, 'styles.css'), 'utf8').replace(/\/\*[\s\S]*?\*\//g, '')
+
+const NON_SHRINKING_ITEMS = [
+  '.cv-p-filters',
+  '.cv-p-quick',
+  '.cv-p-search',
+  '.cv-p-composer',
+  '.cv-p-thread__header',
+  '.cv-p-thread__subject-card',
+]
+
+type FlexState = { grow: number; shrink: number }
+
+const FLEX_KEYWORDS: Record<string, FlexState> = {
+  none: { grow: 0, shrink: 0 },
+  auto: { grow: 1, shrink: 1 },
+  initial: { grow: 0, shrink: 1 },
+}
+
+function parseFlexShorthand(value: string): FlexState {
+  const keyword = FLEX_KEYWORDS[value]
+  if (keyword) return { ...keyword }
+  const numbers = value
+    .split(/\s+/)
+    .filter((token) => /^\d*\.?\d+$/.test(token))
+    .map(Number)
+  return { grow: numbers[0] ?? 0, shrink: numbers[1] ?? 1 }
+}
+
+function cleanValue(raw: string): string {
+  return raw
+    .replace(/!important/g, '')
+    .trim()
+    .toLowerCase()
+}
+
+// Only depth-0 style rules count (@media/@supports are conditional); later declarations win.
+function effectiveFlex(selector: string): FlexState | undefined {
+  let state: FlexState | undefined
+  for (const { prelude, body } of splitBlocks(CSS)) {
+    if (body === undefined || prelude.startsWith('@')) continue
+    if (!prelude.split(',').some((entry) => entry.trim() === selector)) continue
+    for (const declaration of body.split(';')) {
+      const separator = declaration.indexOf(':')
+      if (separator === -1) continue
+      const property = declaration.slice(0, separator).trim().toLowerCase()
+      const value = cleanValue(declaration.slice(separator + 1))
+      if (property === 'flex') state = parseFlexShorthand(value)
+      if (property === 'flex-shrink') state = { grow: state?.grow ?? 0, shrink: Number(value) }
+    }
+  }
+  return state
+}
+
+function hasMinHeightZero(selector: string): boolean {
+  return splitBlocks(CSS).some(
+    ({ prelude, body }) =>
+      body !== undefined &&
+      !prelude.startsWith('@') &&
+      prelude.split(',').some((entry) => entry.trim() === selector) &&
+      /min-height:\s*0\b/.test(body),
+  )
+}
+
+describe('participant view flex layout', () => {
+  it.each(NON_SHRINKING_ITEMS)('%s does not shrink inside a flex column', (selector) => {
+    expect(effectiveFlex(selector)?.shrink).toBe(0)
+  })
+
+  it('keeps the thread scroller as the only shrinking, growing region', () => {
+    const scroller = effectiveFlex('.cv-p-thread__scroll')
+    expect(scroller?.grow).toBe(1)
+    expect(scroller?.shrink).toBe(1)
+    expect(hasMinHeightZero('.cv-p-thread__scroll')).toBe(true)
+  })
+})