1import React, { useState } from 'react';
2 
3export default function PricingCard() {
4  const [isYearly, setIsYearly] = useState(false);
5  
6  return (
7    <div className="pricing-card">
8      <h3>Pro Plan</h3>
9      <p className="price">
10        ${isYearly ? '99' : '12'} 
11        <span className="duration">
12          /{isYearly ? 'year' : 'month'}
13        </span>
14      </p>
15      
16      <button onClick={() => setIsYearly(!isYearly)}>
17        Toggle Billing
18      </button>
19      
20      <ul className="features">
21        <li>Unlimited Projects</li>
22        <li>Priority Support</li>
23      </ul>
24    </div>
25  );
26}