// Metro module 10023 (f10024).
import * as Module19 from "react";
import { useCallback, useMemo } from "react";
import { View, Pressable } from "react-native";
import LocaleStore from "../../user_settings/LocaleStore";
import UserRecord from "../../../records/UserRecord";
import StreamerModeStore from "../../../stores/StreamerModeStore";
import UserProfileStore from "../UserProfileStore";
import { PlatformTypes, ThemeTypes, AnalyticEvents } from "../../../Constants";
import { FORM_ROW_VERTICAL_PADDING } from "../../../design/void/Form/native/FormConstants";
import { MetadataFields } from "../../connections/Constants";
import { jsx } from "react/jsx-runtime";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import { getCreatedAtDate } from "../../connections/ConnectionsUtils";
import { generateRedditMetadataItems, generateSteamMetadataItems, generatePaypalMetadataItems, generateEbayMetadataItems, generateTikTokMetadataItems, generateTwitterMetadataItems, generateRoleConnectionMetadataItems } from "../../connections/native/ConnectionMetadataVanityItems";
import Platforms from "../../../lib/Platforms";
import { makeSource } from "../../../utils/AvatarUtils";
import * as _shared from "../../../design/shared";
import { Icon, Avatar, AvatarSizes } from "../../../design/void/native";
import Module10027 from "../../../_bundle/Module10027";
import Module10028 from "../../../_bundle/Module10028";
import { useToken } from "../../../design/tokens/native/useToken";
import Module10029 from "../../../_bundle/Module10029";
import Module10030 from "../../../_bundle/Module10030";
import { triggerHapticFeedback, HapticFeedbackTypes } from "../../haptics/HapticUtils.native";
import { copy } from "../../../utils/ClipboardUtils.native";
import { presentCopiedToClipboard } from "../../toast/native/ToastUtils";
import { intl, t } from "../../../intl/index.native";
import { handleClick } from "../../../utils/MaskedLinkUtils";
import { trackWithMetadata } from "../../app_analytics/AppAnalyticsUtils";
import Linking from "../../../lib/native/Linking";
import { PressableOpacity } from "../../../design/void/Pressables/native/Pressables";
import { Text } from "../../../design/components/Text/native/Text";
import { useThemeContext } from "../../../_bundle/Module3901";
import { useStateFromStores } from "../../../_bundle/Module589";
import { usePlatformAllowed } from "../../connections/ConnectionsHooks";
import UserProfileSection from "./UserProfileSection";
function $mk83792($env) {
  return (a0, a1) => {
    const r6 = $env;
    const r1 = $env.$parent;
    const r4 = r1[14];
    return r4(r1[3].Fragment, {
      children: r4(r1[19], {
        applicationRoleConnection: a0,
        theme: r6[1],
        locale: r6[2],
        style: r6[0]
      })
    }, a1);
  };
}
function $mk83794($env) {
  return (a0) => {
    const r2 = $env.$parent;
    const r10 = (0, r2[1])(r2[2][14]).get(a0.type);
    return r10 != null && (0, $env[4])(r10);
  };
}
function $mk83795($env) {
  return (a0, a1) => {
    const r6 = $env;
    const r1 = $env.$parent;
    const r4 = r1[14];
    return r4(r1[3].Fragment, {
      children: r4(r1[18], {
        account: a0,
        theme: r6[2],
        locale: r6[3],
        userId: r6[0],
        style: r6[1]
      })
    }, a1);
  };
}
let useStyles, c6667_18, c6667_19, c6667_20, c6667_21;
let $mk83791 = function() {
  return () => LocaleStore.locale;
}, $mk83793 = function() {
  return () => LocaleStore.locale;
};
let env6667 = {};
export function ConnectedUserAccount(props) {
  let r17, r36;
  const account = props.account;
  let theme = props.theme;
  const { locale, userId, style } = props;
  let showMetadata = props.showMetadata;
  const showInvisibleIcon = props.showInvisibleIcon;
  if (showMetadata == null) {
    showMetadata = true;
  }
  const styles = useStyles();
  let metadata = account.metadata;
  if (metadata == null) {
    metadata = {};
  }
  const date = showMetadata ? getCreatedAtDate(metadata[MetadataFields.CREATED_AT], locale) : null;
  L22: {
    r36 = void 0;
    r17 = void 0;
    if (showMetadata) {
      const type = account.type;
      if (PlatformTypes.REDDIT === type) {
        r17 = generateRedditMetadataItems(metadata, styles.metadataItem);
        r36 = void 0;
      } else if (PlatformTypes.STEAM === type) {
        r17 = generateSteamMetadataItems(metadata, styles.metadataItem);
        r36 = void 0;
      } else {
        if (PlatformTypes.BLUESKY !== type && PlatformTypes.MASTODON !== type && PlatformTypes.TWITTER !== type) {
          if (PlatformTypes.PAYPAL === type) {
            r17 = generatePaypalMetadataItems(metadata, styles.metadataItem);
            r36 = void 0;
            break L22;
          }
          if (PlatformTypes.EBAY === type) {
            r17 = generateEbayMetadataItems(metadata, styles.metadataItem);
            r36 = void 0;
            break L22;
          }
          const TIKTOK = PlatformTypes.TIKTOK;
          r36 = void 0;
          r17 = void 0;
          if (TIKTOK !== type) {
            break L22;
          }
          r17 = generateTikTokMetadataItems(metadata, styles.metadataItem);
          r36 = void 0;
          break L22;
        }
        const r70 = generateTwitterMetadataItems(metadata, styles.metadataItem);
        const r73 = metadata[MetadataFields.TWITTER_VERIFIED];
        r36 = void 0;
        r17 = r70;
        if (r73 === "1") {
          r36 = Platforms.get(PlatformTypes.TWITTER).color;
          r17 = r70;
        }
      }
    }
  }
  const r97 = Platforms.get(account.type);
  let c17631_2 = r97;
  const isThemeDark = _shared.isThemeDark(theme);
  const r3 = r97 == null;
  const source = makeSource(isThemeDark ? r3 ? void 0 : r97.icon.darkPNG : r3 ? void 0 : r97.icon.lightPNG);
  const r110 = r97 == null;
  let r111 = void 0;
  if (!r110) {
    const getPlatformUserUrl = r97.getPlatformUserUrl;
    r111 = getPlatformUserUrl == null ? void 0 : getPlatformUserUrl.call(r97, account);
  }
  const platformUserUrl = r111;
  const r115 = showInvisibleIcon != null && showInvisibleIcon ? (0, jsx)(Icon, {
    style: styles.connectedAccountOpenHide,
    source: Module10027
  }) : platformUserUrl != null ? (0, jsx)(Icon, {
    style: styles.connectedAccountOpenLink,
    source: Module10028
  }) : null;
  const token = useToken(Module712.colors.BACKGROUND_MOD_MUTED, theme);
  const INTERACTIVE_TEXT_ACTIVE = Module712.colors.INTERACTIVE_TEXT_ACTIVE;
  if (r36 != null) {
    theme = ThemeTypes.DARK;
  }
  let color = useToken(INTERACTIVE_TEXT_ACTIVE, theme);
  let color2 = token;
  if (r36 != null) {
    color = Module712.unsafe_rawColors.WHITE;
    color2 = r36;
  }
  const r151 = account.verified ? <View style={styles.verifiedCheckContainer}>
    <Icon style={styles.verifiedCheck} size={Icon.Sizes.REFRESH_SMALL_16} source={Module10029} color={color2} />
    <Icon style={styles.verifiedCheck} size={Icon.Sizes.REFRESH_SMALL_16} source={Module10030} color={color} />
  </View> : null;
  const callback = useCallback(() => {
    triggerHapticFeedback(HapticFeedbackTypes.IMPACT_LIGHT);
    copy(account.name);
    presentCopiedToClipboard();
  }, [account.name]);
  const memo = useMemo(() => {
    let r21;
    if (platformUserUrl != null) {
      r21 = intl.string(t.wuRE8M);
    } else {
      const OKzaN3 = t.OKzaN3;
      let name = c17631_2?.name;
      if (name == null) {
        name = "";
      }
      r21 = intl.formatToPlainString(OKzaN3, {
        name
      });
    }
    return r21;
  }, [r97?.name, platformUserUrl]);
  const callback2 = useCallback(() => {
    if (platformUserUrl != null) {
      handleClick({
        href: platformUserUrl,
        trusted: account.type !== PlatformTypes.DOMAIN,
        onConfirm: () => {
          trackWithMetadata(AnalyticEvents.CONNECTED_ACCOUNT_VIEWED, {
            platform_type: account.type,
            other_user_id: userId
          });
          Linking.openURL(platformUserUrl);
        }
      });
    }
  }, [account.type, platformUserUrl, userId]);
  const Component = platformUserUrl != null ? PressableOpacity : Pressable;
  return <Component accessibilityLabel={memo} accessibilityRole="button" onPress={platformUserUrl != null ? callback2 : void 0} onLongPress={callback}>
    <View style={[styles.connectedAccountContainer, style]}>
      <View style={styles.connectedAccount}>
        <Icon size={Icon.Sizes.MEDIUM} source={source} disableColor />
        <View style={styles.connectedAccountNameContainer}>
          <View style={styles.connectedAccountName}>
            <Text variant="text-md/semibold" style={styles.connectedAccountNameText}>{account.name}</Text>
            {r151}
          </View>
          {date != null ? <Text variant="heading-deprecated-12/medium" style={styles.connectedAccountNameCreatedAtText}>
            {intl.format(t["9rfonh"], {
              date
            })}
          </Text> : null}
          {r17 != null ? r17.length > 0 ? <View style={styles.connectedAccountChildren}>{r17}</View> : null : null}
        </View>
        {r115}
      </View>
    </View>
  </Component>;
}
export function ConnectedApplicationUserRoleAccount(props) {
  const { applicationRoleConnection, style } = props;
  const styles = useStyles();
  let c17632_1 = styles;
  const r12 = generateRoleConnectionMetadataItems(applicationRoleConnection);
  return <View style={[styles.connectedAccountContainer, style]}>
    {applicationRoleConnection.platform_name != null ? (0, jsx)(Text, {
      variant: "eyebrow",
      color: "interactive-text-default",
      children: applicationRoleConnection.platform_name
    }) : null}
    <View style={styles.appConnectionNameContainer}>
      {applicationRoleConnection.platform_username != null ? <Text variant="text-md/semibold" color="interactive-text-active">{applicationRoleConnection.platform_username}</Text> : null}
    </View>
    {r12 != null ? r12.length > 0 ? <View style={styles.connectedAccountChildren}>{r12}</View> : null : null}
    <View style={{
      flexDirection: "row"
    }}>
      <View style={styles.connectedAccountPoweredByContainer}>
        <Text variant="text-xs/normal" color="text-muted">
          {intl.format(t.zIT9YA, {
            applicationHook: () => <View style={c17632_1.connectedAccountPoweredByText}>
              {applicationRoleConnection.application.bot != null ? <Avatar style={c17632_1.connectedAccountPoweredByAvatar} user={new UserRecord(applicationRoleConnection.application.bot)} size={AvatarSizes.SIZE_16} guildId={void 0} /> : null}
              {(0, jsx)(Text, {
                variant: "text-xs/normal",
                color: "text-default",
                children: applicationRoleConnection.application.name
              })}
            </View>
          })}
        </Text>
      </View>
      <View style={{
        flexGrow: 1
      }} />
    </View>
  </View>;
}
useStyles = createStyles({
  connectedAccountContainer: {
    paddingHorizontal: 10,
    paddingVertical: FORM_ROW_VERTICAL_PADDING / 2
  },
  connectedAccount: {
    flexDirection: "row",
    alignItems: "center"
  },
  connectedAccountNameContainer: {
    flex: 1,
    marginLeft: 8
  },
  connectedAccountName: {
    flexDirection: "row",
    alignItems: "center"
  },
  connectedAccountNameText: {
    color: Module712.colors.INTERACTIVE_TEXT_ACTIVE
  },
  connectedAccountNameCreatedAtText: {
    color: Module712.colors.TEXT_SUBTLE
  },
  connectedAccountOpenLink: {
    height: 24,
    width: 24,
    transform: [{
      rotate: "135deg"
    }],
    tintColor: Module712.colors.INTERACTIVE_TEXT_ACTIVE
  },
  connectedAccountOpenHide: {
    alignSelf: "flex-start",
    margin: 4,
    height: 16,
    width: 16,
    tintColor: Module712.colors.INTERACTIVE_TEXT_DEFAULT
  },
  verifiedCheckContainer: {
    marginLeft: 4,
    height: 16,
    width: 16
  },
  verifiedCheck: {
    position: "absolute",
    left: 0,
    top: 0
  },
  connectedAccountChildren: {
    flexDirection: "row",
    flexWrap: "wrap",
    alignItems: "center",
    overflow: "hidden"
  },
  metadataItem: {
    color: Module712.colors.INTERACTIVE_TEXT_ACTIVE
  },
  appConnectionNameContainer: {
    flex: 1,
    flexDirection: "row",
    alignItems: "center",
    marginTop: 4
  },
  connectedAccountPoweredByContainer: {
    flexDirection: "row",
    alignItems: "center",
    backgroundColor: Module712.colors.BACKGROUND_BASE_LOWEST,
    borderRadius: Module712.radii.sm,
    borderWidth: 1,
    borderColor: Module712.colors.BORDER_SUBTLE,
    paddingHorizontal: 8,
    paddingVertical: 4,
    marginTop: 12
  },
  connectedAccountPoweredByAvatar: {
    marginRight: 4
  },
  connectedAccountPoweredByText: {
    marginTop: -4,
    alignItems: "center",
    flexDirection: "row"
  }
});
c6667_18 = Module19.memo(ConnectedUserAccount);
c6667_19 = Module19.memo(ConnectedApplicationUserRoleAccount);
c6667_20 = [];
c6667_21 = [];
export default function LegacyUserProfileConnections(props) {
  const user = props.user;
  const stateFromStores = useStateFromStores([UserProfileStore], () => UserProfileStore.getUserProfile(user.id));
  const stateFromStores2 = useStateFromStores([StreamerModeStore], () => StreamerModeStore.hidePersonalInformation);
  const memo = useMemo(() => {
    let r4 = stateFromStores?.applicationRoleConnections;
    if (r4 == null) {
      r4 = c6667_21;
    }
    return r4;
  }, [stateFromStores?.applicationRoleConnections]);
  const connectedAccounts = stateFromStores?.connectedAccounts;
  let env17636;
  let env17637;
  const memo2 = useMemo(() => {
    let r4 = stateFromStores?.connectedAccounts;
    if (r4 == null) {
      r4 = c6667_20;
    }
    return r4;
  }, [connectedAccounts]);
  const r39 = env17636 = {
    $parent: env6667
  };
  env17636[0] = void 0;
  env17636[1] = void 0;
  env17636[2] = void 0;
  env17636[1] = useThemeContext().theme;
  env17636[2] = useStateFromStores([LocaleStore], $mk83791());
  const children = memo.map($mk83792(r39));
  const id = user.id;
  const r55 = env17637 = {
    $parent: env6667
  };
  env17637[0] = id;
  env17637[1] = void 0;
  env17637[2] = void 0;
  env17637[3] = void 0;
  env17637[4] = void 0;
  env17637[2] = useThemeContext().theme;
  env17637[3] = useStateFromStores([LocaleStore], $mk83793());
  env17637[4] = usePlatformAllowed({
    forUserProfile: true
  });
  const children2 = memo2.filter($mk83794(r55)).map($mk83795(r55));
  return stateFromStores2 ? null : memo2.length !== 0 ? <>
    {children != null && children.length > 0 && (0, jsx)(UserProfileSection, {
      title: intl.string(t.PHjkRE),
      showContainer: true,
      children
    })}
    {(0, jsx)(UserProfileSection, {
      title: intl.string(t["3fe7U5"]),
      showContainer: true,
      children: children2
    })}
  </> : null;
};
export function useAppplicationRoleConnectionItems(a0, a1) {
  let env17633;
  const r1 = env17633 = {
    $parent: env6667
  };
  env17633[0] = a1;
  env17633[1] = useThemeContext().theme;
  env17633[2] = useStateFromStores([LocaleStore], $mk83791());
  return a0.map($mk83792(r1));
}
export function useConnectedAccountItems(a0, a1, a2) {
  let env17634;
  const r1 = env17634 = {
    $parent: env6667
  };
  env17634[0] = a1;
  env17634[1] = a2;
  env17634[2] = useThemeContext().theme;
  env17634[3] = useStateFromStores([LocaleStore], $mk83793());
  env17634[4] = usePlatformAllowed({
    forUserProfile: true
  });
  return a0.filter($mk83794(r1)).map($mk83795(r1));
}