View difference between Paste ID: AiWgeUcP and tnfN7K6d
SHOW: | | - or go back to the newest paste.
1
import React from 'react';
2
import ReactDOM from 'react-dom';
3
import { connect, Provider } from 'react-redux';
4
import { createStore } from 'redux';
5
import PropTypes from 'prop-types';
6
7
const defaultState = {
8
  type: 'company',
9
  name: 'безымянный',
10
  caption: '',
11
  logo: '???',
12
};
13
14
const store = createStore((state = defaultState) => state);
15
16
const BookletTypes = [
17
    { type: 'Company', name: 'Профайл компании'},
18
    { type: 'text', name: 'Текстовый буклет', disabled: true }
19
];
20
21
const BookletType = ({ onChange, type }) => (
22
23
    <h1>Тип:
24
        <select value={type} name="booklet-type" className="form-select" onChange={onChange}>
25
            {BookletTypes.map((bt) => (
26
27
                <option key={bt.type} value={bt.type} disabled={bt.disabled}>{bt.name}</option>
28
            ))
29
            }
30
        </select>
31
    </h1>
32
);
33
34
const BookletForm = ({ onTypeChange, type }) => (
35
  <BookletType onChange={onTypeChange} type={type}>
36
  <span>Лого: </span><input required name="company-logo" form="send-booklet" class="form-control" type="file" accept="image/*"/>
37
);
38
39
const mapDispatchToProps = (dispatch) => {
40
41
    return {
42
        onTypeChange: (type) => {
43
44
            dispatch({ newTypeChosen: type });
45
        }
46
    };
47
};
48
49
const mapStateToProps = (state) => {
50
51
    return { type: state.type };
52
};
53
54
55
const VisibileBookletForm = connect(
56
    mapStateToProps,
57
    mapDispatchToProps
58
)(BookletForm);
59
60
ReactDOM.render(
61
    <Provider store={store}>
62
      <VisibileBookletForm/>
63
    </Provider>,
64
    document.getElementById('root')
65
);
66
67
BookletType.propTypes = {
68
    onChange: PropTypes.func.isRequired
69
};
70
71
72
/*
73
ERROR in ./static/create-booklet.js                                             
74
Module build failed (from ./node_modules/babel-loader/lib/index.js):            
75
SyntaxError: /home/ilyaigpetrov/Repos/slog.foobar/static/create-booklet.js: Unex
76
pected token (41:4)                                                             
77
                                                                                
78
  39 | const mapDispatchToProps = (dispatch) => {                               
79
  40 |                                                                          
80
> 41 |     return {                                                             
81
     |     ^                                                                    
82
  42 |         onTypeChange: (type) => {                                        
83
  43 |                                                                          
84
  44 |             dispatch({ newTypeChosen: type });                           
85
    at _class.raise (/home/ilyaigpetrov/Repos/slog.foobar/node_modules/@babel/pa
86
rser/lib/index.js:3893:15)                            
87
88
89
*/