import React from "react";
import { View, ViewStyle } from "react-native";

import { River } from "@applicaster/zapp-react-native-ui-components/Components";
import { withNestedNavigationContextProvider } from "@applicaster/zapp-react-native-ui-components/Contexts/NestedNavigationContext";

type Props = {
  styles: Record<string, ViewStyle>;
  minHeight: number;
  changingTab: boolean;
  feedUrl: string;
  screenId: string;
  hasUIComponents: boolean;
  backgroundColor: string;
};

function TabContentComponent(props: Props) {
  const {
    styles,
    minHeight,
    backgroundColor,
    changingTab,
    feedUrl,
    screenId,
    hasUIComponents,
  } = props;

  return (
    <View
      style={[
        styles.riverWrapper,

        {
          backgroundColor,
          minHeight,
        },
      ]}
    >
      {changingTab ? null : (
        <River
          testID="riverScreen"
          feedUrl={feedUrl}
          screenId={screenId}
          isInsideContainer={!hasUIComponents}
        />
      )}
    </View>
  );
}

export const TabContent =
  withNestedNavigationContextProvider(TabContentComponent);