@magmamath/students-features 0.7.1 → 0.8.0-rc.0

package/src/features/chatbot/components/Alternatives/HelpRequestOption.tsx

@@ -1,91 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react'
-import { Animated, Pressable, StyleSheet } from 'react-native'
-import { COLORS, FONT_FAMILY, SPACING } from '@magmamath/react-native-ui'
-import { ArrowRightIcon } from '../../../../shared/icons/ArrowRightIcon'
-
-type HelpRequestOptionProps = {
-  onPress: () => void
-  message: string
-  disabled: boolean
-  hoverColor?: string
-}
-
-export const HelpRequestOption = ({
-  onPress,
-  message,
-  disabled = false,
-  hoverColor = COLORS.PRIMARY_BLUE,
-}: HelpRequestOptionProps) => {
-  const [isHovered, setIsHovered] = useState(false)
-  const hoverAnim = useRef(new Animated.Value(0)).current
-
-  const backgroundColor = hoverAnim.interpolate({
-    inputRange: [0, 1],
-    outputRange: [COLORS.NEUTRAL_1, hoverColor],
-  })
-  const textColor = hoverAnim.interpolate({
-    inputRange: [0, 1],
-    outputRange: [COLORS.NEUTRAL_10, COLORS.NEUTRAL_1],
-  })
-
-  useEffect(() => {
-    Animated.timing(hoverAnim, {
-      toValue: isHovered ? 1 : 0,
-      duration: 200,
-      useNativeDriver: false,
-    }).start()
-  }, [isHovered, hoverAnim])
-
-  return (
-    <Pressable
-      onHoverIn={() => setIsHovered(true)}
-      onHoverOut={() => setIsHovered(false)}
-      onPress={onPress}
-      style={styles.button}
-      disabled={disabled}
-      accessibilityState={{ disabled }}
-      accessibilityRole="button"
-    >
-      <Animated.View
-        style={[styles.textWrapper, { backgroundColor, borderColor: backgroundColor }]}
-      >
-        <Animated.Text numberOfLines={1} style={[styles.text, { color: textColor }]}>
-          {message}
-        </Animated.Text>
-        <ArrowRightIcon color={isHovered ? COLORS.NEUTRAL_1 : COLORS.NEUTRAL_10} />
-      </Animated.View>
-    </Pressable>
-  )
-}
-
-const styles = StyleSheet.create({
-  button: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    width: '100%',
-  },
-  text: {
-    fontSize: 20,
-    fontWeight: 400,
-    fontFamily: FONT_FAMILY.buenosAires,
-    color: COLORS.NEUTRAL_10,
-  },
-  textWrapper: {
-    flex: 1,
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    maxWidth: 305,
-    paddingHorizontal: SPACING[400],
-    paddingVertical: SPACING[200],
-    borderWidth: 1,
-    borderRadius: 48,
-    elevation: 3,
-    shadowColor: '#333',
-    shadowOffset: { width: 0, height: 1 },
-    shadowOpacity: 0.25,
-    shadowRadius: 3,
-    backgroundColor: COLORS.NEUTRAL_1,
-  },
-})