1import * as React from 'react'
2import * as Kb from '../../../common-adapters'
3import * as Sb from '../../../stories/storybook'
4import GiphySearch from './index'
5
6const common = {
7  previewIsVideo: true,
8}
9const props = {
10  galleryURL: '',
11  onClick: (url: string) => Sb.action('onClick')(url),
12  previews: [
13    {
14      ...common,
15      previewHeight: 200,
16      previewIsVideo: true,
17      previewUrl: 'http://media0.giphy.com/media/feqkVgjJpYtjy/200w.mp4',
18      previewWidth: 445,
19      targetUrl: 'http://gph.is/XJ200y',
20    },
21    {
22      ...common,
23      previewHeight: 200,
24      previewIsVideo: true,
25      previewUrl: 'http://media2.giphy.com/media/FiGiRei2ICzzG/200.mp4',
26      previewWidth: 568,
27      targetUrl: 'http://gph.is/1fIdLOl',
28    },
29    {
30      ...common,
31      previewHeight: 200,
32      previewIsVideo: true,
33      previewUrl: 'https://media0.giphy.com/media/xUA7b68VhMqQ4Xv8aY/200.mp4',
34      previewWidth: 356,
35      targetUrl: 'https://gph.is/2ljwmsU',
36    },
37    {
38      ...common,
39      previewHeight: 200,
40      previewIsVideo: true,
41      previewUrl: 'https://media1.giphy.com/media/gSRkSblDEjUuk/200.mp4',
42      previewWidth: 263,
43      targetUrl: 'https://gph.is/11i7rUS',
44    },
45    {
46      ...common,
47      previewHeight: 200,
48      previewIsVideo: true,
49      previewUrl: 'https://media0.giphy.com/media/26gR0FCswrVMfscRG/200.mp4',
50      previewWidth: 379,
51      targetUrl: 'https://gph.is/2qld9Fy',
52    },
53    {
54      ...common,
55      previewHeight: 200,
56      previewIsVideo: true,
57      previewUrl: 'https://media0.giphy.com/media/l3fZGF5yOD3YonXPO/200.mp4',
58      previewWidth: 266,
59      targetUrl: 'https://gph.is/2qwO3GJ',
60    },
61    {
62      ...common,
63      previewHeight: 200,
64      previewIsVideo: true,
65      previewUrl: 'https://media0.giphy.com/media/l0Exk3lvWTWWC1ezS/200.mp4',
66      previewWidth: 300,
67      targetUrl: 'https://gph.is/2kQz8EU',
68    },
69    {
70      ...common,
71      previewHeight: 200,
72      previewIsVideo: true,
73      previewUrl: 'https://media3.giphy.com/media/3o6Yg6J4RmkJYBFZ9m/200.mp4',
74      previewWidth: 356,
75      targetUrl: 'https://gph.is/2lBB70Z',
76    },
77    {
78      ...common,
79      previewHeight: 200,
80      previewIsVideo: true,
81      previewUrl: 'https://media1.giphy.com/media/iW20cf1G7xPyg/200.mp4',
82      previewWidth: 385,
83      targetUrl: 'https://gph.is/1Sz02fi',
84    },
85    {
86      ...common,
87      previewHeight: 200,
88      previewIsVideo: true,
89      previewUrl: 'https://media1.giphy.com/media/l46C8Nl1uHLkppB3G/200.mp4',
90      previewWidth: 361,
91      targetUrl: 'https://gph.is/2b8qb2r',
92    },
93  ],
94}
95
96const load = () => {
97  Sb.storiesOf('Chat/Conversation/Giphy', module)
98    .addDecorator(story => <Kb.Box style={{maxWidth: 500, padding: 5}}>{story()}</Kb.Box>)
99    .add('Display', () => <GiphySearch {...props} />)
100}
101
102export default load
103