brandon/uiowaATR
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

add admin bar with create button

Browse Source
This commit is contained in:
Brandon Egger 2023-08-30 21:48:04 -05:00
parent 13a8b2dbe8
commit 2e2f99e0ec
1 changed files with 51 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
src/pages/resources/index.tsx
View File

@ -1,5 +1,5 @@
import { LinkIcon } from "@heroicons/react/20/solid";
import { PrinterIcon } from "@heroicons/react/24/solid";
import { PrinterIcon, PlusCircleIcon } from "@heroicons/react/24/solid";
import Link from "next/link";
import { useRouter } from "next/router";
import ResourceTable from "~/components/ResourceTable";
@ -8,6 +8,42 @@ import { parseQueryData } from "~/utils/parseSearchForm";
import { HeaderFooterLayout } from "~/layouts/HeaderFooterLayout";
import { type AuditoryResource } from "@prisma/client";
import { QueryWaitWrapper } from "~/components/LoadingWrapper";
import { AdminBarLayout } from "~/components/admin/ControlBar";
import { AdminActionLink } from "~/components/admin/common";
const PageHeader = ({ printLink }: { printLink: string }) => {
return (
<div className="mb-2 flex flex-row justify-between p-2 print:hidden sm:mb-4 sm:p-4">
<section className="space-y-2">
<h1 className="text-3xl font-bold">All Resources</h1>
<div className="">
<p className="inline">Fill out the </p>
<Link
href="/resources/search"
className="inline rounded-lg border border-neutral-800 bg-neutral-200 px-2 py-[4px] hover:bg-neutral-900 hover:text-white"
>
search form
<LinkIcon className="inline w-4" />
</Link>
<p className="inline">
{" "}
for a list of auditory training resource recommendations.
</p>
</div>
</section>
<section className="mt-auto">
<Link
href={printLink}
className="inline-block whitespace-nowrap rounded-md border border-neutral-900 bg-yellow-200 px-4 py-2 align-middle font-semibold shadow shadow-black/50 duration-200 ease-out hover:bg-yellow-300 hover:shadow-md print:hidden sm:space-x-2"
>
<span className="hidden sm:inline-block">Print Results</span>
<PrinterIcon className="inline-block w-6" />
</Link>
</section>
</div>
);
};
const Resources = () => {
const router = useRouter();
@ -49,39 +85,22 @@ const Resources = () => {
return (
<HeaderFooterLayout>
<div className="mx-auto mb-12 mt-6 w-full max-w-6xl md:px-2">
<div className="mb-2 flex flex-row justify-between p-2 print:hidden sm:mb-4 sm:p-4">
<section className="space-y-2">
<h1 className="text-3xl font-bold">All Resources</h1>
<div className="">
<p className="inline">Fill out the </p>
<Link
href="/resources/search"
className="inline rounded-lg border border-neutral-800 bg-neutral-200 px-2 py-[4px] hover:bg-neutral-900 hover:text-white"
>
search form
<LinkIcon className="inline w-4" />
</Link>
<p className="inline">
{" "}
for a list of auditory training resource recommendations.
</p>
</div>
</section>
<AdminBarLayout
actions={[
<AdminActionLink
key="cancel"
symbol={<PlusCircleIcon className="w-4" />}
label="Create New"
href={`/resources/create`}
/>,
]}
>
<div className="mx-auto mb-12 mt-6 w-full max-w-6xl md:px-2">
<PageHeader printLink={printLink} />
<section className="mt-auto">
<Link
href={printLink}
className="inline-block whitespace-nowrap rounded-md border border-neutral-900 bg-yellow-200 px-4 py-2 align-middle font-semibold shadow shadow-black/50 duration-200 ease-out hover:bg-yellow-300 hover:shadow-md print:hidden sm:space-x-2"
>
<span className="hidden sm:inline-block">Print Results</span>
<PrinterIcon className="inline-block w-6" />
</Link>
</section>
<QueryWaitWrapper query={resourceQuery} Render={ConditionalTable} />
</div>
<QueryWaitWrapper query={resourceQuery} Render={ConditionalTable} />
</div>
</AdminBarLayout>
</HeaderFooterLayout>
);
};