// withHooks
// noPage
import { LibIcon } from 'esoftplay/cache/lib/icon/import';
import useSafeState from 'esoftplay/state';

import React from 'react';
import { Animated, TouchableOpacity } from 'react-native';


export interface MarketRefresh_buttonProps {
  onPress: () => void,
  size?: number
}
export default function m(props: MarketRefresh_buttonProps): any {
  const [anim, setAnim] = useSafeState(new Animated.Value(0))
  const size = props.size || 18


  function rotate() {
    Animated.timing(anim, {
      toValue: 1, duration: 500, useNativeDriver: true
    }).start(() => { setAnim(new Animated.Value(0)) })
  }

  const rotateAnim = anim.interpolate({
    inputRange: [0, 1],
    outputRange: ['0deg', '360deg'],
    extrapolate: 'clamp'
  })

  return (
    <TouchableOpacity onPress={() => { rotate(); props.onPress(); }} style={{ height: 30, width: 30, alignItems: 'center', justifyContent: 'center' }} >
      <Animated.View style={{ height: size + 8, width: size + 8, transform: [{ rotate: rotateAnim }], alignItems: 'center', justifyContent: 'center' }} >
        <LibIcon name="refresh" size={size} color="#999" />
      </Animated.View>
    </TouchableOpacity>
  )
}