Merge remote-tracking branch 'origin/v3.4' into dev

interface/src/components/loading/LoadingSpinner.tsx

@@ -0,0 +1,24 @@
+import { FC } from 'react';
+
+import { CircularProgress, Box, Typography, Theme } from '@mui/material';
+
+interface LoadingSpinnerProps {
+  height?: number | string;
+}
+
+const LoadingSpinner: FC<LoadingSpinnerProps> = ({ height = '100%' }) => (
+  <Box display="flex" alignItems="center" justifyContent="center" flexDirection="column" padding={2} height={height}>
+    <CircularProgress
+      sx={(theme: Theme) => ({
+        margin: theme.spacing(4),
+        color: theme.palette.text.secondary
+      })}
+      size={100}
+    />
+    <Typography variant="h4" color="textSecondary">
+      Loading&hellip;
+    </Typography>
+  </Box>
+);
+
+export default LoadingSpinner;