// Metro module 14089 (f14090).
import { ImageBackground, View } from "react-native";
import { VerticalGradient } from "../../../Constants";
import { createStyles } from "../../../design/components/Styles/native/createStyles";
import Module712 from "../../../_bundle/Module712";
import { intl, t } from "../../../intl/index.native";
import { useToken } from "../../../design/tokens/native/useToken";
import useChatLayout from "../../chat/native/useChatLayout";
import { SafeAreaPaddingView } from "../../../components_native/common/SafeAreaView";
import { isAndroid } from "../../../utils/PlatformUtils";
import { Text } from "../../../design/components/Text/native/Text";
import Module14090 from "../../../_bundle/Module14090";
import Module4611 from "../../../_bundle/Module4611";
const useStyles = createStyles({
  container: {
    flex: 1
  },
  emptyStateContainer: {
    justifyContent: "center",
    alignItems: "center",
    flex: 1
  },
  emptyStateContentContainer: {
    top: -55,
    paddingHorizontal: Module712.space.PX_32
  },
  emptyStateContentTitle: {
    textAlign: "center"
  },
  emptyStateContentDescription: {
    textAlign: "center",
    marginTop: 4
  },
  emptyImage: {
    flex: 1,
    width: "100%",
    aspectRatio: 1.6375545851528384,
    minWidth: "100%",
    position: "absolute",
    bottom: 0,
    zIndex: -1
  },
  gradient: {
    height: 22,
    width: "100%",
    position: "absolute",
    bottom: 0
  },
  actionWrapper: {
    marginTop: 16,
    alignSelf: "center"
  }
});
export default function QuestHomeEmptyState(props) {
  const { action, title = intl.string(t.SdlRnK), subtitle = intl.string(t["R7mv+G"]) } = props;
  const styles = useStyles();
  const token = useToken(Module712.colors.BACKGROUND_BASE_LOWER);
  const isChatLockedOpen = useChatLayout().isChatLockedOpen;
  return <SafeAreaPaddingView bottom={isAndroid()} style={styles.container}>
    <View style={styles.container}>
      <View style={styles.emptyStateContainer}>
        <View style={styles.emptyStateContentContainer}>
          <Text variant="heading-xl/bold" color="mobile-text-heading-primary" style={styles.emptyStateContentTitle}>{title}</Text>
          <Text variant="text-md/normal" color="text-default" style={styles.emptyStateContentDescription}>{subtitle}</Text>
          {action != null && <View style={styles.actionWrapper}>{action}</View>}
        </View>
        {isChatLockedOpen ? null : <>
          <ImageBackground style={styles.emptyImage} source={Module14090} resizeMode="cover" />
          <Module4611 style={styles.gradient} end={VerticalGradient.END} start={VerticalGradient.START} colors={["rgba(0, 0, 0, 0)", token]} />
        </>}
      </View>
    </View>
  </SafeAreaPaddingView>;
};