// Module ID: 17055
// Function ID: 17056
// Name: UserProfileYourFriendsCard
// Dependencies: [32, 19, 17, 7773, 4288, 1372, 1074, 21, 1177, 4640, 504, 13218, 9999, 12, 1370, 5693, 4636, 1115, 2]
// Exports: default

// Module 17055 (UserProfileYourFriendsCard)
import _modDef12 from "module_12" /* 12 */;
import GlobalUtils from "GlobalUtils" /* 1370 */;
import _slicedToArray from "module_32" /* 32 */;
import noop from "module_19" /* 19 */;
import UserAffinitiesV2Store from "UserAffinitiesV2Store" /* 7773 */;
import RelationshipStore from "RelationshipStore" /* 4288 */;
import UserStore from "UserStore" /* 1372 */;

const require = globalThis.__r;

require = fn;
const View = fn(17).View;
const RelationshipTypes = fn(1074).RelationshipTypes;
const jsx = fn(21).jsx;
let closure_11 = Object.freeze({ direction: fn(1177).CutoutDirection.RIGHT, inset: -4 });
const createStyles = fn(4640);
let closure_12 = createStyles.createStyles({ facepile: { flexDirection: "row", alignItems: "center" }, avatars: { flexDirection: "row" } });
const size = fn(2);
const result = size.fileFinishedImporting("modules/user_profile/native/UserProfileYourFriendsCard.tsx");

export default function UserProfileYourFriendsCard(navigateToFriends) {
  let stateFromStoresArray;
  let stateFromStoresArray1;
  let tmp = closure_12();
  _require = tmp;
  const tmp2 = stateFromStoresArray(stateFromStoresArray1.useState([]), 2);
  const first = tmp2[0];
  dependencyMap = tmp2[1];
  let items = [UserAffinitiesV2Store];
  stateFromStoresArray = require("initialize").useStateFromStoresArray(items, () => {
    userAffinities = userAffinities.getUserAffinities();
    return userAffinities.map((otherUserId) => otherUserId.otherUserId);
  });
  let obj = require("initialize");
  const items1 = [RelationshipStore];
  stateFromStoresArray1 = require("initialize").useStateFromStoresArray(items1, () => friendIDs.getFriendIDs());
  let obj2 = require("initialize");
  const gameRelationshipsByType = require("GameRelationshipStoreHooks").useGameRelationshipsByType(RelationshipTypes.FRIEND);
  const effect = stateFromStoresArray1.useEffect(() => {
    const userAffinitiesV2 = closure_0(9999).fetchUserAffinitiesV2();
  }, []);
  const items2 = [stateFromStoresArray, stateFromStoresArray1, gameRelationshipsByType];
  const effect1 = stateFromStoresArray1.useEffect(() => {
    const found = _modDef12.chain(stateFromStoresArray).filter((item) => stateFromStoresArray1.includes(item));
    const chainResult = _modDef12.chain(stateFromStoresArray);
    const mapped = found.take(5).map(UserStore.getUser);
    const takeResult = found.take(5);
    const tmp3 = UserStore;
    const valueResult = mapped.filter(GlobalUtils.isNotNullish).value();
    if (valueResult.length >= 5) {
      dependencyMap(valueResult);
    } else {
      const tmpResult = _modDef12;
      const mapped1 = _modDef12.chain(gameRelationshipsByType).map((id) => id.id);
      const chainResult1 = _modDef12.chain(gameRelationshipsByType);
      const uniqResult = mapped1.uniq();
      const mapped2 = mapped1.uniq().take(5 - valueResult.length).map(tmp3.getUser);
      const takeResult1 = mapped1.uniq().take(5 - valueResult.length);
      const valueResult2 = mapped2.filter(GlobalUtils.isNotNullish).value();
      const items = [];
      HermesBuiltin.arraySpread(valueResult2, HermesBuiltin.arraySpread(valueResult, 0));
      dependencyMap(items);
      const iter2 = mapped2.filter(GlobalUtils.isNotNullish);
    }
  }, items2);
  const items3 = [first, , ];
  ({ avatars: arr4[1], facepile: arr4[2] } = tmp);
  const memo = stateFromStoresArray1.useMemo(() => {
    let obj = {
      style: closure_0.facepile,
      accessibilityElementsHidden: true,
      importantForAccessibility: "no-hide-descendants",
      children: <View style={closure_0.avatars}>{first.map((user, index) => {
        const obj = { style: null, children: null };
        const obj2 = { transform: null };
        const items = [{ translateX: 4 * (first.length - 1 - index) }];
        obj2.transform = items;
        obj.style = obj2;
        const obj4 = { user, guildId: "r", size: closure_0(1177).AvatarSizes.XSMALL, cutout: null };
        let tmp3;
        if (index < first.length - 1) {
          tmp3 = closure_2_11;
        }
        obj4.cutout = tmp3;
        obj.children = jsx(closure_0(1177).CutoutableAvatarImage, { user, guildId: "r", size: closure_0(1177).AvatarSizes.XSMALL, cutout: null });
        return <gameRelationshipsByType key={arg0.id} style={null}>{null}</gameRelationshipsByType>;
      })}</View>
    };
    return <View style={closure_0.facepile} accessibilityElementsHidden importantForAccessibility="no-hide-descendants"><View style={closure_0.avatars}>{first.map((user, index) => {
      const obj = { style: null, children: null };
      const obj2 = { transform: null };
      const items = [{ translateX: 4 * (first.length - 1 - index) }];
      obj2.transform = items;
      obj.style = obj2;
      const obj4 = { user, guildId: "r", size: closure_0(1177).AvatarSizes.XSMALL, cutout: null };
      let tmp3;
      if (index < first.length - 1) {
        tmp3 = closure_2_11;
      }
      obj4.cutout = tmp3;
      obj.children = jsx(closure_0(1177).CutoutableAvatarImage, { user, guildId: "r", size: closure_0(1177).AvatarSizes.XSMALL, cutout: null });
      return <gameRelationshipsByType key={arg0.id} style={null}>{null}</gameRelationshipsByType>;
    })}</View></View>;
  }, items3);
  let obj4 = { label: null, accessibilityLabel: null, onPress: null, trailing: null, arrow: true, start: true, end: true };
  const obj5 = { variant: "text-sm/semibold", color: "text-default", children: null };
  const intl = require("util").intl;
  obj5.children = intl.string(require("util").t.TdEu5X);
  obj4.label = jsx(require("Text/Text").Text, { variant: "text-sm/semibold", color: "text-default", children: null });
  const intl2 = require("util").intl;
  obj4.accessibilityLabel = intl2.string(require("util").t.TdEu5X);
  obj4.onPress = navigateToFriends.navigateToFriends;
  obj4.trailing = memo;
  return jsx(require("TableRow").TableRow, { label: null, accessibilityLabel: null, onPress: null, trailing: null, arrow: true, start: true, end: true });
};