aloknecessary

//Author: Alok Ranjan Daftuar
// App.js
//
import React from 'react';
import List from './components/List';
import WithLoading from './components/withLoading.js';
//
const ListWithLoading = WithLoading(List);

class App extends React.Component {

aloknecessary

// withStyle.js
//Author: Alok Ranjan Daftuar
//
const withStyle = (BaseComponent) => (props) =>
  <BaseComponent {...props} style={{ fontWeight: 700, color: "blue" }} />;

  export default withStyle;

aloknecessary

// withAuth.js
//Author: Alok Ranjan Daftuar
//
import React from "react";
export function withAuth(Component) {
  return class AuthenticatedComponent extends React.Component {
    isAuthenticated() {
      return this.props.isAuthenticated;
    }

aloknecessary

// SayHelloComponent.js
//Author: Alok Ranjan Daftuar
//
const SayHelloComponent = ({ name, ...otherProps }) => (
  <div {...otherProps}>Hello {name}!</div>
);

export default SayHelloComponent;

aloknecessary

// PrivateComponent.jsx
// Author: Alok Ranjan Daftuar
//
import React from "react";
import { withAuth } from "./withAuth.js";

export class PrivateComponent extends React.Component {
  render() {
    return <div>Accessible only to authenticated users.</div>;
  }

aloknecessary

//withLoading.js
//Author: Alok Ranjan Daftuar
//
import React from 'react';
function WithLoading(Component) {
  return function WihLoadingComponent({ isLoading, ...props }) {
    if (!isLoading) return <Component {...props} />;
    return <p>Hold on, fetching data might take some time.</p>;
  };
}

aloknecessary

//List.js
//Author: Alok Ranjan Daftuar
//
import React from "react";
//
const List = (props) => {
  const { repos } = props;
  if (!repos) return null;
  if (!repos.length) return <p>No repos, sorry</p>;
  return (