Commit b9709caa authored by Patrik Meijer's avatar Patrik Meijer
Browse files

Add ConfirmDialog demo

parent e156d790

demo/demoApp.jsx

+7 −2
Original line number Diff line number Diff line
@@ -6,6 +6,7 @@ import Typography from '@material-ui/core/Typography'; 


import DemoProjectSeedCards from '../src/components/ProjectSeedCards/demo';

import DemoAttributeEditor from '../src/components/AttributeEditor/demo';

import DemoConfirmDialog from '../src/components/ConfirmDialog/demo';





export default class demoApp extends Component {
@@ -19,11 +20,15 @@ export default class demoApp extends Component { 
        const DEMOS = [

            {

                component: <DemoAttributeEditor/>,

                title: 'AttributeEditor'

                title: 'AttributeEditor',

            },

            {

                component: <DemoProjectSeedCards/>,

                title: 'ProjectSeedCards'

                title: 'ProjectSeedCards',

            },

            {

                component: <DemoConfirmDialog/>,

                title: 'ConfirmDialog',

            },

        ];

src/components/ConfirmDialog/ConfirmDialog.jsx

+1 −1
Original line number Diff line number Diff line
@@ -39,9 +39,9 @@ function ConfirmDialog(props) { 
ConfirmDialog.propTypes = {

    title: PropTypes.string.isRequired,

    message: PropTypes.string.isRequired,

    onClose: PropTypes.func,

    noButtonText: PropTypes.string,

    yesButtonText: PropTypes.string,

    onClose: PropTypes.func,

};



ConfirmDialog.defaultProps = {

src/components/ConfirmDialog/demo.jsx

0 → 100644
+43 −0
Original line number Diff line number Diff line 
import React, {Component} from 'react';

import Button from '@material-ui/core/Button';



import ConfirmDialog from './index'



export default class DemoConfirmDialog extends Component {

    state = {

        openDialog: false

    };



    openDialog = () => {

        this.setState({openDialog: true});

    };



    closeDialog = () => {

        this.setState({openDialog: false});

    };



    render() {

        return (

            <div>

                <Button

                    onClick={this.openDialog}

                    color="primary"

                >

                    Show Dialog

                </Button>



                {this.state.openDialog ? <ConfirmDialog

                    title="A simple Yes/No or OK/Cancel Dialog"

                    message="Note that whenever this dialog is present it will be displayed. Therefore you

                    need to add/remove it from the parent that controls it. Get it?"

                    yesButtonText="Yes"

                    noButtonText="No"

                    onClose={(yes) => {

                        alert(yes ? 'Good' : 'It\'ll be come clear if you look at the source for the demo');

                        this.closeDialog();

                    }}

                /> : null}

            </div>

        )

    }

}
 
 No newline at end of file

src/components/ProjectSeedCards/demo.jsx

+11 −9
Original line number Diff line number Diff line
@@ -20,6 +20,7 @@ export default class DemoProjectSeedCards extends Component { 
            }));



        return (

            <div style={{width: '50%'}}>

                <ProjectSeedCards

                    seedsInfo={seedsInfo}

                    contentStyle={{
@@ -29,6 +30,7 @@ export default class DemoProjectSeedCards extends Component { 
                        alert(`Seed selected:\n ${JSON.stringify(createData, null, 2)}`);

                    }}

                />

            </div>

        )

    }

}
 
 No newline at end of file