@planningcenter/chat-react-native 3.0.0 → 3.1.0-rc.1

package/build/types/resources/denormalized_attachment_resource.d.ts

@@ -0,0 +1,88 @@
+/**
+ * This is the type of message attachment that is denormalized onto the message resource.
+ * It is what we receive from `MessageVertex#attachments`.
+ */
+export type DenormalizedAttachmentResource = DenormalizedMessageAttachmentResource | DenormalizedGiphyAttachmentResource | DenormalizedExpandedLinkAttachmentResource;
+export type DenormalizedAttachmentResourceForCreate = DenormalizedMessageAttachmentResourceForCreate | DenormalizedGiphyAttachmentResourceForCreate | DenormalizedExpandedLinkAttachmentResource;
+interface GenericAttachmentResource {
+    type: string;
+    id?: string;
+    [key: string]: unknown;
+}
+export interface DenormalizedMessageAttachmentResource extends GenericAttachmentResource {
+    type: 'MessageAttachment';
+    id: string;
+    attributes: {
+        filename: string;
+        key: string;
+        contentType: string;
+        byteSize: number;
+        checksum: string;
+        metadata?: {
+            width?: number;
+            height?: number;
+            analyzed?: boolean;
+            identified?: boolean;
+        };
+        url: string;
+        urlMedium?: string;
+    };
+}
+export interface DenormalizedMessageAttachmentResourceForCreate extends GenericAttachmentResource {
+    type: 'MessageAttachment';
+    id: string;
+}
+export interface DenormalizedGiphyAttachmentResource extends GenericAttachmentResource {
+    type: 'giphy';
+    id: string;
+    title: string;
+    originalGiphyTitle?: string;
+    titleLink: string;
+    thumbUrl: string;
+    giphy: {
+        original: GiphyVariant;
+        fixedHeight: GiphyVariant;
+        fixedHeightStill: GiphyVariant;
+        fixedHeightDownsampled: GiphyVariant;
+        fixedWidth: GiphyVariant;
+        fixedWidthStill: GiphyVariant;
+        fixedWidthDownsampled: GiphyVariant;
+    };
+}
+export interface DenormalizedGiphyAttachmentResourceForCreate extends GenericAttachmentResource {
+    type: 'giphy';
+    id: string;
+    title: string;
+    original_giphy_title: string;
+    title_link: string;
+    thumb_url: string;
+    giphy: {
+        original: GiphyVariant;
+        fixed_height: GiphyVariant;
+        fixed_height_still: GiphyVariant;
+        fixed_height_downsampled: GiphyVariant;
+        fixed_width: GiphyVariant;
+        fixed_width_still: GiphyVariant;
+        fixed_width_downsampled: GiphyVariant;
+    };
+}
+interface GiphyVariant {
+    url: string;
+    width: number;
+    height: number;
+    size: string;
+    frames: string;
+}
+export interface DenormalizedExpandedLinkAttachmentResource extends GenericAttachmentResource {
+    type: 'ExpandedLink';
+    attributes: {
+        url: string;
+        title?: string;
+        description?: string;
+        imageUrl?: string;
+        imageHeight?: number;
+        imageWidth?: number;
+    };
+}
+export {};
+//# sourceMappingURL=denormalized_attachment_resource.d.ts.map

package/build/types/resources/denormalized_attachment_resource.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"denormalized_attachment_resource.d.ts","sourceRoot":"","sources":["../../../src/types/resources/denormalized_attachment_resource.ts"],"names":[],"mappings":"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"}

package/build/types/resources/denormalized_attachment_resource.js

@@ -0,0 +1,6 @@
+/**
+ * This is the type of message attachment that is denormalized onto the message resource.
+ * It is what we receive from `MessageVertex#attachments`.
+ */
+export {};
+//# sourceMappingURL=denormalized_attachment_resource.js.map

package/build/types/resources/denormalized_attachment_resource.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"denormalized_attachment_resource.js","sourceRoot":"","sources":["../../../src/types/resources/denormalized_attachment_resource.ts"],"names":[],"mappings":"AAAA;;;GAGG","sourcesContent":["/**\n * This is the type of message attachment that is denormalized onto the message resource.\n * It is what we receive from `MessageVertex#attachments`.\n */\n\nexport type DenormalizedAttachmentResource =\n  | DenormalizedMessageAttachmentResource\n  | DenormalizedGiphyAttachmentResource\n  | DenormalizedExpandedLinkAttachmentResource\n\nexport type DenormalizedAttachmentResourceForCreate =\n  | DenormalizedMessageAttachmentResourceForCreate\n  | DenormalizedGiphyAttachmentResourceForCreate\n  | DenormalizedExpandedLinkAttachmentResource\n\ninterface GenericAttachmentResource {\n  type: string\n  id?: string\n  [key: string]: unknown\n}\n\nexport interface DenormalizedMessageAttachmentResource extends GenericAttachmentResource {\n  type: 'MessageAttachment'\n  id: string\n  attributes: {\n    filename: string\n    key: string\n    contentType: string\n    byteSize: number\n    checksum: string\n    metadata?: {\n      width?: number\n      height?: number\n      analyzed?: boolean\n      identified?: boolean\n    }\n    url: string\n    urlMedium?: string\n  }\n}\n\nexport interface DenormalizedMessageAttachmentResourceForCreate extends GenericAttachmentResource {\n  type: 'MessageAttachment'\n  id: string\n}\n\nexport interface DenormalizedGiphyAttachmentResource extends GenericAttachmentResource {\n  type: 'giphy'\n  id: string\n  title: string\n  originalGiphyTitle?: string\n  titleLink: string\n  thumbUrl: string\n  giphy: {\n    original: GiphyVariant\n    fixedHeight: GiphyVariant\n    fixedHeightStill: GiphyVariant\n    fixedHeightDownsampled: GiphyVariant\n    fixedWidth: GiphyVariant\n    fixedWidthStill: GiphyVariant\n    fixedWidthDownsampled: GiphyVariant\n  }\n}\n\nexport interface DenormalizedGiphyAttachmentResourceForCreate extends GenericAttachmentResource {\n  type: 'giphy'\n  id: string\n  title: string\n  original_giphy_title: string\n  title_link: string\n  thumb_url: string\n  giphy: {\n    original: GiphyVariant\n    fixed_height: GiphyVariant\n    fixed_height_still: GiphyVariant\n    fixed_height_downsampled: GiphyVariant\n    fixed_width: GiphyVariant\n    fixed_width_still: GiphyVariant\n    fixed_width_downsampled: GiphyVariant\n  }\n}\n\ninterface GiphyVariant {\n  url: string\n  width: number\n  height: number\n  size: string\n  frames: string\n}\n\nexport interface DenormalizedExpandedLinkAttachmentResource extends GenericAttachmentResource {\n  type: 'ExpandedLink'\n  attributes: {\n    url: string\n    title?: string\n    description?: string\n    imageUrl?: string\n    imageHeight?: number\n    imageWidth?: number\n  }\n}\n"]}

package/build/types/resources/message.d.ts

@@ -1,13 +1,16 @@
+import { DenormalizedAttachmentResource } from './denormalized_attachment_resource';
 import type { PersonResource } from './person';
 import type { ReactionCountResource } from './reaction';
 export interface MessageResource {
     type: 'Message';
     id: string;
     text: string;
+    html: string;
     createdAt: string;
+    deletedAt: string | null;
     textEditedAt: string | null;
     mine: boolean;
-    attachments: unknown[];
+    attachments: DenormalizedAttachmentResource[];
     author: PersonResource;
     reactionCounts: ReactionCountResource[];
     renderAuthor?: boolean;

package/build/types/resources/message.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message.d.ts","sourceRoot":"","sources":["../../../src/types/resources/message.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAC9C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAEvD,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,SAAS,CAAA;IACf,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,EAAE,MAAM,CAAA;IACjB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,IAAI,EAAE,OAAO,CAAA;IACb,WAAW,EAAE,OAAO,EAAE,CAAA;IACtB,MAAM,EAAE,cAAc,CAAA;IACtB,cAAc,EAAE,qBAAqB,EAAE,CAAA;IAGvC,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB"}
+{"version":3,"file":"message.d.ts","sourceRoot":"","sources":["../../../src/types/resources/message.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,8BAA8B,EAAE,MAAM,oCAAoC,CAAA;AACnF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAA;AAC9C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAEvD,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,SAAS,CAAA;IACf,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAA;IACxB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,IAAI,EAAE,OAAO,CAAA;IACb,WAAW,EAAE,8BAA8B,EAAE,CAAA;IAC7C,MAAM,EAAE,cAAc,CAAA;IACtB,cAAc,EAAE,qBAAqB,EAAE,CAAA;IAGvC,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB"}

package/build/types/resources/message.js.map

@@ -1 +1 @@
-{"version":3,"file":"message.js","sourceRoot":"","sources":["../../../src/types/resources/message.ts"],"names":[],"mappings":"","sourcesContent":["import type { PersonResource } from './person'\nimport type { ReactionCountResource } from './reaction'\n\nexport interface MessageResource {\n  type: 'Message'\n  id: string\n  text: string\n  createdAt: string\n  textEditedAt: string | null\n  mine: boolean\n  attachments: unknown[]\n  author: PersonResource\n  reactionCounts: ReactionCountResource[]\n\n  // Custom Local Properties we set for rendering\n  renderAuthor?: boolean\n  renderTime?: boolean\n}\n"]}
+{"version":3,"file":"message.js","sourceRoot":"","sources":["../../../src/types/resources/message.ts"],"names":[],"mappings":"","sourcesContent":["import { DenormalizedAttachmentResource } from './denormalized_attachment_resource'\nimport type { PersonResource } from './person'\nimport type { ReactionCountResource } from './reaction'\n\nexport interface MessageResource {\n  type: 'Message'\n  id: string\n  text: string\n  html: string\n  createdAt: string\n  deletedAt: string | null\n  textEditedAt: string | null\n  mine: boolean\n  attachments: DenormalizedAttachmentResource[]\n  author: PersonResource\n  reactionCounts: ReactionCountResource[]\n\n  // Custom Local Properties we set for rendering\n  renderAuthor?: boolean\n  renderTime?: boolean\n}\n"]}

package/build/types/resources/person.d.ts

@@ -2,6 +2,8 @@ import { ResourceObject } from '../api_primitives';
 export interface PersonResource extends ResourceObject {
     name: string;
     avatar: string;
+}
+export interface CurrentPersonResource extends PersonResource {
     canChat: boolean;
     unreadCount: number;
     pcoChatEnabled: boolean;

package/build/types/resources/person.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"person.d.ts","sourceRoot":"","sources":["../../../src/types/resources/person.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAElD,MAAM,WAAW,cAAe,SAAQ,cAAc;IACpD,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,OAAO,CAAA;IAChB,WAAW,EAAE,MAAM,CAAA;IACnB,cAAc,EAAE,OAAO,CAAA;CACxB"}
+{"version":3,"file":"person.d.ts","sourceRoot":"","sources":["../../../src/types/resources/person.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAElD,MAAM,WAAW,cAAe,SAAQ,cAAc;IACpD,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;CACf;AAED,MAAM,WAAW,qBAAsB,SAAQ,cAAc;IAC3D,OAAO,EAAE,OAAO,CAAA;IAChB,WAAW,EAAE,MAAM,CAAA;IACnB,cAAc,EAAE,OAAO,CAAA;CACxB"}

package/build/types/resources/person.js.map

@@ -1 +1 @@
-{"version":3,"file":"person.js","sourceRoot":"","sources":["../../../src/types/resources/person.ts"],"names":[],"mappings":"","sourcesContent":["import { ResourceObject } from '../api_primitives'\n\nexport interface PersonResource extends ResourceObject {\n  name: string\n  avatar: string\n  canChat: boolean\n  unreadCount: number\n  pcoChatEnabled: boolean\n}\n"]}
+{"version":3,"file":"person.js","sourceRoot":"","sources":["../../../src/types/resources/person.ts"],"names":[],"mappings":"","sourcesContent":["import { ResourceObject } from '../api_primitives'\n\nexport interface PersonResource extends ResourceObject {\n  name: string\n  avatar: string\n}\n\nexport interface CurrentPersonResource extends PersonResource {\n  canChat: boolean\n  unreadCount: number\n  pcoChatEnabled: boolean\n}\n"]}

package/build/utils/deepCamelCaseKeys.d.ts

@@ -0,0 +1,4 @@
+type ObjType = Record<string, unknown> | unknown[] | unknown;
+export declare function deepCamelCaseKeys<T extends ObjType>(obj: T): T;
+export {};
+//# sourceMappingURL=deepCamelCaseKeys.d.ts.map

package/build/utils/deepCamelCaseKeys.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"deepCamelCaseKeys.d.ts","sourceRoot":"","sources":["../../src/utils/deepCamelCaseKeys.ts"],"names":[],"mappings":"AAEA,KAAK,OAAO,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,OAAO,EAAE,GAAG,OAAO,CAAA;AAE5D,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,OAAO,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,CAU9D"}

package/build/utils/deepCamelCaseKeys.js

@@ -0,0 +1,11 @@
+import { camelCase, isArray, isObject, mapKeys, mapValues } from 'lodash';
+export function deepCamelCaseKeys(obj) {
+    if (isArray(obj)) {
+        return obj.map(deepCamelCaseKeys);
+    }
+    else if (isObject(obj)) {
+        return mapValues(mapKeys(obj, (_value, key) => camelCase(key)), deepCamelCaseKeys);
+    }
+    return obj;
+}
+//# sourceMappingURL=deepCamelCaseKeys.js.map

package/build/utils/deepCamelCaseKeys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"deepCamelCaseKeys.js","sourceRoot":"","sources":["../../src/utils/deepCamelCaseKeys.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AAIzE,MAAM,UAAU,iBAAiB,CAAoB,GAAM;IACzD,IAAI,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;QACjB,OAAQ,GAAiB,CAAC,GAAG,CAAC,iBAAiB,CAAM,CAAA;IACvD,CAAC;SAAM,IAAI,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;QACzB,OAAO,SAAS,CACd,OAAO,CAAC,GAAG,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,EAC7C,iBAAiB,CACb,CAAA;IACR,CAAC;IACD,OAAO,GAAG,CAAA;AACZ,CAAC","sourcesContent":["import { camelCase, isArray, isObject, mapKeys, mapValues } from 'lodash'\n\ntype ObjType = Record<string, unknown> | unknown[] | unknown\n\nexport function deepCamelCaseKeys<T extends ObjType>(obj: T): T {\n  if (isArray(obj)) {\n    return (obj as T & any[]).map(deepCamelCaseKeys) as T\n  } else if (isObject(obj)) {\n    return mapValues(\n      mapKeys(obj, (_value, key) => camelCase(key)),\n      deepCamelCaseKeys\n    ) as T\n  }\n  return obj\n}\n"]}

package/build/utils/jolt/transform_message_event_data_to_message_resource.d.ts

@@ -0,0 +1,7 @@
+import { MessageResource } from '../../types';
+import { MessageCreatedEvent } from '../../types/jolt_events/message_events';
+export declare function transformMessageEventDataToMessageResource({ data, currentPersonId, }: {
+    data: MessageCreatedEvent['data']['data'];
+    currentPersonId: string;
+}): MessageResource;
+//# sourceMappingURL=transform_message_event_data_to_message_resource.d.ts.map

package/build/utils/jolt/transform_message_event_data_to_message_resource.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform_message_event_data_to_message_resource.d.ts","sourceRoot":"","sources":["../../../src/utils/jolt/transform_message_event_data_to_message_resource.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAC7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAA;AAI5E,wBAAgB,0CAA0C,CAAC,EACzD,IAAI,EACJ,eAAe,GAChB,EAAE;IACD,IAAI,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAA;IACzC,eAAe,EAAE,MAAM,CAAA;CACxB,GAAG,eAAe,CAmBlB"}

package/build/utils/jolt/transform_message_event_data_to_message_resource.js

@@ -0,0 +1,22 @@
+import { deepCamelCaseKeys } from '../deepCamelCaseKeys';
+export function transformMessageEventDataToMessageResource({ data, currentPersonId, }) {
+    return {
+        type: 'Message',
+        id: data.sort_key,
+        text: data.text,
+        html: data.html,
+        createdAt: data.created_at,
+        deletedAt: data.deleted_at,
+        textEditedAt: data.text_edited_at,
+        mine: data.author_id.toString() === currentPersonId.toString(),
+        attachments: deepCamelCaseKeys(data.attachments) || [],
+        author: {
+            type: 'Person',
+            id: data.author_id.toString(),
+            name: data.author_name,
+            avatar: data.author_avatar,
+        },
+        reactionCounts: [],
+    };
+}
+//# sourceMappingURL=transform_message_event_data_to_message_resource.js.map

package/build/utils/jolt/transform_message_event_data_to_message_resource.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"transform_message_event_data_to_message_resource.js","sourceRoot":"","sources":["../../../src/utils/jolt/transform_message_event_data_to_message_resource.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAExD,MAAM,UAAU,0CAA0C,CAAC,EACzD,IAAI,EACJ,eAAe,GAIhB;IACC,OAAO;QACL,IAAI,EAAE,SAAS;QACf,EAAE,EAAE,IAAI,CAAC,QAAQ;QACjB,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,SAAS,EAAE,IAAI,CAAC,UAAU;QAC1B,SAAS,EAAE,IAAI,CAAC,UAAU;QAC1B,YAAY,EAAE,IAAI,CAAC,cAAc;QACjC,IAAI,EAAE,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,KAAK,eAAe,CAAC,QAAQ,EAAE;QAC9D,WAAW,EAAE,iBAAiB,CAAmC,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE;QACxF,MAAM,EAAE;YACN,IAAI,EAAE,QAAQ;YACd,EAAE,EAAE,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE;YAC7B,IAAI,EAAE,IAAI,CAAC,WAAW;YACtB,MAAM,EAAE,IAAI,CAAC,aAAa;SAC3B;QACD,cAAc,EAAE,EAAE;KACnB,CAAA;AACH,CAAC","sourcesContent":["import { MessageResource } from '../../types'\nimport { MessageCreatedEvent } from '../../types/jolt_events/message_events'\nimport { DenormalizedAttachmentResource } from '../../types/resources/denormalized_attachment_resource'\nimport { deepCamelCaseKeys } from '../deepCamelCaseKeys'\n\nexport function transformMessageEventDataToMessageResource({\n  data,\n  currentPersonId,\n}: {\n  data: MessageCreatedEvent['data']['data']\n  currentPersonId: string\n}): MessageResource {\n  return {\n    type: 'Message',\n    id: data.sort_key,\n    text: data.text,\n    html: data.html,\n    createdAt: data.created_at,\n    deletedAt: data.deleted_at,\n    textEditedAt: data.text_edited_at,\n    mine: data.author_id.toString() === currentPersonId.toString(),\n    attachments: deepCamelCaseKeys<DenormalizedAttachmentResource[]>(data.attachments) || [],\n    author: {\n      type: 'Person',\n      id: data.author_id.toString(),\n      name: data.author_name,\n      avatar: data.author_avatar,\n    },\n    reactionCounts: [],\n  }\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planningcenter/chat-react-native",
-  "version": "3.0.0",
+  "version": "3.1.0-rc.1",
   "description": "",
   "main": "build/index.js",
   "types": "build/index.d.ts",
@@ -52,5 +52,5 @@
     "prettier": "^3.4.2",
     "typescript": "<5.6.0"
   },
-  "gitHead": "9ba41b63c9b41a8a118a36b4d14019fe90fe3368"
+  "gitHead": "a653776f157e5b79468f1221233ea8a082dc009e"
 }

package/src/components/display/badge.tsx

@@ -181,6 +181,7 @@ const useStyles = ({
       flexDirection: 'row',
       alignItems: 'center',
       justifyContent: 'center',
+      alignSelf: 'flex-start',
       borderRadius: variantStylesMap[variant].borderRadius,
       borderWidth: variantStylesMap[variant].borderWidth,
       borderColor: statusColorMap[appearance].background,
@@ -205,12 +206,14 @@ const useStyles = ({
       color: variantStylesMap[variant].textColor,
       fontWeight: variantStylesMap[variant].fontWeight,
       fontSize: badgeFontSize,
+      lineHeight: 15 * fontScale,
     },
     metaLabel: {
       paddingHorizontal: variantStylesMap[variant].paddingHorizontal,
       fontSize: badgeFontSize,
       flexShrink: 1,
       paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,
+      lineHeight: 15 * fontScale,
     },
   })
 }

package/src/components/display/index.ts

@@ -1,15 +1,16 @@
-export * from './avatar'
 export * from './avatar_group'
+export * from './avatar'
 export * from './badge'
-export * from './banner'
 export * from './banner_collapsible'
+export * from './banner'
 export * from './button'
 export * from './heading'
-export * from './icon'
 export * from './icon_button'
+export * from './icon'
 export * from './image'
+export * from './person'
 export * from './spinner'
 export * from './switch'
-export * from './text'
 export * from './text_button'
 export * from './text_inline_button'
+export * from './text'

package/src/components/display/person.tsx

@@ -0,0 +1,90 @@
+import React from 'react'
+import { StyleSheet, View } from 'react-native'
+import { useTheme } from '../../hooks'
+import { platformFontWeightMedium } from '../../utils/styles'
+import { MemberResource } from '../../types'
+import { Avatar } from './avatar'
+import { Text } from './text'
+import { Badge } from './badge'
+import { space } from '../../utils'
+
+// =================================
+// ====== Components ===============
+// =================================
+
+interface PersonProps {
+  person: MemberResource
+}
+
+export function Person({ person }: PersonProps) {
+  return person.child ? <Child person={person} /> : <Adult person={person} />
+}
+
+export function Adult({ person }: PersonProps) {
+  const styles = useStyles()
+
+  return (
+    <View style={styles.wrapper}>
+      <Avatar sourceUri={person.avatar} />
+      <View style={styles.content}>
+        <Text style={styles.name}>{person.name}</Text>
+        <View style={styles.badges}>
+          {person.badges?.map((badge, index) => <Badge key={index} label={badge.title} />)}
+        </View>
+      </View>
+    </View>
+  )
+}
+export function Child({ person }: PersonProps) {
+  const styles = useStyles()
+
+  return (
+    <View style={styles.wrapper}>
+      <View style={styles.childAvatar}>
+        <Avatar sourceUri={person.avatar} />
+      </View>
+      <View style={styles.content}>
+        <Text style={[styles.name, styles.childName]}>{person.name}</Text>
+        <View style={styles.badges}>
+          <Badge
+            label="Not eligible to chat"
+            appearance="warning"
+            iconName="general.shieldExclamation"
+          />
+        </View>
+      </View>
+    </View>
+  )
+}
+
+// =================================
+// ====== Styles ===================
+// =================================
+
+const useStyles = () => {
+  const { colors } = useTheme()
+
+  return StyleSheet.create({
+    wrapper: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: space(1),
+    },
+    content: {
+      gap: space(0.25),
+    },
+    name: {
+      fontWeight: platformFontWeightMedium,
+    },
+    childName: {
+      color: colors.textColorDefaultSecondary,
+    },
+    childAvatar: {
+      opacity: 0.5,
+    },
+    badges: {
+      flexDirection: 'row',
+      gap: space(0.5),
+    },
+  })
+}

package/src/hooks/use_conversation_messages.ts

@@ -1,4 +1,5 @@
 import { MessageResource } from '../types'
+import { useConversationMessagesJoltEvents } from './use_conversation_messages_jolt_events'
 import {
   getRequestQueryKey,
   SuspensePaginatorOptions,
@@ -16,6 +17,11 @@ export const useConversationMessages = (
   const queryKey = getMessagesQueryKey({ conversation_id })
   const messages = data.sort((a, b) => -a.id.localeCompare(b.id))
 
+  useConversationMessagesJoltEvents({
+    conversationId: conversation_id,
+    refetchMessages: refetch,
+  })
+
   return { messages, refetch, isRefetching, fetchNextPage, queryKey }
 }
 

package/src/hooks/use_conversation_messages_jolt_events.ts

@@ -0,0 +1,51 @@
+import { ApiCollection, MessageResource } from '../types'
+import { useJoltChannel, useJoltEvent } from './use_jolt'
+import { updateRecordInPagesData } from '../utils'
+import { MessageCreatedEvent } from '../types/jolt_events/message_events'
+import { InfiniteData, useQueryClient } from '@tanstack/react-query'
+import { useCurrentPerson } from './use_current_person'
+import { transformMessageEventDataToMessageResource } from '../utils/jolt/transform_message_event_data_to_message_resource'
+import { getMessagesRequestArgs } from './use_conversation_messages'
+import { getRequestQueryKey } from './use_suspense_api'
+
+interface Props {
+  conversationId: string
+  refetchMessages?: () => void
+}
+
+export function useConversationMessagesJoltEvents({ conversationId, refetchMessages }: Props) {
+  const queryClient = useQueryClient()
+  const currentPerson = useCurrentPerson()
+  const joltChannel = useJoltChannel(`chat.conversations.${conversationId}`)
+  const messagesRequestArgs = getMessagesRequestArgs({ conversation_id: conversationId })
+  const messagesQueryKey = getRequestQueryKey(messagesRequestArgs)
+
+  const handleMessageJoltEvent = async () => {
+    refetchMessages?.()
+  }
+
+  const handleMessageUpdateOrCreate = async (e: MessageCreatedEvent) => {
+    const { data } = e.data
+    const message = transformMessageEventDataToMessageResource({
+      data,
+      currentPersonId: currentPerson.id,
+    })
+
+    queryClient.setQueryData<QueryData>(messagesQueryKey, prev =>
+      updateRecordInPagesData({
+        data: prev,
+        record: message,
+        processRecord: (record, current) => {
+          return { ...current, ...record }
+        },
+      })
+    )
+  }
+
+  useJoltEvent(joltChannel, 'message.created', handleMessageUpdateOrCreate)
+  useJoltEvent(joltChannel, 'message.updated', handleMessageUpdateOrCreate)
+  useJoltEvent(joltChannel, 'message.deleted', handleMessageJoltEvent)
+  useJoltEvent(joltChannel, 'reaction.*', handleMessageJoltEvent)
+}
+
+type QueryData = InfiniteData<ApiCollection<MessageResource>>

package/src/hooks/use_current_person.ts

@@ -1,8 +1,8 @@
-import { PersonResource } from '../types'
+import { CurrentPersonResource } from '../types'
 import { useSuspenseGet } from './use_suspense_api'
 
 export const useCurrentPerson = () => {
-  const { data: person } = useSuspenseGet<PersonResource>({
+  const { data: person } = useSuspenseGet<CurrentPersonResource>({
     url: '/me',
     data: {
       fields: {

package/src/screens/conversation_details_screen.tsx

@@ -15,14 +15,14 @@ import {
   type ViewStyle,
   type ViewProps,
 } from 'react-native'
-import { Avatar, Badge, Heading, Icon, Switch, Text } from '../components'
+import { Heading, Icon, Person, Switch, Text } from '../components'
 import { useSuspenseGet, useTheme } from '../hooks'
 import {
   useConversation,
   useConversationMute,
   useConversationUpdate,
 } from '../hooks/use_conversation'
-import { MemberBadge, MemberResource, isDefined } from '../types'
+import { MemberResource, isDefined } from '../types'
 import { HeaderRightButton } from '../navigation/header'
 import { FlashList } from '@shopify/flash-list'
 import { space } from '../utils'
@@ -157,7 +157,7 @@ export function ConversationDetailsScreen({ route }: ConversationDetailsScreenPr
           case SectionTypes.members:
             return (
               <ListSection isStart={isStart} isEnd={isEnd} style={item?.sectionStyle}>
-                <MemberRow {...item.data} />
+                <Person person={{ ...item.data }} />
               </ListSection>
             )
           case SectionTypes.setting:
@@ -267,33 +267,6 @@ function SettingRow({
   )
 }
 
-interface MemberRowProps {
-  avatar: string
-  name: string
-  style?: ViewStyle
-  badges?: MemberBadge[]
-}
-
-function MemberRow({ avatar, name, style, badges }: MemberRowProps) {
-  const styles = useStyles()
-
-  return (
-    <View style={[styles.member, style]}>
-      <Avatar sourceUri={avatar} />
-      <View style={styles.memberBody}>
-        <Text style={styles.memberName}>{name}</Text>
-        <View style={styles.memberBadges}>
-          {badges?.map((badge, index) => (
-            <View key={index} style={styles.memberBadge}>
-              <Badge label={badge.title} />
-            </View>
-          ))}
-        </View>
-      </View>
-    </View>
-  )
-}
-
 // =================================
 // ====== Styles ===================
 // =================================

package/src/screens/design_system_screen.tsx

@@ -13,6 +13,7 @@ import {
   Icon,
   IconButton,
   Image,
+  Person,
   Spinner,
   Switch,
   Text,
@@ -50,6 +51,24 @@ const URL = {
   ],
 }
 
+const personAdult = {
+  id: '1',
+  type: 'Member' as const,
+  name: 'John Doe',
+  avatar: URL.avatar,
+  badges: [{ title: 'Conversation owner' }, { title: 'Leader' }],
+  child: false,
+}
+
+const personChild = {
+  id: '2',
+  type: 'Member' as const,
+  name: 'Kid McChild',
+  avatar: URL.two_avatars[1],
+  badges: [],
+  child: true,
+}
+
 const buttonPress = () => Alert.alert('Button clicked')
 
 // =================================
@@ -69,7 +88,8 @@ export function DesignSystemScreen() {
       <PressablesSection />
       <ImageIconsSection />
       <FormControlsSection />
-      <StatusComponentsSection isLast />
+      <StatusComponentsSection />
+      <MiscComponentsSection isLast />
     </ScrollView>
   )
 }
@@ -852,6 +872,22 @@ function StatusComponentsSection({ isLast }: SectionProps) {
   )
 }
 
+function MiscComponentsSection({ isLast }: SectionProps) {
+  return (
+    <CollapsableSection title="Misc components" isLast={isLast}>
+      <Group
+        title="Person"
+        description="Takes a person object (`MemberResource` type) and displays an avatar, name, and badges. If person is a child we show a special badge and faded styles. Implomentation is based on a similar Chat Web component."
+      >
+        <Column>
+          <Person person={personAdult} />
+          <Person person={personChild} />
+        </Column>
+      </Group>
+    </CollapsableSection>
+  )
+}
+
 // =================================
 // ====== Docs UI ==================
 // =================================

package/src/types/jolt_events/conversation_events.ts

@@ -0,0 +1,41 @@
+import type { CustomMessage } from '@planningcenter/jolt-client/dist/types/JoltConnection'
+
+type DateString = string
+interface BaseConversationEventData extends Record<string, unknown> {
+  data: {
+    id: number
+    archived_at: DateString
+    created_at: DateString
+    last_message_author_id?: number
+    last_message_author_name?: string
+    last_message_created_at?: DateString
+    last_message_sort_key?: string
+    last_message_text_preview?: string
+    latest_read_message_sort_key?: string
+    organization_id: number
+    replies_disabled: boolean
+    subtitle?: string
+    title: string
+    updated_at: DateString
+  }
+}
+
+export interface ConversationCreatedEvent extends CustomMessage {
+  event: 'conversation.created'
+  data: BaseConversationEventData
+}
+
+export interface ConversationUpdatedEvent extends CustomMessage {
+  event: 'conversation.updated'
+  data: BaseConversationEventData
+}
+
+export interface ConversationDeletedEvent extends CustomMessage {
+  event: 'conversation.destroyed'
+  data: BaseConversationEventData
+}
+
+export interface ConversationReadEvent extends CustomMessage {
+  event: 'conversation.read'
+  data: BaseConversationEventData
+}