diff --git a/webapp/src/theme.ts b/webapp/src/theme.tsx
similarity index 62%
rename from webapp/src/theme.ts
rename to webapp/src/theme.tsx
index da52ab6..4b249cd 100644
--- a/webapp/src/theme.ts
+++ b/webapp/src/theme.tsx
@@ -1,7 +1,9 @@
 'use client';
 
 import { Roboto } from 'next/font/google';
+import NextLink from 'next/link';
 import { createTheme } from '@mui/material/styles';
+import { ForwardedRef, forwardRef } from 'react';
 
 const roboto = Roboto({
   display: 'swap',
@@ -9,6 +11,13 @@ const roboto = Roboto({
   weight: ['300', '400', '500', '700'],
 });
 
+const LinkBehaviour = forwardRef(function LinkBehaviour(
+  props: { href: string },
+  ref: ForwardedRef<HTMLAnchorElement>,
+) {
+  return <NextLink ref={ref} {...props} />;
+});
+
 const theme = createTheme({
   components: {
     MuiBreadcrumbs: {
@@ -19,6 +28,11 @@ const theme = createTheme({
         }),
       },
     },
+    MuiButton: {
+      defaultProps: {
+        LinkComponent: LinkBehaviour,
+      },
+    },
     MuiLinearProgress: {
       styleOverrides: {
         root: () => ({
@@ -29,6 +43,11 @@ const theme = createTheme({
         }),
       },
     },
+    MuiLink: {
+      defaultProps: {
+        component: LinkBehaviour,
+      },
+    },
   },
 
   typography: {