add page title and quick link for survey to resources index

src/components/ResourceTable.tsx

@@ -1,4 +1,4 @@
-import { type PlatformLink, type PaymentType, type AuditoryResource, type Skill, type SkillLevel, Manufacturer } from '@prisma/client';
+import { type PlatformLink, type PaymentType, type AuditoryResource, type Skill, type SkillLevel, type Manufacturer } from '@prisma/client';
 import { CurrencyDollarIcon, ArrowPathRoundedSquareIcon } from '@heroicons/react/24/solid';
 import { ClipboardDocumentListIcon } from '@heroicons/react/24/outline';
 import Image from 'next/image';

src/pages/resources/index.tsx

@@ -1,4 +1,6 @@
 import Head from "next/head";
+import { LinkIcon } from '@heroicons/react/20/solid';
+import Link from "next/link";
 import { useRouter } from "next/router";
 import ResourceTable from "~/components/ResourceTable";
 import { api } from "~/utils/api";
@@ -28,10 +30,20 @@ const Resources = () => {
         <meta name="description" content="University of Iowa Center for Auditory Training Resources" />
         <link rel="icon" href="/favicon.ico" />
       </Head>
-      <main>
-        <div className="my-6 sm:px-4 max-w-6xl mx-auto">
-          <ResourceTable query={router.query} resources={query.data} currentPage={currentPage} />
+      <main className="my-6 sm:px-4 max-w-6xl mx-auto">
+        <div className="mb-4 p-4 space-y-2">
+          <h1 className="text-3xl font-bold">All Resources</h1>
+          <div className="">
+            <p className="inline">Fill out the </p>
+            <Link href="/resources/survey"
+                  className="hover:bg-neutral-900 hover:text-white inline rounded-lg bg-neutral-200 border border-neutral-800 px-2 py-[4px]">
+              survey
+              <LinkIcon className="w-4 inline" />
+            </Link>
+            <p className="inline"> for specific resource recommendations.</p>
+          </div>
         </div>
+        <ResourceTable query={router.query} resources={query.data} currentPage={currentPage} />
       </main>
     </>
   );