diff --git a/src/components/PricingTable.tsx b/src/components/PricingTable.tsx
index 06e47f5..4354ae8 100644
--- a/src/components/PricingTable.tsx
+++ b/src/components/PricingTable.tsx
@@ -2,13 +2,17 @@
 
 import {Elements} from "@stripe/react-stripe-js";
 import {loadStripe} from "@stripe/stripe-js";
+import {useEffect} from "react";
 
 const stripePromise = loadStripe("pk_test_51NzD5xFI67mXFum2XDMXiLu89SbCAMY5O0RnKjlU6XqyfboRVvFHI3f5OJHaxsrjjB7WqDYqN7Y3eF8mq3sF354F00l30L5GuJ");
 
 export default function PricingTable() {
+	useEffect(() => {
+		console.log(process.env.NEXT_PUBLIC_STRIPE_PRICING_TABLE, process.env.NEXT_PUBLIC_STRIPE_KEY);
+	}, []);
+
 	return (
 		<Elements stripe={stripePromise}>
-			{/** @ts-ignore */}
 			<stripe-pricing-table
 				id="pricing"
 				pricing-table-id={process.env.NEXT_PUBLIC_STRIPE_PRICING_TABLE}
@@ -17,3 +21,12 @@ export default function PricingTable() {
 		</Elements>
 	);
 }
+
+// If using TypeScript, add the following snippet to your file as well.
+declare global {
+	namespace JSX {
+		interface IntrinsicElements {
+			"stripe-pricing-table": React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+		}
+	}
+}