import React, { CSSProperties } from "react";
import { View, ViewProps } from "react-native";
import { WebView } from "react-native-webview";
import { BigButton } from "./components/atom/BigButton";
import { useNavigation } from "@react-navigation/native";
export default ({ route }) => {
  if (!route.params) {
    return null;
  }
  const { uri, useExitButton = true } = route.params;
  const { goBack } = useNavigation();
  return (
    <View style={styles}>
      <WebView
        useWebKit
        source={{ uri }}
        onMessage={(event) => {
          const { data } = event.nativeEvent;
          const {type} = JSON.parse(data);
          if (type === "windowClose") return goBack();
        }}
      />
      {useExitButton && <BigButton onPress={goBack} string="閉じる" />}
    </View>
  );
};
const styles: ViewProps["style"] = {
  height: "100%",
  backgroundColor: "#0099CC",
};
