Redux: useSelector returns undefined - reactjs

Question

I have carefully gone through my code, nothing wrong with store, reducer function, Provider, but useSelector hook returns undefined in the App.js. Why does it return undefined?
redux.js
import {createStore} from 'redux'
const counterReducer = (state = {counter:0}, action)=>{
if(action.type ==='increment'){
return {counter:state.counter+1}
}
if(action.type ==='decrement'){
return{counter : state.counter-1}
}
}
const store = createStore(counterReducer);
export default store;
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import store from '../src/store/redux'
import {Provider} from 'react-redux'
ReactDOM.render(
<Provider store = {store}>
<App />
</Provider>,
document.getElementById('root')
);
reportWebVitals();
App.js
import './App.css';
import {useSelector} from 'react-redux'
function App() {
const counter = useSelector(state=> state);
console.log(counter) //undefined
return (
<div></div>
);
}
export default App;

Answer 1

redux.js
import { createStore } from 'redux';
const counterReducer = (state = { counter: 0 }, action) => {
**// Updated previous if statement using switch statement**
switch (action.type) {
case 'increment':
return { ...state, counter: state.counter + 1 };
case 'decrement':
return { ...state, counter: state.counter - 1 };
default:
return { counter: 0 }; // you need to define a default value;
}
const store = createStore(counterReducer);
export default store;
app.js
import React from 'react';
import { useSelector, useDispatch } from 'react-redux';
import './style.css';
export default function App() {
const counter = useSelector((state) => state.counter);
const dispatch = useDispatch();
console.log(counter);
return (
<div>
<h1>{counter}</h1>
<button onClick={() => dispatch({ type: 'increment' })}>Increment</button>
<button onClick={() => dispatch({ type: 'decrement' })}>Decrement</button>
</div>
);
}
Look at this code, we always need a default value when creating reducer. Using switch statement for this case I think safe.
you can see this solution: stackbllitz