01Clarian

import React,{createContext, useState, useEffect} from 'react'
import shop from '../api/shop'

export const ProductsContext = createContext({
    test: '',
    products: []
})

const ProductsProvider = ({children}) => {
    const [test] = useState('the products provider has been successfully connected :)')

01Clarian

import React,{useContext} from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { addToCart } from '../actions'
import { getVisibleProducts } from '../reducers/products'
import ProductItem from '../components/ProductItem'
import ProductsList from '../components/ProductsList'
import {ProductsContext} from '../provider/products.provider'

const ProductsContainer = ({ products, addToCart }) => {

01Clarian

import React from 'react'
import { render } from 'react-dom'
import { createStore, applyMiddleware } from 'redux'
import { Provider } from 'react-redux'
import { createLogger } from 'redux-logger'
import thunk from 'redux-thunk'
import reducer from './reducers'
import { getAllProducts } from './actions'
import App from './containers/App'
import ProductsProvider from './provider/products.provider'

01Clarian

import React,{createContext, useState} from 'react'

export const ProductsContext = createContext({
    test: ''
})

const ProductsProvider = ({children}) => {
    const [test] = useState('the products provider has been successfully connected :)')
    return (
        <ProductsContext.Provider value={{test}}>

01Clarian

import React from 'react';
import EnhanceComponent from './EnhanceComponent'

const HoverCounter = (props)  => {
        return (
            <h2 onMouseOver={props.increment}>
                {props.count}</h2>
        );
}
export default EnhanceComponent(HoverCounter);

01Clarian

import React from 'react';
import EnhanceComponent from './EnhanceComponent';

const ClickCounter = (props) => {

        return (
        <button onClick={props.increment}>
            {props.count}</button>
        );
}

01Clarian

import React from 'react'

const EnhanceComponent = (OrignComponent) => {    

    class ModComponent extends React.Component {
        constructor() {
            super()
            this.state = {
                count: 0
            }

01Clarian

import React from 'react'

const EnhanceComponent = (OrignComponent) => {    

    class ModComponent extends React.Component {
        constructor() {
            super()
            this.state = {
                count: 0
            }

01Clarian

import React from 'react';

class HoverCounter extends React.Component {
        constructor() {
                super()
                this.state = {
                    count: 0
                }
            }
        increment = () => {

01Clarian

import React from 'react';

class HoverCounter extends React.Component {
        constructor() {
                super()
                this.state = {
                    count: 0
                }
            }
        increment = () => {