query grade distributions working, and filtering by semesters working

src/views/components/common/Button/Button.tsx

@@ -27,7 +27,7 @@ export function Button({
     return (
         <button
             style={style}
-            data-testId={testId}
+            data-testid={testId}
             className={classNames(styles.button, className, styles[type ?? 'primary'], {
                 [styles.disabled]: disabled,
             })}

src/views/components/common/Spinner/Spinner.tsx

@@ -12,5 +12,5 @@ type Props = {
  * A simple spinner component that can be used to indicate loading.
  */
 export default function Spinner({ className, testId, style }: Props) {
-    return <div data-testId={testId} style={style} className={classNames(styles.spinner, className)} />;
+    return <div data-testid={testId} style={style} className={classNames(styles.spinner, className)} />;
 }