cjoecker

import React from 'react';
import {useDispatch, useSelector} from "react-redux";
import {getFunFact} from "../services/FunFact_Actions";

function FunFact() {

    const dispatch = useDispatch();
    const {counterNumber} = useSelector(state => state.Counter);
    const {funFact} = useSelector(state => state.FunFact);

cjoecker

import React from 'react';
import './App.css';
import Counter from "./components/Counter";
import FunFact from "./components/FunFact";

function App() {
    return (
        <div>
            <Counter/>
            <br/>

cjoecker

import {Action, applyMiddleware, combineReducers, compose, createStore,} from "redux";
import thunk, {ThunkMiddleware} from "redux-thunk";
import {Counter_Reducer, CounterState} from "./Counter_Reducer";
import {FunFact_Reducer, FunFactState} from "./FunFact_Reducer";


const rootReducer = combineReducers({
    Counter: Counter_Reducer,
    FunFact: FunFact_Reducer
});

cjoecker

import React from 'react';
import {useDispatch, useSelector} from "react-redux";
import {CounterActionTypes} from "../services/Counter_Actions";

function Counter() {

    const dispatch = useDispatch();
    const {counterNumber} = useSelector(state => state.Counter);

    return (

cjoecker

import {Reducer} from "redux";
import {DispatchAction} from "./store";
import {CounterActionTypes} from "./Counter_Actions";

export class CounterState {
    counterNumber: number = 0;
}

export const Counter_Reducer: Reducer<CounterState, DispatchAction> = (state = new CounterState(), action) => {
    switch (action.type) {

cjoecker

export enum CounterActionTypes {
	SumCounter = "SumCounter",
	SubtractCounter = "SubtractCounter",
}