import React, { PureComponent } from "react";
import { StyleSheet, View } from "react-native";
import type {
  LuraPlayerNativeHost,
  LuraPlayerProps,
  LuraPlayerState,
} from "../interfaces";

import LuraPlayerNative from "./LuraPlayerNative";

export default class LuraPlayer extends PureComponent<
  LuraPlayerProps,
  LuraPlayerState
> {
  private readonly native: React.RefObject<LuraPlayerNativeHost>;

  constructor(props: LuraPlayerProps) {
    super(props);
    this.native = React.createRef();
    this.state = {};
  }

  render(): JSX.Element {
    return (
      <View style={this.props.style}>
        <LuraPlayerNative
          ref={this.native}
          style={styles.native}
          token={this.props.token}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  native: {
    width: "100%",
    height: "100%",
  },
});