How to update state in react-native to detect when a certain event(given date has passed) has occurred with Hooks?

Viewed 59

I am using react-native with redux.

I want to update the state in my contacts when their dueDate has passed and this is my code

This is the way I am updating state in App.js

useEffect(()=>{ 
    
    setInterval(()=>{
       
       updateContacts(contacts.map(item => item.dueDate < new Date() 
          ?
          ( d=new Date(item.dueDate),
            item.payments.duration=='year'?d.setMonth(d.getMonth()+12)
          :item.payments.duration=='hyear'? d.setMonth(d.getMonth()+6)
          :item.payments.duration=='month'?d.setMonth(d.getMonth()+1)
          :d.setDate(d.getDate() +7),
          balance=item.balance-item.payments.payment,
          {
          ...item,dueDate:d,balance
          
        })
          :item)
       )
      },60000)
    },[]);

const mapStateToProps=(state)=>{
return{
  contacts:state.contactReducer.contacts
}
}

const mapDisptachToProps=(dispatch)=>{
  return {
  
    addContact: (contact) => dispatch(addContact(contact)),
    updateContacts: (contacts)=> dispatch(updateContacts(contacts))
  }

}


export default connect(mapStateToProps,mapDisptachToProps) (App);

My contact.Reducer

const initialState={
    contacts:
    [
        {
          id: uuid.v4(),
          name: {firstName: 'Neelanshu', lastName: 'Garg'},
          contact: {
            Mobile: '8800170377',
            Alt: '',
            email: 'neelanshugarg097@gmail.com',
          },
          payments: {
            paid: 0,
            duration: 'month',
            payment: 1000,
          },
          balance: 8800,
          date: new Date(2021, 10, 8),
          dueDate:new Date(2021,10,15),
        },
        {
          id: uuid.v4(),
          name: {firstName: 'Neel', lastName: 'Garg'},
          contact: {
            Mobile: '8800170377',
            Alt: '',
            email: 'neelanshugarg097@gmail.com',
          },
          payments: {
            paid: 0,
            duration: 'week',
            payment: 100,
          },
          balance: -100,
          date: new Date(2021, 10, 8),
          dueDate:new Date(2021,10,15),
          
        },
        {
          id: uuid.v4(),
          name: {firstName: 'shu', lastName: 'Garg'},
          contact: {
            Mobile: '8800170377',
            Alt: '',
            email: 'neelanshugarg097@gmail.com',
          },
          payments: {
            paid: 0,
            duration: 'week',
            payment: 100,
          },
          balance: 8800,
          date: new Date(2021, 10, 8),
          dueDate:new Date(2021,10,15),
          
        }
      ]
    }

    const contactReducer= (state=initialState, action)=>{
        switch(action.type)
        {
            case ADD_CONTACT:
              
                return{
                    ...state,
                    contacts:[...state.contacts,{id: uuid.v4(), ...action.data}]
                   
                };
            case DELETE_CONTACT:
                return {
                    ...state,
                    contacts:state.contacts.filter(item => item.id != action.id)
                };
            case UPDATE_CONTACTS:
              console.log(action.data)
                return {
                    ...state,
                    contacts:action.data
                }
            default:
                return state;
        }
    }


    export default contactReducer;

This is store.js

import {createStore, combineReducers} from 'redux'
import contactReducer from './reducers/contactReducer';
import devToolsEnhancer from 'remote-redux-devtools';

const rootReducer= combineReducers({
    contactReducer: contactReducer
})

const configureStore = ( ) => createStore(rootReducer,devToolsEnhancer({realtime:true,host: 'localhost',
port: 8000
}));

export default configureStore;

So problem is when I add a new contact(through action.type== ADD_CONTACT) it gets shown in the state and UI for some time but after update state goes back to initial hardcoded state and the new added contact goes away. I cant figure out how to update my state at all.

If I remove the update for state the new contact stays in the state and shown in UI all time. Please Help

0 Answers
Related