import React from 'react';
import { withKnobs } from '@storybook/addon-knobs';
import PasswordReseter from './PasswordResetUi';
import { useModal, JDbutton } from '../..';


export const passwordFind = () => {
    const modalHook = useModal();

    return (
        <div>
            <JDbutton onClick={() => {
                modalHook.openModal();
            }}>변경하기</JDbutton>
            <PasswordReseter requireField={{
                email: true,
                password: true,
            }} modalHook={modalHook} startChangeCallBack={(param) => {
                console.info(param);
            }} completeChangeCallBack={(param) => {
                console.info(param);
            }} />
        </div>
    );
};

export const emailFind = () => {
    const modalHook = useModal();

    return (
        <div>
            <JDbutton onClick={() => {
                modalHook.openModal();
            }}>변경하기</JDbutton>
            <PasswordReseter modalHook={modalHook} startChangeCallBack={(param) => {
                console.info(param);
            }} completeChangeCallBack={(param) => {
                console.info(param);
            }} />
        </div>
    );
};


export default {
    title: 'PasswordChanger',
    component: passwordFind,
    decorators: [withKnobs]
};

passwordFind.story = {
    name: 'passwordFind'
};

emailFind.story = {
    name: 'emailFind'
};
