dev #1

Merged
RizqiSyahrendra merged 3 commits from dev into main 2025-02-21 09:52:03 +00:00
3 changed files with 10 additions and 5 deletions
Showing only changes of commit 8e0018c185 - Show all commits

View File

@ -2,6 +2,7 @@ import type { ElementType } from "react";
import Link from "next/link";
import React from "react";
import { CgSpinner } from "react-icons/cg";
export type Props = {
appearance?: "default" | "primary" | "secondary";
@ -12,6 +13,7 @@ export type Props = {
label?: string;
newTab?: boolean | null;
onClick?: () => void;
isLoading?: boolean;
};
export const Button: React.FC<Props> = ({
@ -21,6 +23,7 @@ export const Button: React.FC<Props> = ({
href,
label,
newTab,
isLoading,
}) => {
const newTabProps = newTab ? { rel: "noopener noreferrer", target: "_blank" } : {};
const Element: ElementType = el;
@ -35,19 +38,21 @@ export const Button: React.FC<Props> = ({
const content = (
<div className="btn btn-mod btn-color btn-large btn-full btn-circle btn-hover-anim">
<span>{label}</span>
<span className="flex flex-row">
{label} {isLoading && <CgSpinner color="var(--ext-color-primary-1)" className="animate-spin ml-2" size={24} />}
</span>
</div>
);
return (
<Element {...elementProps}>
<Element {...elementProps} {...{ disabled: isLoading }}>
<React.Fragment>
{(el === "link" || el === "a") && (
<Link {...newTabProps} href={href || ""}>
{content}
</Link>
)}
{el === "button" && content}
{el === "button" && <>{content}</>}
</React.Fragment>
</Element>
);

View File

@ -76,7 +76,7 @@ export const FormBlock: React.FC<
// delay loading indicator by 1s
loadingTimerID = setTimeout(() => {
setIsLoading(true);
}, 1000);
}, 250);
try {
const req = await fetch(`${process.env.NEXT_PUBLIC_PAYLOAD_URL}/api/form-submissions`, {
@ -160,7 +160,7 @@ export const FormBlock: React.FC<
return null;
})}
</div>
<Button appearance="primary" el="button" form={formID} label={submitButtonLabel} />
<Button appearance="primary" el="button" form={formID} label={submitButtonLabel} isLoading={isLoading} />
</form>
)}
</div>