Attempt #1 - Invert Business Logic

FeaturedCompanies.js

import React, { useEffect, useState } from 'react';
import { Company } from '../../Interfaces/Interfaces.Company';

// this doesn't work with brackes for some reason: 
// const FeaturedCompanies = ({findFeaturedCompanies: () => Promise<Array<Company>>}) => {

const FeaturedCompanies = (findFeaturedCompanies: () => Promise<Array<Company>>) => {
  const [featuredCompanies, setData] = useState([]);

  useEffect(() => {
    const fetchData = async () => {
      const companies: Array<Company> = await findFeaturedCompanies();
        setData(companies);
      };

      fetchData();
    }, [featuredCompanies]);

    return (
      <span>
        <div className="padding-bottom-50">
          <div className="section-heading bold padding-top-10 font-22">New Companies</div>
          featuredCompanies && <PresentableFeaturedCompanies companies={featuredCompanies} />
        </div>
      </span>
    );
};

function PresentableFeaturedCompanies({ companies }) {
  return (<>
    <div className="margin-top-20">
      {companies.map((company) => (
        <div
          className="all-20"
          data-testid="company"
          key={`${company.name}`}>
            {company.name}
        </div>
    </div>
  </>);
}

export default ({ findFeaturedCompanies }) => FeaturedCompanies;

list.featured.companies.spec.js

import React from "react";
import { expect } from "../../test.imports";
import { findAttribute } from "../../unit/test.doubles";
import { mount } from "enzyme";
import FeaturedCompanies from "../../../../client/Compannies/FeaturedCompanies";

describe.only("Use Case: Featured Companies", () => {

  describe("Featured Companies List", () => {

    it.only("shows featured companies listed by name", async () => {
      const newCompanies = [
	{
          name: "Made Tech"
        },
        {
          name: "Pillar"
        }
      ];

      const findFeaturedCompaniesMock = async () => Promise.resolve(newCompanies);
      const _FeaturedCompanies = () => FeaturedCompanies({findFeaturedCompanies: findFeaturedCompaniesMock})(findFeaturedCompaniesMock);

      const featuredCompanies = mount(<_FeaturedCompanies />);
      // featuredCompanies.update();
      const companies = findAttribute(featuredCompanies, "company");

      expect(companies.length).to.equal(2);
    });

  });
});