SHARE
TWEET

Untitled

a guest Jun 25th, 2019 47 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. TypeError: Cannot read property 'values' of undefined
  2. Home.render
  3. ./components/home/components/Home.jsx:24
  4.   21 |    render() {
  5.   22 |        const { uploads } = this.props;
  6.   23 |        // convert uploads values to an array
  7. > 24 |        const values = [...uploads.values()];
  8.      | ^  25 |
  9.   26 |        return (
  10.   27 |            <div style={CARD_CONTAINER}>
  11.      
  12. import { UPDATE_REACTION, REQUEST_UPLOAD_LIST } from './actionTypes';
  13. import { USER_UPLOADS } from './constants';
  14.  
  15. const INITIAL_STATE = {
  16.     uploads: new Map(),
  17. };
  18.  
  19. function generateUploadsMap() {
  20.     const setOfUserUploads = new Map();
  21.  
  22.     USER_UPLOADS.forEach(userUpload => {
  23.         const { _id } = userUpload;
  24.  
  25.         setOfUserUploads.set(_id, userUpload);
  26.     });
  27. }
  28. export default (state = { ...INITIAL_STATE }, action) => {
  29.     switch (action.type) {
  30.         case REQUEST_UPLOAD_LIST: {
  31.             const { payload } = action;
  32.  
  33.             return {
  34.                 ...state,
  35.                 uploads: generateUploadsMap(payload),
  36.             };
  37.         }
  38.         default:
  39.             return state;
  40.     }
  41. };
  42.      
  43. import React from 'react';
  44. import { Avatar, Card, Icon, List } from 'antd';
  45. import { connect } from 'react-redux';
  46. import { bindActionCreators } from 'redux';
  47.  
  48. import { LIST_TEXTS, STYLES } from '../constants';
  49. import * as actions from '../actions';
  50. import { getUploads } from '../selectors';
  51.  
  52. const { AVATAR, CARD_CONTAINER, CARD_LIST, USER_LIST } = STYLES;
  53. const { INNER, MORE, UPLOAD, VERTICAL } = LIST_TEXTS;
  54.  
  55. class Home extends React.Component {
  56.  
  57.     componentDidMount() {
  58.         const { requestUploadList } = this.props.actions;
  59.  
  60.         requestUploadList();
  61.     }
  62.  
  63.     render() {
  64.         const { uploads } = this.props;
  65.  
  66.         const values = [...uploads.values()];
  67.  
  68.         return (
  69.             <div style={CARD_CONTAINER}>
  70.                 <List
  71.                   itemLayout={VERTICAL}
  72.                   dataSource={values}
  73.                   renderItem={item => (
  74.                       <List.Item style={USER_LIST}>
  75.                           <Card                            
  76.                             cover={<img alt={UPLOAD} src={item.image} />}
  77.                             extra={<Icon type={MORE} />}
  78.                             hoverable
  79.                             title={(
  80.                                 <a>
  81.                                     <Avatar src={item.image} style={AVATAR} />
  82.                                     {item.user}
  83.                                 </a>
  84. )}
  85.                             type={INNER}
  86.                             style={CARD_LIST}
  87.                           >
  88.                               {item.story}
  89.                           </Card>
  90.                       </List.Item>
  91.                   )}
  92.                 />
  93.             </div>
  94.         );
  95.     }
  96. }
  97.  
  98. const mapStateToProps = state => ({
  99.     uploads: getUploads(state),
  100. });
  101.  
  102. const mapDispatchToProps = dispatch => ({
  103.     actions: bindActionCreators(actions, dispatch),
  104. });
  105.  
  106. export default connect(mapStateToProps, mapDispatchToProps)(Home);
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top