import GeckoView from "react-native-geckoview";
const App = () => {
  const ref = useRef<GeckoView>(null);

  return (
    <SafeAreaView
      style={{
        backgroundColor: "white",
        flex: 1,
      }}
    >
      <GeckoView
        ref={ref}
        style={{
          flex: 1,
        }}
        source={{ uri: "https://google.com" }}
        onLoadingStart={(e) => {
          console.log(e.nativeEvent.uri);
        }}
        onLoadingFinish={(e) => {
          console.log("success:", e.nativeEvent.success);
        }}
        remoteDebugging={true}
        onMessage={(event) => {
          console.log(event.nativeEvent);
        }}
        injectedJavaScript={
          'window.ReactNativeWebView.postMessage("hello world")'
        }
      />
    </SafeAreaView>
  );
};

interface GeckoViewInterface extends ViewProps {
  source?: { html?: string; uri?: string };
  forceDarkOn?: boolean;
  autoFillEnabled?: boolean;
  remoteDebugging?: boolean;
  userAgent?: string;
  onLoadingStart?: (event: NativeSyntheticEvent<{ uri: string }>) => void;
  onLoadingFinish?: (event: NativeSyntheticEvent<{ success: string }>) => void;
  onLoadingError?: (
    event: NativeSyntheticEvent<{ error: string; uri: string }>
  ) => void;
  onMessage?: (event: NativeSyntheticEvent<any>) => void;
  onLoadingProgress?: (
    event: NativeSyntheticEvent<{ progress: number }>
  ) => void;
  onMessagingDisconnected?: () => void;
  injectedJavaScript?: string;
}

type WebViewCommands = {
  goBack: () => void;
  goForward: () => void;
  reload: () => void;
  stopLoading: () => void;
  postMessage: (message: string) => void;
  injectJavaScript: (script: string) => void;
  loadUrl: (url: string) => void;
  requestFocus: () => void;
  clearHistory: () => void;
  clearCache: () => void;
  connectMessagingPort: () => void;
};

const ref = useRef<GeckoView>(null);

// In your function
ref.current?.reload();