Object is not a function using withRR4() on react-sidenav

Question

I'm trying to use react-sidenav and go off of https://codesandbox.io/s/q9851xoymj to build something.

When I try to use the withRR4() function as is done in that example, I get the following error when I load the page. Object(...) is not a function and it happens on the const SideNav = withRR4()

I'm using "react-sidenav": "^3.1.3"

import React from 'react';
import { connect } from 'react-redux';
import { FaTasks, FaUserCog, FaProjectDiagram } from 'react-icons/fa';
import { IoIosBusiness } from 'react-icons/io';

import '../css/Nav.css';

import { withRR4, Nav } from 'react-sidenav';
import { Link } from "./styles";
import { getCompanies, getProjects, getTasks, getUsers } from '../actions';

const mapDispatchToProps = {
     getCompanies: getCompanies,
     getProjects: getProjects,
     getTasks: getTasks,
     getUsers: getUsers,
};

const SideNav = withRR4();

let CompanyLink=({getCompanies})=>(
   <Link onClick={getCompanies}><IoIosBusiness /> Companies</Link>
)
CompanyLink = connect(null,mapDispatchToProps)(CompanyLink);

let ProjectLink=({getProjects})=>(
   <Link onClick={getProjects}><FaProjectDiagram /> Projects</Link>
)
ProjectLink = connect(null,mapDispatchToProps)(ProjectLink);

let TaskLink=({getTasks})=>(
   <Link onClick={getTasks}><FaTasks /> Tasks</Link>
)
TaskLink = connect(null,mapDispatchToProps)(TaskLink);

let UserLink=({getUsers})=>(
   <Link onClick={getUsers}><FaUserCog /> Users</Link>
)
UserLink = connect(null,mapDispatchToProps)(UserLink);

const LeftNav = () => (
  <SideNav defaultSelectedPath="company">
     <Nav id="company"><CompanyLink /></Nav>
     <Nav id="projects"><ProjectLink /></Nav>
     <Nav id="tasks"><TaskLink /></Nav>
     <Nav id="users"><UserLink /></Nav>
   </SideNav>
)

export default LeftNav;

I'm not sure what I'm missing here.

score 0 · Accepted Answer · answered Dec 20 '18 at 19:20

0

Try it with different version: "react-sidenav": "3.0.9"

If you upgrade the version above this the example will not work either.

answered Dec 20 '18 at 19:20

Peter Ambruzs

7,763
3
30
36

Thanks! Seems to have solved it. I had tried going down to 3.1.1 and that didn't work. Should have just went down a few more versions :) – Chris Dec 20 '18 at 19:54

score 0 · Answer 2 · answered Apr 11 '19 at 16:19

0

No need to downgrade, try this:

import { withRR4 } from "react-sidenav/withRR4";

answered Apr 11 '19 at 16:19

Aloysius Paredes

61
1
6

Object is not a function using withRR4() on react-sidenav

2 Answers2