<file_sep>import React from 'react';
import { shallow } from 'enzyme';
import GiftCard from "./GiftCard";
import Button from '@material-ui/core/Button';
import { Link } from 'react-router-dom';

describe("Landing Page Test", () => {

    it("should load GiftCard Component", () => {
        let wrapper = shallow(<GiftCard />); 
        expect(wrapper).not.toBe(null);
    });

    it("should have props for GiftCard", () =>{
        let classess = { card: {}, avatar:{}, media:{}}
        let gift = {cardName: 'amazon', id: 1, cardPoints: 10, cardImage: 'image.png', cardCount: 11, cardShortDesc: '10% OFF'}
        let wrapper = shallow(<GiftCard classes={classess} 
            userEmail='<EMAIL>'
            giftCard={gift}  />)
            wrapper.instance().setState({expanded: false});
        expect(wrapper.instance().state.expanded).toBe(false);
    })

    // it('', () =>{
    //     let classess = { card: {}, avatar:{}, media:{}}
    //     let gift = {cardName: 'amazon', id: 1, cardPoints: 10, cardImage: 'image.png', cardCount: 11, cardShortDesc: '10% OFF'}
    //     const component = renderer.create(
    //         <GiftCard classes={classess} 
    //         userEmail='<EMAIL>'
    //         giftCard={gift} />
    //       );
    //       const tree = component.toJSON();
    //       expect(tree).toMatchSnapshot();
    // });
});<file_sep>import axios from "axios";
import thunk from 'redux-thunk'
import configureMockStore from 'redux-mock-store'
import {
    fetchCard, 
    fetchCards, 
    fetchCardFilter, 
    adminUpdateCard, 
    adminAddCard, 
    updateCardCount
} from "./index";
import { FETCH_CARDS, FETCH_CARD, FETCH_CARD_FILTER, ADMIN_ADD_CARD, UPDATE_CARD_COUNT, ADMIN_UPDATE_CARD } from './types';

jest.mock('axios');

const middlewares = [thunk];
const mockStore = configureMockStore(middlewares);

describe('All gifts actions', function description() {
    it ("On fetchCards Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        axios.get.mockResolvedValueOnce({data:[{ id: 1, name: "iphone" }], headers:{"x-total-count": 1}})
        const expectedAction = [
            {
                type: FETCH_CARDS,
                payload: {data:[{ id: 1, name: "iphone" }], totalCount : 1}
            }
        ]
        await store.dispatch(fetchCards(1,3));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
    })

    it ("On fetchCard Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        axios.get.mockResolvedValueOnce({ id: 1, name: "iphone" })
        const expectedAction = [
            {
                type: FETCH_CARD,
                payload: { id: 1, name: "iphone" }
            }
        ]
        await store.dispatch(fetchCard(1));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
    })


    it ("On adminUpdateCard Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        axios.patch.mockResolvedValueOnce({ id: 1, name: "iphone" })
        const expectedAction = [
            {
                type: ADMIN_UPDATE_CARD,
                payload: { id: 1, name: "iphone" }
            }
        ]
        await store.dispatch(adminUpdateCard(1,{ id: 1, name: "amazon" }));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
    })

    it ("On fetchCardFilter Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        const expectedAction = [
            {
                type: FETCH_CARD_FILTER,
                payload: { id: 1, name: "amazon" }
            }
        ]
        await store.dispatch(fetchCardFilter({id: 1, name: "amazon" }));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
    })

    it ("On updateCardCount Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        axios.patch.mockResolvedValueOnce({data:{ id: 1, name: "iphone", cardCount:2 }})
        const expectedAction = [
            {
                type: UPDATE_CARD_COUNT,
                payload: { id: 1, name: "iphone", cardCount:2 }
            }
        ]
        await store.dispatch(updateCardCount(1,1));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
    })

    it ("On adminAddCard Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        axios.post.mockResolvedValueOnce({data:{ id: 1, name: "food Panda" }})
        const expectedAction = [
            {
                type: ADMIN_ADD_CARD,
                payload: { id: 1, name: "food Panda" }
            }
        ]
        await store.dispatch(adminAddCard({ id: 1, name: "food Panda" }));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
    })

});<file_sep>import { Random_rgba } from './Random_rgba';
    
    describe('Random_rgba component', () => {
      it('Random_rgba', () => {
            let comp = Random_rgba()
            expect(comp).not.toBe(null);
        })
    });    <file_sep>import loginReducer from "./loginReducer";
import { LOGIN, LOGOUT } from "../actions/types";
import { logout } from "../actions";

describe ("Login Reducer Tests", () => {
    
    let user;
    beforeEach(() => {
         user=null 
    });

    
    it ("should be empty list", () => {
        let state = {};
        let login = {...state,
            loginStatus: true,
            detailsObject: {}
          }
        let logout = {...state,
            loginStatus: false,
            detailsObject: {}
          }
        const initial = user ? login : logout;
        expect(loginReducer (initial, {})).
        toEqual({"detailsObject": {}, "loginStatus": false})
    });

    it("when action type is LOGIN", () =>{
        let state = {};
        expect(loginReducer ({...state,
            loginStatus: true,
            detailsObject: {}
          }, {type:LOGIN, payload: {id:1, name:'<NAME>'}}))
          .toEqual({"detailsObject": {"id": 1, "name": "<NAME>"}, "loginStatus": true})
    });

    it("when action type is LOGOUT", () =>{
        let state = {}
        expect(loginReducer ({...state,
            loginStatus: false,
            detailsObject: {}
          }, {type:LOGOUT, payload: {id:1, name:'<NAME>'}}))
          .toEqual({"detailsObject": {}, "loginStatus": false})
    })


    it ("should be same state", () => {
        let state = [];
        expect(loginReducer(state, {type:'__UNKNOWN'})).toStrictEqual({})
    });

})<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import GiftsList from './GiftsList';
import { jssPreset } from '@material-ui/core';

describe("GiftsList Section Test", () => {
    it('should load component', () =>{
        let props = {
            giftCards:[],
            totalCount: 0,
            fetchMorecards: jest.fn(),
            userDetails:{
                email: ''
            },
            classes:{ 
                root:{}
            }
        }
        let wrapper = shallow(<GiftsList  {...props}/>);
        expect(wrapper).toBeTruthy();

    })

    // it('should call componentDidMount', () =>{
    //     let props = {
    //         giftCards:[],
    //         totalCount: 0,
    //         fetchMorecards: jest.fn(),
    //         userDetails:{
    //             email: ''
    //         },
    //         classes:{ 
    //             root:{}
    //         }
    //     }
    //     let wrapper = shallow(<GiftsList  {...props}/>);
    //     const c = wrapper.instance();
    //     const check = jest.spyOn(c,'componentDidMount');
    //     expect(check).toHaveBeenCalled();

    // })

});<file_sep>// import React from 'react';
// import PropTypes from 'prop-types';
// import { withStyles } from '@material-ui/core/styles';
// import Paper from '@material-ui/core/Paper';
// import { Grid, AutoSizer, Table, Column, InfiniteLoader } from 'react-virtualized';
// import {DateFormatter} from '../../common/components/DateFormatter';
// import 'react-virtualized/styles.css';

// const styles = theme => ({
//   root: {
//     width: '100%',
//     marginTop: theme.spacing.unit * 3,
//     //overflowX: 'auto',
//   },
//   table: {
//     minWidth: 700,
//   },
//   tablecell: {
//     border: '1px solid black',
//     lineHeight: '30px',
//     textAlign: 'center',
//     padding: '0 4px',
//   }
// });


// class GiftsSend extends React.PureComponent {

//   constructor(props) {
//     super(props);
//     this.state = {
//       prevStaterows: [],
//       rows: []
//     };
//     // this.generateData();
//   }

//   componentDidMount() {
//     debugger;
//     if(this.props.data)
//       this.generateData([]);
//   }

//   componentDidUpdate(prevProps) {
//     debugger;
//     // Typical usage (don't forget to compare props):
//     if (JSON.stringify(this.props.data) !== JSON.stringify(prevProps.data)) {
//       this.generateData(prevProps.data);
//     }
//   }

//   componentWillReceiveProps (nextProps) {
//     if (JSON.stringify(this.props.data) !== JSON.stringify(nextProps.data)) {
//       this.generateData(this.props.data);
//        }
//   }

//   generateData = (arr) => {
//     debugger;
//     let rowes = arr;
//     // this.setState(
//     //   prevState => {
//     //     return {
//     //       prevStaterows: prevState.rows
//     //     };
//     //   },() => {rowes = [...this.state.prevStaterows]}
//     // );
//   //  rowes = [...this.state.prevStaterows];
//    this.props.data.forEach((row,i) => {
//      let a = {
//        "cardName":row.cardName,
//        "points": row.cardPoints,
//        "receiveTo":row.senderEmail,
//        "issueDate":DateFormatter(row.cardIssueDate),
//        "expiryDate":DateFormatter(row.cardExpiryDate)
//      }    
//       // rowes[i] = [];
//       // let b = Object.values(a);
//       // for (let j = 0; j < Object.entries(a).length; j++) {
//       //   rowes[i].push(b[j]);
//       // }
//       rowes.push(a);
//    });

//     this.setState({rows:rowes});
//   }

//   loadMore = () => {
//     debugger;
//     this.props.fetchSentCards();
//   }

// //  cellRenderer = ({ columnIndex, key, rowIndex, style }) => {    
// //   return (
// //     <div key={key} style={style}>
// //       <div className={this.props.classes.tablecell}>
// //         {this.state.rows[rowIndex][columnIndex]}
// //       </div>
// //     </div>
// //   );
      
// //   };

//   render() {
//   const {classes, data, totalCount} = this.props;
//     return (
//       <Paper className={classes.root}>
//         {/* <Table className={classes.table}>
//           <TableHead>
//             <TableRow>
//               <TableCell>CARD NAME</TableCell>
//               <TableCell >POINTS</TableCell>
//               <TableCell >SENT TO</TableCell>
//               <TableCell >ISSUE DATE</TableCell>
//               <TableCell >EXPIRY DATE</TableCell>
//             </TableRow>
//           </TableHead>
//           <TableBody>
//             {data.map(row => (
//               <TableRow key={row.id}>
                
//                 <TableCell>{row.cardName}</TableCell>
//                 <TableCell >{row.cardPoints}</TableCell>
//                 <TableCell >{row.receiverEmail}</TableCell>
//                 <TableCell>{DateFormatter(row.cardIssueDate)}</TableCell>
//                 <TableCell>{DateFormatter(row.cardExpiryDate)}</TableCell>
//               </TableRow>
//             ))}
//           </TableBody>
//         </Table> */}
//         {/* <div style={{width:"100%", height:"74vh"}}>
//           <AutoSizer>
//             {({width, height}) =>(
//               // <List width={width} height={height} rowHeight={50} rowCount={data.length} 
//               // rowRenderer={({key, index, style, parent}) =>{
//               //   const row = data[index];
//               //   return (<div key={key} style={style}>
//               //    <tr> <div>{row.cardName}</div>
//               //     <div>{row.cardPoints}</div>
//               //     <div>{row.receiverEmail}</div>
//               //     <div>{DateFormatter(row.cardIssueDate)}</div>
//               //     <div>{DateFormatter(row.cardExpiryDate)}</div> 
//               //     </tr>
//               //   </div>);
    
//               // }} />
//               // <Grid
//               //   cellRenderer={this.cellRenderer}
//               //   overscanRowCount={2}
//               //   columnCount={5}
//               //   columnWidth={200}
//               //   height={height}
//               //   rowCount={data.length}
//               //   rowHeight={30}
//               //   width={width}
//               // />

//               <Table
//     width={width}
//     height={height}
//     headerHeight={40}
//     rowHeight={40}
//     rowCount={this.state.rows.length}
//     rowGetter={({index}) => this.state.rows[index]}>
//     <Column label="Card Name" dataKey="cardName" width={200} />
//     <Column width={200} label="Card Points" dataKey="points" />
//     <Column label="Receiver Email" dataKey="receiveTo" width={400} />
//     <Column width={300} label="Card Issue Date" dataKey="issueDate" />
//     <Column width={300} label="Card Expiry Date" dataKey="expiryDate" />
//   </Table>

//             )}
//           </AutoSizer>
//         </div> */}

// <div style={{width:"100%", height:"74vh"}}>
//      <InfiniteLoader
//               isRowLoaded={({index}) => !!this.state.rows[index]}
//                loadMoreRows={this.loadMore}
//                rowCount={totalCount}
//             >
//                {({onRowsRendered, registerChild}) => (
//                   <AutoSizer>
//                      {({ width, height}) => (
//                         <Table
//                            ref={registerChild}
//                            onRowsRendered={onRowsRendered}
//                            rowClassName='table-row'
//                            headerHeight={40}
//                            width={width}
//                            height={height}
//                            rowHeight={40}
//                            rowCount={this.state.rows.length}
//                            rowGetter={({ index }) => this.state.rows[index]}
//                         >
//                         <Column label="Card Name" dataKey="cardName" width={200} />
//                         <Column width={200} label="Card Points" dataKey="points" />
//                         <Column label="Receiver Email" dataKey="receiveTo" width={400} />
//                         <Column width={300} label="Card Issue Date" dataKey="issueDate" />
//                         <Column width={300} label="Card Expiry Date" dataKey="expiryDate" />
//                      </Table>
//                      )}
//                   </AutoSizer>
//                )}
//             </InfiniteLoader>
//             </div>
    




//       </Paper>
//     );
//   }
  
// }


// GiftsSend.propTypes = {
//   classes: PropTypes.object.isRequired,
// };

// export default withStyles(styles)(GiftsSend);



import React, { useEffect, useState, useRef } from 'react';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import Paper from '@material-ui/core/Paper';
import { AutoSizer, Table, Column, InfiniteLoader } from 'react-virtualized';
import {DateFormatter} from '../../common/components/DateFormatter';
import 'react-virtualized/styles.css';

const styles = theme => ({
  root: {
    width: '100%',
    marginTop: theme.spacing.unit * 3,
    //overflowX: 'auto',
  },
  table: {
    minWidth: 700,
  },
  tablecell: {
    border: '1px solid black',
    lineHeight: '30px',
    textAlign: 'center',
    padding: '0 4px',
  }
});


function GiftsSend (props) {

  const { classes } = props;

  const [rows, setRows] = useState([]);
  const prevCount = useRef();
  useEffect(() => {
    prevCount.current = rows;
  });
  const loadMore = () =>{
    props.fetchSentCards();      
      // resolve the promise after data where fetched
     // this.promiseResolve();
  }

  useEffect(() =>{
  const generateData = () => {
    const rowes = [...prevCount.current];
    props.data.forEach((row,i) => {
      let a = {
        "cardName":row.cardName,
        "points": row.cardPoints,
        "receiveTo":row.senderEmail,
        "issueDate":DateFormatter(row.cardIssueDate),
        "expiryDate":DateFormatter(row.cardExpiryDate)
      }    
       // rowes[i] = [];
       // let b = Object.values(a);
       // for (let j = 0; j < Object.entries(a).length; j++) {
       //   rowes[i].push(b[j]);
       // }
       rowes.push(a);
    });
    setRows(rowes);
  }
  generateData();
 },[props.data]);


  // generateData =() => {
  //   debugger;
  //   let rowes = [];
  //   // this.setState(
  //   //   prevState => {
  //   //     return {
  //   //       prevStaterows: prevState.rows
  //   //     };
  //   //   },() => {rowes = [...this.state.prevStaterows]}
  //   // );
  //   rowes = [...this.state.prevStaterows]
  //  this.props.data.forEach((row,i) => {
  //    let a = {
  //      "cardName":row.cardName,
  //      "points": row.cardPoints,
  //      "receiveTo":row.senderEmail,
  //      "issueDate":DateFormatter(row.cardIssueDate),
  //      "expiryDate":DateFormatter(row.cardExpiryDate)
  //    }    
  //     // rowes[i] = [];
  //     // let b = Object.values(a);
  //     // for (let j = 0; j < Object.entries(a).length; j++) {
  //     //   rowes[i].push(b[j]);
  //     // }
  //     rowes.push(a);
  //  });

  //   this.setState({rows:rowes});
  // }

  // loadMore = () => {
  //   debugger;
  //   this.props.fetchSentCards();
  // }

//  cellRenderer = ({ columnIndex, key, rowIndex, style }) => {    
//   return (
//     <div key={key} style={style}>
//       <div className={this.props.classes.tablecell}>
//         {this.state.rows[rowIndex][columnIndex]}
//       </div>
//     </div>
//   );
      
//   };

  // render() {
  // const {classes, data, totalCount} = this.props;
    return (
      <Paper className={classes.root}>
        {/* <Table className={classes.table}>
          <TableHead>
            <TableRow>
              <TableCell>CARD NAME</TableCell>
              <TableCell >POINTS</TableCell>
              <TableCell >SENT TO</TableCell>
              <TableCell >ISSUE DATE</TableCell>
              <TableCell >EXPIRY DATE</TableCell>
            </TableRow>
          </TableHead>
          <TableBody>
            {data.map(row => (
              <TableRow key={row.id}>
                
                <TableCell>{row.cardName}</TableCell>
                <TableCell >{row.cardPoints}</TableCell>
                <TableCell >{row.receiverEmail}</TableCell>
                <TableCell>{DateFormatter(row.cardIssueDate)}</TableCell>
                <TableCell>{DateFormatter(row.cardExpiryDate)}</TableCell>
              </TableRow>
            ))}
          </TableBody>
        </Table> */}
        {/* <div style={{width:"100%", height:"74vh"}}>
          <AutoSizer>
            {({width, height}) =>(
              // <List width={width} height={height} rowHeight={50} rowCount={data.length} 
              // rowRenderer={({key, index, style, parent}) =>{
              //   const row = data[index];
              //   return (<div key={key} style={style}>
              //    <tr> <div>{row.cardName}</div>
              //     <div>{row.cardPoints}</div>
              //     <div>{row.receiverEmail}</div>
              //     <div>{DateFormatter(row.cardIssueDate)}</div>
              //     <div>{DateFormatter(row.cardExpiryDate)}</div> 
              //     </tr>
              //   </div>);
    
              // }} />
              // <Grid
              //   cellRenderer={this.cellRenderer}
              //   overscanRowCount={2}
              //   columnCount={5}
              //   columnWidth={200}
              //   height={height}
              //   rowCount={data.length}
              //   rowHeight={30}
              //   width={width}
              // />

              <Table
    width={width}
    height={height}
    headerHeight={40}
    rowHeight={40}
    rowCount={this.state.rows.length}
    rowGetter={({index}) => this.state.rows[index]}>
    <Column label="Card Name" dataKey="cardName" width={200} />
    <Column width={200} label="Card Points" dataKey="points" />
    <Column label="Receiver Email" dataKey="receiveTo" width={400} />
    <Column width={300} label="Card Issue Date" dataKey="issueDate" />
    <Column width={300} label="Card Expiry Date" dataKey="expiryDate" />
  </Table>

            )}
          </AutoSizer>
        </div> */}

<div style={{width:"100%", height:"74vh"}}>
     <InfiniteLoader
               isRowLoaded={({index}) => !!rows[index]}
               loadMoreRows={loadMore}
               rowCount={props.totalCount}
            >
               {({onRowsRendered, registerChild}) => (
                  <AutoSizer>
                     {({ width, height}) => (
                        <Table
                           ref={registerChild}
                           onRowsRendered={onRowsRendered}
                           rowClassName='table-row'
                           headerHeight={40}
                           width={width}
                           height={height}
                           rowHeight={40}
                           rowCount={rows.length}
                           rowGetter={({ index }) => rows[index]}
                        >
                        <Column label="Card Name" dataKey="cardName" width={200} />
                        <Column width={200} label="Card Points" dataKey="points" />
                        <Column label="Receiver Email" dataKey="receiveTo" width={400} />
                        <Column width={300} label="Card Issue Date" dataKey="issueDate" />
                        <Column width={300} label="Card Expiry Date" dataKey="expiryDate" />
                     </Table>
                     )}
                  </AutoSizer>
               )}
            </InfiniteLoader>
            </div>
    




      </Paper>
    );
  //}
  
}


GiftsSend.propTypes = {
  classes: PropTypes.object.isRequired,
};

export default withStyles(styles)(GiftsSend);







<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import GiftShow from './GiftShow';

describe("GiftShow Section Test", () => {
    it('should load component', () =>{
        let props = {
            data:{
                cardImage:'',
                cardName: '',
                cardPoints: '',
                cardCount: '',
                cardExpiryDate: '',
                cardComments:[
                    {
                        first_name: '',
                        last_name: '',
                        commented_on: '',
                        comment: '',
                        rating:''
                    }
                ],
                cardVendor: '',
                cardLongDesc: ''
            }
        }
        let wrapper = shallow(<GiftShow  {...props}/>);
        expect(wrapper).toBeTruthy();

    })
});<file_sep>import React, { useEffect, useState, useRef } from 'react';
import PropTypes from 'prop-types';
import { withStyles } from '@material-ui/core/styles';
import { Table, Column, AutoSizer, InfiniteLoader } from 'react-virtualized';
import Paper from '@material-ui/core/Paper';
//import { Button } from '@material-ui/core';
import {DateFormatter} from '../../common/components/DateFormatter';
import 'react-virtualized/styles.css';
import { Button } from '@material-ui/core';

const styles = theme => ({
  root: {
    // minHeight: '100vh',
     width: '100%',
    marginTop: theme.spacing.unit * 3,
    //overflowX: 'auto',
  },
  table: {
    minWidth: 700,
  },
  tablecell: {
    border: '1px solid black',
    lineHeight: '30px',
    textAlign: 'center',
    padding: '0 4px',
  }
});

function GiftsReceived(props) {
  const { classes } = props;

  const [rows, setRows] = useState([]);
  const prevCount = useRef();
  useEffect(() => {
    prevCount.current = rows;
  });
  const loadMore = () =>{
    props.fetchReceivedCards();      
      // resolve the promise after data where fetched
     // this.promiseResolve();
  }

 useEffect(() =>{
  const generateData = () => {
    const rowes = [...prevCount.current];
   props.data.forEach((row,i) => {
     let a = {
       "cardName":row.cardName,
       "points": row.cardPoints,
       "sentTo":row.senderEmail,
       "shortDesc": row.cardShortDesc,
       "issueDate":DateFormatter(row.cardIssueDate),
       "expiryDate":DateFormatter(row.cardExpiryDate),
       "redeem" : row.isRedeemed ? 'Redeemed': 'notRedeemed'
     }    
      // rowes[i] = [];
      // let b = Object.values(a);
      // for (let j = 0; j < Object.entries(a).length; j++) {
      //   rowes[i].push(b[j]);
      // }
      rowes.push(a);
   });

    setRows(rowes);
  }
  generateData();
 },[props.data]);

// const cellRenderer = ({ columnIndex, key, rowIndex, style }) => {    
//   return (
//     <div key={key} style={style}>
//       <div className={props.classes.tablecell}>
//         {rows[rowIndex][columnIndex] === 'notRedeemed' ? 
//         <Button variant="contained" color="primary" onClick={handleRedeem(rowIndex)}>
//           Redeem
//         </Button> : rows[rowIndex][columnIndex]}
//       </div>
//     </div>
//   );
      
//  };

// const handleRedeem = (index) =>{
//     props.redeemCard(rows[index])
//   }

  return (
    <Paper className={classes.root}>
      {/* <div style={{width:"100%", height:"74vh"}}>
          <AutoSizer>
            {({width, height}) =>(
              // <List width={width} height={height} rowHeight={200} rowCount={data.length} 
              // overscanRowCount={2}
              // rowRenderer={({key, index, style, parent}) =>{
              //   const row = data[index];
              //   return (<div key={key} style={style}>
              //    <tr> <div>{row.cardName}</div>
              //     <div>{row.cardPoints}</div>
              //     <div>{row.senderEmail}</div>
              //     <div>{row.cardShortDesc}</div>
              //     <div>{DateFormatter(row.cardIssueDate)}</div>
              //     <div>{DateFormatter(row.cardExpiryDate)}</div>
              //     <div>{row.isRedeemed ? 'Redeemed' : <Button variant="contained" color="primary" onClick={()=>props.redeemCard(row)}>Redeem</Button>}</div>
              //     </tr>
              //   </div>);
              // }
              // } />

              // <Grid
              //   cellRenderer={cellRenderer}
              //   overscanRowCount={2}
              //   columnCount={7}
              //   columnWidth={200}
              //   height={height}
              //   rowCount={data.length}
              //   rowHeight={30}
              //   width={width}
              // />

              <Table
    width={width}
    height={height}
    headerHeight={40}
    rowHeight={40}
    rowCount={rows.length}
    overscanRowCount={10}
    rowGetter={({index}) => rows[index]}>
    <Column label="Card Name" dataKey="cardName" width={200} />
    <Column width={200} label="Card Points" dataKey="points" />
    <Column label="Sender Email" dataKey="sentTo" width={400} />
    <Column label="Short Desc" dataKey="shortDesc" width={200} />
    <Column width={300} label="Card Issue Date" dataKey="issueDate" />
    <Column width={300} label="Card Expiry Date" dataKey="expiryDate" />
    <Column label="Status" dataKey="redeem" width={200} />
  </Table>
            )}
          </AutoSizer>
        </div> */}
     <div style={{width:"100%", height:"74vh"}}>
     <InfiniteLoader
               isRowLoaded={({ index}) => !!rows[index]}
               loadMoreRows={loadMore}
               rowCount={props.totalCount}
            >
               {({onRowsRendered, registerChild}) => (
                  <AutoSizer>
                     {({ width, height}) => (
                        <Table
                           ref={registerChild}
                           onRowsRendered={onRowsRendered}
                           rowClassName='table-row'
                           headerHeight={40}
                           width={width}
                           height={height}
                           rowHeight={40}
                           rowCount={rows.length}
                           rowGetter={({ index }) => rows[index]}
                        >
                        <Column label="Card Name" dataKey="cardName" width={200} />
                        <Column width={200} label="Card Points" dataKey="points" />
                        <Column label="Sender Email" dataKey="sentTo" width={400} />
                        <Column label="Short Desc" dataKey="shortDesc" width={200} />
                        <Column width={300} label="Card Issue Date" dataKey="issueDate" />
                        <Column width={300} label="Card Expiry Date" dataKey="expiryDate" />
                        <Column label="Status" dataKey="redeem" width={200} 
                        cellRenderer={
                          ({rowData}) => rowData.isRedeemed ? 'Redeemed' :
                            <Button color='primary' varient="contained" onClick={() =>{console.log(rowData)}}>
                              Redeem
                            </Button>
                        } />
                     </Table>
                     )}
                  </AutoSizer>
               )}
            </InfiniteLoader>
            </div>
    </Paper>
  );
}

GiftsReceived.propTypes = {
  classes: PropTypes.object.isRequired,
};

export default withStyles(styles)(GiftsReceived);<file_sep>import giftsReducer from "./giftsReducer";
import { FETCH_CARDS, FETCH_CARD, FETCH_CARD_FILTER, UPDATE_CARD_COUNT, ADMIN_ADD_CARD, ADMIN_UPDATE_CARD } from "../actions/types";

describe ("Gifts Reducer Tests", () => {
    
    it ("should be empty giftlist", () => {
        let state = {
            giftCards: [],
            giftCardsFiltered: [],
            giftCard: {}
          };
        expect(giftsReducer ({
            giftCards: [],
            giftCardsFiltered: [],
            giftCard: {}
          }, {})).toEqual(state)
    });

    it("when action type is FETCH_CARDS", () =>{
        let state = {
            giftCards: [],
            giftCardsFiltered: [],
            giftCard: {},
          };
        expect(giftsReducer(state, 
            {type:FETCH_CARDS, payload: {data:[{id:1, name:'new card1'},{id:2, name:'new card2'}], totalCount:2}}))
        .toEqual({
            giftCards: [{id:1, name:'new card1'}, {id:2, name:'new card2'}],
            giftCardsFiltered: [{id:1, name:'new card1'}, {id:2, name:'new card2'}],
            giftCard: {},
            totalCount: 2
          })
    });

    it("when action type is FETCH_CARD_FILTER", () =>{
        let state = {
            giftCards: [],
            giftCardsFiltered: [],
            giftCard: {},
          };
        expect(giftsReducer(state, {type:FETCH_CARD_FILTER, payload: [{id:1, name:'new card'}]}))
        .toEqual({
            giftCards: [],
            giftCardsFiltered: [{id:1, name:'new card'}],
            giftCard: {},
          })
    });

    it("when action type is UPDATE_CARD_COUNT", () =>{
      let state = {
          giftCards: [],
          giftCardsFiltered: [],
          giftCard: {},
        };
      expect(giftsReducer(state, {type:UPDATE_CARD_COUNT, payload: {id:1, name:'new card'}}))
      .toEqual({
          giftCards: [],
          giftCardsFiltered: [],
          giftCard: {id:1, name:'new card'},
        })
  });

    it("when action type is FETCH_CARD", () =>{
      let state = {
          giftCards: [],
          giftCardsFiltered: [],
          giftCard: {},
        };
      expect(giftsReducer(state, {type:FETCH_CARD, payload: {data:{id:1, name:'new card'}}}))
      .toEqual({
          giftCards: [],
          giftCardsFiltered: [],
          giftCard: {id:1, name:'new card'},
        })
  });

  it("when action type is ADMIN_ADD_CARD", () =>{
    let state = {
        giftCards: [],
        giftCardsFiltered: [],
        giftCard: {},
      };
    expect(giftsReducer(state, {type:ADMIN_ADD_CARD}))
    .toEqual({
        giftCards: [],
        giftCardsFiltered: [],
        giftCard: {},
      })
});

it("when action type is ADMIN_UPDATE_CARD", () =>{
  let state = {
      giftCards: [{id:1, name:'new card1'}],
      giftCardsFiltered: [],
      giftCard: {},
    };
  expect(giftsReducer(state, {type:ADMIN_UPDATE_CARD,payload: {data:{id:1, name:'new card'}}}))
  .toEqual({
      giftCards: [{id:1, name:'new card'}],
      giftCardsFiltered: [],
      giftCard: {},
    })
});

it("when action type is ADMIN_UPDATE_CARD with not having id present", () =>{
  let state = {
      giftCards: [{id:1, name:'new card1'}],
      giftCardsFiltered: [],
      giftCard: {},
    };
  expect(giftsReducer(state, {type:ADMIN_UPDATE_CARD,payload: {data:{id:2, name:'new card'}}}))
  .toEqual({
      giftCards: [{id:1, name:'new card1'}],
      giftCardsFiltered: [],
      giftCard: {},
    })
});


    it ("should be same state", () => {
        let state = [];
        expect(giftsReducer(state, {type:'__UNKNOWN'})).toStrictEqual({})
    });

})<file_sep>import { compareCountAsc, compareCountDesc,
comparePointsAsc, comparePointsDesc, 
compareValidityAsc, compareValidityDesc } from './CompareForSort';

describe('Calc component', () => {
  it('compareCountAsc', () => {
        let a = {cardCount: 10};
        let b = {cardCount: 20};
        let comp = compareCountAsc(a, b)
        expect(comp).toBe(-1);
        let c = {cardCount: 20};
        let d = {cardCount: 10};
        let comp1 = compareCountAsc(c, d)
        expect(comp1).toBe(1);
    })

    it('comparePointsAsc', () => {
        let a = {cardPoints: 10};
        let b = {cardPoints: 20};
        let comp = comparePointsAsc(a, b)
        expect(comp).toBe(-1);
        let c = {cardPoints: 20};
        let d = {cardPoints: 10};
        let comp1 = comparePointsAsc(c, d)
        expect(comp1).toBe(1);
    })

    it('comparePointsDesc', () => {
        let a = {cardPoints: 10};
        let b = {cardPoints: 20};
        let comp = comparePointsDesc(a, b)
        expect(comp).toBe(1);
        let c = {cardPoints: 20};
        let d = {cardPoints: 10};
        let comp1 = comparePointsDesc(c, d)
        expect(comp1).toBe(-1);
    })

    it('compareCountDesc', () => {
        let a = {cardCount: 10};
        let b = {cardCount : 20};
        let comp = compareCountDesc(a, b)
        expect(comp).toBe(1);
        let c = {cardCount: 20};
        let d = {cardCount : 10};
        let comp1 = compareCountDesc(c, d)
        expect(comp1).toBe(-1);
    })

    it('compareValidityAsc', () => {
        let a = {cardExpiryDate: new Date()};
        let b = {cardExpiryDate: new Date()+1};
        let comp = compareValidityAsc(a, b)
        expect(comp).toBe(0);
    })

    it('compareValidityDesc', () => {
        let a = {cardExpiryDate: new Date()};
        let b = {cardExpiryDate: new Date() + 1};
        let comp = compareValidityDesc(a, b)
        expect(comp).toBe(0);
    })

});<file_sep># React-training-Project-2021<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import Profile from './profile';

describe('Profile component', () => {
    it('should render snapshot', () => {
        let props = {
            detailsObject:{
                email: '',
                first_name: '',
                last_name: '',
                socialProfileLink: '',
                picture: '',
                balance_points: 100
            }
        }
        let wrapper = shallow(<Profile  {...props}/>);
        expect(wrapper).toBeTruthy();
      })

      it('should not have socialProfileLink', () => {
        let props = {
            detailsObject:{
                email: '',
                first_name: '',
                last_name: '',
                picture: '',
                balance_points: 100
            }
        }
        let wrapper = shallow(<Profile  {...props}/>);
        expect(wrapper.find('label').at(2).text()).toBe('Balance Points');
      })
  });<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import GiftShowContainer from './GiftShowContainer';
import configureMockStore from 'redux-mock-store'
import fetchMock from 'fetch-mock';
import thunk from 'redux-thunk'
import * as actions from '../state/actions'
import {Provider} from 'react-redux';

const middlewares = [thunk]
const mockStore = configureMockStore(middlewares)

describe("GiftShowContainer Section Test", () => {
    let wrapper;
    beforeEach(() => {
       wrapper = shallow(<Provider store={mockStore}><GiftShowContainer /></Provider>);   
    });
    afterEach(() => {
        fetchMock.restore();
      })
      const state = {
        gifts:{
            giftCard: {}
        },
        user: {
            UserDetails: {}
        },
        login: {
            detailsObject: {},
            loginStatus: {}
        }
      }
      const store1 = mockStore(state);
    it("should load GiftShowContainer Component", () => {
        wrapper = shallow(<Provider store={store1}><GiftShowContainer /></Provider>);
        expect(wrapper).not.toBe(null);
    });

    // it("should call componentDidMount", () =>{
    //     wrapper =  mount(<Provider store={store1}><GiftShowContainer /></Provider>);
    //     expect(wrapper..componentDidMount()).toHaveBeenCalled();
    // })
});<file_sep>import React from 'react';
import InputTypeComponent from './inputTypeComponent';
import { mount, shallow } from 'enzyme';
import {
    FormControl,
    Input,
    InputAdornment,
    InputLabel,
    FormHelperText,
    IconButton
  } from "@material-ui/core";

    describe('InputTypeComponent component', () => {
      it('should render snapshot', () => {
          let props = {
            fieldFullWidth: '100%',
            inputError: '',
            style: {},
            inputDisabled: false,
            inputId: 'id',
            inputType: 'text',
            inputValue: '',
            inputPlaceholder: 'Please enter',
            endAdornment: true,
            endAdornmentIcon: '',
            startAdornment: true,
            startAdornmentText: '',
            inputHelperText: 'check it',
            handleEndAdornmentButtonClick: jest.fn()
          }
           let wrapper = shallow(<InputTypeComponent {...props}/>)
            expect(wrapper.find(Input)).toBeTruthy();
        })

        it('should render snapshot', () => {
            let props = {
              fieldFullWidth: '100%',
              inputError: '',
              style: {},
              inputDisabled: false,
              inputId: 'id',
              inputType: 'text',
              inputValue: '',
              inputPlaceholder: 'Please enter',
              endAdornment: false,
              endAdornmentIcon: '',
              startAdornment: false,
              startAdornmentText: '',
              inputHelperText: 'check it',
              handleEndAdornmentButtonClick: jest.fn(),
              handleInputChange: jest.fn()
            }
             let wrapper = shallow(<InputTypeComponent {...props}/>)
             wrapper.find(Input).simulate('change');
             expect(wrapper.find(Input).props().inputId).toBe();
          })
    });<file_sep>import axios from "axios";
import thunk from 'redux-thunk'
import configureMockStore from 'redux-mock-store'
import {
createUser, login, logout
} from "./index";
import { LOGIN, LOGOUT, CREATE_USER } from "./types";

jest.mock('axios');

const middlewares = [thunk];
const mockStore = configureMockStore(middlewares);

describe('All Header actions', function description() {
    it ("On login Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        axios.get.mockResolvedValueOnce({data:[{ id: 1, name: "Prajakta" }]})
        const expectedAction = [
            {
                type: LOGIN,
                payload: { id: 1, name: "Prajakta" }
            }
        ]
        let user = {
            "id": '',
            "email": '',
            "first_name": '',
            "last_name": '',
            "picture":''
        }
        await store.dispatch(createUser(user));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
    })

    it ("On login Action trigger", async () => {
        let state = {};
        const store = mockStore(state);
        axios.get.mockResolvedValueOnce({data:[]});
        axios.post.mockResolvedValueOnce({data:[{ id: 1, name: "Prajakta" }]})
        const expectedAction = [
            {
                type: CREATE_USER,
                payload: [{ id: 1, name: "Prajakta" }]
            }
        ]
        let user = {
            "id": '',
            "email": '',
            "first_name": '',
            "last_name": '',
            "picture":''
        }
        await store.dispatch(createUser(user));
        const getAction = store.getActions();
        expect(getAction).toEqual(expectedAction);
        let loggOUT = logout();
        expect(loggOUT).not.toBe(null);
    })

});<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import GiftsSend from './giftsSend';

describe('GiftsSend component', () => {
    it('should render component', () =>{
        let props = {
            classes:{
                root:{
                    margin:'0px'
                }
            },
            fetchSentCards: jest.fn(),
            data:[
                {
                    cardName:'',
                    cardPoints:'',
                    senderEmail:'',
                    cardIssueDate:'',
                    cardExpiryDate: ''
                }
            ],
            totalCount:1
        }
        let wrapper = shallow(<GiftsSend {...props}/>);
        expect(wrapper).not.toBe(null);
    });
});<file_sep>import usersReducer from "./usersReducer";
import { RECEIVED_CARDS, SENT_CARDS, USER_DETAILS, REDEEM_CARD, UPDATE_BALANCE, UPDATE_TRANSACT } from './../actions/types';

describe ("UsersReducer Reducer Tests", () => {
        
    it ("should be empty state", () => {
        let state = {
            cards: [],
            UserDetails: []
          };
        expect(usersReducer ({
            cards: [],
            UserDetails: []
          }, {})).toEqual(state)
    });

    it("when action type is RECEIVED_CARDS", () =>{
        let state = {
            cards: [],
            UserDetails: []
          };
        expect(usersReducer (state, {type:RECEIVED_CARDS, 
            payload:{data:[{id:1, name:'new card1'},{id:2, name:'new card2'}], totalCount:2}}))
          .toEqual({cards: [{id:1, name:'new card1'},{id:2, name:'new card2'}],
          totalCount:2, UserDetails: []})
    });

    it("when action type is SENT_CARDS", () =>{
        let state = {
            cards: [],
            UserDetails: []
          };
        expect(usersReducer (state, {type:SENT_CARDS, 
            payload:{data:[{id:1, name:'new card1'},{id:2, name:'new card2'}], totalCount:2}}))
          .toEqual({cards: [{id:1, name:'new card1'},{id:2, name:'new card2'}],
          totalCount:2, UserDetails: []})
    });

    it("when action type is USER_DETAILS", () =>{
        let state = {
            cards: [],
            UserDetails: []
          };
        expect(usersReducer (state, {type:USER_DETAILS, 
            payload:{userId:1, userName:'new user1'}}))
          .toEqual({cards: [], UserDetails: {userId:1, userName:'new user1'}})
    });

    it("when action type is UPDATE_BALANCE", () =>{
        let state = {
            cards: [],
            UserDetails: []
          };
        expect(usersReducer (state, {type:UPDATE_BALANCE, 
            payload:{userId:1, userName:'new user1', balance:500}}))
          .toEqual({cards: [], UserDetails: {userId:1, userName:'new user1',balance: 500}})
    });

    it("when action type is UPDATE_TRANSACT", () =>{
        let state = {
            cards: [],
            UserDetails: []
          };
        expect(usersReducer (state, {type:UPDATE_TRANSACT, 
            payload:[{id:1, name:'new card1'},{id:2, name:'new card2'}]}))
          .toEqual({cards: [{id:1, name:'new card1'},{id:2, name:'new card2'}], UserDetails: []})
    });

    it("when action type is REDEEM_CARD", () =>{
        let state = {
            cards: [{id:1, name:'new card1'},{id:2, name:'new card2'}],
            UserDetails: []
          };
        expect(usersReducer (state, {type:REDEEM_CARD, payload: {id:1, name:'new card1'}}))
          .toEqual({cards: [{id:1, name:'new card1', isRedeemed: true},{id:2, name:'new card2'}], UserDetails: []})
    });

    it("when action type is REDEEM_CARD when card is not present", () =>{
        let state = {
            cards: [{id:1, name:'new card1'},{id:2, name:'new card2'}],
            UserDetails: []
          };
        expect(usersReducer (state, {type:REDEEM_CARD, payload: {id:3, name:'new card3'}}))
          .toEqual({cards: [{id:1, name:'new card1'},{id:2, name:'new card2'}], UserDetails: []})
    });


    it ("should be same state", () => {
        let state = [];
        expect(usersReducer(state, {type:'__UNKNOWN'})).toStrictEqual({})
    });

})<file_sep>export const apiURL = 'http://localhost:5000'
export const adminEmail = [
    "<EMAIL>",
]<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import configureMockStore from 'redux-mock-store'
import thunk from 'redux-thunk'
import {Provider} from 'react-redux';
import GiftsListContainer from './GiftsListContainer';
import fetchMock from 'fetch-mock';

const middlewares = [thunk]
const mockStore = configureMockStore(middlewares)

describe("GiftsListContainer Section Test", () => {
  let wrapper;
  beforeEach(() => {
     wrapper = shallow(<Provider store={mockStore}><GiftsListContainer /></Provider>);   
  });
  afterEach(() => {
      fetchMock.restore();
    })
    const state = {
      giftCards:{ 
        gifts:{
          giftCards: []
        }
      },
      totalCount:{
        gifts:{
          totalCount:0
        }
      },
      giftCardsFiltered: {
        gifts:{
          giftCardsFiltered:[]
        }
      },
      userDetails: {
        login: {
            detailsObject: {}
        }
      }
    }
    const store1 = mockStore(state);
    it("should load GiftsListContainer Component", () => {
        let wrapper = shallow(<Provider store={store1}><GiftsListContainer /></Provider>);
        expect(wrapper).not.toBe(null);
    });

  //   it("should load ComponentDidmount", () => {
  //     const spy = jest.spyOn(GiftsListContainer.WrappedComponent.prototype, 'componentDidMount');
  //     let props = {
  //       fetchCards: jest.fn()
  //     }
  //     let wrap = shallow(<Provider store={store1}>
  //       <GiftsListContainer store={store1} {...props}/>
  //       </Provider>);
  //     expect(spy).toHaveBeenCalled();
  //     wrap.unmount();
  // });
});
<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import Header from "./Header";
import configureMockStore from 'redux-mock-store'
import thunk from 'redux-thunk'
import * as actions from '../state/actions'
import {Provider} from 'react-redux';
import Button from '@material-ui/core/Button';
import AppBar from "@material-ui/core/AppBar";
import Toolbar from "@material-ui/core/Toolbar";
import Typography from "@material-ui/core/Typography";
import fetchMock from 'fetch-mock';

const middlewares = [thunk]
const mockStore = configureMockStore(middlewares)

describe("Header Section Test", () => {

    let wrapper;
    beforeEach(() => {
       wrapper = shallow(<Provider store={mockStore}><Header /></Provider>);   
    });
    afterEach(() => {
        fetchMock.restore();
      })

      const user = {
        "id": "106899629700260704678",
        "email": "<EMAIL>",
        "first_name": "Prajakta",
        "last_name": "Charde",
        "picture": "https://lh3.googleusercontent.com/a-/AOh14GjtYgJumsRsIoorjBCTY43WWA10CzkLWOq7hwidzA=s96-c",
        "balance_points": 5000
      };

      const expectedActions = [
        actions.login(user)
      ]
      
      const state = {
        login:{
            loginStatus:true,
            userDetails: user
        }
      }

      const store1 = mockStore(state);

    it("should load Header Component", () => {
        wrapper = shallow(<Provider store={store1}><Header /></Provider>);
        expect(wrapper).not.toBe(null);
    });

    it("if main header element present ", () => {     
        wrapper = shallow(<Provider store={store1}>
            <Header />
            </Provider>);
        expect(wrapper.find(AppBar)).toBeDefined();
        expect(wrapper.find(Toolbar)).toBeDefined();
        expect(wrapper.find(Typography)).toBeDefined();
    });

    it('should present home button', () =>{
        wrapper = mount(<Provider store={store1}>
            <Header />
            </Provider>);
        expect(wrapper.find(Button).at(0).text()).toBe('YOYOGift')
    });

    it('should present gift received button', () =>{
        wrapper = mount(<Provider store={store1}>
            <Header />
            </Provider>);
        expect(wrapper.find(Button).at(1).text()).toBe('GIFTS RECEIVED');
    });

    it('should present gift send button', () =>{
      wrapper = mount(<Provider store={store1}>
          <Header />
          </Provider>);
      expect(wrapper.find(Button).at(2).text()).toBe('GIFTS SENT');
  });

  it('should present gift received button', () =>{
    wrapper = mount(<Provider store={store1}>
        <Header />
        </Provider>);
    expect(wrapper.find(Button).at(3).text()).toBe('MY PROFILE');
  });


});<file_sep>import React from 'react';
import { shallow, mount } from 'enzyme';
import GiftsReceived from './giftsReceived';

describe('GiftsReceived component', () => {
    it('should render component', () =>{
        let props = {
            classes:{
                root:{
                    margin:'0px'
                }
            },
            fetchSentCards: jest.fn(),
            data:[
                {
                    cardName:'',
                    cardPoints:'',
                    senderEmail:'',
                    cardIssueDate:'',
                    cardExpiryDate: '',
                    cardShortDesc: '',
                    isRedeemed: true
                }
            ],
            totalCount:1
        }
        let wrapper = shallow(<GiftsReceived {...props}/>);
        expect(wrapper).not.toBe(null);
    });
});<file_sep>import React from 'react';
import Footer from './Footer';
import { mount, shallow } from 'enzyme';
import PropTypes from 'prop-types';
import AppBar from "@material-ui/core/AppBar";
import Toolbar from "@material-ui/core/Toolbar";
    
    describe('Footer component', () => {
      it('should render snapshot', () => {
        Footer.propTypes = {
            classes: PropTypes.object.isRequired
          };
          let cla = {root:{margin:'10px'}}
           let wrapper = shallow(<Footer classes={ cla }/>);
            expect(wrapper.find(AppBar)).toBeTruthy();
            expect(wrapper.find(Toolbar)).toBeTruthy();
        
        })
    });<file_sep>import React from 'react';
import DatePickers  from './datePicker';
import PropTypes from 'prop-types';
import { mount, shallow } from 'enzyme';
import TextField from '@material-ui/core/TextField';
    
    describe('DatePickers component', () => {
      it('should render snapshot', () => {
        DatePickers.propTypes = {
            classes: PropTypes.object.isRequired
          };
          let classesss = {container:{}, label:{}, defaultValue:{}, textField:{}}
           let wrapper = shallow(<DatePickers classes={classesss} />)
            expect(wrapper.find(TextField)).toBeTruthy();
        })
    });