update pay function

src/components/Button2/index.tsx

@@ -0,0 +1,53 @@
+import React from "react";
+import Link, { LinkProps } from "next/link";
+
+type CommonProps = {
+    className?: string;
+    children?: React.ReactNode;
+    isPrimary?: boolean;
+    isSecondary?: boolean;
+};
+
+type ButtonAsButton = {
+    as?: "button";
+} & React.ButtonHTMLAttributes<HTMLButtonElement>;
+
+type ButtonAsAnchor = {
+    as: "a";
+} & React.AnchorHTMLAttributes<HTMLAnchorElement>;
+
+type ButtonAsLink = {
+    as: "link";
+} & LinkProps;
+
+type ButtonProps = CommonProps &
+    (ButtonAsButton | ButtonAsAnchor | ButtonAsLink);
+
+const Button: React.FC<ButtonProps> = ({
+    className,
+    children,
+    isPrimary,
+    isSecondary,
+    as = "button",
+    ...props
+}) => {
+    const isLink = as === "link";
+    const Component: React.ElementType = isLink ? Link : as;
+
+    return (
+        <Component
+            className={`relative inline-flex justify-center items-center h-10 px-3.5 rounded-lg text-title-5 cursor-pointer transition-all ${
+                isPrimary ? "bg-white text-black hover:bg-white/90" : ""
+            } ${
+                isSecondary
+                    ? "shadow-[0.0625rem_0.0625rem_0.0625rem_0_rgba(255,255,255,0.10)_inset] text-white after:absolute after:inset-0 after:border after:border-line after:rounded-lg after:pointer-events-none after:transition-colors hover:after:border-white"
+                    : ""
+            }  ${className || ""}`}
+            {...(isLink ? (props as LinkProps) : props)}
+        >
+            {children}
+        </Component>
+    );
+};
+
+export default Button;