feat: add loading indicator to submit buttons

This commit is contained in:
trafficlunar 2025-04-23 18:38:21 +01:00
parent 99c3aa5add
commit e1d248853f
7 changed files with 53 additions and 33 deletions

View file

@ -4,6 +4,7 @@ import { useEffect, useState } from "react";
import { createPortal } from "react-dom";
import { Icon } from "@iconify/react";
import { redirect } from "next/navigation";
import SubmitButton from "../submit-button";
export default function DeleteAccount() {
const [isOpen, setIsOpen] = useState(false);
@ -11,7 +12,7 @@ export default function DeleteAccount() {
const [error, setError] = useState<string | undefined>(undefined);
const submit = async () => {
const handleSubmit = async () => {
const response = await fetch("/api/auth/delete", { method: "DELETE" });
if (!response.ok) {
const { error } = await response.json();
@ -78,9 +79,7 @@ export default function DeleteAccount() {
<button onClick={close} className="pill button">
Cancel
</button>
<button onClick={submit} className="pill button !bg-red-400 !border-red-500 hover:!bg-red-500">
Delete
</button>
<SubmitButton onClick={handleSubmit} text="Delete" className="!bg-red-400 !border-red-500 hover:!bg-red-500" />
</div>
</div>
</div>,

View file

@ -3,6 +3,7 @@
import { useEffect, useState } from "react";
import { createPortal } from "react-dom";
import { Icon } from "@iconify/react";
import SubmitButton from "../submit-button";
interface Props {
title: string;
@ -71,9 +72,7 @@ export default function SubmitDialogButton({ title, description, onSubmit, error
<button onClick={close} className="pill button">
Cancel
</button>
<button onClick={submit} className="pill button">
Submit
</button>
<SubmitButton onClick={submit} />
</div>
</div>
</div>,