I have three different item types: courses, packages and programs. I can either filter by All, or by the three Types mentioned before. How can I check the case in which ALL items are loaded, not just these three individually? I want to show a loading spinner in case the items are not loaded. Here's what I have so far:

 const [isLoading,   setIsLoading]   = React.useState<boolean>(false);

 React.useEffect(() => {
    setCourses([]);
    setPrograms([]);
    setPackages([]);

    if([DataType.Course, "all"].includes(contentType))
      Course.get(undefined, useCatalog, parent).then(async (c: Course[]) => {
        setCourses(c || []);
        setIsLoading(false)
      })
    if([DataType.Program, "all"].includes(contentType) && (!parent || parent.data_type === DataType.Package))
      Program.get(undefined, useCatalog, parent).then((p: Program[]) => {
        setPrograms(p ||[]),
        setIsLoading(false)
    });
    if([DataType.Package, "all"].includes(contentType) && !parent)
      Package.get(undefined, useCatalog).then((p: Package[]) => {
        setPackages(p || []),
        setIsLoading(false)
      });
  }, [contentType, useCatalog, parent]);