Fix bug resulting in incorrect img src URLs in production

src/components/CustomToast.tsx

@@ -8,6 +8,15 @@ interface Props {
   variant?: ToastProps["bg"];
 }
 
+// Get an explicit reference to the globally-injected public base path.
+//
+// Note: This is to work around the fact that vite does not seem to automatically prepend the base path to
+//       `<img src="..."/>` paths, which breaks those paths when deployed to a subdirectory (of a domain).
+//
+// Reference: https://vitejs.dev/guide/build.html#public-base-path
+//
+const BASE_URL = import.meta.env.BASE_URL;
+
 const CustomToast = ({
   onClose,
   isVisible,
@@ -19,7 +28,7 @@ const CustomToast = ({
     <Toast onClose={onClose} show={isVisible} autohide bg={variant}>
       <Toast.Header>
         <img
-          src={"/logo-512x512.png"}
+          src={`${BASE_URL}/logo-512x512.png`}
           className={"rounded me-2"}
           style={{ height: 16, width: 16 }}
           alt={"Monocle logo"}