save

cypress/support/component.ts

@@ -19,7 +19,7 @@ import './commands'
 // Alternatively you can use CommonJS syntax:
 // require('./commands')
 
-import { mount } from 'cypress/react18'
+import { mount } from 'cypress/react'
 
 // Augment the Cypress namespace to include type definitions for
 // your custom command.

drizzle.config.ts

@@ -3,4 +3,5 @@ import type { Config } from "drizzle-kit";
 export default {
   schema: "./src/app/db/schema/*",
   out: "./src/app/db/migrations",
+  dialect: "postgresql",
 } satisfies Config;

src/app/components/Navbar.tsx

@@ -108,7 +108,7 @@ function Nav({ userImage }: { userImage: string }) {
         >
           {(ref) => (
             <div className="md:hidden" id="mobile-menu">
-              <div ref={ref} className="px-2 pt-2 pb-3 space-y-1 sm:px-3">
+              <div ref={ref as React.MutableRefObject<HTMLDivElement | null>} className="px-2 pt-2 pb-3 space-y-1 sm:px-3">
                 <a
                   href="/home"
                   className="hover:bg-hoverblue text-white block px-3 py-2 rounded-md text-base font-medium"

src/app/components/portfolio/summary/SelectComparisonModal.tsx

@@ -1,4 +1,4 @@
-import { Dialog, Transition } from "@headlessui/react";
+import { Dialog, DialogBackdrop, DialogPanel, DialogTitle, Transition, TransitionChild } from "@headlessui/react";
 import { Fragment, useState } from "react";
 
 const SelectComparisonModal = ({
@@ -38,7 +38,7 @@ const SelectComparisonModal = ({
             leaveFrom="opacity-100"
             leaveTo="opacity-0"
           >
-            <Dialog.Overlay className="fixed inset-0 bg-black opacity-30" />
+            <DialogBackdrop className="fixed inset-0 bg-black/30" />
           </Transition.Child>
 
           {/* This element is to trick the browser into centering the modal contents. */}