stream-chat-react-native-core 9.10.1 → 10.0.0-rc.1

package/src/components/Notifications/notificationTranslations.ts

@@ -1,5 +1,13 @@
-import type { TFunction } from 'i18next';
-import type { Notification } from 'stream-chat';
+import { CORE_NOTIFICATION_TYPE } from 'stream-chat';
+import type { CoreNotificationType, Notification } from 'stream-chat';
+
+import type { StreamTFunction } from '../../i18n/types';
+import { asDynamicKey } from '../../i18n/utils';
+
+type NotificationTranslator = (options: {
+  notification: Notification;
+  t: StreamTFunction;
+}) => string;
 
 const normalizeReason = (notification?: Notification) => {
   const reason = notification?.metadata?.reason;
@@ -17,12 +25,12 @@ const withReasonFallback = ({
   fallbackTranslationKey: string;
   notification?: Notification;
   reasonTranslationKey: string;
-  t: TFunction;
+  t: StreamTFunction;
 }) => {
   const reason = normalizeReason(notification);
-  if (!reason) return t(fallbackTranslationKey);
+  if (!reason) return t(asDynamicKey(fallbackTranslationKey));
 
-  return t(reasonTranslationKey, { reason });
+  return t(asDynamicKey(reasonTranslationKey), { reason });
 };
 
 const translateAttachmentUploadBlocked = ({
@@ -30,14 +38,23 @@ const translateAttachmentUploadBlocked = ({
   t,
 }: {
   notification?: Notification;
-  t: TFunction;
+  t: StreamTFunction;
 }) => {
   const rawReason = notification?.metadata?.reason;
-  let reason = t('unsupported file type');
-  if (typeof rawReason !== 'string') reason = t('unknown error');
-  if (rawReason === 'size_limit') reason = t('size limit');
-
-  return t('Attachment upload blocked due to {{reason}}', { reason });
+  let reason = t(
+    'notifications.attachmentUploadBlocked.reason.unsupportedFileType.text',
+    'unsupported file type',
+  );
+  if (typeof rawReason !== 'string')
+    reason = t('notifications.attachmentUploadBlocked.reason.unknownError.text', 'unknown error');
+  if (rawReason === 'size_limit')
+    reason = t('notifications.attachmentUploadBlocked.reason.sizeLimit.text', 'size limit');
+
+  return t(
+    'notifications.attachmentUploadBlocked.error',
+    'Attachment upload blocked due to {{reason}}',
+    { reason },
+  );
 };
 
 const translateAttachmentUploadFailed = ({
@@ -45,12 +62,12 @@ const translateAttachmentUploadFailed = ({
   t,
 }: {
   notification?: Notification;
-  t: TFunction;
+  t: StreamTFunction;
 }) =>
   withReasonFallback({
-    fallbackTranslationKey: 'Error uploading attachment',
+    fallbackTranslationKey: 'notifications.attachmentUploadFailed.error',
     notification,
-    reasonTranslationKey: 'Attachment upload failed due to {{reason}}',
+    reasonTranslationKey: 'notifications.attachmentUploadFailed.withReason.error',
     t,
   });
 
@@ -59,12 +76,12 @@ const translatePollCreateFailed = ({
   t,
 }: {
   notification?: Notification;
-  t: TFunction;
+  t: StreamTFunction;
 }) =>
   withReasonFallback({
-    fallbackTranslationKey: 'Failed to create the poll',
+    fallbackTranslationKey: 'notifications.pollCreateFailed.error',
     notification,
-    reasonTranslationKey: 'Failed to create the poll due to {{reason}}',
+    reasonTranslationKey: 'notifications.pollCreateFailed.withReason.error',
     t,
   });
 
@@ -73,12 +90,12 @@ const translatePollEndFailed = ({
   t,
 }: {
   notification?: Notification;
-  t: TFunction;
+  t: StreamTFunction;
 }) =>
   withReasonFallback({
-    fallbackTranslationKey: 'Failed to end the poll',
+    fallbackTranslationKey: 'poll.endVote.error',
     notification,
-    reasonTranslationKey: 'Failed to end the poll due to {{reason}}',
+    reasonTranslationKey: 'notifications.pollEndFailed.withReason.error',
     t,
   });
 
@@ -87,44 +104,93 @@ const translateCommandDisabled = ({
   t,
 }: {
   notification?: Notification;
-  t: TFunction;
+  t: StreamTFunction;
 }) => {
   const reason = normalizeReason(notification);
 
   if (reason === 'editing') {
-    return t('Command not available while editing');
+    return t(
+      'notifications.commandUnavailable.whileEditing.error',
+      'Command not available while editing',
+    );
   }
 
   if (reason === 'quoted_message') {
-    return t('Command not available while replying');
+    return t(
+      'notifications.commandUnavailable.whileReplying.error',
+      'Command not available while replying',
+    );
   }
 
-  return t(notification?.message || 'Command not available');
+  return t('notifications.commandUnavailable.error', 'Command not available');
 };
 
-const notificationTranslatorsByType: Record<
-  string,
-  (options: { notification: Notification; t: TFunction }) => string
-> = {
-  'api:attachment:upload:failed': translateAttachmentUploadFailed,
-  'api:location:create:failed': ({ t }) => t('Failed to share location'),
-  'api:location:share:failed': ({ t }) => t('Failed to share location'),
-  'api:poll:create:failed': translatePollCreateFailed,
+/**
+ * A translator for every notification `stream-chat` itself emits.
+ *
+ * `Record<CoreNotificationType, …>` is the point: a new identifier in core fails to compile here until
+ * it is mapped, and an entry for one that no longer exists is rejected. Before core exported the union,
+ * this table and the React SDK's equivalent were hand-maintained copies of each other, and both had
+ * drifted — carrying entries nothing emits while missing identifiers that fell through to untranslated
+ * English.
+ *
+ * The key *names* stay this SDK's own. They have shipped, integrators' dictionaries are keyed on them,
+ * and `build-translations` reads the literal string at the call site — a key resolved from a map would
+ * be invisible to the generator and so would never reach the catalog.
+ */
+const coreNotificationTranslators: Record<CoreNotificationType, NotificationTranslator> = {
+  [CORE_NOTIFICATION_TYPE.attachmentFileMissing]: ({ t }) =>
+    t('notifications.attachmentFileMissing.error', 'File is required for upload attachment'),
+  [CORE_NOTIFICATION_TYPE.attachmentIdMissing]: ({ t }) =>
+    t('notifications.attachmentIdMissing.error', 'Local upload attachment missing local id'),
+  [CORE_NOTIFICATION_TYPE.attachmentUploadBlocked]: translateAttachmentUploadBlocked,
+  [CORE_NOTIFICATION_TYPE.attachmentUploadFailed]: translateAttachmentUploadFailed,
+  [CORE_NOTIFICATION_TYPE.attachmentUploadInProgress]: ({ t }) =>
+    t('notifications.attachmentUploadInProgress.error', 'Wait until all attachments have uploaded'),
+  [CORE_NOTIFICATION_TYPE.commandDisabled]: translateCommandDisabled,
+  // The three below were unmapped, so they rendered untranslated English from `notification.message`.
+  [CORE_NOTIFICATION_TYPE.commandNotReady]: ({ t }) =>
+    t('notifications.commandNotReady.error', 'Command not ready to be sent'),
+  [CORE_NOTIFICATION_TYPE.locationCreateFailed]: ({ t }) =>
+    t('notifications.locationShareFailed.error', 'Failed to share location'),
+  [CORE_NOTIFICATION_TYPE.messageJumpFailed]: ({ t }) =>
+    t('notifications.messageJumpFailed.error', 'Failed to jump to the message'),
+  [CORE_NOTIFICATION_TYPE.messageJumpToLatestFailed]: ({ t }) =>
+    t('notifications.messageJumpToLatestFailed.error', 'Failed to jump to the latest message'),
+  // The composer's send and update failures, which the SDK used to report itself with this copy.
+  [CORE_NOTIFICATION_TYPE.messageSendFailed]: ({ t }) =>
+    t('common.sendMessageFailed.error', 'Send message request failed'),
+  [CORE_NOTIFICATION_TYPE.messageUpdateFailed]: ({ t }) =>
+    t('common.editMessageFailed.error', 'Edit message request failed'),
+  [CORE_NOTIFICATION_TYPE.pollCastVoteLimit]: ({ t }) =>
+    t(
+      'notifications.voteLimitReached.error',
+      'Reached the vote limit. Remove an existing vote first.',
+    ),
+  [CORE_NOTIFICATION_TYPE.pollCreateFailed]: translatePollCreateFailed,
+};
+
+/**
+ * Translators for notifications this SDK emits itself, which core knows nothing about.
+ *
+ * Deliberately not exhaustiveness-checked — there is no union to check against — so keep it to
+ * identifiers that are actually emitted. `api:reply:search:failed`, `api:location:share:failed` and
+ * `browser:location:get:failed` were removed: all three were copied over from the React SDK and none is
+ * emitted here.
+ */
+const sdkNotificationTranslators: Record<string, NotificationTranslator> = {
   'api:poll:end:failed': translatePollEndFailed,
-  'api:poll:end:success': ({ t }) => t('Poll ended'),
-  'api:reply:search:failed': ({ t }) => t('Thread has not been found'),
+  'api:poll:end:success': ({ t }) => t('notifications.pollEnded.text', 'Poll ended'),
   'browser:audio:playback:error': ({ notification, t }) =>
-    notification.message ? t(notification.message) : t('Error reproducing the recording'),
-  'browser:location:get:failed': ({ t }) => t('Failed to retrieve location'),
-  'channel:jumpToFirstUnread:failed': ({ t }) => t('Failed to jump to the first unread message'),
-  'validation:attachment:file:missing': ({ t }) => t('File is required for upload attachment'),
-  'validation:attachment:id:missing': ({ t }) => t('Local upload attachment missing local id'),
-  'validation:attachment:upload:blocked': translateAttachmentUploadBlocked,
-  'validation:attachment:upload:in-progress': ({ t }) =>
-    t('Wait until all attachments have uploaded'),
-  'validation:command:disabled': translateCommandDisabled,
-  'validation:poll:castVote:limit': ({ t }) =>
-    t('Reached the vote limit. Remove an existing vote first.'),
+    notification.message ||
+    t('notifications.recordingPlaybackFailed.error', 'Error reproducing the recording'),
+  'channel:jumpToFirstUnread:failed': ({ t }) =>
+    t('channel.jumpToFirstUnreadFailed.error', 'Failed to jump to the first unread message'),
+};
+
+const notificationTranslatorsByType: Record<string, NotificationTranslator> = {
+  ...coreNotificationTranslators,
+  ...sdkNotificationTranslators,
 };
 
 export const getNotificationDisplayMessage = ({
@@ -132,11 +198,15 @@ export const getNotificationDisplayMessage = ({
   t,
 }: {
   notification: Notification;
-  t: TFunction;
+  t: StreamTFunction;
 }) => {
   const translator = notification.type
     ? notificationTranslatorsByType[notification.type]
     : undefined;
 
-  return translator ? translator({ notification, t }) : t(notification.message);
+  // An unrecognized identifier renders `message` verbatim. It is untranslated English, but a newer
+  // core — or an integrator emitting its own identifier — must not produce an empty toast. This used
+  // to run the message through a table of English sentences, which is the mechanism core's `type`
+  // replaced: matching on prose went stale silently on every core upgrade.
+  return translator ? translator({ notification, t }) : notification.message;
 };

package/src/components/Poll/CreatePollContent.tsx

@@ -4,7 +4,8 @@ import { StyleSheet, Switch, Text, View } from 'react-native';
 import { ScrollView } from 'react-native-gesture-handler';
 import Animated, { LinearTransition, useSharedValue } from 'react-native-reanimated';
 
-import { PollComposerState, StateStore, VotingVisibility } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
+import { PollComposerState } from 'stream-chat';
 
 import { CreatePollOptions, CurrentOptionPositionsCache } from './components';
 
@@ -120,7 +121,7 @@ export const CreatePollContent = () => {
     async (value: boolean) => {
       setIsAnonymousPoll(value);
       await pollComposer.updateFields({
-        voting_visibility: value ? VotingVisibility.anonymous : VotingVisibility.public,
+        voting_visibility: value ? 'anonymous' : 'public',
       });
     },
     [pollComposer],
@@ -165,9 +166,11 @@ export const CreatePollContent = () => {
           >
             <View style={[styles.optionCard, anonymousPoll.wrapper]}>
               <View style={[styles.optionCardContent, anonymousPoll.optionCardContent]}>
-                <Text style={[styles.title, anonymousPoll.title]}>{t('Anonymous voting')}</Text>
+                <Text style={[styles.title, anonymousPoll.title]}>
+                  {t('poll.createPoll.anonymousVoting.label', 'Anonymous voting')}
+                </Text>
                 <Text style={[styles.description, anonymousPoll.description]}>
-                  {t('Hide who voted')}
+                  {t('poll.createPoll.anonymousVoting.description', 'Hide who voted')}
                 </Text>
               </View>
 
@@ -179,9 +182,11 @@ export const CreatePollContent = () => {
             </View>
             <View style={[styles.optionCard, suggestOption.wrapper]}>
               <View style={[styles.optionCardContent, suggestOption.optionCardContent]}>
-                <Text style={[styles.title, suggestOption.title]}>{t('Suggest an option')}</Text>
+                <Text style={[styles.title, suggestOption.title]}>
+                  {t('poll.suggestOption.label', 'Suggest an option')}
+                </Text>
                 <Text style={[styles.description, suggestOption.description]}>
-                  {t('Let others add options')}
+                  {t('poll.suggestOption.description', 'Let others add options')}
                 </Text>
               </View>
 
@@ -193,9 +198,11 @@ export const CreatePollContent = () => {
             </View>
             <View style={[styles.optionCard, addComment.wrapper]}>
               <View style={[styles.optionCardContent, addComment.optionCardContent]}>
-                <Text style={[styles.title, addComment.title]}>{t('Add a comment')}</Text>
+                <Text style={[styles.title, addComment.title]}>
+                  {t('poll.addComment.label', 'Add a comment')}
+                </Text>
                 <Text style={[styles.description, addComment.description]}>
-                  {t('Add a comment to the poll')}
+                  {t('poll.addComment.description', 'Add a comment to the poll')}
                 </Text>
               </View>
 

package/src/components/Poll/Poll.tsx

@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 
-import { PollOption as PollOptionClass } from 'stream-chat';
+import { PollOptionResponseData as PollOptionClass } from 'stream-chat';
 
 import { PollOption, ShowAllOptionsButton } from './components';
 import { PollUIStateProvider } from './contexts/PollUIStateContext';
@@ -31,15 +31,19 @@ export const PollHeader = () => {
 
   const subtitle = useMemo(() => {
     if (isClosed) {
-      return t('Poll has ended');
+      return t('poll.subtitle.ended.text', 'Poll has ended');
     }
     if (enforceUniqueVote) {
-      return t('Select one');
+      return t('poll.subtitle.selectOne.text', 'Select one');
     }
     if (maxVotesAllowed) {
-      return t('Select up to {{count}}', { count: maxVotesAllowed });
+      return t('poll.subtitle.selectUpTo.text', {
+        count: maxVotesAllowed,
+        defaultValue_one: 'Select up to {{count}}',
+        defaultValue_other: 'Select up to {{count}}',
+      });
     }
-    return t('Select one or more');
+    return t('poll.subtitle.selectAny.text', 'Select one or more');
   }, [isClosed, t, enforceUniqueVote, maxVotesAllowed]);
 
   const {

package/src/components/Poll/__tests__/Poll.test.tsx

@@ -34,7 +34,9 @@ describe('PollHeader chat text side', () => {
   const renderHeader = () =>
     render(
       <ThemeProvider>
-        <TranslationProvider value={{ t: (key: string) => key } as never}>
+        <TranslationProvider
+          value={{ t: (key: string, d?: unknown) => (typeof d === 'string' ? d : key) } as never}
+        >
           <OwnCapabilitiesProvider value={{} as never}>
             <PollContextProvider
               value={{ message: generateMessage(), poll: { data: {} } as never }}

package/src/components/Poll/components/Button.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 
-import { LocalMessage, Poll, PollOption } from 'stream-chat';
+import { LocalMessage, Poll, PollOptionResponseData } from 'stream-chat';
 
 import { Button, ButtonProps } from '../../ui';
 
@@ -15,7 +15,7 @@ export type PollVoteButtonProps = {
    * surfaces that are not a message bubble, such as the full-options list.
    */
   forceIncoming?: boolean;
-  option: PollOption;
+  option: PollOptionResponseData;
   style?: StyleProp<ViewStyle>;
 } & Pick<PollButtonProps, 'onPress'>;
 

package/src/components/Poll/components/CreatePollHeader.tsx

@@ -59,7 +59,7 @@ export const CreatePollHeader = ({
   return (
     <View style={[styles.headerContainer, headerContainer]}>
       <Button
-        accessibilityLabelKey='a11y/Close poll creation'
+        accessibilityLabelKey='poll.createPoll.close.accessibilityLabel'
         variant='secondary'
         onPress={onBackPressHandler}
         type='outline'
@@ -69,11 +69,11 @@ export const CreatePollHeader = ({
       />
 
       <Text numberOfLines={1} style={[styles.title, titleStyle]}>
-        {t('Create Poll')}
+        {t('attachmentPicker.poll.label', 'Create Poll')}
       </Text>
 
       <Button
-        accessibilityLabelKey='a11y/Create poll'
+        accessibilityLabelKey='poll.createPoll.submit.accessibilityLabel'
         variant='primary'
         onPress={onCreatePollPressHandler}
         type='solid'

package/src/components/Poll/components/CreatePollOptions.tsx

@@ -1,4 +1,5 @@
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
+
 import {
   I18nManager,
   LayoutChangeEvent,
@@ -23,7 +24,8 @@ import Animated, {
   withSpring,
 } from 'react-native-reanimated';
 
-import { PollComposerOption, PollComposerState } from 'stream-chat';
+import { POLL_COMPOSER_VALIDATION_CODE, PollComposerOption, PollComposerState } from 'stream-chat';
+import type { PollComposerValidationCode, PollComposerValidationError } from 'stream-chat';
 
 import { useCreatePollContentContext, useTheme, useTranslationContext } from '../../../contexts';
 import { useComponentsContext } from '../../../contexts/componentsContext/ComponentsContext';
@@ -50,7 +52,7 @@ export type CreatePollOptionType = {
   optionsCount: number;
   currentOptionPositions: SharedValue<CurrentOptionPositionsCache>;
   draggedItemId: SharedValue<string | null>;
-  error?: string;
+  error?: PollComposerValidationError;
   handleChangeText: (newText: string, index: number) => void;
   handleBlur: () => void;
   index: number;
@@ -287,6 +289,23 @@ export const CreatePollOption = ({
   const { t } = useTranslationContext();
   const { icons } = useComponentsContext();
   const { createPollOptionGap = 8 } = useCreatePollContentContext();
+
+  // Keyed on `stream-chat`'s stable validation code. This used to match on the English sentence the
+  // composer returned, which meant a reworded message in a `stream-chat` patch silently stopped
+  // translating. `error.message` remains the fallback so an unrecognized code renders readable text.
+  const knownValidationErrors = useMemo<Partial<Record<PollComposerValidationCode, string>>>(
+    () => ({
+      [POLL_COMPOSER_VALIDATION_CODE.optionDuplicate]: t(
+        'poll.createPoll.options.duplicate.error',
+        'Option already exists',
+      ),
+      [POLL_COMPOSER_VALIDATION_CODE.optionEmpty]: t(
+        'poll.createPoll.options.empty.error',
+        'Option is empty',
+      ),
+    }),
+    [t],
+  );
   const normalizedCreatePollOptionGap =
     Number.isFinite(createPollOptionGap) && createPollOptionGap > 0 ? createPollOptionGap : 0;
   const initialTop =
@@ -517,7 +536,7 @@ export const CreatePollOption = ({
         <TextInput
           onBlur={handleBlur}
           onChangeText={onChangeTextHandler}
-          placeholder={t('Add an option')}
+          placeholder={t('poll.createPoll.options.placeholder', 'Add an option')}
           placeholderTextColor={semantics.inputTextPlaceholder}
           style={[styles.optionInput, optionStyle.input]}
         />
@@ -533,7 +552,7 @@ export const CreatePollOption = ({
         >
           <icons.InfoTooltip height={20} width={20} fill={semantics.accentError} />
           <Text style={[styles.optionValidationError, optionStyle.validationErrorText]}>
-            {t(error)}
+            {knownValidationErrors[error.code] ?? error.message}
           </Text>
         </View>
       ) : null}
@@ -714,7 +733,7 @@ export const CreatePollOptions = ({ currentOptionPositions }: CreatePollOptionsP
 
   return (
     <View style={[styles.container, container]}>
-      <Text style={[styles.title, title]}>{t('Options')}</Text>
+      <Text style={[styles.title, title]}>{t('poll.createPoll.options.label', 'Options')}</Text>
       <Animated.View layout={LinearTransition.duration(200)} style={animatedOptionsContainerStyle}>
         {options.map((option, index) => (
           <MemoizedCreatePollOption

package/src/components/Poll/components/MultipleAnswersField.tsx

@@ -41,9 +41,11 @@ export const MultipleAnswersField = () => {
     >
       <View style={[styles.optionCard, multipleAnswers.optionCard]}>
         <View style={[styles.optionCardContent, multipleAnswers.optionCardContent]}>
-          <Text style={[styles.title, multipleAnswers.title]}>{t('Multiple votes')}</Text>
+          <Text style={[styles.title, multipleAnswers.title]}>
+            {t('poll.createPoll.multipleVotes.label', 'Multiple votes')}
+          </Text>
           <Text style={[styles.description, multipleAnswers.description]}>
-            {t('Select more than one option')}
+            {t('poll.createPoll.multipleVotes.description', 'Select more than one option')}
           </Text>
         </View>
         <Switch

package/src/components/Poll/components/MultipleVotesSettings.tsx

@@ -147,9 +147,11 @@ export const MultipleVotesSettings = () => {
     >
       <View style={[styles.optionCard, multipleAnswers.optionCard]}>
         <View style={[styles.optionCardContent, multipleAnswers.optionCardContent]}>
-          <Text style={[styles.title, multipleAnswers.title]}>{t('Limit votes per person')}</Text>
+          <Text style={[styles.title, multipleAnswers.title]}>
+            {t('poll.createPoll.maxVotes.label', 'Limit votes per person')}
+          </Text>
           <Text style={[styles.description, multipleAnswers.description]}>
-            {t('Choose between 2–10 options')}
+            {t('poll.createPoll.maxVotes.description', 'Choose between 2–10 options')}
           </Text>
         </View>
         <Switch
@@ -165,7 +167,7 @@ export const MultipleVotesSettings = () => {
           style={[styles.row, multipleAnswers.row]}
         >
           <Button
-            accessibilityLabelKey='a11y/Decrease maximum votes'
+            accessibilityLabelKey='poll.createPoll.maxVotes.decrease.accessibilityLabel'
             variant='secondary'
             type='outline'
             size='md'
@@ -178,7 +180,7 @@ export const MultipleVotesSettings = () => {
           />
           <MaxVotesTextInput />
           <Button
-            accessibilityLabelKey='a11y/Increase maximum votes'
+            accessibilityLabelKey='poll.createPoll.maxVotes.increase.accessibilityLabel'
             variant='secondary'
             type='outline'
             size='md'

package/src/components/Poll/components/NameField.tsx

@@ -23,8 +23,8 @@ export const NameField = () => {
 
   return (
     <Input
-      title={t('Questions')}
-      placeholder={t('Ask a question')}
+      title={t('poll.createPoll.question.label', 'Questions')}
+      placeholder={t('poll.createPoll.question.placeholder', 'Ask a question')}
       variant='outline'
       onChangeText={onChangeText}
       onBlur={onBlur}

package/src/components/Poll/components/PollAnswersList.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useMemo, useState } from 'react';
 import { FlatList, type FlatListProps, StyleSheet, Text, View } from 'react-native';
 
-import { PollAnswer, VotingVisibility } from 'stream-chat';
+import { convertTimestampToDate, PollVoteResponseData } from 'stream-chat';
 
 import { PollButtonProps } from './Button';
 import { PollInputDialog } from './PollInputDialog';
@@ -15,8 +15,8 @@ import {
   useTranslationContext,
 } from '../../../contexts';
 import { useComponentsContext } from '../../../contexts/componentsContext/ComponentsContext';
+import { getDateString } from '../../../i18n/utils';
 import { primitives } from '../../../theme';
-import { getDateString } from '../../../utils/i18n/getDateString';
 import { Button } from '../../ui';
 import { UserAvatar } from '../../ui/Avatar/UserAvatar';
 import { usePollAnswersPagination } from '../hooks/usePollAnswersPagination';
@@ -46,7 +46,11 @@ export const AnswerListAddCommentButton = (props: PollButtonProps) => {
         variant={'secondary'}
         type={'ghost'}
         size={'lg'}
-        label={ownAnswer ? t('Update your comment') : t('Add a comment')}
+        label={
+          ownAnswer
+            ? t('poll.updateComment.label', 'Update your comment')
+            : t('poll.addComment.label', 'Add a comment')
+        }
         onPress={onPressHandler}
       />
       {showAddCommentDialog ? (
@@ -54,8 +58,8 @@ export const AnswerListAddCommentButton = (props: PollButtonProps) => {
           closeDialog={() => setShowAddCommentDialog(false)}
           initialValue={ownAnswer?.answer_text ?? ''}
           onSubmit={addComment}
-          placeholder={t('Your comment')}
-          title={t('Add a comment')}
+          placeholder={t('poll.addComment.placeholder', 'Your comment')}
+          title={t('poll.addComment.label', 'Add a comment')}
           visible={showAddCommentDialog}
         />
       ) : null}
@@ -64,10 +68,10 @@ export const AnswerListAddCommentButton = (props: PollButtonProps) => {
 };
 
 export type PollAnswersListProps = PollContextValue & {
-  additionalFlatListProps?: Partial<FlatListProps<PollAnswer>>;
+  additionalFlatListProps?: Partial<FlatListProps<PollVoteResponseData>>;
 };
 
-export const PollAnswerListItem = ({ answer }: { answer: PollAnswer }) => {
+export const PollAnswerListItem = ({ answer }: { answer: PollVoteResponseData }) => {
   const { client } = useChatContext();
   const { t, tDateTimeParser } = useTranslationContext();
   const { votingVisibility } = usePollState();
@@ -84,10 +88,10 @@ export const PollAnswerListItem = ({ answer }: { answer: PollAnswer }) => {
   const dateString = useMemo(
     () =>
       getDateString({
-        date: answer.updated_at,
+        messageCreatedAt: convertTimestampToDate(answer.updated_at),
         t,
         tDateTimeParser,
-        timestampTranslationKey: 'timestamp/PollVote',
+        timestampTranslationKey: 'timestamp.PollVote',
       }),
     [answer.updated_at, t, tDateTimeParser],
   );
@@ -95,11 +99,11 @@ export const PollAnswerListItem = ({ answer }: { answer: PollAnswer }) => {
   const isMyAnswer = client.userID === answer.user?.id;
 
   const isAnonymous = useMemo(
-    () => votingVisibility === VotingVisibility.anonymous && !isMyAnswer,
+    () => votingVisibility === 'anonymous' && !isMyAnswer,
     [votingVisibility, isMyAnswer],
   );
 
-  const answerAuthorName = isMyAnswer ? t('You') : answer.user?.name;
+  const answerAuthorName = isMyAnswer ? t('common.you.label', 'You') : answer.user?.name;
 
   return (
     <View style={[styles.listItemWrapper, itemStyle.wrapper]}>
@@ -111,7 +115,7 @@ export const PollAnswerListItem = ({ answer }: { answer: PollAnswer }) => {
               <UserAvatar user={answer.user} size='sm' showBorder />
             ) : null}
             <Text style={styles.listItemInfoUserName}>
-              {isAnonymous ? t('Anonymous') : answerAuthorName}
+              {isAnonymous ? t('common.anonymousUser.label', 'Anonymous') : answerAuthorName}
             </Text>
             <Text style={styles.listItemInfoDate}>{dateString}</Text>
           </View>
@@ -122,7 +126,7 @@ export const PollAnswerListItem = ({ answer }: { answer: PollAnswer }) => {
   );
 };
 
-const renderPollAnswerListItem = ({ item }: { item: PollAnswer }) => (
+const renderPollAnswerListItem = ({ item }: { item: PollVoteResponseData }) => (
   <PollAnswerListItem answer={item} />
 );