chore: update yarn.lock and enhance animated gradient background

- Updated yarn.lock to reflect changes in package versions and workspace references.
- Refactored fetch-price-details.ts to create a unique cache key based on Stripe price IDs.
- Introduced AnimatedGradientBackgroundWrapper component to manage scale based on onboarding progress.
- Enhanced AnimatedGradientBackground with improved shader effects and removed unused mouse influence logic.
- Adjusted layout components to integrate the new animated background and improve user experience during onboarding.

Author: claudfuen

apps/app/src/actions/stripe/fetch-price-details.ts

@@ -22,7 +22,12 @@ export type CachedPrices = {
 const CACHE_DURATION = 30 * 60; // 30 minutes in seconds
 
 export async function fetchStripePriceDetails(): Promise<CachedPrices> {
-  const cacheKey = 'stripe:managed-prices';
+  // Fetch from Stripe
+  const monthlyPriceId = env.NEXT_PUBLIC_STRIPE_SUBSCRIPTION_MANAGED_MONTHLY_PRICE_ID;
+  const yearlyPriceId = env.NEXT_PUBLIC_STRIPE_SUBSCRIPTION_MANAGED_YEARLY_PRICE_ID;
+
+  // Create a unique cache key that includes the price IDs
+  const cacheKey = `stripe:managed-prices:${monthlyPriceId || 'none'}:${yearlyPriceId || 'none'}`;
 
   try {
     // Check cache first
@@ -34,10 +39,6 @@ export async function fetchStripePriceDetails(): Promise<CachedPrices> {
     console.error('[STRIPE] Error reading from cache:', error);
   }
 
-  // Fetch from Stripe
-  const monthlyPriceId = env.NEXT_PUBLIC_STRIPE_SUBSCRIPTION_MANAGED_MONTHLY_PRICE_ID;
-  const yearlyPriceId = env.NEXT_PUBLIC_STRIPE_SUBSCRIPTION_MANAGED_YEARLY_PRICE_ID;
-
   let monthlyPrice: PriceDetails | null = null;
   let yearlyPrice: PriceDetails | null = null;