diff --git a/dashboard/starter-example/app/page.tsx b/dashboard/starter-example/app/page.tsx
index 7b2739c..4aab0a2 100644
--- a/dashboard/starter-example/app/page.tsx
+++ b/dashboard/starter-example/app/page.tsx
@@ -1,12 +1,12 @@
 import AcmeLogo from '@/app/ui/acme-logo';
-
+import Link from 'next/link';
 export default function Page() {
   return (
     <main className="flex min-h-screen flex-col p-6">
       <div className="flex h-20 shrink-0 items-end rounded-lg bg-blue-500 p-4 md:h-52">
         {/* <AcmeLogo /> */}
       </div>
-      <div className="gr ow mt-4 flex flex-col gap-4 md:flex-row">
+      <div className="mt-4 flex grow flex-col gap-4 md:flex-row">
         <div className="flex flex-col justify-center gap-6 rounded-lg bg-gray-50 px-6 py-10 md:w-2/5 md:px-20">
           <p className={`text-xl text-gray-800 md:text-3xl md:leading-normal`}>
             <strong>Welcome to Acme.</strong> This is the example for the{' '}
@@ -15,12 +15,12 @@ export default function Page() {
             </a>
             , brought to you by Vercel.
           </p>
-          <a
+          <Link
             href="/login"
             className="flex items-center gap-5 self-start rounded-lg bg-blue-500 px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-blue-400 md:text-base"
           >
             <span>Log in</span>
-          </a>
+          </Link>
         </div>
         <div className="flex items-center justify-center p-6 md:w-3/5 md:px-28 md:py-12">
           {/* Add Hero Images Here */}