How to use the react-router-dom.withRouter function in react-router-dom

})
    }

    render() {
      console.log("- Async Component: render():", Boolean(View))

      return View ?  : null

      /*
        
          
         : null*/
    }
  }

  return withRouter(AsyncComponent)
}

const Protected = ({ component: Component, path, loggedIn, exact }) => (
   (
    loggedIn ? (
      
    ) : (
      
    )
  )} />
);

const mapStateToProps = (state) => ({
  loggedIn: Boolean(state.session.currentUser)
});

export const AuthRoute = withRouter(connect(mapStateToProps)(Auth));
export const ProtectedRoute = withRouter(connect(mapStateToProps)(Protected));

import ListForm from '@/components/ListForm';

const CREATE_RESPONSIBILITY = gql`
  mutation CreateResponsibility_createResponsibilityMutation($title: String!, $needId: ID!) {
    createResponsibility(title: $title, needId: $needId) {
      nodeId
      title
      realizer {
        nodeId
        name
      }
    }
  }
`;

const CreateResponsibility = withRouter(({ match, history }) => (
   {
      cache.writeData({ data: { showCreateResponsibility: false } });
      const { need } = cache.readQuery({
        query: GET_NEED_RESPONSIBILITIES,
        variables: { needId: match.params.needId },
      });
      cache.writeQuery({
        query: GET_NEED_RESPONSIBILITIES,
        variables: { needId: match.params.needId },
        data: {
          need: {
            __typename: 'Need',
            nodeId: match.params.needId,
            fulfilledBy: need.fulfilledBy

<button disabled="{loading}">Log in</button>
          
        
      )}
    
  );
};

SignIn.propTypes = {
  history: PropTypes.object.isRequired,
  refetch: PropTypes.func.isRequired,
};

export default withRouter(SignIn);

import styled from 'styled-components';
import VisitSummary from '../components/VisitSummary';
import LineCharts from './../../charts/components/LineCharts';

const Dashboard = () => {
  return (
    <>
      
      
        <title>Monthly Stats</title>
      
    
  );
};

export const DashboardContainer = withRouter(Dashboard);

const Title = styled.h2`
  color: #313435;
  font-weight: 500;
  font-size: 1.1rem;
  margin-bottom: 1rem;
`;

};

EditProfile.propTypes = {
  createProfile: PropTypes.func.isRequired,
  getCurrentProfile: PropTypes.func.isRequired,
  profile: PropTypes.object.isRequired
};

const mapStateToProps = state => ({
  profile: state.profile
});

export default connect(
  mapStateToProps,
  { createProfile, getCurrentProfile }
)(withRouter(EditProfile));

Where in the world is the photo?
        
          
          
        
        
      
    );
  }
}

GameScreen.propTypes = {
  game: PropTypes.object
};

export default withRouter(GameScreen);

{nodes}
        
      
    
  );
};

interface Props extends RouteComponentProps {
  node?: FileTree;
  loading: boolean;
}

export const Directory = withRouter((props: Props) => {
  let files: FileTree[] = [];
  let folders: FileTree[] = [];
  if (props.node && props.node.children) {
    files = props.node.children.filter(
      n => n.type === FileTreeItemType.File || n.type === FileTreeItemType.Link
    );
    folders = props.node.children.filter(
      n => n.type === FileTreeItemType.Directory || n.type === FileTreeItemType.Submodule
    );
  }
  const { resource, org, repo, revision } = props.match.params;
  const getUrl = (pathType: PathTypes) => (path: string) =>
    `/${resource}/${org}/${repo}/${pathType}/${encodeRevisionString(revision)}/${path}`;
  const fileList = ;
  const folderList = (

text: string,
    href: string,
    brand?: boolean,
};

const NavbarLink = ({ text, href, brand }: NavbarLinkProps) => (
    
        {text}
    
);

NavbarLink.defaultProps = {
    brand: false,
};

export default withRouter(Navbar);