Files
next-learn/dashboard/final-example/app/ui/invoices/buttons.tsx
Delba de Oliveira 9044c85918 Fix broken images, remove unused assets, update types, polish (#224)
* 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>
2023-10-26 09:31:48 -06:00

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>
);
}