fix: enable yearly team pricing (#1199)

## Description

**Pending testing on preview**

Enable yearly team pricing during checkout.

## Changes Made

- Enable selecting yearly team pricing during checkout
- Update pricing on marketing to $480 for yearly team plan

## Testing Performed

- Stripe simulations

Pending manual testing


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **New Features**
- Updated the savings message in the pricing table to reflect new
savings amounts.
  - Adjusted yearly pricing from $500 to $480.
  - Modified user addition costs based on subscription periods.

- **Improvements**
- Simplified button text in the Create Team Checkout Dialog to
consistently display "Checkout".

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

apps/marketing/src/components/(marketing)/pricing-table.tsx

@@ -58,7 +58,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
           >
             Yearly
             <div className="bg-muted text-foreground block rounded-full px-2 py-0.5 text-xs">
-              Save $60 or $100
+              Save $60 or $120
             </div>
             {period === 'YEARLY' && (
               <motion.div
@@ -143,7 +143,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
           <div className="text-primary mt-2.5 text-xl font-medium">
             <AnimatePresence mode="wait">
               {period === 'MONTHLY' && <motion.div layoutId="pricingTeams">$50</motion.div>}
-              {period === 'YEARLY' && <motion.div layoutId="pricingTeams">$500</motion.div>}
+              {period === 'YEARLY' && <motion.div layoutId="pricingTeams">$480</motion.div>}
             </AnimatePresence>
           </div>
 
@@ -166,7 +166,9 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
             <p className="text-foreground py-4">Email and Discord Support</p>
             <p className="text-foreground py-4 font-medium">Team Inbox</p>
             <p className="text-foreground py-4">5 Users Included</p>
-            <p className="text-foreground py-4">Add More Users for $10/ mo.</p>
+            <p className="text-foreground py-4">
+              Add More Users for {period === 'MONTHLY' ? '$10/ mo.' : '$96/ yr.'}
+            </p>
           </div>
         </div>
       </div>

apps/web/src/components/(teams)/dialogs/create-team-checkout-dialog.tsx

@@ -158,7 +158,6 @@ export const CreateTeamCheckoutDialog = ({
 
               <Button
                 type="submit"
-                disabled={selectedPrice.interval === 'yearly'}
                 loading={isCreatingCheckout}
                 onClick={async () =>
                   createCheckout({
@@ -167,7 +166,7 @@ export const CreateTeamCheckoutDialog = ({
                   })
                 }
               >
-                {selectedPrice.interval === 'monthly' ? 'Checkout' : 'Coming soon'}
+                Checkout
               </Button>
             </DialogFooter>
           </div>