Loading spinner

app/src/components/data/TemperaturePerSector/index.tsx

@@ -5,7 +5,7 @@ import { TableHeader as Header, TdGroup } from "../shared";
 import * as classes from "../tables.module.css";
 
 const TemperaturePerSector: FC = () => {
-  const [data, setData] = useState<Summary[]>([]);
+  const [data, setData] = useState<Summary[] | null>(null);
 
   useEffect(() => {
     generalTable("", "", "").then((res) => {
@@ -29,10 +29,19 @@ const TemperaturePerSector: FC = () => {
   ));
 
   return (
-    <table className={classes.table}>
-      <Header daysToMatchCurrentTemperature={false} />
-      <tbody>{rows}</tbody>
-    </table>
+    <>
+      <table className={classes.table}>
+        <Header daysToMatchCurrentTemperature={false} />
+        <tbody>{data && rows}</tbody>
+      </table>
+      {!data && (
+        <div className="d-flex py-3 justify-content-center">
+          <div className="spinner-border" role="status">
+            <span className="visually-hidden">Loading...</span>
+          </div>
+        </div>
+      )}
+    </>
   );
 };
 export default TemperaturePerSector;