// Metro module 12489 (f12490).
import { useRef, useEffect, useCallback } from "react";
import { View } from "react-native";
import { ContentDismissActionType } from "../../dismissible_content/DismissibleContentConstants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import useSafeAreaInsets_native from "../../safe_area/useSafeAreaInsets.native";
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
import { BottomSheet } from "../../../design/components/Sheet/native/BottomSheet.native";
import { Stack } from "../../../design/components/Stack/native/Stack.native";
import { LaptopSpotIllustration } from "../../../design/assets/native";
import { Text } from "../../../design/components/Text/native/Text";
import { intl } from "../../../intl/index.native";
import GiftCard_messages from "../messages/GiftCard.messages";
import { Button } from "../../../design/components/Button/native/Button.native";
const useStyles = createStyles({
  sheet: {
    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
  },
  container: {
    paddingHorizontal: Module712.space.PX_16
  },
  illustration: {
    alignSelf: "stretch",
    alignItems: "center",
    paddingTop: Module712.space.PX_12
  },
  body: {
    textAlign: "center",
    fontFamily: "gg sans",
    fontSize: 16,
    fontWeight: 600,
    lineHeight: 20,
    alignSelf: "center",
    width: 280
  }
});
export default function GiftCardMobileConsumptionActionSheet(props) {
  let callback;
  const markAsDismissed = props.markAsDismissed;
  callback = void 0;
  const styles = useStyles();
  const bottom = useSafeAreaInsets_native().bottom;
  const ref = useRef(false);
  const ref2 = useRef(markAsDismissed);
  useEffect(() => {
    ref2.current = markAsDismissed;
  }, [markAsDismissed]);
  useEffect(() => () => {
    if (!ref.current) {
      ref2.current(ContentDismissActionType.AUTO_DISMISS);
    }
  }, []);
  callback = useCallback((a0) => {
    if (!ref.current) {
      ref.current = true;
      markAsDismissed(a0);
      ActionSheetActionCreators.hideActionSheet();
    }
  }, [markAsDismissed]);
  return <BottomSheet startExpanded backgroundStyles={styles.sheet} onDismiss={() => callback(ContentDismissActionType.USER_DISMISS)}>
    <View style={[styles.container, {
      paddingBottom: bottom
    }]}>
      <Stack spacing={Module712.space.PX_16}>
        <View style={styles.illustration}>
          <LaptopSpotIllustration scale={1} width={150} height={123} />
        </View>
        <Text variant="text-md/medium" color="text-default" style={styles.body}>
          {intl.string(GiftCard_messages.V3DI1E)}
        </Text>
        <Button size="lg" variant="secondary" grow text={intl.string(GiftCard_messages.YZePWx)} onPress={() => callback(ContentDismissActionType.USER_DISMISS)} />
      </Stack>
    </View>
  </BottomSheet>;
};