Tinder-Card-Swipe-Animation/App.js at master · Rodrig79/Tinder-Card-Swipe-Animation · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
import React, {Component} from 'react'
import {View} from 'react-native'
import Card from './card'

import * as firebase from 'firebase'

const firebaseConfig = {
  apiKey: "AIzaSyDKMpc5G7aZaC52SKD1LoKGwOo1i2TNEHU",
  databaseURL: "https://dating-app-ed4b5.firebaseio.com",

}

firebase.initializeApp(firebaseConfig)
export default class App extends Component{

  state = {
    profileIndex: 0,
  }

  nextCard = () =>{
    this.setState({profileIndex: this.state.profileIndex +1})
  }
  render(){
    const {profileIndex} = this.state
    return(
      <View style = {{flex:1}}>
      {profiles.slice(profileIndex, profileIndex+3).reverse().map((profile) => {
        return(
          <Card
          key={profile.id}
          profile = {profile}
          onSwipeOff= {this.nextCard}
          />
        )
      })}
      </View>
    )
  }
}

const profiles = [
  {
    id: '259389830744794',
    name: 'Candice',
    birthday: '10/18/1986',
    bio: 'Supermodel',
  },
  {
    id: '720115413',
    name: 'Alessandra',
    birthday: '1/10/1989',
    bio: 'Dancer',
  },
  {
    id: '169571172540',
    name: 'Miranda',
    birthday: '12/12/1983',
    bio: 'Doctor',
  },
  {
    id: '1476279359358140',
    name: 'Alissa',
    birthday: '2/11/1990',
    bio: 'Comedian',
  },
  {
    id: '1140849052644433',
    name: 'Behati',
    birthday: '3/23/1991',
    bio: 'Developer',
  },
  {
    id: '912478262117011',
    name: 'Rosie',
    birthday: '9/4/1989',
    bio: 'Artist',
  },
  {
    id: '173567062703796',
    name: 'Kendall',
    birthday: '8/17/1992',
    bio: 'Truck Driver',
  },
]