mirror of
https://github.com/vercel/next-learn.git
synced 2026-07-07 14:09:06 +00:00
* Update next to canary * Update layout.tsx * Use canary * Remove serverActions flag warning * Use unstable_noStore * Add Date.now() test * Update metadataBase url * Create wrapper component for Cards * Update page.tsx * Misc * Delete unused data fetch * Add noStore to /invoices and /customers functions * Remove date.now() * Use canary * Rename component * Fix imports * Update types for useFormStatus and useFormState * Rename folder, add team members * fixed images and added login button pending state * Update dashboard/final-example/app/lib/data.ts Co-authored-by: Matt Kane <m@mk.gg> --------- Co-authored-by: Steven Tey <stevensteel97@gmail.com> Co-authored-by: Matt Kane <m@mk.gg>
39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
import { PencilIcon, PlusIcon, TrashIcon } from '@heroicons/react/24/outline';
|
|
import Link from 'next/link';
|
|
import { deleteInvoice } from '@/app/lib/actions';
|
|
|
|
export function CreateInvoice() {
|
|
return (
|
|
<Link
|
|
href="/dashboard/invoices/create"
|
|
className="flex h-10 items-center rounded-lg bg-blue-600 px-4 text-sm font-medium text-white transition-colors hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
|
|
>
|
|
<span className="hidden md:block">Create Invoice</span>{' '}
|
|
<PlusIcon className="h-5 md:ml-4" />
|
|
</Link>
|
|
);
|
|
}
|
|
|
|
export function UpdateInvoice({ id }: { id: string }) {
|
|
return (
|
|
<Link
|
|
href={`/dashboard/invoices/${id}/edit`}
|
|
className="rounded-md border p-2 hover:bg-gray-100"
|
|
>
|
|
<PencilIcon className="w-5" />
|
|
</Link>
|
|
);
|
|
}
|
|
|
|
export function DeleteInvoice({ id }: { id: string }) {
|
|
return (
|
|
<form action={deleteInvoice}>
|
|
<input type="hidden" name="id" value={id} />
|
|
<button className="rounded-md border p-2 hover:bg-gray-100">
|
|
<span className="sr-only">Delete</span>
|
|
<TrashIcon className="w-5" />
|
|
</button>
|
|
</form>
|
|
);
|
|
}
|