// Metro module 8707 (f8708).
import { useContext, useState, useCallback, useEffect } from "react";
import { Pressable, View } from "react-native";
import AuthenticationStore from "../../../stores/AuthenticationStore";
import UserStore from "../../../stores/UserStore";
import { ShopCtaEnum } from "../CollectiblesShopConstants";
import { ThemeTypes } from "../../../_bundle/Module505";
import * as _ReanimatedRexport from "../../reanimated/ReanimatedRexport";
import ReanimatedRexport, { useSharedValue, useAnimatedStyle, Easing } from "../../reanimated/ReanimatedRexport";
import { SMALL_BUTTON_HEIGHT, MEDIUM_BUTTON_HEIGHT } from "../../../design/components/Button/native/ButtonConstants.native";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import { useThemeContext, setColorOpacity } from "../../../_bundle/Module3901";
import { ICON_SIZE } from "../../../design/components/Icon/IconSize";
import * as _shared from "../../../design/shared";
import { AccessibilityPreferencesContext } from "../../../_bundle/Module3908";
import ToastActionCreators from "../../toast/native/ToastActionCreators";
import * as _index_native from "../../../intl/index.native";
import { intl } from "../../../intl/index.native";
import { withTiming } from "../../../design/animation/reanimated/timing/timing";
import * as _spring from "../../../design/animation/reanimated/spring/spring";
import * as _springPresets from "../../../design/animation/reanimated/spring/springPresets";
import { HeartOutlineIcon } from "../../../design/components/Icon/native/redesign/generated/HeartOutlineIcon";
import { HeartIcon } from "../../../design/components/Icon/native/redesign/generated/HeartIcon";
import { useStateFromStores } from "../../../_bundle/Module589";
import useWishlistNUXActionSheet from "./useWishlistNUXActionSheet";
import { useWishlistButtonState } from "../hooks/useWishlistButtonState";
import { useProductPurchaseState } from "../hooks/useProductPurchaseState";
import * as _CollectiblesWishlistUtils from "../../wishlists/CollectiblesWishlistUtils";
import { HermesBuiltin } from "../../../_hermes/prelude";
let c5676_14, c5676_15, c5676_16, useStyles, __initData, __initData2, __initData3, __initData4, WishlistButton;
const WishlistButtonBase = function WishlistButtonBase(props) {
  const { isWishlisted, onPress, busy, disabled, accessibilityLabel, accessibilityHidden = false, style: style2, size = "sm", onTrackPress } = props;
  const styles = useStyles(size);
  const width = ICON_SIZE[c5676_16[size]];
  const theme = useThemeContext().theme;
  const isThemeLight = _shared.isThemeLight(theme);
  let c16736_7 = theme === ThemeTypes.MIDNIGHT;
  const light = isThemeLight ? styles.light : styles.dark;
  const lightPressed = isThemeLight ? styles.lightPressed : styles.darkPressed;
  const enabled = useContext(AccessibilityPreferencesContext).reducedMotion.enabled;
  const [state, setState] = useState(false);
  const state2 = isWishlisted ? isWishlisted : state;
  const sharedValue = useSharedValue(isWishlisted ? 1 : 0);
  const callback = useCallback(() => {
    if (disabled) {
      ToastActionCreators.open({
        key: "WISHLIST_DISABLED",
        content: intl.string(_index_native.t["50TX9k"])
      });
    } else if (!busy) {
      if (onTrackPress != null) {
        onTrackPress(isWishlisted ? ShopCtaEnum.REMOVE_FROM_WISHLIST : ShopCtaEnum.ADD_TO_WISHLIST);
      }
      let r15 = isWishlisted;
      if (!isWishlisted && !enabled) {
        setState(true);
      } else {
        if (isWishlisted) {
          r15 = state;
        }
        if (r15) {
          setState(false);
        }
      }
      if (onPress != null) {
        onPress();
      }
    }
  }, [disabled, busy, onPress, isWishlisted, enabled, state, onTrackPress]);
  useEffect(() => {
    if (!state) {
      sharedValue.set(isWishlisted ? 1 : 0);
    }
  }, [isWishlisted, state, sharedValue]);
  useEffect(() => {
    if (state) {
      sharedValue.set(0);
      let c26273_0 = requestAnimationFrame(() => {
        const t = function t(a0) {
          if (a0) {
            _ReanimatedRexport.runOnJS(setState)(false);
          }
        };
        t.__closure = {
          runOnJS: _ReanimatedRexport.runOnJS,
          setIsClickAnimating: setState
        };
        t.__workletHash = 13061953734403;
        t.__initData = __initData;
        sharedValue.set(withTiming(1, c5676_14, "animate-always", t));
      });
      return () => cancelAnimationFrame(c26273_0);
    }
  }, [state, sharedValue]);
  const J = () => {
    let r0 = 1;
    const r4 = {
      ...styles.animationFill,
      opacity: _spring.withSpring(state2 ? 0 : 1, _springPresets.SUBTLE_SPRING, "animate-always")
    };
    if (state2) {
      r0 = 0.9;
    }
    r4.transform = [{
      scale: _spring.withSpring(r0, _springPresets.SUBTLE_SPRING, "animate-always")
    }];
    return r4;
  };
  J.__closure = {
    styles,
    withSpring: _spring.withSpring,
    showFilled: state2,
    SUBTLE_SPRING: _springPresets.SUBTLE_SPRING
  };
  J.__workletHash = 1357254413161;
  J.__initData = __initData2;
  const animatedStyle = useAnimatedStyle(J);
  const Y = function Y() {
    const r10 = sharedValue.get();
    return {
      ...styles.animationFill,
      opacity: _spring.withSpring(state2 ? 1 : 0, _springPresets.SUBTLE_SPRING, "animate-always"),
      transform: [{
        scale: _ReanimatedRexport.interpolate(r10, [0, 0.625, 1], [0, 1.35, 1], _ReanimatedRexport.Extrapolation.CLAMP)
      }]
    };
  };
  Y.__closure = {
    animationFillProgress: sharedValue,
    styles,
    withSpring: _spring.withSpring,
    showFilled: state2,
    SUBTLE_SPRING: _springPresets.SUBTLE_SPRING,
    interpolate: _ReanimatedRexport.interpolate,
    Extrapolation: _ReanimatedRexport.Extrapolation
  };
  Y.__workletHash = 15039903885060;
  Y.__initData = __initData3;
  const animatedStyle2 = useAnimatedStyle(Y);
  const K = function K() {
    const r8 = sharedValue.get();
    return {
      ...styles.animationFill,
      opacity: state2 ? _ReanimatedRexport.interpolate(r8, [0, 0.7], [1, 0], _ReanimatedRexport.Extrapolation.CLAMP) : 0,
      transform: [{
        scale: _ReanimatedRexport.interpolate(r8, [0, 0.625, 1], [0, 1.35, 1], _ReanimatedRexport.Extrapolation.CLAMP)
      }]
    };
  };
  K.__closure = {
    animationFillProgress: sharedValue,
    styles,
    showFilled: state2,
    interpolate: _ReanimatedRexport.interpolate,
    Extrapolation: _ReanimatedRexport.Extrapolation
  };
  K.__workletHash = 12429379889426;
  K.__initData = __initData4;
  return <Pressable style={({ pressed }) => {
    const r6 = [styles.button, light, c16736_7 && styles.midnight, , , ,];
    if (pressed) {
      pressed = !disabled;
    }
    if (pressed) {
      pressed = lightPressed;
    }
    r6[3] = pressed;
    let r10 = disabled;
    if (disabled) {
      r10 = styles.disabled;
    }
    r6[4] = r10;
    r6[5] = style2;
    return r6;
  }} onPress={callback} accessibilityRole={accessibilityHidden ? "none" : "togglebutton"} accessibilityLabel={accessibilityHidden ? void 0 : accessibilityLabel} accessibilityState={accessibilityHidden ? void 0 : {
    checked: isWishlisted,
    busy,
    disabled
  }} accessibilityElementsHidden={accessibilityHidden} importantForAccessibility={accessibilityHidden ? "no-hide-descendants" : "auto"}>
    <View style={[styles.iconContainer, {
      width,
      height: width
    }]}>
      <ReanimatedRexport.View style={animatedStyle} pointerEvents="none">
        <HeartOutlineIcon size={c5676_16[size]} color={Module712.colors.INTERACTIVE_ICON_DEFAULT} />
      </ReanimatedRexport.View>
      <ReanimatedRexport.View style={animatedStyle2} pointerEvents="none">
        <HeartIcon size={c5676_16[size]} color={Module712.unsafe_rawColors.RED_NEW_50} />
      </ReanimatedRexport.View>
      <ReanimatedRexport.View style={useAnimatedStyle(K)} pointerEvents="none">
        <HeartIcon size={c5676_16[size]} color="white" />
      </ReanimatedRexport.View>
    </View>
  </Pressable>;
};
WishlistButton = function WishlistButton(props) {
  let shouldShowWishlistNUXActionSheet, showWishlistNUXActionSheet, content, isWishlisted2, handleToggle;
  const { skuId, product, onPress: onPress2, onTrackPress: onTrackPress2 } = props;
  const r23 = {};
  let r2 = null;
  const props2 = HermesBuiltin.copyDataProperties(r23, props, {
    __proto__: null,
    skuId: 0,
    product: 0,
    onPress: 0,
    onTrackPress: 0
  });
  shouldShowWishlistNUXActionSheet = void 0;
  showWishlistNUXActionSheet = void 0;
  content = void 0;
  isWishlisted2 = void 0;
  handleToggle = void 0;
  const stateFromStores = useStateFromStores([AuthenticationStore], () => AuthenticationStore.getId());
  const stateFromStores2 = useStateFromStores([UserStore], () => UserStore.getCurrentUser());
  const wishlistNUXActionSheet = useWishlistNUXActionSheet();
  shouldShowWishlistNUXActionSheet = wishlistNUXActionSheet.shouldShowWishlistNUXActionSheet;
  showWishlistNUXActionSheet = wishlistNUXActionSheet.showWishlistNUXActionSheet;
  const accessibilityLabel = intl.formatToPlainString(_index_native.t["7kFjeK"], {
    productName: product.name
  });
  const callback = useCallback(() => {
    if (shouldShowWishlistNUXActionSheet) {
      showWishlistNUXActionSheet(product);
    }
  }, [shouldShowWishlistNUXActionSheet, showWishlistNUXActionSheet, product]);
  content = intl.string(_index_native.t.F8FvUy);
  const wishlistButtonState = useWishlistButtonState({
    userId: stateFromStores,
    skuId,
    onAddSuccess: callback,
    onError: useCallback(() => {
      ToastActionCreators.open({
        key: "WISHLIST_ERROR",
        content
      });
    }, [content]),
    skipAddAnnouncement: shouldShowWishlistNUXActionSheet
  });
  isWishlisted2 = wishlistButtonState.isWishlisted;
  const isBusy = wishlistButtonState.isBusy;
  handleToggle = wishlistButtonState.handleToggle;
  const callback2 = useCallback(async () => {
    if (onTrackPress2 != null) {
      onTrackPress2(isWishlisted2 ? ShopCtaEnum.REMOVE_FROM_WISHLIST : ShopCtaEnum.ADD_TO_WISHLIST);
    }
    if (onPress2 != null) {
      onPress2();
    }
    await handleToggle();
  }, [onPress2, onTrackPress2, isWishlisted2, handleToggle]);
  if (stateFromStores2 != null) {
    r2 = <WishlistButtonBase isWishlisted={isWishlisted2} onPress={callback2} busy={isBusy} accessibilityLabel={accessibilityLabel} {...props2} />;
  }
  return r2;
};
c5676_14 = {
  duration: 400,
  easing: Easing.bezier(0.67, 0, 0.26, 1)
};
c5676_15 = {
  sm: SMALL_BUTTON_HEIGHT,
  md: MEDIUM_BUTTON_HEIGHT
};
c5676_16 = {
  sm: "sm",
  md: "md"
};
useStyles = createStyles((a0) => ({
  button: {
    width: c5676_15[a0],
    height: c5676_15[a0],
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    borderRadius: Module712.radii.round,
    borderWidth: 1,
    borderColor: Module712.colors.CONTROL_SECONDARY_BORDER_DEFAULT
  },
  light: {
    backgroundColor: setColorOpacity("white", 0.72)
  },
  lightPressed: {
    backgroundColor: setColorOpacity("white", 0.62)
  },
  dark: {
    backgroundColor: Module712.colors.CONTROL_OVERLAY_SECONDARY_BACKGROUND_DEFAULT
  },
  darkPressed: {
    backgroundColor: Module712.colors.CONTROL_OVERLAY_SECONDARY_BACKGROUND_ACTIVE
  },
  midnight: {
    borderColor: Module712.colors.BORDER_STRONG
  },
  disabled: {
    opacity: 0.5
  },
  iconContainer: {
    position: "relative",
    alignItems: "center",
    justifyContent: "center"
  },
  animationFill: {
    position: "absolute",
    inset: 0,
    alignItems: "center",
    justifyContent: "center"
  }
}));
__initData = {
  code: "function WishlistButtonTsx1(done){const{runOnJS,setIsClickAnimating}=this.__closure;if(done){runOnJS(setIsClickAnimating)(false);}}"
};
__initData2 = {
  code: "function WishlistButtonTsx2(){const{styles,withSpring,showFilled,SUBTLE_SPRING}=this.__closure;return{...styles.animationFill,opacity:withSpring(showFilled?0:1,SUBTLE_SPRING,'animate-always'),transform:[{scale:withSpring(showFilled?0.9:1,SUBTLE_SPRING,'animate-always')}]};}"
};
__initData3 = {
  code: "function WishlistButtonTsx3(){const{animationFillProgress,styles,withSpring,showFilled,SUBTLE_SPRING,interpolate,Extrapolation}=this.__closure;const progress=animationFillProgress.get();return{...styles.animationFill,opacity:withSpring(showFilled?1:0,SUBTLE_SPRING,'animate-always'),transform:[{scale:interpolate(progress,[0,0.625,1],[0,1.35,1],Extrapolation.CLAMP)}]};}"
};
__initData4 = {
  code: "function WishlistButtonTsx4(){const{animationFillProgress,styles,showFilled,interpolate,Extrapolation}=this.__closure;const progress=animationFillProgress.get();return{...styles.animationFill,opacity:showFilled?interpolate(progress,[0,0.7],[1,0],Extrapolation.CLAMP):0,transform:[{scale:interpolate(progress,[0,0.625,1],[0,1.35,1],Extrapolation.CLAMP)}]};}"
};
export default function CollectiblesWishlistButton(props) {
  const { selectedProduct, onTrackPress: onTrackPress3 } = props;
  const r14 = {};
  let r2 = null;
  const props2 = HermesBuiltin.copyDataProperties(r14, props, {
    __proto__: null,
    selectedProduct: 0,
    onTrackPress: 0
  });
  const skuId = selectedProduct.skuId;
  const isPurchased = useProductPurchaseState(selectedProduct).isPurchased;
  const isWishlistableCollectiblesProduct = _CollectiblesWishlistUtils.isWishlistableCollectiblesProduct(selectedProduct);
  if (!isPurchased) {
    r2 = <WishlistButton skuId={skuId} product={selectedProduct} disabled={!isWishlistableCollectiblesProduct} onTrackPress={onTrackPress3} {...props2} />;
  }
  return r2;
};
export { WishlistButtonBase };
export { WishlistButton };