// Metro module 10361 (f10362).
import { useCallback, useMemo } from "react";
import { View } from "react-native";
import AccessibilityStore from "../../a11y/AccessibilityStore";
import { IN_APP_NOTIFICATION_MAX_HEIGHT, NOTIFICATION_PREVIEW_LINE_CLAMP } from "./InAppNotificationConstants";
import { ChannelTypes, MessageEmbedTypes } from "../../../Constants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import { isIOS } from "../../../_bundle/Module501";
import Module712 from "../../../_bundle/Module712";
import { AnimateEmoji } from "../../user_settings/UserSettings";
import { usePreviewableMedia, PreviewableMediaTypes } from "./hooks/usePreviewableMedia";
import { Text } from "../../../design/components/Text/native/Text";
import AvatarUtils from "../../../utils/AvatarUtils";
import { DEFAULT_EMOJI_SIZE } from "../../forums/native/posts/reactions/ForumPostReactionButton";
import Emoji from "../../emojis/native/Emoji";
import { intl, t } from "../../../intl/index.native";
import isForwardMessage from "../../forwarding/isForwardMessage";
import * as _InAppNotificationUtils from "./InAppNotificationUtils";
import { getMessagePreviewTextVariant, useHasPreviewableMedia, trackDismissed } from "./InAppNotificationUtils";
import useTruncatedGradientColors from "./hooks/useTruncatedGradientColors";
import { NativeChannelRowPreview } from "../../main_tabs_v2/native/shared_components/ChannelRowPreview";
import { useGetInitialMessagePreview } from "./hooks/useGetInitialMessagePreview";
import GroupDMAvatar from "../../group_dm/native/GroupDMAvatar";
import { AvatarSizes, Avatar, RoleDot } from "../../../design/void/native";
import GuildIcon, { GuildIconSizes } from "../../guild/native/GuildIcon";
import { sumBy } from "../../../_bundle/Module12";
import { getUserAuthor } from "../../messages/useMessageAuthor";
import { useStateFromStores } from "../../../_bundle/Module589";
import ModalActionCreators from "../../../actions/ModalActionCreators";
import { transitionToMessage } from "../../routing/transitionToChannel";
import InAppNotificationActionCreators from "../../../actions/native/InAppNotificationActionCreators";
import { NotificationPressable } from "./Notification";
import { MediaPreviewRightAccessory } from "./MediaPreviewRightAccessory";
let useStyles, ReactionNotificationBodyWrapper, ReactorNotificationIcon;
const ReactionNotificationBody = function ReactionNotificationBody(props) {
  const { text, secondaryText, hasMessageContent, messagePreview } = props;
  const styles2 = useStyles();
  const messagePreviewTextVariant = getMessagePreviewTextVariant();
  const truncatedGradientColors = useTruncatedGradientColors();
  const { gradientColors, gradientStyles } = truncatedGradientColors;
  return <>
    {[<Text variant={messagePreviewTextVariant} color="text-default" style={styles2.italic}>{text}</Text>, secondaryText != null ? <Text variant="redesign/message-preview/medium" color="text-link" lineClamp={NOTIFICATION_PREVIEW_LINE_CLAMP}>{secondaryText}</Text> : null, hasMessageContent ? messagePreview != null ? <NativeChannelRowPreview message={messagePreview} lineClamp={1} maxHeight={IN_APP_NOTIFICATION_MAX_HEIGHT} textColor="text-subtle" gradientStyles={gradientStyles} gradientColors={gradientColors} /> : null : null]}
  </>;
};
ReactionNotificationBodyWrapper = function ReactionNotificationBodyWrapper(props) {
  let message3 = props.message;
  const { reaction: reaction2, reactionCount, renderAnnouncementText, isMilestone } = props;
  const r1 = message3.embeds.length > 0 && message3.embeds[0].type === MessageEmbedTypes.GIFV;
  const hasMessageContent = message3.content != null && message3.content.trim() !== "" && !r1;
  const message = message3;
  const reaction = reaction2;
  let c17899_2 = hasMessageContent;
  const styles = useStyles();
  const setting = AnimateEmoji.useSetting();
  const previewableMedia = usePreviewableMedia(message);
  const callback = useCallback(() => {
    if ((reaction == null ? void 0 : reaction.emoji.name) == null) {
      return null;
    }
    if ((reaction == null ? void 0 : reaction.emoji.name) != null && (reaction == null ? void 0 : reaction.emoji.id) == null) {
      return <Text key={reaction.emoji.name} style={styles.italic} variant="text-sm/normal">{reaction.emoji.name}</Text>;
    }
    const r21 = (reaction == null ? void 0 : reaction.emoji.id) != null;
    let src = void 0;
    if (r21) {
      let animated = setting;
      if (setting) {
        animated = reaction.emoji.animated;
      }
      src = AvatarUtils.getEmojiURL({
        id: reaction.emoji.id,
        animated,
        size: DEFAULT_EMOJI_SIZE
      });
    }
    return <Emoji textEmojiStyle={styles.textEmoji} fastImageStyle={styles.imageEmoji} src={src} name={reaction.emoji.name} />;
  }, [setting, reaction, styles.imageEmoji, styles.textEmoji, styles.italic]);
  const memo = useMemo(() => {
    if (previewableMedia.length !== 0 && !c17899_2) {
      if (previewableMedia.length === 1) {
        const r66 = previewableMedia[0];
        const type = r66.type;
        if (PreviewableMediaTypes.IMAGE === type) {
          return {
            text: intl.format(t.I7mNcA, {
              emojiHook: callback
            }),
            secondaryText: null
          };
        }
        if (PreviewableMediaTypes.VIDEO === type) {
          return {
            text: intl.format(t["Umew/z"], {
              emojiHook: callback
            }),
            secondaryText: null
          };
        }
        if (PreviewableMediaTypes.AUDIO === type) {
          return {
            text: intl.format(t["P/bwx9"], {
              emojiHook: callback
            }),
            secondaryText: r66.media.filename
          };
        }
        if (PreviewableMediaTypes.FILE === type) {
          return {
            text: intl.format(t.TXNjGW, {
              emojiHook: callback
            }),
            secondaryText: r66.media.filename
          };
        }
        if (PreviewableMediaTypes.STICKER === type) {
          return {
            text: intl.format(t.pnm8NC, {
              emojiHook: callback
            }),
            secondaryText: null
          };
        }
        if (PreviewableMediaTypes.VOICE_MESSAGE === type) {
          return {
            text: intl.format(t.k6YnQO, {
              emojiHook: callback
            }),
            secondaryText: null
          };
        }
        if (PreviewableMediaTypes.GIF === type) {
          return {
            text: intl.format(t["3oS3Jq"], {
              emojiHook: callback
            }),
            secondaryText: null
          };
        }
        return {
          text: intl.format(t.sHV43G, {
            emojiHook: callback
          }),
          secondaryText: null
        };
      }
      if (isForwardMessage(message)) {
        return {
          text: intl.format(t["8xg9ZQ"], {
            emojiHook: callback
          }),
          secondaryText: null
        };
      }
      const r7 = previewableMedia.every((item) => item.type === PreviewableMediaTypes.FILE);
      const length = previewableMedia.length;
      const r35 = intl.format(t.sec4g7, {
        emojiHook: callback,
        count: length
      });
      let text = intl.format(t.UNRyki, {
        emojiHook: callback,
        count: length
      });
      if (r7) {
        text = r35;
      }
      return {
        text,
        secondaryText: null
      };
    }
    return {
      text: c17899_2 ? intl.format(t.sHV43G, {
        emojiHook: callback
      }) : intl.format(t.ZOzpKt, {
        emojiHook: callback
      }),
      secondaryText: null
    };
  }, [callback, hasMessageContent, message, previewableMedia]);
  const { text, secondaryText } = memo;
  const hasPreviewableMedia = useHasPreviewableMedia(message);
  const getInitialMessagePreview = useGetInitialMessagePreview({
    message
  });
  if (hasPreviewableMedia) {
    message3 = getInitialMessagePreview;
  }
  if (renderAnnouncementText) {
    return <ReactionNotificationBody text={intl.format(t.Tqk79E, {
      count: reactionCount
    })} />;
  }
  if (isMilestone) {
    return <ReactionNotificationBody text={hasMessageContent ? intl.format(t.NfZxrD, {
      count: reactionCount
    }) : intl.format(t.vfYN5b, {
      count: reactionCount
    })} secondaryText={secondaryText} hasMessageContent={hasMessageContent} messagePreview={message3} />;
  }
  return <ReactionNotificationBody text={text} secondaryText={secondaryText} hasMessageContent={hasMessageContent} messagePreview={message3} />;
};
ReactorNotificationIcon = function ReactorNotificationIcon(props) {
  const { notification: notification2, isMilestone } = props;
  const styles2 = useStyles();
  const { user, guild: guild2, channel: channel2 } = notification2;
  return isMilestone && channel2.isGroupDM() ? <GroupDMAvatar channel={channel2} size={AvatarSizes.NORMAL} /> : user != null ? <Avatar user={user} guildId={guild2?.id} size={AvatarSizes.NORMAL} /> : <GuildIcon guild={guild2} size={GuildIconSizes.NORMAL} style={styles2.guildIcon} />;
};
useStyles = createStyles({
  newContainerRoleDot: {
    paddingRight: 4,
    paddingTop: 0
  },
  container: {
    flexDirection: "column"
  },
  textEmoji: {
    fontSize: 12
  },
  imageEmoji: {
    height: 16,
    width: 16,
    transform: isIOS() ? void 0 : [{
      translateY: 2
    }]
  },
  italic: {
    fontStyle: "italic",
    fontFamily: isIOS() ? "ggsans-NormalItalic, NotoSans-NormalItalic" : "ggsans-MediumItalic, NotoSans-MediumItalic"
  },
  guildIcon: {
    borderRadius: Module712.radii.sm
  }
});
export default function ReactionNotification(props) {
  let c17900_8, userAuthor;
  const notification = props.notification;
  c17900_8 = void 0;
  userAuthor = void 0;
  const styles2 = useStyles();
  const { user, channel, guild, parentChannel } = notification;
  let r28 = guild?.id;
  if (r28 == null) {
    r28 = channel.guild_id;
  }
  const guild_id = r28;
  const { id, type } = channel;
  const GUILD_ANNOUNCEMENT = ChannelTypes.GUILD_ANNOUNCEMENT;
  const { message: message2, reaction: reaction2 } = notification;
  const reactions = message2.reactions;
  const type2 = channel?.type;
  let renderAnnouncementText = type === GUILD_ANNOUNCEMENT;
  const isReactionMilestoneNotification = _InAppNotificationUtils.isReactionMilestoneNotification(reactions, type2);
  const memo = useMemo(() => sumBy(message2.reactions, ({ count_details }) => {
    let r6 = count_details?.burst;
    if (r6 == null) {
      r6 = 0;
    }
    let r4 = count_details?.normal;
    if (r4 == null) {
      r4 = 0;
    }
    return r6 + r4;
  }), [message2.reactions]);
  if (renderAnnouncementText) {
    renderAnnouncementText = memo !== 1;
  }
  c17900_8 = renderAnnouncementText;
  userAuthor = renderAnnouncementText ? null : isReactionMilestoneNotification ? null : getUserAuthor(user, channel);
  const stateFromStores = useStateFromStores([AccessibilityStore], () => AccessibilityStore.roleStyle);
  let color = userAuthor?.colorString;
  if (color == null) {
    color = void 0;
  }
  let accessoryLabelNode = void 0;
  if (stateFromStores === "dot") {
    accessoryLabelNode = void 0;
    if (color !== void 0) {
      let colors = userAuthor?.colorStrings;
      if (colors == null) {
        colors = null;
      }
      accessoryLabelNode = <RoleDot color={color} colors={colors} containerStyles={styles2.newContainerRoleDot} />;
    }
  }
  return <NotificationPressable icon={<ReactorNotificationIcon notification={notification} isMilestone={isReactionMilestoneNotification} />} accessoryLabelNode={accessoryLabelNode} header={useMemo(() => ({
    type: "message",
    channel,
    parentChannel,
    guild,
    author: userAuthor,
    locationTextColor: c17900_8 ? "mobile-text-heading-primary" : isReactionMilestoneNotification ? "mobile-text-heading-primary" : void 0
  }), [channel, parentChannel, guild, userAuthor, renderAnnouncementText, isReactionMilestoneNotification])} onPress={useCallback(() => {
    trackDismissed({
      type: notification.type,
      dismissReason: "notification_clicked",
      guildId: guild_id,
      channelId: id,
      messageId: message2.id,
      inAppNotificationId: notification.inAppNotificationId
    });
    ModalActionCreators.popAll();
    transitionToMessage(channel.id, message2.id, {
      navigationReplace: true
    });
    InAppNotificationActionCreators.clearNotification();
  }, [channel.id, id, guild_id, message2.id, notification.inAppNotificationId, notification.type])} onSettingsPress={useCallback(() => ModalActionCreators.pushLazy(import("../../../components_native/InAppNotificationSettingsModal"), {
    channelId: id
  }), [id])} notification={notification} rightAccessory={<MediaPreviewRightAccessory message={message2} />}>
    <View style={styles2.container}>
      <ReactionNotificationBodyWrapper message={message2} reaction={reaction2} reactionCount={memo} renderAnnouncementText={renderAnnouncementText} isMilestone={isReactionMilestoneNotification} />
    </View>
  </NotificationPressable>;
};