feat(billing): update authentication redirect for subscription and enhance billing modal integration in chat input

This commit is contained in:
sharath 2025-06-26 19:09:36 +00:00
parent e7f02f31bc
commit a77b98cecb
No known key found for this signature in database
3 changed files with 12 additions and 5 deletions

View File

@ -181,7 +181,7 @@ function PricingTier({
// Auto-select the correct plan only on initial load - simplified since no more Custom tier // Auto-select the correct plan only on initial load - simplified since no more Custom tier
const handleSubscribe = async (planStripePriceId: string) => { const handleSubscribe = async (planStripePriceId: string) => {
if (!isAuthenticated) { if (!isAuthenticated) {
window.location.href = '/auth'; window.location.href = '/auth?mode=signup';
return; return;
} }

View File

@ -1,4 +1,4 @@
import React, { forwardRef, useEffect } from 'react'; import React, { forwardRef, useEffect, useState } from 'react';
import { Textarea } from '@/components/ui/textarea'; import { Textarea } from '@/components/ui/textarea';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Square, Loader2, ArrowUp } from 'lucide-react'; import { Square, Loader2, ArrowUp } from 'lucide-react';
@ -76,6 +76,7 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(
}, },
ref, ref,
) => { ) => {
const [billingModalOpen, setBillingModalOpen] = useState(false);
useEffect(() => { useEffect(() => {
const textarea = ref as React.RefObject<HTMLTextAreaElement>; const textarea = ref as React.RefObject<HTMLTextAreaElement>;
if (!textarea.current) return; if (!textarea.current) return;
@ -156,8 +157,7 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(
<TooltipProvider> <TooltipProvider>
<Tooltip> <Tooltip>
<TooltipTrigger> <TooltipTrigger>
<p className='text-sm text-amber-500 hidden sm:block'>Upgrade for full performance</p> <p role='button' className='text-sm text-amber-500 hidden sm:block cursor-pointer' onClick={() => setBillingModalOpen(true)}>Upgrade for full performance</p>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipContent>
<p>The free tier is severely limited by inferior models; upgrade to experience the true full Suna experience.</p> <p>The free tier is severely limited by inferior models; upgrade to experience the true full Suna experience.</p>
@ -173,6 +173,7 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(
subscriptionStatus={subscriptionStatus} subscriptionStatus={subscriptionStatus}
canAccessModel={canAccessModel} canAccessModel={canAccessModel}
refreshCustomModels={refreshCustomModels} refreshCustomModels={refreshCustomModels}
billingModalOpenParent={billingModalOpen}
/> />
<Button <Button
type="submit" type="submit"

View File

@ -46,6 +46,7 @@ interface ModelSelectorProps {
canAccessModel: (modelId: string) => boolean; canAccessModel: (modelId: string) => boolean;
subscriptionStatus: SubscriptionStatus; subscriptionStatus: SubscriptionStatus;
refreshCustomModels?: () => void; refreshCustomModels?: () => void;
billingModalOpenParent: boolean;
} }
export const ModelSelector: React.FC<ModelSelectorProps> = ({ export const ModelSelector: React.FC<ModelSelectorProps> = ({
@ -55,9 +56,10 @@ export const ModelSelector: React.FC<ModelSelectorProps> = ({
canAccessModel, canAccessModel,
subscriptionStatus, subscriptionStatus,
refreshCustomModels, refreshCustomModels,
billingModalOpenParent,
}) => { }) => {
const [paywallOpen, setPaywallOpen] = useState(false); const [paywallOpen, setPaywallOpen] = useState(false);
const [billingModalOpen, setBillingModalOpen] = useState(false); const [billingModalOpen, setBillingModalOpen] = useState(billingModalOpenParent);
const [lockedModel, setLockedModel] = useState<string | null>(null); const [lockedModel, setLockedModel] = useState<string | null>(null);
const [isOpen, setIsOpen] = useState(false); const [isOpen, setIsOpen] = useState(false);
const [searchQuery, setSearchQuery] = useState(''); const [searchQuery, setSearchQuery] = useState('');
@ -79,6 +81,10 @@ export const ModelSelector: React.FC<ModelSelectorProps> = ({
} }
}, []); }, []);
useEffect(() => {
setBillingModalOpen(billingModalOpenParent);
}, [billingModalOpenParent]);
// Save custom models to localStorage whenever they change // Save custom models to localStorage whenever they change
useEffect(() => { useEffect(() => {
if (isLocalMode() && customModels.length > 0) { if (isLocalMode() && customModels.length > 0) {