/**
 * Conditional render by platform because "maximumZoomScale" and "minimumZoomScale" only works in iOS.
 * In the case of Android, We must replicate that behavior from zero.
 * @see https://reactnative.dev/docs/scrollview#maximumzoomscale-ios
 */

import React from 'react';
import {ScrollView} from 'react-native';
import {isIos} from '@shared/utils';

import {styles} from './styles';
import AndroidZoom, {AndroidZoomProps} from './AndroidZoom';

export function ZoomView({children, style, ...props}: AndroidZoomProps) {
  return isIos ? (
    <ScrollView
      maximumZoomScale={3}
      minimumZoomScale={1}
      bouncesZoom={false}
      contentContainerStyle={[styles.flex, style]}
      keyboardShouldPersistTaps="always"
      bounces={false}
      alwaysBounceVertical={false}
      alwaysBounceHorizontal={false}>
      {children}
    </ScrollView>
  ) : (
    <AndroidZoom style={style} {...props}>
      {children}
    </AndroidZoom>
  );
}
