@planningcenter/chat-react-native 3.44.1-qa-875.0 → 3.44.1-qa-876.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/build/components/conversation/message.d.ts.map +1 -1
  2. package/build/components/conversation/message.js +8 -1
  3. package/build/components/conversation/message.js.map +1 -1
  4. package/build/components/conversation/message_form.d.ts.map +1 -1
  5. package/build/components/conversation/message_form.js +7 -1
  6. package/build/components/conversation/message_form.js.map +1 -1
  7. package/build/components/conversation/reply_shadow_message.d.ts.map +1 -1
  8. package/build/components/conversation/reply_shadow_message.js +8 -1
  9. package/build/components/conversation/reply_shadow_message.js.map +1 -1
  10. package/build/components/display/badge.d.ts.map +1 -1
  11. package/build/components/display/badge.js +15 -4
  12. package/build/components/display/badge.js.map +1 -1
  13. package/build/hooks/use_conversation_layout_diagnostics.d.ts +21 -0
  14. package/build/hooks/use_conversation_layout_diagnostics.d.ts.map +1 -0
  15. package/build/hooks/use_conversation_layout_diagnostics.js +99 -0
  16. package/build/hooks/use_conversation_layout_diagnostics.js.map +1 -0
  17. package/build/screens/conversation_screen.d.ts.map +1 -1
  18. package/build/screens/conversation_screen.js +16 -6
  19. package/build/screens/conversation_screen.js.map +1 -1
  20. package/build/screens/message_report_screen.d.ts.map +1 -1
  21. package/build/screens/message_report_screen.js +2 -4
  22. package/build/screens/message_report_screen.js.map +1 -1
  23. package/build/utils/aspect_ratio.d.ts.map +1 -1
  24. package/build/utils/aspect_ratio.js +4 -3
  25. package/build/utils/aspect_ratio.js.map +1 -1
  26. package/package.json +3 -3
  27. package/src/__tests__/hooks/use_conversation_layout_diagnostics.test.tsx +142 -0
  28. package/src/components/conversation/message.tsx +8 -1
  29. package/src/components/conversation/message_form.tsx +14 -2
  30. package/src/components/conversation/reply_shadow_message.tsx +8 -1
  31. package/src/components/display/badge.tsx +19 -3
  32. package/src/hooks/use_conversation_layout_diagnostics.ts +123 -0
  33. package/src/screens/conversation_screen.tsx +19 -5
  34. package/src/screens/message_report_screen.tsx +6 -4
  35. package/src/utils/aspect_ratio.ts +4 -3
@@ -1 +1 @@
1
- {"version":3,"file":"reply_shadow_message.js","sourceRoot":"","sources":["../../../src/components/conversation/reply_shadow_message.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAA;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,mBAAmB,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC/E,OAAO,QAAQ,MAAM,yBAAyB,CAAA;AAC9C,OAAO,EACL,iCAAiC,EACjC,YAAY,EACZ,wBAAwB,EACxB,QAAQ,GACT,MAAM,aAAa,CAAA;AACpB,OAAO,EAAE,sBAAsB,EAAE,MAAM,sCAAsC,CAAA;AAC7E,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAA;AAQxE,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAC9E,OAAO,EACL,4CAA4C,EAC5C,wBAAwB,EACxB,kCAAkC,EAClC,wBAAwB,GACzB,MAAM,oBAAoB,CAAA;AAC3B,OAAO,EAAE,MAAM,EAAE,IAAI,EAAa,KAAK,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AACjE,OAAO,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAU1E,MAAM,UAAU,kBAAkB,CAAC,EACjC,eAAe,EACf,aAAa,EACb,SAAS,EACT,oBAAoB,EACpB,iBAAiB,GACO;IACxB,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,sBAAsB,CAAC,EAAE,eAAe,EAAE,SAAS,EAAE,CAAC,CAAA;IAE9F,IAAI,aAAa;QAAE,OAAO,IAAI,CAAA;IAC9B,IAAI,SAAS;QAAE,OAAO,KAAC,qBAAqB,IAAC,IAAI,EAAC,YAAY,GAAG,CAAA;IACjE,IAAI,OAAO,IAAI,CAAC,OAAO;QAAE,OAAO,KAAC,qBAAqB,IAAC,IAAI,EAAC,iBAAiB,GAAG,CAAA;IAEhF,MAAM,eAAe,GAAG;QACtB,GAAG,OAAO;QACV,oBAAoB;QACpB,iBAAiB;KAClB,CAAA;IAED,OAAO,KAAC,oBAAoB,IAAC,eAAe,EAAE,eAAe,KAAM,eAAe,GAAI,CAAA;AACxF,CAAC;AAMD,SAAS,oBAAoB,CAAC,EAAE,eAAe,EAAE,GAAG,OAAO,EAA6B;IACtF,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,OAAO,CAAA;IACxD,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,CAAC,CAAA;IACjC,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAC7B,MAAM,UAAU,GAAG,aAAa,EAAE,CAAA;IAClC,MAAM,SAAS,GAAG,mBAAmB,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;IAExD,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;IACvE,MAAM,EAAE,uBAAuB,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,GAC5E,iCAAiC,EAAE,CAAA;IACrC,MAAM,qBAAqB,GAAG,wBAAwB,CAAC,CAAC,CAAC,CAAA;IACzD,MAAM,cAAc,GAAG,SAAS,CAAC,OAAO,CAAC,UAAU,EAAE,OAAO,CAAC,CAAA;IAC7D,MAAM,SAAS,GAAG,CAAC,CAAC,SAAS,CAAA;IAC7B,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAA;IAExD,MAAM,uBAAuB,GAAG,GAAG,EAAE;QACnC,UAAU,CAAC,QAAQ,CAAC,mBAAmB,EAAE;YACvC,eAAe;YACf,aAAa,EAAE,OAAO,CAAC,WAAW;YAClC,sBAAsB,EAAE,OAAO,CAAC,MAAM,CAAC,IAAI;SAC5C,CAAC,CAAA;IACJ,CAAC,CAAA;IAED,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,WAAW,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAC5F,MAAM,kBAAkB,GAAG,GAAG,MAAM,EAAE,IAAI,IAAI,EAAE,kBAAkB,eAAe,IAC/E,WAAW,IAAI,EACjB,IAAI,SAAS,IAAI,cAAc,EAAE,CAAA;IAEjC,OAAO,CACL,KAAC,SAAS,IACR,cAAc,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,oBAAoB,EAAE,EACtD,OAAO,EAAE,uBAAuB,EAChC,SAAS,EAAE,oBAAoB,EAC/B,UAAU,EAAE,qBAAqB,EACjC,kBAAkB,EAAE,kBAAkB,EACtC,iBAAiB,EAAC,2CAA2C,EAC7D,iBAAiB,EAAC,MAAM,YAExB,MAAC,QAAQ,CAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,uBAAuB,CAAC,aAC5D,CAAC,OAAO,CAAC,IAAI,IAAI,CAChB,MAAC,IAAI,eACH,KAAC,IAAI,IAAC,KAAK,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,SAAS,IAAI,MAAM,CAAC,aAAa,CAAC,YACrE,KAAC,MAAM,IACL,IAAI,EAAC,IAAI,EACT,SAAS,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAChC,KAAK,EAAE,MAAM,CAAC,MAAM,EACpB,qBAAqB,EAAE,CAAC,EACxB,gBAAgB,EAAE,SAAS,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,gBAAgB,EACnE,YAAY,EAAE,SAAS,GACvB,GACG,EACP,KAAC,mBAAmB,IAAC,OAAO,EAAE,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,GAAI,IAC9E,CACR,EACD,MAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,cAAc,aAChC,MAAC,IAAI,IACH,KAAK,EAAE,MAAM,CAAC,aAAa,EAC3B,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,aAElE,KAAC,wBAAwB,IAAC,WAAW,EAAE,WAAW,GAAI,EACrD,IAAI,IAAI,CACP,KAAC,IAAI,IACH,OAAO,EAAC,UAAU,EAClB,KAAK,EAAE,MAAM,CAAC,WAAW,EACzB,aAAa,EAAE,qBAAqB,YAEnC,WAAW,GACP,CACR,IACI,EACP,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,WAAW,YAC7B,KAAC,IAAI,IAAC,OAAO,EAAC,UAAU,EAAC,KAAK,EAAE,MAAM,CAAC,cAAc,YAClD,cAAc,GACV,GACF,IACF,EACN,OAAO,CAAC,IAAI,IAAI,CACf,KAAC,gBAAgB,IAAC,OAAO,EAAE,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,GAAI,CACjF,IACa,GACN,CACb,CAAA;AACH,CAAC;AAED,SAAS,wBAAwB,CAAC,EAChC,WAAW,GAGZ;IACC,IAAI,CAAC,WAAW,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAA;IAEzD,MAAM,UAAU,GAAG,WAAW,CAAC,CAAC,CAAC,CAAA;IAEjC,IAAI,UAAU,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;QAChC,OAAO,KAAC,UAAU,IAAC,UAAU,EAAE,UAAU,GAAI,CAAA;IAC/C,CAAC;IACD,IAAI,UAAU,CAAC,IAAI,KAAK,cAAc,EAAE,CAAC;QACvC,OAAO,KAAC,iBAAiB,IAAC,UAAU,EAAE,UAAU,GAAI,CAAA;IACtD,CAAC;IACD,IAAI,UAAU,CAAC,IAAI,KAAK,mBAAmB,EAAE,CAAC;QAC5C,MAAM,WAAW,GAAG,UAAU,CAAC,UAAU,EAAE,WAAW,CAAA;QACtD,MAAM,SAAS,GAAG,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA;QAE5C,QAAQ,SAAS,EAAE,CAAC;YAClB,KAAK,OAAO;gBACV,OAAO,KAAC,sBAAsB,IAAC,UAAU,EAAE,UAAU,GAAI,CAAA;YAC3D,KAAK,OAAO;gBACV,OAAO,KAAC,qBAAqB,IAAC,QAAQ,EAAC,2BAA2B,GAAG,CAAA;YACvE,KAAK,OAAO;gBACV,OAAO,KAAC,qBAAqB,IAAC,QAAQ,EAAC,2BAA2B,GAAG,CAAA;YACvE,KAAK,aAAa;gBAChB,OAAO,KAAC,qBAAqB,IAAC,QAAQ,EAAC,6BAA6B,GAAG,CAAA;YACzE;gBACE,OAAO,IAAI,CAAA;QACf,CAAC;IACH,CAAC;IAED,OAAO,IAAI,CAAA;AACb,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,UAAU,EAAuD;IACrF,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,UAAU,CAAA;IACnC,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC,UAAU,CAAA;IAChC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,oBAAoB,CAAC,KAAK,CAAC,UAAU,CAAC,CAAA;IAChE,MAAM,MAAM,GAAG,SAAS,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC,CAAA;IAEpE,OAAO,CACL,KAAC,KAAK,IACJ,MAAM,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,EACpB,YAAY,EAAE,MAAM,CAAC,YAAY,EACjC,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,EAAE,GACd,CACH,CAAA;AACH,CAAC;AAED,SAAS,iBAAiB,CAAC,EACzB,UAAU,GAGX;IACC,MAAM,EAAE,KAAK,GAAG,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,UAAU,EAAE,GAAG,UAAU,CAAC,UAAU,CAAA;IAC/E,MAAM,MAAM,GAAG,SAAS,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC,CAAA;IAErD,OAAO,CACL,KAAC,KAAK,IACJ,MAAM,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,EACzB,YAAY,EAAE,MAAM,CAAC,YAAY,EACjC,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,EAAE,GACd,CACH,CAAA;AACH,CAAC;AAED,SAAS,sBAAsB,CAAC,EAC9B,UAAU,GAGX;IACC,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,GAAG,EAAE,EAAE,GAAG,UAAU,CAAC,UAAU,CAAA;IACzE,MAAM,MAAM,GAAG,SAAS,CAAC,EAAE,UAAU,EAAE,QAAQ,CAAC,KAAK,EAAE,WAAW,EAAE,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAA;IAEtF,OAAO,CACL,KAAC,KAAK,IACJ,MAAM,EAAE,EAAE,GAAG,EAAE,SAAS,IAAI,GAAG,EAAE,EACjC,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,YAAY,EAAE,MAAM,CAAC,YAAY,EACjC,GAAG,EAAE,QAAQ,EACb,UAAU,EAAE,EAAE,GACd,CACH,CAAA;AACH,CAAC;AAED,SAAS,qBAAqB,CAAC,EAAE,QAAQ,EAAmC;IAC1E,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,OAAO,CACL,KAAC,IAAI,IACH,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,MAAM,CAAC,cAAc,EAC5B,qBAAqB,EAAE,wBAAwB,GAC/C,CACH,CAAA;AACH,CAAC;AAED,6HAA6H;AAC7H,SAAS,qBAAqB,CAAC,EAAE,IAAI,EAAE,IAAI,EAAoC;IAC7E,MAAM,MAAM,GAAG,SAAS,CAAC,EAAE,IAAI,EAAE,CAAC,CAAA;IAElC,OAAO,CACL,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,YACzB,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,cAAc,YAChC,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,aAAa,YAC/B,KAAC,IAAI,IAAC,OAAO,EAAC,UAAU,EAAC,KAAK,EAAE,MAAM,CAAC,WAAW,YAC/C,IAAI,GACA,GACF,GACF,GACF,CACR,CAAA;AACH,CAAC;AAQD,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,EAAE,UAAU,GAAG,EAAE,EAAE,WAAW,GAAG,EAAE,KAAkB,EAAE,EAAE,EAAE;IAClF,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAA;IAC7B,MAAM,SAAS,GAAG,YAAY,CAAC,EAAE,qBAAqB,EAAE,wBAAwB,EAAE,CAAC,CAAA;IACnF,MAAM,EAAE,KAAK,EAAE,GAAG,mBAAmB,EAAE,CAAA;IACvC,MAAM,WAAW,GAAG,KAAK,IAAI,GAAG,CAAA,CAAC,6BAA6B;IAE9D,OAAO,UAAU,CAAC,MAAM,CAAC;QACvB,OAAO,EAAE;YACP,GAAG,EAAE,CAAC;YACN,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK;YAC3C,iBAAiB,EAAE,4CAA4C;SAChE;QACD,cAAc,EAAE;YACd,IAAI,EAAE,CAAC;YACP,GAAG,EAAE,CAAC;YACN,YAAY,EAAE,EAAE;SACjB;QACD,aAAa,EAAE;YACb,KAAK,EAAE,kCAAkC;YACzC,UAAU,EAAE,QAAQ;SACrB;QACD,MAAM,EAAE;YACN,YAAY,EAAE,CAAC;SAChB;QACD,aAAa,EAAE;YACb,OAAO,EAAE,GAAG;SACb;QACD,aAAa,EAAE;YACb,aAAa,EAAE,KAAK;YACpB,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY;YAC3C,UAAU,EAAE,QAAQ;YACpB,GAAG,EAAE,CAAC;YACN,WAAW,EAAE,MAAM,CAAC,sBAAsB;YAC1C,WAAW,EAAE,CAAC;YACd,YAAY,EAAE,CAAC;YACf,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK;YACnC,eAAe,EAAE,CAAC;YAClB,iBAAiB,EAAE,CAAC;SACrB;QACD,WAAW,EAAE;YACX,KAAK,EAAE,MAAM,CAAC,2BAA2B;YACzC,UAAU,EAAE,CAAC;SACd;QACD,WAAW,EAAE;YACX,aAAa,EAAE,KAAK;YACpB,cAAc,EAAE,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY;SACjD;QACD,cAAc,EAAE;YACd,KAAK,EAAE,MAAM,CAAC,WAAW;YACzB,UAAU,EAAE,wBAAwB;SACrC;QACD,YAAY,EAAE;YACZ,KAAK,EAAE,EAAE,GAAG,SAAS;YACrB,WAAW,EAAE,eAAe,CAAC,UAAU,EAAE,WAAW,CAAC;YACrD,OAAO,EAAE,GAAG;SACb;QACD,KAAK,EAAE;YACL,YAAY,EAAE,CAAC;SAChB;QACD,cAAc,EAAE;YACd,KAAK,EAAE,MAAM,CAAC,mBAAmB;YACjC,QAAQ,EAAE,EAAE;SACb;KACF,CAAC,CAAA;AACJ,CAAC,CAAA","sourcesContent":["import { useNavigation } from '@react-navigation/native'\nimport { some } from 'lodash'\nimport React from 'react'\nimport { Pressable, StyleSheet, useWindowDimensions, View } from 'react-native'\nimport Animated from 'react-native-reanimated'\nimport {\n useAnimatedMessageBackgroundColor,\n useFontScale,\n useScalableNumberOfLines,\n useTheme,\n} from '../../hooks'\nimport { useConversationMessage } from '../../hooks/use_conversation_message'\nimport { useLiveRelativeTime } from '../../hooks/use_live_relative_time'\nimport { MessageResource } from '../../types'\nimport {\n DenormalizedAttachmentResource,\n DenormalizedGiphyAttachmentResource,\n DenormalizedExpandedLinkAttachmentResource,\n DenormalizedMessageAttachmentResource,\n} from '../../types/resources/denormalized_attachment_resource'\nimport { assertKeysAreNumbers, pluralize, safeAspectRatio } from '../../utils'\nimport {\n CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,\n MAX_FONT_SIZE_MULTIPLIER,\n MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n platformFontWeightMedium,\n} from '../../utils/styles'\nimport { Avatar, Icon, IconProps, Image, Text } from '../display'\nimport { TheirReplyConnector, MyReplyConnector } from './reply_connectors'\n\ninterface ReplyShadowMessageProps extends MessageResource {\n messageId: string\n conversation_id: number\n inReplyScreen?: boolean\n isReplyShadowMessage: boolean\n nextRendersAuthor: boolean\n}\n\nexport function ReplyShadowMessage({\n conversation_id,\n inReplyScreen,\n messageId,\n isReplyShadowMessage,\n nextRendersAuthor,\n}: ReplyShadowMessageProps) {\n const { message, isError, isLoading } = useConversationMessage({ conversation_id, messageId })\n\n if (inReplyScreen) return null\n if (isLoading) return <ShadowMessageFallback text=\"Loading...\" />\n if (isError || !message) return <ShadowMessageFallback text=\"Message deleted\" />\n\n const enrichedMessage = {\n ...message,\n isReplyShadowMessage,\n nextRendersAuthor,\n }\n\n return <ShadowMessageContent conversation_id={conversation_id} {...enrichedMessage} />\n}\n\ninterface ShadowMessageContentProps extends MessageResource {\n conversation_id: number\n}\n\nfunction ShadowMessageContent({ conversation_id, ...message }: ShadowMessageContentProps) {\n const { text, deletedAt, author, attachments } = message\n const styles = useStyles(message)\n const { colors } = useTheme()\n const navigation = useNavigation()\n const timestamp = useLiveRelativeTime(message.createdAt)\n\n const [messageBubbleHeight, setMessageBubbleHeight] = React.useState(0)\n const { animatedBackgroundColor, handleMessagePressIn, handleMessagePressOut } =\n useAnimatedMessageBackgroundColor()\n const scalableNumberOfLines = useScalableNumberOfLines(2)\n const replyCountText = pluralize(message.replyCount, 'reply')\n const isDeleted = !!deletedAt\n const messageText = isDeleted ? 'Message deleted' : text\n\n const handleNavigateToReplies = () => {\n navigation.navigate('ConversationReply', {\n conversation_id,\n reply_root_id: message.replyRootId,\n reply_root_author_name: message.author.name,\n })\n }\n\n const attachmentLabel = some(attachments) ? pluralize(attachments.length, 'attachment') : ''\n const accessibilityLabel = `${author?.name || ''} Reply Preview ${attachmentLabel} ${\n messageText || ''\n } ${timestamp} ${replyCountText}`\n\n return (\n <Pressable\n android_ripple={{ color: colors.androidRippleNeutral }}\n onPress={handleNavigateToReplies}\n onPressIn={handleMessagePressIn}\n onPressOut={handleMessagePressOut}\n accessibilityLabel={accessibilityLabel}\n accessibilityHint=\"Navigate to reply screen for this message\"\n accessibilityRole=\"link\"\n >\n <Animated.View style={[styles.message, animatedBackgroundColor]}>\n {!message.mine && (\n <View>\n <View style={[styles.avatarWrapper, !isDeleted && styles.avatarOpacity]}>\n <Avatar\n size=\"xs\"\n sourceUri={message.author.avatar}\n style={styles.avatar}\n maxFontSizeMultiplier={1}\n fallbackIconName={isDeleted ? 'publishing.trash' : 'general.person'}\n showFallback={isDeleted}\n />\n </View>\n <TheirReplyConnector message={message} messageBubbleHeight={messageBubbleHeight} />\n </View>\n )}\n <View style={styles.messageContent}>\n <View\n style={styles.messageBubble}\n onLayout={e => setMessageBubbleHeight(e.nativeEvent.layout.height)}\n >\n <MessageAttachmentImagery attachments={attachments} />\n {text && (\n <Text\n variant=\"footnote\"\n style={styles.messageText}\n numberOfLines={scalableNumberOfLines}\n >\n {messageText}\n </Text>\n )}\n </View>\n <View style={styles.messageMeta}>\n <Text variant=\"footnote\" style={styles.replyCountText}>\n {replyCountText}\n </Text>\n </View>\n </View>\n {message.mine && (\n <MyReplyConnector message={message} messageBubbleHeight={messageBubbleHeight} />\n )}\n </Animated.View>\n </Pressable>\n )\n}\n\nfunction MessageAttachmentImagery({\n attachments,\n}: {\n attachments: DenormalizedAttachmentResource[]\n}) {\n if (!attachments || attachments.length === 0) return null\n\n const attachment = attachments[0]\n\n if (attachment.type === 'giphy') {\n return <GiphyImage attachment={attachment} />\n }\n if (attachment.type === 'ExpandedLink') {\n return <ExpandedLinkImage attachment={attachment} />\n }\n if (attachment.type === 'MessageAttachment') {\n const contentType = attachment.attributes?.contentType\n const basicType = contentType?.split('/')[0]\n\n switch (basicType) {\n case 'image':\n return <MessageAttachmentImage attachment={attachment} />\n case 'video':\n return <MessageAttachmentIcon iconName=\"general.outlinedVideoFile\" />\n case 'audio':\n return <MessageAttachmentIcon iconName=\"general.outlinedMusicFile\" />\n case 'application':\n return <MessageAttachmentIcon iconName=\"general.outlinedGenericFile\" />\n default:\n return null\n }\n }\n\n return null\n}\n\nfunction GiphyImage({ attachment }: { attachment: DenormalizedGiphyAttachmentResource }) {\n const { title, giphy } = attachment\n const { url } = giphy.fixedWidth\n const { width, height } = assertKeysAreNumbers(giphy.fixedWidth)\n const styles = useStyles({ imageWidth: width, imageHeight: height })\n\n return (\n <Image\n source={{ uri: url }}\n wrapperStyle={styles.imageWrapper}\n style={styles.image}\n alt={title}\n loaderSize={16}\n />\n )\n}\n\nfunction ExpandedLinkImage({\n attachment,\n}: {\n attachment: DenormalizedExpandedLinkAttachmentResource\n}) {\n const { title = '', imageUrl, imageHeight, imageWidth } = attachment.attributes\n const styles = useStyles({ imageWidth, imageHeight })\n\n return (\n <Image\n source={{ uri: imageUrl }}\n wrapperStyle={styles.imageWrapper}\n style={styles.image}\n alt={title}\n loaderSize={16}\n />\n )\n}\n\nfunction MessageAttachmentImage({\n attachment,\n}: {\n attachment: DenormalizedMessageAttachmentResource\n}) {\n const { url, urlMedium, filename, metadata = {} } = attachment.attributes\n const styles = useStyles({ imageWidth: metadata.width, imageHeight: metadata.height })\n\n return (\n <Image\n source={{ uri: urlMedium || url }}\n style={styles.image}\n wrapperStyle={styles.imageWrapper}\n alt={filename}\n loaderSize={16}\n />\n )\n}\n\nfunction MessageAttachmentIcon({ iconName }: { iconName: IconProps['name'] }) {\n const styles = useStyles()\n return (\n <Icon\n name={iconName}\n style={styles.attachmentIcon}\n maxFontSizeMultiplier={MAX_FONT_SIZE_MULTIPLIER}\n />\n )\n}\n\n// TODO: The mine prop is not used yet, but in the future we will be adding a way to find the `mine` value for this fallback.\nfunction ShadowMessageFallback({ text, mine }: { text: string; mine?: boolean }) {\n const styles = useStyles({ mine })\n\n return (\n <View style={styles.message}>\n <View style={styles.messageContent}>\n <View style={styles.messageBubble}>\n <Text variant=\"footnote\" style={styles.messageText}>\n {text}\n </Text>\n </View>\n </View>\n </View>\n )\n}\n\ninterface StylesProps {\n imageWidth?: number\n imageHeight?: number\n mine?: boolean\n}\n\nconst useStyles = ({ mine, imageWidth = 32, imageHeight = 32 }: StylesProps = {}) => {\n const { colors } = useTheme()\n const fontScale = useFontScale({ maxFontSizeMultiplier: MAX_FONT_SIZE_MULTIPLIER })\n const { width } = useWindowDimensions()\n const tabletWidth = width >= 744 // Smallest iPad Mini's width\n\n return StyleSheet.create({\n message: {\n gap: 8,\n flexDirection: mine ? 'row-reverse' : 'row',\n paddingHorizontal: CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,\n },\n messageContent: {\n flex: 1,\n gap: 4,\n marginBottom: 12,\n },\n avatarWrapper: {\n width: MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n alignItems: 'center',\n },\n avatar: {\n marginBottom: 8,\n },\n avatarOpacity: {\n opacity: 0.5,\n },\n messageBubble: {\n flexDirection: 'row',\n alignSelf: mine ? 'flex-end' : 'flex-start',\n alignItems: 'center',\n gap: 8,\n borderColor: colors.borderColorDefaultBase,\n borderWidth: 1,\n borderRadius: 8,\n maxWidth: tabletWidth ? 360 : '80%',\n paddingVertical: 6,\n paddingHorizontal: 8,\n },\n messageText: {\n color: colors.textColorDefaultPlaceholder,\n flexShrink: 1,\n },\n messageMeta: {\n flexDirection: 'row',\n justifyContent: mine ? 'flex-end' : 'flex-start',\n },\n replyCountText: {\n color: colors.interaction,\n fontWeight: platformFontWeightMedium,\n },\n imageWrapper: {\n width: 32 * fontScale,\n aspectRatio: safeAspectRatio(imageWidth, imageHeight),\n opacity: 0.5,\n },\n image: {\n borderRadius: 4,\n },\n attachmentIcon: {\n color: colors.iconColorDefaultDim,\n fontSize: 16,\n },\n })\n}\n"]}
1
+ {"version":3,"file":"reply_shadow_message.js","sourceRoot":"","sources":["../../../src/components/conversation/reply_shadow_message.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useNavigation } from '@react-navigation/native'\nimport { some } from 'lodash'\nimport React from 'react'\nimport { Pressable, StyleSheet, useWindowDimensions, View } from 'react-native'\nimport Animated from 'react-native-reanimated'\nimport {\n useAnimatedMessageBackgroundColor,\n useFontScale,\n useScalableNumberOfLines,\n useTheme,\n} from '../../hooks'\n// CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts\nimport { useLayoutWidthProbe } from '../../hooks/use_conversation_layout_diagnostics'\nimport { useConversationMessage } from '../../hooks/use_conversation_message'\nimport { useLiveRelativeTime } from '../../hooks/use_live_relative_time'\nimport { MessageResource } from '../../types'\nimport {\n DenormalizedAttachmentResource,\n DenormalizedGiphyAttachmentResource,\n DenormalizedExpandedLinkAttachmentResource,\n DenormalizedMessageAttachmentResource,\n} from '../../types/resources/denormalized_attachment_resource'\nimport { assertKeysAreNumbers, pluralize, safeAspectRatio } from '../../utils'\nimport {\n CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,\n MAX_FONT_SIZE_MULTIPLIER,\n MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n platformFontWeightMedium,\n} from '../../utils/styles'\nimport { Avatar, Icon, IconProps, Image, Text } from '../display'\nimport { TheirReplyConnector, MyReplyConnector } from './reply_connectors'\n\ninterface ReplyShadowMessageProps extends MessageResource {\n messageId: string\n conversation_id: number\n inReplyScreen?: boolean\n isReplyShadowMessage: boolean\n nextRendersAuthor: boolean\n}\n\nexport function ReplyShadowMessage({\n conversation_id,\n inReplyScreen,\n messageId,\n isReplyShadowMessage,\n nextRendersAuthor,\n}: ReplyShadowMessageProps) {\n const { message, isError, isLoading } = useConversationMessage({ conversation_id, messageId })\n\n if (inReplyScreen) return null\n if (isLoading) return <ShadowMessageFallback text=\"Loading...\" />\n if (isError || !message) return <ShadowMessageFallback text=\"Message deleted\" />\n\n const enrichedMessage = {\n ...message,\n isReplyShadowMessage,\n nextRendersAuthor,\n }\n\n return <ShadowMessageContent conversation_id={conversation_id} {...enrichedMessage} />\n}\n\ninterface ShadowMessageContentProps extends MessageResource {\n conversation_id: number\n}\n\nfunction ShadowMessageContent({ conversation_id, ...message }: ShadowMessageContentProps) {\n const { text, deletedAt, author, attachments } = message\n const styles = useStyles(message)\n const { colors } = useTheme()\n const navigation = useNavigation()\n const timestamp = useLiveRelativeTime(message.createdAt)\n\n const [messageBubbleHeight, setMessageBubbleHeight] = React.useState(0)\n // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts\n const onMessageBubbleLayout = useLayoutWidthProbe('replyShadow.bubble', 18)\n const { animatedBackgroundColor, handleMessagePressIn, handleMessagePressOut } =\n useAnimatedMessageBackgroundColor()\n const scalableNumberOfLines = useScalableNumberOfLines(2)\n const replyCountText = pluralize(message.replyCount, 'reply')\n const isDeleted = !!deletedAt\n const messageText = isDeleted ? 'Message deleted' : text\n\n const handleNavigateToReplies = () => {\n navigation.navigate('ConversationReply', {\n conversation_id,\n reply_root_id: message.replyRootId,\n reply_root_author_name: message.author.name,\n })\n }\n\n const attachmentLabel = some(attachments) ? pluralize(attachments.length, 'attachment') : ''\n const accessibilityLabel = `${author?.name || ''} Reply Preview ${attachmentLabel} ${\n messageText || ''\n } ${timestamp} ${replyCountText}`\n\n return (\n <Pressable\n android_ripple={{ color: colors.androidRippleNeutral }}\n onPress={handleNavigateToReplies}\n onPressIn={handleMessagePressIn}\n onPressOut={handleMessagePressOut}\n accessibilityLabel={accessibilityLabel}\n accessibilityHint=\"Navigate to reply screen for this message\"\n accessibilityRole=\"link\"\n >\n <Animated.View style={[styles.message, animatedBackgroundColor]}>\n {!message.mine && (\n <View>\n <View style={[styles.avatarWrapper, !isDeleted && styles.avatarOpacity]}>\n <Avatar\n size=\"xs\"\n sourceUri={message.author.avatar}\n style={styles.avatar}\n maxFontSizeMultiplier={1}\n fallbackIconName={isDeleted ? 'publishing.trash' : 'general.person'}\n showFallback={isDeleted}\n />\n </View>\n <TheirReplyConnector message={message} messageBubbleHeight={messageBubbleHeight} />\n </View>\n )}\n <View style={styles.messageContent}>\n <View\n style={styles.messageBubble}\n onLayout={e => {\n setMessageBubbleHeight(e.nativeEvent.layout.height)\n onMessageBubbleLayout?.(e)\n }}\n >\n <MessageAttachmentImagery attachments={attachments} />\n {text && (\n <Text\n variant=\"footnote\"\n style={styles.messageText}\n numberOfLines={scalableNumberOfLines}\n >\n {messageText}\n </Text>\n )}\n </View>\n <View style={styles.messageMeta}>\n <Text variant=\"footnote\" style={styles.replyCountText}>\n {replyCountText}\n </Text>\n </View>\n </View>\n {message.mine && (\n <MyReplyConnector message={message} messageBubbleHeight={messageBubbleHeight} />\n )}\n </Animated.View>\n </Pressable>\n )\n}\n\nfunction MessageAttachmentImagery({\n attachments,\n}: {\n attachments: DenormalizedAttachmentResource[]\n}) {\n if (!attachments || attachments.length === 0) return null\n\n const attachment = attachments[0]\n\n if (attachment.type === 'giphy') {\n return <GiphyImage attachment={attachment} />\n }\n if (attachment.type === 'ExpandedLink') {\n return <ExpandedLinkImage attachment={attachment} />\n }\n if (attachment.type === 'MessageAttachment') {\n const contentType = attachment.attributes?.contentType\n const basicType = contentType?.split('/')[0]\n\n switch (basicType) {\n case 'image':\n return <MessageAttachmentImage attachment={attachment} />\n case 'video':\n return <MessageAttachmentIcon iconName=\"general.outlinedVideoFile\" />\n case 'audio':\n return <MessageAttachmentIcon iconName=\"general.outlinedMusicFile\" />\n case 'application':\n return <MessageAttachmentIcon iconName=\"general.outlinedGenericFile\" />\n default:\n return null\n }\n }\n\n return null\n}\n\nfunction GiphyImage({ attachment }: { attachment: DenormalizedGiphyAttachmentResource }) {\n const { title, giphy } = attachment\n const { url } = giphy.fixedWidth\n const { width, height } = assertKeysAreNumbers(giphy.fixedWidth)\n const styles = useStyles({ imageWidth: width, imageHeight: height })\n\n return (\n <Image\n source={{ uri: url }}\n wrapperStyle={styles.imageWrapper}\n style={styles.image}\n alt={title}\n loaderSize={16}\n />\n )\n}\n\nfunction ExpandedLinkImage({\n attachment,\n}: {\n attachment: DenormalizedExpandedLinkAttachmentResource\n}) {\n const { title = '', imageUrl, imageHeight, imageWidth } = attachment.attributes\n const styles = useStyles({ imageWidth, imageHeight })\n\n return (\n <Image\n source={{ uri: imageUrl }}\n wrapperStyle={styles.imageWrapper}\n style={styles.image}\n alt={title}\n loaderSize={16}\n />\n )\n}\n\nfunction MessageAttachmentImage({\n attachment,\n}: {\n attachment: DenormalizedMessageAttachmentResource\n}) {\n const { url, urlMedium, filename, metadata = {} } = attachment.attributes\n const styles = useStyles({ imageWidth: metadata.width, imageHeight: metadata.height })\n\n return (\n <Image\n source={{ uri: urlMedium || url }}\n style={styles.image}\n wrapperStyle={styles.imageWrapper}\n alt={filename}\n loaderSize={16}\n />\n )\n}\n\nfunction MessageAttachmentIcon({ iconName }: { iconName: IconProps['name'] }) {\n const styles = useStyles()\n return (\n <Icon\n name={iconName}\n style={styles.attachmentIcon}\n maxFontSizeMultiplier={MAX_FONT_SIZE_MULTIPLIER}\n />\n )\n}\n\n// TODO: The mine prop is not used yet, but in the future we will be adding a way to find the `mine` value for this fallback.\nfunction ShadowMessageFallback({ text, mine }: { text: string; mine?: boolean }) {\n const styles = useStyles({ mine })\n\n return (\n <View style={styles.message}>\n <View style={styles.messageContent}>\n <View style={styles.messageBubble}>\n <Text variant=\"footnote\" style={styles.messageText}>\n {text}\n </Text>\n </View>\n </View>\n </View>\n )\n}\n\ninterface StylesProps {\n imageWidth?: number\n imageHeight?: number\n mine?: boolean\n}\n\nconst useStyles = ({ mine, imageWidth = 32, imageHeight = 32 }: StylesProps = {}) => {\n const { colors } = useTheme()\n const fontScale = useFontScale({ maxFontSizeMultiplier: MAX_FONT_SIZE_MULTIPLIER })\n const { width } = useWindowDimensions()\n const tabletWidth = width >= 744 // Smallest iPad Mini's width\n\n return StyleSheet.create({\n message: {\n gap: 8,\n flexDirection: mine ? 'row-reverse' : 'row',\n paddingHorizontal: CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,\n },\n messageContent: {\n flex: 1,\n gap: 4,\n marginBottom: 12,\n },\n avatarWrapper: {\n width: MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,\n alignItems: 'center',\n },\n avatar: {\n marginBottom: 8,\n },\n avatarOpacity: {\n opacity: 0.5,\n },\n messageBubble: {\n flexDirection: 'row',\n alignSelf: mine ? 'flex-end' : 'flex-start',\n alignItems: 'center',\n gap: 8,\n borderColor: colors.borderColorDefaultBase,\n borderWidth: 1,\n borderRadius: 8,\n maxWidth: tabletWidth ? 360 : '80%',\n paddingVertical: 6,\n paddingHorizontal: 8,\n },\n messageText: {\n color: colors.textColorDefaultPlaceholder,\n flexShrink: 1,\n },\n messageMeta: {\n flexDirection: 'row',\n justifyContent: mine ? 'flex-end' : 'flex-start',\n },\n replyCountText: {\n color: colors.interaction,\n fontWeight: platformFontWeightMedium,\n },\n imageWrapper: {\n width: 32 * fontScale,\n aspectRatio: safeAspectRatio(imageWidth, imageHeight),\n opacity: 0.5,\n },\n image: {\n borderRadius: 4,\n },\n attachmentIcon: {\n color: colors.iconColorDefaultDim,\n fontSize: 16,\n },\n })\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAwB,SAAS,EAAE,MAAM,cAAc,CAAA;AAMnE,OAAO,EAAQ,UAAU,EAAE,MAAM,QAAQ,CAAA;AAEzC,OAAO,EAA+B,KAAK,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAM/F,KAAK,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,YAAY,CAAA;AAiBrD,KAAK,eAAe,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAA;AACpE,KAAK,eAAe,GAAG,MAAM,GAAG,MAAM,CAAA;AActC,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,GAAG,eAAe,CAAA;IACnD;;OAEG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAA;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,UAAU,CAAA;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAA;CAChC;AAED,wBAAgB,KAAK,CAAC,EACpB,UAAsB,EACtB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,aAAa,EACb,KAAK,EACL,eAAe,EACf,OAAmB,EACnB,qBAAqB,EACrB,sBAA0B,EAC1B,OAAO,GACR,EAAE,UAAU,2CAwCZ"}
1
+ {"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAwB,SAAS,EAAE,MAAM,cAAc,CAAA;AAQnE,OAAO,EAAQ,UAAU,EAAE,MAAM,QAAQ,CAAA;AAEzC,OAAO,EAA+B,KAAK,qBAAqB,EAAE,MAAM,uBAAuB,CAAA;AAM/F,KAAK,YAAY,GAAG,SAAS,GAAG,MAAM,GAAG,YAAY,CAAA;AAiBrD,KAAK,eAAe,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAA;AACpE,KAAK,eAAe,GAAG,MAAM,GAAG,MAAM,CAAA;AActC,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,qBAAqB,CAAA;IAClC;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,GAAG,eAAe,CAAA;IACnD;;OAEG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAA;IACrB;;OAEG;IACH,aAAa,CAAC,EAAE,UAAU,CAAA;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAA;CAChC;AAED,wBAAgB,KAAK,CAAC,EACpB,UAAsB,EACtB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,aAAa,EACb,KAAK,EACL,eAAe,EACf,OAAmB,EACnB,qBAAqB,EACrB,sBAA0B,EAC1B,OAAO,GACR,EAAE,UAAU,2CAkDZ"}
@@ -2,6 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Pressable, StyleSheet, View } from 'react-native';
3
3
  import Svg, { Defs, LinearGradient, Path, Stop } from 'react-native-svg';
4
4
  import { useFontScale, useTheme } from '../../hooks';
5
+ // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts
6
+ import { useLayoutWidthProbe } from '../../hooks/use_conversation_layout_diagnostics';
5
7
  import { platformFontWeightMedium } from '../../utils';
6
8
  import { tokens } from '../../vendor/tapestry/tokens';
7
9
  import { Icon } from './icon';
@@ -16,13 +18,18 @@ const PRODUCT_LOGO_COMPONENT_MAP = {
16
18
  export function Badge({ appearance = 'neutral', metaLabel, style, iconName, iconNameRight, label, productLogoName, variant = 'default', maxFontSizeMultiplier, numberOfLinesMetaLabel = 1, onPress, }) {
17
19
  const styles = useStyles({ appearance, maxFontSizeMultiplier, variant });
18
20
  const { showBadgeProductLogo } = useTheme();
21
+ // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts
22
+ // Inset is metaLabel's remaining contentInset now that its left offset is
23
+ // a margin, not padding - see the CHAT-476 candidate fix on this style.
24
+ const onLabelLayout = useLayoutWidthProbe('badge.label', 0);
25
+ const onMetaLabelLayout = useLayoutWidthProbe('badge.metaLabel', styles.metaLabel.paddingHorizontal * 2);
19
26
  const isMetaSubtle = variant === 'metaSubtle';
20
27
  const hasMetaLabel = Boolean(metaLabel);
21
28
  const showLogo = showBadgeProductLogo && productLogoName;
22
29
  const isChatLogo = productLogoName?.toLowerCase() === 'chat';
23
30
  const ProductLogoSvg = showLogo && PRODUCT_LOGO_COMPONENT_MAP[productLogoName];
24
31
  const badgeLabel = isMetaSubtle && hasMetaLabel ? `${label}:` : label;
25
- return (_jsxs(BadgeWrapper, { style: [styles.badgeWrapper, style], onPress: onPress, accessibilityRole: "button", children: [_jsxs(View, { style: styles.badge, children: [showLogo && ProductLogoSvg && _jsx(ProductLogoSvg, { logoSize: styles.logo.fontSize }), showLogo && isChatLogo && _jsx(Icon, { name: "general.textMessage", style: styles.icon }), iconName && _jsx(Icon, { name: iconName, style: styles.icon }), _jsx(Text, { variant: "footnote", style: styles.label, numberOfLines: 1, maxFontSizeMultiplier: maxFontSizeMultiplier, children: badgeLabel }), iconNameRight && _jsx(Icon, { name: iconNameRight, style: styles.iconRight })] }), hasMetaLabel && (_jsx(Text, { variant: "footnote", style: styles.metaLabel, numberOfLines: numberOfLinesMetaLabel, maxFontSizeMultiplier: maxFontSizeMultiplier, children: metaLabel }))] }));
32
+ return (_jsxs(BadgeWrapper, { style: [styles.badgeWrapper, style], onPress: onPress, accessibilityRole: "button", children: [_jsxs(View, { style: styles.badge, children: [showLogo && ProductLogoSvg && _jsx(ProductLogoSvg, { logoSize: styles.logo.fontSize }), showLogo && isChatLogo && _jsx(Icon, { name: "general.textMessage", style: styles.icon }), iconName && _jsx(Icon, { name: iconName, style: styles.icon }), _jsx(Text, { variant: "footnote", style: styles.label, numberOfLines: 1, maxFontSizeMultiplier: maxFontSizeMultiplier, onLayout: onLabelLayout, children: badgeLabel }), iconNameRight && _jsx(Icon, { name: iconNameRight, style: styles.iconRight })] }), hasMetaLabel && (_jsx(Text, { variant: "footnote", style: styles.metaLabel, numberOfLines: numberOfLinesMetaLabel, maxFontSizeMultiplier: maxFontSizeMultiplier, onLayout: onMetaLabelLayout, children: metaLabel }))] }));
26
33
  }
27
34
  const BadgeWrapper = ({ children, onPress, accessibilityRole, ...restProps }) => {
28
35
  if (onPress) {
@@ -92,8 +99,9 @@ const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'd
92
99
  paddingVertical: variantStylesMap[variant].paddingVertical,
93
100
  paddingHorizontal: variantStylesMap[variant].paddingHorizontal,
94
101
  backgroundColor: variantStylesMap[variant].backgroundColor,
95
- // metaSubtle's borderRadius is 0, so this can't go below 0 - Android
96
- // hard-throws on a negative borderRadius during layout.
102
+ // metaSubtle's borderRadius is 0, so this would otherwise resolve to -2.
103
+ // Neither platform clamps a negative radius; Android's BackgroundDrawable
104
+ // reads it as "no rounded borders" and skips the rounded path entirely.
97
105
  borderRadius: Math.max(0, variantStylesMap[variant].borderRadius - 2),
98
106
  },
99
107
  icon: {
@@ -118,7 +126,10 @@ const useStyles = ({ appearance = 'neutral', maxFontSizeMultiplier, variant = 'd
118
126
  fontSize: badgeFontSize,
119
127
  alignSelf: 'center',
120
128
  flexShrink: 1,
121
- paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,
129
+ // CHAT-476 candidate fix: margin (not padding) so this offset sits
130
+ // outside contentInsets - a shrunk Text can never see it as part of
131
+ // its own measured content width, so it can't go negative from this.
132
+ marginLeft: variantStylesMap[variant].metaLabelPaddingLeft,
122
133
  },
123
134
  });
124
135
  };
@@ -1 +1 @@
1
- {"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { JSX } from 'react'\nimport type { TextStyle, ViewProps, ViewStyle } from 'react-native'\nimport { Pressable, StyleSheet, View } from 'react-native'\nimport Svg, { Defs, LinearGradient, Path, Stop } from 'react-native-svg'\nimport { useFontScale, useTheme } from '../../hooks'\nimport { platformFontWeightMedium } from '../../utils'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { Icon, IconString } from './icon'\nimport { Text } from './text'\nimport { useStatusColorAppearanceMap, type StatusAppearanceUnion } from './utils/status_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\ntype VariantUnion = 'default' | 'meta' | 'metaSubtle'\n\ntype VariantStyles = Record<\n VariantUnion,\n {\n backgroundColor: string\n paddingHorizontal: number\n paddingVertical: number\n borderWidth: number\n borderRadius: number\n textColor: string\n gap: number\n metaLabelPaddingLeft: number\n fontWeight: TextStyle['fontWeight']\n }\n>\n\ntype ProductLogoName = 'Groups' | 'Services' | 'groups' | 'services'\ntype ProductIconName = 'Chat' | 'chat'\ntype ProductLogoComponent = ({ logoSize }: { logoSize: number }) => JSX.Element\n\nconst PRODUCT_LOGO_COMPONENT_MAP: Record<ProductLogoName, ProductLogoComponent> = {\n Groups: GroupsLogo,\n groups: GroupsLogo,\n services: ServicesIcon,\n Services: ServicesIcon,\n}\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport interface BadgeProps {\n /**\n * Renders the main text.\n */\n label: string\n /**\n * Renders secondary meta text to the right of the label.\n */\n metaLabel?: string\n /**\n * Changes the status color for the badge and icon.\n */\n appearance?: StatusAppearanceUnion\n /**\n * Changes form of the logo to support a meta label and badge\n */\n variant?: VariantUnion\n /**\n * Adds a product logo to the left of the text.\n */\n productLogoName?: ProductLogoName | ProductIconName\n /**\n * Shows an icon of the user choice to the left of the text.\n */\n iconName?: IconString\n /**\n * Shows an icon of the user choice to the right of the text.\n */\n iconNameRight?: IconString\n /**\n * Styles badge wrapper.\n */\n style?: ViewStyle\n /**\n * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n */\n maxFontSizeMultiplier?: number\n /**\n * Callback function when the badge is pressed.\n */\n onPress?: () => void\n /**\n * Specifies the number of lines for the meta label before truncating.\n */\n numberOfLinesMetaLabel?: number\n}\n\nexport function Badge({\n appearance = 'neutral',\n metaLabel,\n style,\n iconName,\n iconNameRight,\n label,\n productLogoName,\n variant = 'default',\n maxFontSizeMultiplier,\n numberOfLinesMetaLabel = 1,\n onPress,\n}: BadgeProps) {\n const styles = useStyles({ appearance, maxFontSizeMultiplier, variant })\n const { showBadgeProductLogo } = useTheme()\n\n const isMetaSubtle = variant === 'metaSubtle'\n const hasMetaLabel = Boolean(metaLabel)\n\n const showLogo = showBadgeProductLogo && productLogoName\n const isChatLogo = productLogoName?.toLowerCase() === 'chat'\n const ProductLogoSvg = showLogo && PRODUCT_LOGO_COMPONENT_MAP[productLogoName as ProductLogoName]\n const badgeLabel = isMetaSubtle && hasMetaLabel ? `${label}:` : label\n\n return (\n <BadgeWrapper style={[styles.badgeWrapper, style]} onPress={onPress} accessibilityRole=\"button\">\n <View style={styles.badge}>\n {showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize} />}\n {showLogo && isChatLogo && <Icon name=\"general.textMessage\" style={styles.icon} />}\n {iconName && <Icon name={iconName} style={styles.icon} />}\n <Text\n variant=\"footnote\"\n style={styles.label}\n numberOfLines={1}\n maxFontSizeMultiplier={maxFontSizeMultiplier}\n >\n {badgeLabel}\n </Text>\n {iconNameRight && <Icon name={iconNameRight} style={styles.iconRight} />}\n </View>\n {hasMetaLabel && (\n <Text\n variant=\"footnote\"\n style={styles.metaLabel}\n numberOfLines={numberOfLinesMetaLabel}\n maxFontSizeMultiplier={maxFontSizeMultiplier}\n >\n {metaLabel}\n </Text>\n )}\n </BadgeWrapper>\n )\n}\n\nconst BadgeWrapper = ({\n children,\n onPress,\n accessibilityRole,\n ...restProps\n}: ViewProps & Pick<BadgeProps, 'onPress'>) => {\n if (onPress) {\n return (\n <Pressable accessibilityRole={accessibilityRole} onPress={onPress} {...restProps}>\n {children}\n </Pressable>\n )\n }\n\n return <View {...restProps}>{children}</View>\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n appearance = 'neutral',\n maxFontSizeMultiplier,\n variant = 'default',\n}: Partial<BadgeProps>) => {\n const { colors } = useTheme()\n const fontScale = useFontScale({ maxFontSizeMultiplier })\n\n const statusColorMap = useStatusColorAppearanceMap()\n\n const badgeGap = 4 * fontScale\n const badgePaddingHorizontal = 8\n const badgePaddingVertical = 4\n const badgeFontSize = 12\n\n const variantStylesMap: VariantStyles = {\n default: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd * fontScale,\n textColor: statusColorMap[appearance].text,\n fontWeight: 'normal',\n },\n meta: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd * fontScale,\n textColor: statusColorMap[appearance].text,\n fontWeight: platformFontWeightMedium,\n },\n metaSubtle: {\n gap: badgeGap,\n backgroundColor: 'transparent',\n metaLabelPaddingLeft: badgeGap,\n paddingHorizontal: 0,\n paddingVertical: 0,\n borderWidth: 0,\n borderRadius: 0,\n textColor: colors.textColorDefaultSecondary,\n fontWeight: platformFontWeightMedium,\n },\n }\n\n return StyleSheet.create({\n badgeWrapper: {\n flexDirection: 'row',\n justifyContent: 'center',\n alignSelf: 'flex-start',\n borderRadius: variantStylesMap[variant].borderRadius,\n borderWidth: variantStylesMap[variant].borderWidth,\n borderColor: statusColorMap[appearance].background,\n },\n badge: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: variantStylesMap[variant].gap,\n paddingVertical: variantStylesMap[variant].paddingVertical,\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n backgroundColor: variantStylesMap[variant].backgroundColor,\n // metaSubtle's borderRadius is 0, so this can't go below 0 - Android\n // hard-throws on a negative borderRadius during layout.\n borderRadius: Math.max(0, variantStylesMap[variant].borderRadius - 2),\n },\n icon: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize,\n },\n iconRight: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize - 2,\n },\n logo: {\n fontSize: badgeFontSize * fontScale,\n },\n label: {\n color: variantStylesMap[variant].textColor,\n fontWeight: variantStylesMap[variant].fontWeight,\n fontSize: badgeFontSize,\n flexShrink: 1,\n },\n metaLabel: {\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n fontSize: badgeFontSize,\n alignSelf: 'center',\n flexShrink: 1,\n paddingLeft: variantStylesMap[variant].metaLabelPaddingLeft,\n },\n })\n}\n\n// =================================\n// ====== Product Logos ============\n// =================================\n\ninterface ProductLogoProps {\n logoSize: number\n}\n\nfunction GroupsLogo({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n d=\"M9.06 6.14H6.94c-.152.36-.438.646-.797.798v2.12c.359.152.645.438.797.797h2.117c.152-.359.437-.645.796-.797V6.94a1.502 1.502 0 01-.793-.8zM8 0C1.6 0 0 1.595 0 8s1.6 8 8 8 8-1.595 8-8-1.595-8-8-8zm3.939 10.44a1.5 1.5 0 01-2.882.585H6.94a1.5 1.5 0 11-1.963-1.963v-2.12A1.501 1.501 0 116.94 4.98h2.12a1.5 1.5 0 111.963 1.968v2.11a1.501 1.501 0 01.916 1.383z\"\n fill=\"url(#paint0_linear_2632_26363)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_26363\"\n x1={-5.6338}\n y1={5.6338}\n x2={5.6338}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#FF962D\" />\n <Stop offset={1} stopColor=\"#FC7638\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n\nfunction ServicesIcon({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M.116 8c0-6.4 1.6-8 8-8s8 1.6 8 8-1.6 8-8 8-8-1.6-8-8zm4.123 3.464a.848.848 0 10.943-1.41.848.848 0 00-.943 1.41zm.001-2.76a.848.848 0 10.948-1.408.848.848 0 00-.948 1.407zm0-2.759a.849.849 0 10.948-1.408.849.849 0 00-.948 1.408zm8.1 5.34a.388.388 0 00.03-.149v-.755a.39.39 0 00-.39-.39H6.87a.39.39 0 00-.39.39v.755a.39.39 0 00.39.39h5.11a.39.39 0 00.36-.24zm0-2.758a.388.388 0 00.03-.149v-.757a.387.387 0 00-.39-.388H6.87a.388.388 0 00-.39.388v.757a.388.388 0 00.39.388h5.11a.388.388 0 00.36-.24zm0-2.76a.388.388 0 00.03-.148v-.754a.39.39 0 00-.39-.389H6.87a.39.39 0 00-.39.387v.756a.39.39 0 00.39.39h5.11a.389.389 0 00.36-.241z\"\n fill=\"url(#paint0_linear_2632_56586)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_56586\"\n x1={-5.51759}\n y1={5.6338}\n x2={5.75001}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#6BB23D\" />\n <Stop offset={1} stopColor=\"#659630\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n"]}
1
+ {"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../src/components/display/badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { JSX } from 'react'\nimport type { TextStyle, ViewProps, ViewStyle } from 'react-native'\nimport { Pressable, StyleSheet, View } from 'react-native'\nimport Svg, { Defs, LinearGradient, Path, Stop } from 'react-native-svg'\nimport { useFontScale, useTheme } from '../../hooks'\n// CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts\nimport { useLayoutWidthProbe } from '../../hooks/use_conversation_layout_diagnostics'\nimport { platformFontWeightMedium } from '../../utils'\nimport { tokens } from '../../vendor/tapestry/tokens'\nimport { Icon, IconString } from './icon'\nimport { Text } from './text'\nimport { useStatusColorAppearanceMap, type StatusAppearanceUnion } from './utils/status_colors'\n\n// =================================\n// ====== Constants ================\n// =================================\n\ntype VariantUnion = 'default' | 'meta' | 'metaSubtle'\n\ntype VariantStyles = Record<\n VariantUnion,\n {\n backgroundColor: string\n paddingHorizontal: number\n paddingVertical: number\n borderWidth: number\n borderRadius: number\n textColor: string\n gap: number\n metaLabelPaddingLeft: number\n fontWeight: TextStyle['fontWeight']\n }\n>\n\ntype ProductLogoName = 'Groups' | 'Services' | 'groups' | 'services'\ntype ProductIconName = 'Chat' | 'chat'\ntype ProductLogoComponent = ({ logoSize }: { logoSize: number }) => JSX.Element\n\nconst PRODUCT_LOGO_COMPONENT_MAP: Record<ProductLogoName, ProductLogoComponent> = {\n Groups: GroupsLogo,\n groups: GroupsLogo,\n services: ServicesIcon,\n Services: ServicesIcon,\n}\n\n// =================================\n// ====== Component ================\n// =================================\n\nexport interface BadgeProps {\n /**\n * Renders the main text.\n */\n label: string\n /**\n * Renders secondary meta text to the right of the label.\n */\n metaLabel?: string\n /**\n * Changes the status color for the badge and icon.\n */\n appearance?: StatusAppearanceUnion\n /**\n * Changes form of the logo to support a meta label and badge\n */\n variant?: VariantUnion\n /**\n * Adds a product logo to the left of the text.\n */\n productLogoName?: ProductLogoName | ProductIconName\n /**\n * Shows an icon of the user choice to the left of the text.\n */\n iconName?: IconString\n /**\n * Shows an icon of the user choice to the right of the text.\n */\n iconNameRight?: IconString\n /**\n * Styles badge wrapper.\n */\n style?: ViewStyle\n /**\n * Specifies the maximum size a font can reach when allowFontScaling is enabled.\n */\n maxFontSizeMultiplier?: number\n /**\n * Callback function when the badge is pressed.\n */\n onPress?: () => void\n /**\n * Specifies the number of lines for the meta label before truncating.\n */\n numberOfLinesMetaLabel?: number\n}\n\nexport function Badge({\n appearance = 'neutral',\n metaLabel,\n style,\n iconName,\n iconNameRight,\n label,\n productLogoName,\n variant = 'default',\n maxFontSizeMultiplier,\n numberOfLinesMetaLabel = 1,\n onPress,\n}: BadgeProps) {\n const styles = useStyles({ appearance, maxFontSizeMultiplier, variant })\n const { showBadgeProductLogo } = useTheme()\n // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts\n // Inset is metaLabel's remaining contentInset now that its left offset is\n // a margin, not padding - see the CHAT-476 candidate fix on this style.\n const onLabelLayout = useLayoutWidthProbe('badge.label', 0)\n const onMetaLabelLayout = useLayoutWidthProbe(\n 'badge.metaLabel',\n styles.metaLabel.paddingHorizontal * 2\n )\n\n const isMetaSubtle = variant === 'metaSubtle'\n const hasMetaLabel = Boolean(metaLabel)\n\n const showLogo = showBadgeProductLogo && productLogoName\n const isChatLogo = productLogoName?.toLowerCase() === 'chat'\n const ProductLogoSvg = showLogo && PRODUCT_LOGO_COMPONENT_MAP[productLogoName as ProductLogoName]\n const badgeLabel = isMetaSubtle && hasMetaLabel ? `${label}:` : label\n\n return (\n <BadgeWrapper style={[styles.badgeWrapper, style]} onPress={onPress} accessibilityRole=\"button\">\n <View style={styles.badge}>\n {showLogo && ProductLogoSvg && <ProductLogoSvg logoSize={styles.logo.fontSize} />}\n {showLogo && isChatLogo && <Icon name=\"general.textMessage\" style={styles.icon} />}\n {iconName && <Icon name={iconName} style={styles.icon} />}\n <Text\n variant=\"footnote\"\n style={styles.label}\n numberOfLines={1}\n maxFontSizeMultiplier={maxFontSizeMultiplier}\n onLayout={onLabelLayout}\n >\n {badgeLabel}\n </Text>\n {iconNameRight && <Icon name={iconNameRight} style={styles.iconRight} />}\n </View>\n {hasMetaLabel && (\n <Text\n variant=\"footnote\"\n style={styles.metaLabel}\n numberOfLines={numberOfLinesMetaLabel}\n maxFontSizeMultiplier={maxFontSizeMultiplier}\n onLayout={onMetaLabelLayout}\n >\n {metaLabel}\n </Text>\n )}\n </BadgeWrapper>\n )\n}\n\nconst BadgeWrapper = ({\n children,\n onPress,\n accessibilityRole,\n ...restProps\n}: ViewProps & Pick<BadgeProps, 'onPress'>) => {\n if (onPress) {\n return (\n <Pressable accessibilityRole={accessibilityRole} onPress={onPress} {...restProps}>\n {children}\n </Pressable>\n )\n }\n\n return <View {...restProps}>{children}</View>\n}\n\n// =================================\n// ====== Styles ===================\n// =================================\n\nconst useStyles = ({\n appearance = 'neutral',\n maxFontSizeMultiplier,\n variant = 'default',\n}: Partial<BadgeProps>) => {\n const { colors } = useTheme()\n const fontScale = useFontScale({ maxFontSizeMultiplier })\n\n const statusColorMap = useStatusColorAppearanceMap()\n\n const badgeGap = 4 * fontScale\n const badgePaddingHorizontal = 8\n const badgePaddingVertical = 4\n const badgeFontSize = 12\n\n const variantStylesMap: VariantStyles = {\n default: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd * fontScale,\n textColor: statusColorMap[appearance].text,\n fontWeight: 'normal',\n },\n meta: {\n gap: badgeGap,\n backgroundColor: statusColorMap[appearance].background,\n metaLabelPaddingLeft: badgePaddingHorizontal,\n paddingHorizontal: badgePaddingHorizontal,\n paddingVertical: badgePaddingVertical,\n borderWidth: tokens.borderSizeDefault * fontScale,\n borderRadius: tokens.borderRadiusMd * fontScale,\n textColor: statusColorMap[appearance].text,\n fontWeight: platformFontWeightMedium,\n },\n metaSubtle: {\n gap: badgeGap,\n backgroundColor: 'transparent',\n metaLabelPaddingLeft: badgeGap,\n paddingHorizontal: 0,\n paddingVertical: 0,\n borderWidth: 0,\n borderRadius: 0,\n textColor: colors.textColorDefaultSecondary,\n fontWeight: platformFontWeightMedium,\n },\n }\n\n return StyleSheet.create({\n badgeWrapper: {\n flexDirection: 'row',\n justifyContent: 'center',\n alignSelf: 'flex-start',\n borderRadius: variantStylesMap[variant].borderRadius,\n borderWidth: variantStylesMap[variant].borderWidth,\n borderColor: statusColorMap[appearance].background,\n },\n badge: {\n flexDirection: 'row',\n alignItems: 'center',\n gap: variantStylesMap[variant].gap,\n paddingVertical: variantStylesMap[variant].paddingVertical,\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n backgroundColor: variantStylesMap[variant].backgroundColor,\n // metaSubtle's borderRadius is 0, so this would otherwise resolve to -2.\n // Neither platform clamps a negative radius; Android's BackgroundDrawable\n // reads it as \"no rounded borders\" and skips the rounded path entirely.\n borderRadius: Math.max(0, variantStylesMap[variant].borderRadius - 2),\n },\n icon: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize,\n },\n iconRight: {\n color: statusColorMap[appearance].icon,\n fontSize: badgeFontSize - 2,\n },\n logo: {\n fontSize: badgeFontSize * fontScale,\n },\n label: {\n color: variantStylesMap[variant].textColor,\n fontWeight: variantStylesMap[variant].fontWeight,\n fontSize: badgeFontSize,\n flexShrink: 1,\n },\n metaLabel: {\n paddingHorizontal: variantStylesMap[variant].paddingHorizontal,\n fontSize: badgeFontSize,\n alignSelf: 'center',\n flexShrink: 1,\n // CHAT-476 candidate fix: margin (not padding) so this offset sits\n // outside contentInsets - a shrunk Text can never see it as part of\n // its own measured content width, so it can't go negative from this.\n marginLeft: variantStylesMap[variant].metaLabelPaddingLeft,\n },\n })\n}\n\n// =================================\n// ====== Product Logos ============\n// =================================\n\ninterface ProductLogoProps {\n logoSize: number\n}\n\nfunction GroupsLogo({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n d=\"M9.06 6.14H6.94c-.152.36-.438.646-.797.798v2.12c.359.152.645.438.797.797h2.117c.152-.359.437-.645.796-.797V6.94a1.502 1.502 0 01-.793-.8zM8 0C1.6 0 0 1.595 0 8s1.6 8 8 8 8-1.595 8-8-1.595-8-8-8zm3.939 10.44a1.5 1.5 0 01-2.882.585H6.94a1.5 1.5 0 11-1.963-1.963v-2.12A1.501 1.501 0 116.94 4.98h2.12a1.5 1.5 0 111.963 1.968v2.11a1.501 1.501 0 01.916 1.383z\"\n fill=\"url(#paint0_linear_2632_26363)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_26363\"\n x1={-5.6338}\n y1={5.6338}\n x2={5.6338}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#FF962D\" />\n <Stop offset={1} stopColor=\"#FC7638\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n\nfunction ServicesIcon({ logoSize }: ProductLogoProps) {\n return (\n <Svg width={logoSize} height={logoSize} viewBox=\"0 0 16 16\" fill=\"none\">\n <Path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M.116 8c0-6.4 1.6-8 8-8s8 1.6 8 8-1.6 8-8 8-8-1.6-8-8zm4.123 3.464a.848.848 0 10.943-1.41.848.848 0 00-.943 1.41zm.001-2.76a.848.848 0 10.948-1.408.848.848 0 00-.948 1.407zm0-2.759a.849.849 0 10.948-1.408.849.849 0 00-.948 1.408zm8.1 5.34a.388.388 0 00.03-.149v-.755a.39.39 0 00-.39-.39H6.87a.39.39 0 00-.39.39v.755a.39.39 0 00.39.39h5.11a.39.39 0 00.36-.24zm0-2.758a.388.388 0 00.03-.149v-.757a.387.387 0 00-.39-.388H6.87a.388.388 0 00-.39.388v.757a.388.388 0 00.39.388h5.11a.388.388 0 00.36-.24zm0-2.76a.388.388 0 00.03-.148v-.754a.39.39 0 00-.39-.389H6.87a.39.39 0 00-.39.387v.756a.39.39 0 00.39.39h5.11a.389.389 0 00.36-.241z\"\n fill=\"url(#paint0_linear_2632_56586)\"\n />\n <Defs>\n <LinearGradient\n id=\"paint0_linear_2632_56586\"\n x1={-5.51759}\n y1={5.6338}\n x2={5.75001}\n y2={16.9014}\n gradientUnits=\"userSpaceOnUse\"\n >\n <Stop stopColor=\"#6BB23D\" />\n <Stop offset={1} stopColor=\"#659630\" />\n </LinearGradient>\n </Defs>\n </Svg>\n )\n}\n"]}
@@ -0,0 +1,21 @@
1
+ import { LayoutChangeEvent } from 'react-native';
2
+ export declare const __resetLayoutDiagnosticsForTests: () => void;
3
+ /**
4
+ * Attaches to a suspect Text/TextInput/View's onLayout and reports through
5
+ * Log.reportError the first time its resolved width drops to at or below
6
+ * its own horizontal inset (padding/border) — the shape that Android's
7
+ * unclamped text-measure path can turn into a negative width. Returns
8
+ * undefined on non-Android platforms so it's a no-op there.
9
+ */
10
+ export declare const useLayoutWidthProbe: (label: string, inset?: number) => ((event: LayoutChangeEvent) => void) | undefined;
11
+ /**
12
+ * Mount once per conversation screen. Periodically flushes every probed
13
+ * label's latest known width as a single breadcrumb, so there's a timeline
14
+ * leading up to the crash even if no individual probe crosses the
15
+ * suspicious threshold. Capped at MAX_BREADCRUMB_FLUSHES per mount.
16
+ */
17
+ export declare const useConversationLayoutDiagnostics: ({ conversationId, replyRootId, }: {
18
+ conversationId: number;
19
+ replyRootId?: string | null;
20
+ }) => void;
21
+ //# sourceMappingURL=use_conversation_layout_diagnostics.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use_conversation_layout_diagnostics.d.ts","sourceRoot":"","sources":["../../src/hooks/use_conversation_layout_diagnostics.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAA6C,MAAM,cAAc,CAAA;AAsB3F,eAAO,MAAM,gCAAgC,YAG5C,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,GAAI,OAAO,MAAM,EAAE,cAAS,cAIhD,iBAAiB,sBAiC5B,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,gCAAgC,GAAI,kCAG9C;IACD,cAAc,EAAE,MAAM,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC5B,SAoCA,CAAA"}
@@ -0,0 +1,99 @@
1
+ import { useCallback, useEffect, useRef } from 'react';
2
+ import { PixelRatio, Platform, useWindowDimensions } from 'react-native';
3
+ import { Log } from '../utils';
4
+ const BREADCRUMB_INTERVAL_MS = 500;
5
+ const MAX_BREADCRUMB_FLUSHES = 6;
6
+ const SUSPICIOUS_MARGIN = 1;
7
+ // Temporary instrumentation for CHAT-476 (Android-only `Layout: -2 < 0`
8
+ // conversation crash). Android's text layout hard-throws when a Text or
9
+ // TextInput resolves to a non-positive content width; this attaches to
10
+ // onLayout on suspect nodes and reports their resolved width through the
11
+ // host error reporter, so a QA repro surfaces which node it is before the
12
+ // native crash tears down the surface. Remove once CHAT-476 is resolved —
13
+ // this hook and every call site are tagged CHAT-476 for that reason.
14
+ const samplesByLabel = new Map();
15
+ const reportedSuspiciousLabels = new Set();
16
+ // Test-only: the maps above are module-scope so useConversationLayoutDiagnostics
17
+ // can flush every probe's latest sample in one breadcrumb. Reset between tests.
18
+ export const __resetLayoutDiagnosticsForTests = () => {
19
+ samplesByLabel.clear();
20
+ reportedSuspiciousLabels.clear();
21
+ };
22
+ /**
23
+ * Attaches to a suspect Text/TextInput/View's onLayout and reports through
24
+ * Log.reportError the first time its resolved width drops to at or below
25
+ * its own horizontal inset (padding/border) — the shape that Android's
26
+ * unclamped text-measure path can turn into a negative width. Returns
27
+ * undefined on non-Android platforms so it's a no-op there.
28
+ */
29
+ export const useLayoutWidthProbe = (label, inset = 0) => {
30
+ const mountedAtRef = useRef(Date.now());
31
+ const handleLayout = useCallback((event) => {
32
+ const { width, height, x } = event.nativeEvent.layout;
33
+ const previous = samplesByLabel.get(label);
34
+ if (previous && previous.width === width && previous.height === height && previous.x === x) {
35
+ return;
36
+ }
37
+ samplesByLabel.set(label, { width, height, x });
38
+ const isSuspicious = width <= inset + SUSPICIOUS_MARGIN;
39
+ if (!isSuspicious || reportedSuspiciousLabels.has(label))
40
+ return;
41
+ reportedSuspiciousLabels.add(label);
42
+ Log.reportError(new Error(`CHAT-476: ${label} measured at or below its horizontal inset`), {
43
+ scope: 'component',
44
+ tags: { team: 'chat', chat476: 'near-zero-width' },
45
+ extra: {
46
+ label,
47
+ width,
48
+ height,
49
+ x,
50
+ inset,
51
+ msSinceMount: Date.now() - mountedAtRef.current,
52
+ pixelRatio: PixelRatio.get(),
53
+ fontScale: PixelRatio.getFontScale(),
54
+ },
55
+ });
56
+ }, [label, inset]);
57
+ if (Platform.OS !== 'android')
58
+ return undefined;
59
+ return handleLayout;
60
+ };
61
+ /**
62
+ * Mount once per conversation screen. Periodically flushes every probed
63
+ * label's latest known width as a single breadcrumb, so there's a timeline
64
+ * leading up to the crash even if no individual probe crosses the
65
+ * suspicious threshold. Capped at MAX_BREADCRUMB_FLUSHES per mount.
66
+ */
67
+ export const useConversationLayoutDiagnostics = ({ conversationId, replyRootId, }) => {
68
+ const { width: windowWidth } = useWindowDimensions();
69
+ const mountedAtRef = useRef(Date.now());
70
+ const flushCountRef = useRef(0);
71
+ useEffect(() => {
72
+ if (Platform.OS !== 'android')
73
+ return;
74
+ samplesByLabel.clear();
75
+ reportedSuspiciousLabels.clear();
76
+ mountedAtRef.current = Date.now();
77
+ flushCountRef.current = 0;
78
+ const interval = setInterval(() => {
79
+ if (flushCountRef.current >= MAX_BREADCRUMB_FLUSHES || samplesByLabel.size === 0)
80
+ return;
81
+ flushCountRef.current += 1;
82
+ Log.reportError(new Error('CHAT-476: layout breadcrumb'), {
83
+ scope: 'component',
84
+ tags: { team: 'chat', chat476: 'breadcrumb' },
85
+ extra: {
86
+ conversationId,
87
+ replyRootId,
88
+ msSinceMount: Date.now() - mountedAtRef.current,
89
+ windowWidth,
90
+ pixelRatio: PixelRatio.get(),
91
+ fontScale: PixelRatio.getFontScale(),
92
+ samples: [...samplesByLabel.entries()].map(([label, { width, height, x }]) => `${label}|w=${width}|h=${height}|x=${x}`),
93
+ },
94
+ });
95
+ }, BREADCRUMB_INTERVAL_MS);
96
+ return () => clearInterval(interval);
97
+ }, [conversationId, replyRootId, windowWidth]);
98
+ };
99
+ //# sourceMappingURL=use_conversation_layout_diagnostics.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use_conversation_layout_diagnostics.js","sourceRoot":"","sources":["../../src/hooks/use_conversation_layout_diagnostics.ts"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useRef } from 'react'\nimport { LayoutChangeEvent, PixelRatio, Platform, useWindowDimensions } from 'react-native'\nimport { Log } from '../utils'\n\nconst BREADCRUMB_INTERVAL_MS = 500\nconst MAX_BREADCRUMB_FLUSHES = 6\nconst SUSPICIOUS_MARGIN = 1\n\ntype LayoutSample = { width: number; height: number; x: number }\n\n// Temporary instrumentation for CHAT-476 (Android-only `Layout: -2 < 0`\n// conversation crash). Android's text layout hard-throws when a Text or\n// TextInput resolves to a non-positive content width; this attaches to\n// onLayout on suspect nodes and reports their resolved width through the\n// host error reporter, so a QA repro surfaces which node it is before the\n// native crash tears down the surface. Remove once CHAT-476 is resolved —\n// this hook and every call site are tagged CHAT-476 for that reason.\n\nconst samplesByLabel = new Map<string, LayoutSample>()\nconst reportedSuspiciousLabels = new Set<string>()\n\n// Test-only: the maps above are module-scope so useConversationLayoutDiagnostics\n// can flush every probe's latest sample in one breadcrumb. Reset between tests.\nexport const __resetLayoutDiagnosticsForTests = () => {\n samplesByLabel.clear()\n reportedSuspiciousLabels.clear()\n}\n\n/**\n * Attaches to a suspect Text/TextInput/View's onLayout and reports through\n * Log.reportError the first time its resolved width drops to at or below\n * its own horizontal inset (padding/border) — the shape that Android's\n * unclamped text-measure path can turn into a negative width. Returns\n * undefined on non-Android platforms so it's a no-op there.\n */\nexport const useLayoutWidthProbe = (label: string, inset = 0) => {\n const mountedAtRef = useRef(Date.now())\n\n const handleLayout = useCallback(\n (event: LayoutChangeEvent) => {\n const { width, height, x } = event.nativeEvent.layout\n const previous = samplesByLabel.get(label)\n if (previous && previous.width === width && previous.height === height && previous.x === x) {\n return\n }\n samplesByLabel.set(label, { width, height, x })\n\n const isSuspicious = width <= inset + SUSPICIOUS_MARGIN\n if (!isSuspicious || reportedSuspiciousLabels.has(label)) return\n\n reportedSuspiciousLabels.add(label)\n Log.reportError(new Error(`CHAT-476: ${label} measured at or below its horizontal inset`), {\n scope: 'component',\n tags: { team: 'chat', chat476: 'near-zero-width' },\n extra: {\n label,\n width,\n height,\n x,\n inset,\n msSinceMount: Date.now() - mountedAtRef.current,\n pixelRatio: PixelRatio.get(),\n fontScale: PixelRatio.getFontScale(),\n },\n })\n },\n [label, inset]\n )\n\n if (Platform.OS !== 'android') return undefined\n\n return handleLayout\n}\n\n/**\n * Mount once per conversation screen. Periodically flushes every probed\n * label's latest known width as a single breadcrumb, so there's a timeline\n * leading up to the crash even if no individual probe crosses the\n * suspicious threshold. Capped at MAX_BREADCRUMB_FLUSHES per mount.\n */\nexport const useConversationLayoutDiagnostics = ({\n conversationId,\n replyRootId,\n}: {\n conversationId: number\n replyRootId?: string | null\n}) => {\n const { width: windowWidth } = useWindowDimensions()\n const mountedAtRef = useRef(Date.now())\n const flushCountRef = useRef(0)\n\n useEffect(() => {\n if (Platform.OS !== 'android') return\n\n samplesByLabel.clear()\n reportedSuspiciousLabels.clear()\n mountedAtRef.current = Date.now()\n flushCountRef.current = 0\n\n const interval = setInterval(() => {\n if (flushCountRef.current >= MAX_BREADCRUMB_FLUSHES || samplesByLabel.size === 0) return\n\n flushCountRef.current += 1\n Log.reportError(new Error('CHAT-476: layout breadcrumb'), {\n scope: 'component',\n tags: { team: 'chat', chat476: 'breadcrumb' },\n extra: {\n conversationId,\n replyRootId,\n msSinceMount: Date.now() - mountedAtRef.current,\n windowWidth,\n pixelRatio: PixelRatio.get(),\n fontScale: PixelRatio.getFontScale(),\n samples: [...samplesByLabel.entries()].map(\n ([label, { width, height, x }]) => `${label}|w=${width}|h=${height}|x=${x}`\n ),\n },\n })\n }, BREADCRUMB_INTERVAL_MS)\n\n return () => clearInterval(interval)\n }, [conversationId, replyRootId, windowWidth])\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"conversation_screen.d.ts","sourceRoot":"","sources":["../../src/screens/conversation_screen.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,gBAAgB,EAAqB,MAAM,4BAA4B,CAAA;AAC7F,OAAO,EAGL,iBAAiB,EAIlB,MAAM,0BAA0B,CAAA;AAmCjC,OAAO,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAA;AAOjF,MAAM,MAAM,sBAAsB,GAAG;IACnC,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,yBAAyB,CAAA;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,sBAAsB,CAAC,CAAA;AAE/E,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,EAAE,uBAAuB,2CAkBpE;AAmPD,UAAU,4BAA6B,SAAQ,gBAAgB;IAC7D,eAAe,EAAE,MAAM,CAAA;IACvB,KAAK,CAAC,EAAE,yBAAyB,CAAA;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,eAAO,MAAM,uBAAuB,GAAI,8DAOrC,4BAA4B,4CAoC9B,CAAA"}
1
+ {"version":3,"file":"conversation_screen.d.ts","sourceRoot":"","sources":["../../src/screens/conversation_screen.tsx"],"names":[],"mappings":"AACA,OAAO,EAAe,gBAAgB,EAAqB,MAAM,4BAA4B,CAAA;AAC7F,OAAO,EAGL,iBAAiB,EAIlB,MAAM,0BAA0B,CAAA;AAwCjC,OAAO,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAA;AAOjF,MAAM,MAAM,sBAAsB,GAAG;IACnC,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,sBAAsB,CAAC,EAAE,MAAM,CAAA;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,yBAAyB,CAAA;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,sBAAsB,CAAC,CAAA;AAE/E,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,EAAE,uBAAuB,2CAkBpE;AAuPD,UAAU,4BAA6B,SAAQ,gBAAgB;IAC7D,eAAe,EAAE,MAAM,CAAA;IACvB,KAAK,CAAC,EAAE,yBAAyB,CAAA;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,eAAO,MAAM,uBAAuB,GAAI,8DAOrC,4BAA4B,4CAuC9B,CAAA"}
@@ -22,6 +22,8 @@ import { useTheme } from '../hooks';
22
22
  import { useMessageAvailableMembersAction } from '../hooks/direct_messages/use_message_available_members_action';
23
23
  import { useConversation } from '../hooks/use_conversation';
24
24
  import { useConversationJoltEvents } from '../hooks/use_conversation_jolt_events';
25
+ // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts
26
+ import { useConversationLayoutDiagnostics, useLayoutWidthProbe, } from '../hooks/use_conversation_layout_diagnostics';
25
27
  import { useConversationMessages } from '../hooks/use_conversation_messages';
26
28
  import { useConversationMessagesJoltEvents } from '../hooks/use_conversation_messages_jolt_events';
27
29
  import { useMarkLatestMessageRead } from '../hooks/use_mark_latest_message_read';
@@ -51,6 +53,8 @@ function ConversationScreenContent({ route }) {
51
53
  });
52
54
  useConversationJoltEvents({ conversationId: conversation_id });
53
55
  useConversationMessagesJoltEvents({ conversationId: conversation_id });
56
+ // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts
57
+ useConversationLayoutDiagnostics({ conversationId: conversation_id, replyRootId: reply_root_id });
54
58
  const { markHandledByMessageForm } = useVideoModerationJoltEvents();
55
59
  useEnsureConversationsRouteExists();
56
60
  useMarkLatestMessageRead({ conversation, messages });
@@ -111,8 +115,8 @@ function ConversationScreenContent({ route }) {
111
115
  }
112
116
  return (_jsx(Message, { ...item, canDeleteNonAuthoredMessages: canDeleteNonAuthoredMessages, conversation_id: conversation_id, latestReadMessageSortKey: conversation?.latestReadMessageSortKey, inReplyScreen: !!reply_root_id }));
113
117
  }, onEndReached: () => {
114
- // Android's inverted FlatList can refire onEndReached while a
115
- // page fetch is already in flight, queueing unbounded requests.
118
+ // VirtualizedList dedupes onEndReached per content length, not
119
+ // per fetch, so it can refire while a page is already in flight.
116
120
  if (hasNextPage && !isFetchingNextPage)
117
121
  fetchNextPage();
118
122
  }, ListHeaderComponent: _jsx(View, { style: styles.listHeader }) })), _jsx(JumpToBottomButton, { onPress: handleReturnToBottom, visible: showJumpToBottomButton }), !noMessages && _jsx(TypingIndicator, {}), showLeaderDisabledReplyBanner && _jsx(LeaderMessagesDisabledBanner, {}), _jsx(ConversationBottomBar, { conversation: conversation, canReply: canReply, replyRootAuthorFirstName: replyRootAuthorFirstName, replyRootId: reply_root_id, currentlyEditingMessage: currentlyEditingMessage, onFlaggedInMessageForm: markHandledByMessageForm })] }) }));
@@ -132,7 +136,9 @@ function InlineDateSeparator({ date }) {
132
136
  const { isThisYear } = getRelativeDateStatus(date);
133
137
  const showYear = !isThisYear;
134
138
  const dateStamp = formatDate(date, { style: 'long', year: showYear });
135
- return (_jsxs(View, { style: styles.container, children: [_jsx(View, { style: styles.separator }), _jsx(Text, { variant: "footnote", style: styles.dateText, children: dateStamp }), _jsx(View, { style: styles.separator })] }));
139
+ // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts
140
+ const onDateTextLayout = useLayoutWidthProbe('dateSeparator.text', 16);
141
+ return (_jsxs(View, { style: styles.container, children: [_jsx(View, { style: styles.separator }), _jsx(Text, { variant: "footnote", style: styles.dateText, onLayout: onDateTextLayout, children: dateStamp }), _jsx(View, { style: styles.separator })] }));
136
142
  }
137
143
  const useDateSeparatorStyles = () => {
138
144
  const theme = useTheme();
@@ -160,7 +166,9 @@ export const ConversationScreenTitle = ({ conversation_id, badge, children, styl
160
166
  const resourceType = badge?.pcoResourceType || '';
161
167
  const productName = badge?.appName;
162
168
  const name = badge?.text || undefined;
163
- return (_jsxs(PlatformPressable, { accessibilityHint: "Opens details about members and settings", style: styles.container, onPress: () => {
169
+ // CHAT-476 diagnostics - remove with use_conversation_layout_diagnostics.ts
170
+ const onHeaderContainerLayout = useLayoutWidthProbe('header.container', 0);
171
+ return (_jsxs(PlatformPressable, { accessibilityHint: "Opens details about members and settings", style: styles.container, onLayout: onHeaderContainerLayout, onPress: () => {
164
172
  if (deleted)
165
173
  return;
166
174
  navigation.navigate('ConversationDetails', { conversation_id });
@@ -169,8 +177,10 @@ export const ConversationScreenTitle = ({ conversation_id, badge, children, styl
169
177
  const usePressableHeaderStyle = () => {
170
178
  const { width } = useWindowDimensions();
171
179
  const slotReserve = useHeaderSlotReserve();
172
- // Guards split-screen/DeX widths where slotReserve * 2 exceeds the
173
- // available width, which would otherwise resolve to a negative maxWidth.
180
+ // Guards narrow windows (split-screen, freeform, DeX) where slotReserve * 2
181
+ // exceeds the available width. A negative maxWidth can hand a descendant
182
+ // <Text> a negative measure width, and android.text.Layout hard-throws on
183
+ // that (`Layout: -2 < 0`) rather than clamping the way iOS does.
174
184
  const headerContainerStyle = { maxWidth: Math.max(0, width - slotReserve * 2) };
175
185
  return StyleSheet.create({
176
186
  container: {