title: TS2339: Property 'tsReducer' does not exist on type 'DefaultRootState'
body: <p>Struggling with the above question. Seen similar questions but cannot figure it out. </p>
  
  <p>The below code is me attempting to open and close a dialog using TypeScript for first time in an existing React project which uses .js and .jsx. </p>
  
  <pre><code>import Button from '@material-ui/core/Button';
  import Dialog from '@material-ui/core/Dialog';
  import DialogActions from '@material-ui/core/DialogActions';
  import DialogContent from '@material-ui/core/DialogContent';
  import {useDispatch, useSelector} from 'react-redux';
  import {closeTsDialog} from '../actions/tsDialog'
  import {ActionTypes} from '../actions/types';
  
  const TsApp = (): JSX.Element =&gt; {
      const dispatch = useDispatch();
  
  // ERROR SHOWS UP ON LINE BELOW "state?.tsReducer?.isDialogOpen"
      const isDialogOpen = useSelector(state =&gt; state?.tsReducer?.isDialogOpen);
      const state = useSelector(s =&gt; s);
      console.log('-&gt;&gt;&gt;&gt;&gt;&gt; state', state);
  
  
      // main tsx excluded to allow for posting on stackoverflow
  };
  
  
  export default TsApp;
  </code></pre>
  
  <pre><code>import {TsDialogAction} from "../actions/tsDialog";
  
  
  const initialState = {
      id: 0,
      isDialogOpen: false
  };
  
  const tsReducer = (state: TsDialogAction = initialState, action: Action) =&gt; {
      switch (action.type) {
          case ActionTypes.closeDialog: {
              return {...state, isDialogOpen: false};
          }
          case ActionTypes.openDialog: {
              return {...state, isDialogOpen: true};
          }
          default:
              return state;
      }
  };
  
  export default tsReducer;
  </code></pre>
  
  <p>import {ActionTypes} from './types';</p>
  
  <p>export interface TsDialogAction {
      isDialogOpen: boolean
      number: number
  }</p>
  
  <p>export interface CloseTsDialog {
      type: ActionTypes.closeDialog
      payload: TsDialogAction
  }</p>
  
  <p>export interface OpenTsDialog {
      type: ActionTypes.openDialog
      payload: TsDialogAction
  }</p>
  
  <p>export interface Increment {
      type: ActionTypes.increment
      payload: TsDialogAction
  }</p>
  
  <p>export interface Decrement {
      type: ActionTypes.decrement
      payload: TsDialogAction
  }</p>
  
  <p>export const closeTsDialog = (id: number) => ({type: ActionTypes.closeDialog, payload: id});
  export const openTsDialog = (id: number) => ({type: ActionTypes.openDialog, payload: id});
  export const incrementAction = (id: number) => ({type: ActionTypes.increment, payload: id});
  export const decrementAction = (id: number) => ({type: ActionTypes.decrement, payload: id});</p>