tsirlucas

/**
 * In this short assessment, the following code tries to implement the React Suspense API,
 * but does so incorrectly. There are 3 core issues with how these components utilize Suspense and concurrent mode -- can you find them?
 * 
 * In your submission, be sure to:
 * 1) Clearly identify what the 3 core issues are, and how they violate the principles of React Suspense;
 * 2) Write and submit the code to fix the core issues you have identified in a gist of your own
 * 
 * If you aren't familiar with Suspense, the docs are a good starting place:
 * 

tsirlucas

import React from 'preact';

import Redirect from 'react-router/Redirect';

export const checkAuth = (Route, isPrivate) => {
  const isAuthenticated = false;

  if (isAuthenticated) {
    // If route is private, user proceeds, else route is public, redirect user to private root.
    return isPrivate

tsirlucas

import React from 'React';
import Route from 'react-router/Route';

import { checkAuth } from './auth';

const render = (route) => route.childRoutes ? renderChildren(route.childRoutes) : null;

const checkLayout = (route) => {
  const Layout = route.layout;

tsirlucas

export const shallowEqual = (a, b) => {
	for (let key in a) if (a[key] !== b[key]) return false;
	for (let key in b) if (!(key in a)) return false;
	return true;
};

const pure = () => (Component) =>
	class PureComponent extends Component {
		shouldComponentUpdate(props, state) {
			return !(shallowEqual(props, this.props) && shallowEqual(state, this.state));