moira-web

1
// @flow
2
import * as React from "react";
3
import { storiesOf } from "@storybook/react";
4
import ContactList from "../Components/ContactList/ContactList";
5
import { ContactTypes } from "../Domain/ContactType";
6
import { actionWithDelay } from "./StoryUtils";
7
import { contactConfigs } from "./Data/ContactConfigs";
8

9
const commonProps = {
10
    contactDescriptions: contactConfigs,
11
    onTestContact: actionWithDelay("onTestContact", 2000),
12
    onRemoveContact: actionWithDelay("onRemoveContact", 2000),
13
    onUpdateContact: actionWithDelay("onUpdateContact", 2000),
14
    onAddContact: actionWithDelay("onAddContact", 2000),
15
};
16

17
storiesOf("ContactList", module)
18
    .add("EmptyList", () => <ContactList {...commonProps} items={[]} />)
19
    .add("Single_Email", () => (
20
        <ContactList
21
            {...commonProps}
22
            items={[
23
                {
24
                    id: "1",
25
                    type: ContactTypes.mail,
26
                    user: "1",
27
                    value: "test@mail.ru",
28
                },
29
            ]}
30
        />
31
    ))
32
    .add("Single_Pushover", () => (
33
        <ContactList
34
            {...commonProps}
35
            items={[
36
                {
37
                    id: "1",
38
                    type: ContactTypes.pushover,
39
                    user: "1",
40
                    value: "u13XsadLKJjh273jafksaja7asjdkds ",
41
                },
42
            ]}
43
        />
44
    ))
45
    .add("TwoItems", () => (
46
        <ContactList
47
            {...commonProps}
48
            items={[
49
                {
50
                    id: "1",
51
                    type: ContactTypes.pushover,
52
                    user: "1",
53
                    value: "u13XsadLKJjh273jafksaja7asjdkds ",
54
                },
55
                {
56
                    id: "2",
57
                    type: ContactTypes.mail,
58
                    user: "1",
59
                    value: "test@mail.ru",
60
                },
61
            ]}
62
        />
63
    ))
64
    .add("AllTypesItems", () => (
65
        <ContactList
66
            {...commonProps}
67
            items={[
68
                {
69
                    id: "1",
70
                    type: ContactTypes.pushover,
71
                    user: "1",
72
                    value: "u13XsadLKJjh273jafksaja7asjdkds ",
73
                },
74
                {
75
                    id: "2",
76
                    type: ContactTypes.mail,
77
                    user: "1",
78
                    value: "test@mail.ru",
79
                },
80
                {
81
                    id: "3",
82
                    type: ContactTypes.slack,
83
                    user: "1",
84
                    value: "test@mail.ru",
85
                },
86
                {
87
                    id: "4",
88
                    type: ContactTypes["twilio voice"],
89
                    user: "1",
90
                    value: "test@mail.ru",
91
                },
92
                {
93
                    id: "5",
94
                    type: ContactTypes.telegram,
95
                    user: "1",
96
                    value: "test@mail.ru",
97
                },
98
            ]}
99
        />
100
    ));
101