Add statuses for export page

csm_web/frontend/src/components/data_export/DataExport.tsx

@@ -1,10 +1,22 @@
 import React, { useState } from "react";
+import { useProfiles } from "../../utils/queries/base";
+import { Role } from "../../utils/types";
+import LoadingSpinner from "../LoadingSpinner";
 import { ExportType } from "./DataExportTypes";
 import { ExportPage } from "./ExportPage";
 import { ExportSelector } from "./ExportSelector";
 
 export const DataExport = () => {
   const [dataExportType, setDataExportType] = useState<ExportType | null>(null);
+  const { data: profiles, isSuccess: profilesLoaded, isError: profilesError } = useProfiles();
+
+  if (profilesError) {
+    return <b>Error loading user profiles.</b>;
+  } else if (!profilesLoaded) {
+    return <LoadingSpinner className="spinner-centered" />;
+  } else if (profilesLoaded && !profiles.some(profile => profile.role === Role.COORDINATOR)) {
+    return <b>Permission denied; you are not a coordinator for any course.</b>;
+  }
 
   return (
     <div className="data-export-container">