Meteor and react map returing undefined, I know the data is there but it loads, despite waiting for isLoading

Question

I have the following code that passing leadsBuilder props to lead in the LeadBuilderSingle componenet. It has an array in a object and I access that array and try to map over it but it returns undefined. The data is being waited on and I am using isLoading, so I am not sure what is causing this error. It loads on first loading, but on page refresh gives me undefined.

import React, { useState, useEffect } from "react";
import Dasboard from "./Dashboard";
import { Container } from "../styles/Main";
import { LeadsBuilderCollection } from "../../api/LeadsCollection";
import { LeadBuilderSingle } from "../leads/LeadBuilderSingle";
import { useTracker } from "meteor/react-meteor-data";

const LeadCategoriesAdd = ({ params }) => {
  const { leadsBuilder, isLoading } = useTracker(() => {
    const noDataAvailable = { leadsBuilder: [] };

    if (!Meteor.user()) {
      return noDataAvailable;
    }

    const handler = Meteor.subscribe("leadsBuilder");

    if (!handler.ready()) {
      return { ...noDataAvailable, isLoading: true };
    }

    const leadsBuilder = LeadsBuilderCollection.findOne({ _id: params._id });
    return { leadsBuilder };
  });

  return (
    <Container>
      <Dasboard />
      <main className="">
        {isLoading ? (
          <div className="loading">loading...</div>
        ) : (
          <>
            <LeadBuilderSingle key={params._id} lead={leadsBuilder} />
          </>
        )}
      </main>
    </Container>
  );
};

export default LeadCategoriesAdd;

import React from "react";

export const LeadBuilderSingle = ({ lead, onDeleteClick }) => {
  console.log(lead);

  return (
    <>
      <li>{lead.type}</li>
      {lead.inputs.map((input, i) => {
        return <p key={i}>{input.inputType}</p>;
      })}
    </>
  );
};

FlowRouter.route("/leadCategories/:_id", {
  name: "leadeBuilder",
  action(params) {
    mount(App, {
      content: <LeadCategoriesAdd params={params} />,
    });
  },
});

Answer 1

try this :

lead.inputs && lead.inputs.map ((input, i) => {...}