Karthik-B-06

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';
import FormField from './FormField';
import { formData } from '../formData';

const RegisterForm = (props) => {
  const [formValues, handleFormValueChange, setFormValues] = formData({
    username: '',
    email: '',
    password: ''

Karthik-B-06

import React from 'react';
import { View, Text, StyleSheet, TextInput } from 'react-native';

const FormField = (props) => {
  return (
    <View style={styles.formFieldWrapper}>
      <Text style={styles.labelText}>{props.label}</Text>
      <TextInput
        placeholder={props.placeholder}
        style={styles.formFieldText}

Karthik-B-06

import { useState } from "react";

export const formData = (values) => {
  const [formValues, setFormValues] = useState({
    ...values
  });

  const handleFormValueChange = (key, value) => {
    setFormValues(
      {

Karthik-B-06

import React, { useState } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { deviceHeight, deviceWidth } from '../../helpers/constants';
import { WHITE, SANS_BASE, SECONDARY_BLACK } from '../../helpers/styleConstants';
import { Button } from 'react-native-elements';
import Modal from 'react-native-modal';
import { CheckBox } from 'react-native-elements'
import { TouchableHighlight } from 'react-native-gesture-handler';

const CustomAlertModal = (props) => {

Karthik-B-06

// Used Libraries
// 1. React Native Elements (https://react-native-elements.github.io/react-native-elements/)
// 2. React Native Modal (https://github.com/react-native-community/react-native-modal)

import React, { useState } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { deviceHeight, deviceWidth } from '../../helpers/constants';
import { WHITE, SANS_BASE, SECONDARY_BLACK } from '../../helpers/styleConstants';
import { Button } from 'react-native-elements';
import Modal from 'react-native-modal';

Karthik-B-06

import React, { useState } from 'react';
import { Animated, SafeAreaView, StatusBar } from 'react-native';
import LoaderComponent from './src/LoaderComponent';
import SearchComponent from './src/SearchComponent';
console.disableYellowBox = true;


const App = () => {
  const [scrollYValue, setScrollYValue] = useState(new Animated.Value(0));
  const clampedScroll = Animated.diffClamp(

Karthik-B-06

import React from 'react';
import { Animated, StyleSheet, TextInput } from 'react-native';
import { deviceWidth } from './LoaderComponent';

const SearchComponent = (props) => {
  const {
    clampedScroll
  } = props;
  const searchBarTranslate = clampedScroll.interpolate({
    inputRange: [0, 50],

Karthik-B-06

import React from 'react';
import { Dimensions } from 'react-native';
import { Circle, Rect } from "react-native-svg";
import ContentLoader from 'rn-content-loader';
export const deviceWidth = Dimensions.get('window').width;

const LoaderComponent = props => (
  <ContentLoader
    height={200}
    width={(deviceWidth - 70) / 2}

Karthik-B-06

import React from 'react';
import { StyleSheet, Text, View, Animated, Image } from 'react-native';
import { deviceHeight, deviceWidth } from '../../helpers/constants';
import { WHITE } from '../../helpers/styleConstants';
import ContentLoader from 'rn-content-loader';
import { Rect } from 'react-native-svg';

// Have react-native-svg and rn-content-loader installed and linked to your project

export const LoadingSkillAtom = (props) => {

Karthik-B-06

import React from 'react';
import { Animated, StyleSheet, View } from 'react-native';
import { deviceHeight, deviceWidth } from '../helpers/constants';

const BottomContainer = ({
  scrollY,
  imageHeight,
  ...props
}) => {
  const animateBorderRadius = scrollY.interpolate({