@linktr.ee/messaging-react 3.6.2-rc-1783317817 → 3.6.2-rc-1783332217

package/src/components/CustomMessage/MessageDeliveryStatus.test.tsx

@@ -1,66 +0,0 @@
-import type { LocalMessage } from 'stream-chat'
-import { describe, expect, it } from 'vitest'
-
-import { renderWithProviders, screen } from '../../test/utils'
-
-import { MessageDeliveryStatus } from './MessageDeliveryStatus'
-
-const receivedMessage = {
-  id: 'message-1',
-  status: 'received',
-  type: 'regular',
-} as unknown as LocalMessage
-
-const render = (
-  props: Partial<{ message: LocalMessage; groupStyles: string[] }> = {}
-) =>
-  renderWithProviders(
-    <MessageDeliveryStatus
-      message={props.message ?? receivedMessage}
-      groupStyles={props.groupStyles ?? ['bottom']}
-    />
-  )
-
-describe('MessageDeliveryStatus', () => {
-  it.each(['bottom', 'single'] as const)(
-    'renders "Delivered" at the end of a group (groupStyle: %s)',
-    (style) => {
-      render({ groupStyles: [style] })
-
-      expect(screen.getByTestId('message-delivery-status')).toHaveTextContent(
-        'Delivered'
-      )
-    }
-  )
-
-  it.each(['top', 'middle'] as const)(
-    'renders nothing for a message that is not the end of its group (groupStyle: %s)',
-    (style) => {
-      const { container } = render({ groupStyles: [style] })
-
-      expect(container).toBeEmptyDOMElement()
-    }
-  )
-
-  it.each(['sending', 'failed'] as const)(
-    'renders nothing while the message status is %s',
-    (status) => {
-      const { container } = render({
-        message: { ...receivedMessage, status } as unknown as LocalMessage,
-      })
-
-      expect(container).toBeEmptyDOMElement()
-    }
-  )
-
-  it('renders nothing for error messages', () => {
-    const { container } = render({
-      message: {
-        ...receivedMessage,
-        type: 'error',
-      } as unknown as LocalMessage,
-    })
-
-    expect(container).toBeEmptyDOMElement()
-  })
-})

package/src/components/CustomMessage/MessageDeliveryStatus.tsx

@@ -1,53 +0,0 @@
-import { ChecksIcon } from '@phosphor-icons/react'
-import type { LocalMessage } from 'stream-chat'
-
-interface MessageDeliveryStatusProps {
-  message: LocalMessage
-  /**
-   * stream's per-message group-position styles (`'top' | 'middle' | 'bottom'
-   * | 'single'`). We key off this rather than the `endOfGroup` boolean:
-   * `endOfGroup` is only supplied by the *virtualized* MessageList, whereas
-   * the standard (non-virtualized) MessageList this package renders through
-   * passes `groupStyles` only. `getGroupStyles` accounts for author changes
-   * and time gaps, so it matches the visual grouping (incl. date breaks).
-   */
-  groupStyles?: string[]
-}
-
-/** The last bubble of a group is 'bottom' (a run) or 'single' (standalone). */
-const isEndOfGroup = (groupStyles?: string[]) =>
-  !!groupStyles &&
-  (groupStyles.includes('bottom') || groupStyles.includes('single'))
-
-/**
- * "✓✓ Delivered" status shown beneath the last bubble of every message group,
- * on both the sent (right) and received (left) sides (MES-1036). The design
- * displays the status per group rather than only on the most recent message.
- *
- * Renders only once a message is stored (`status === 'received'`, which
- * `formatMessage` sets on every persisted message, incoming included) and
- * never on errors. Left/right alignment comes from the outer grid (see
- * `styles.css`).
- */
-export const MessageDeliveryStatus = ({
-  message,
-  groupStyles,
-}: MessageDeliveryStatusProps) => {
-  if (
-    !isEndOfGroup(groupStyles) ||
-    message.type === 'error' ||
-    message.status !== 'received'
-  ) {
-    return null
-  }
-
-  return (
-    <div
-      className="str-chat__message-delivery-status"
-      data-testid="message-delivery-status"
-    >
-      <ChecksIcon size={14} weight="bold" aria-hidden="true" />
-      <span>Delivered</span>
-    </div>
-  )
-}