The weeb for the next gen discord boat - Wamellow wamellow.com
bot discord
3
fork

Configure Feed

Select the types of activity you want to include in your feed.

fix trailing subscription state

Luna f2072106 5f274b33

+28 -6
+28 -6
app/profile/billing/page.tsx
··· 16 16 import Modal from "@/components/modal"; 17 17 import Notice from "@/components/notice"; 18 18 import { OverviewLink } from "@/components/overview-link"; 19 + import { Badge } from "@/components/ui/badge"; 19 20 import { Button } from "@/components/ui/button"; 20 21 import { Separator } from "@/components/ui/separator"; 21 22 import { Skeleton } from "@/components/ui/skeleton"; ··· 28 29 29 30 const { data, isLoading, error, edit } = useApi<ApiV1UsersMeBillingGetResponse>("/users/@me/billing"); 30 31 31 - if ((isLoading && !user?.premium) || (!isLoading && !data) || (data && data.status !== "active")) { 32 + if ((isLoading && !user?.premium) || (!isLoading && !data) || (data && data.status !== "active" && data.status !== "trialing")) { 32 33 return (<> 33 34 {(error && error !== "Not Found") && <Notice message={error} />} 34 35 ··· 52 53 </>); 53 54 } 54 55 56 + const trialEndsInDays = data?.status === "trialing" 57 + ? Math.floor(((data?.currentPeriodEnd - Date.now() / 1000) / (60 * 60 * 24))) 58 + : 0; 59 + 55 60 return ( 56 61 <div className="space-y-2"> 57 62 <Box ··· 59 64 small 60 65 > 61 66 <div className="flex flex-col"> 62 - <h2 className="font-bold text-3xl bg-gradient-to-r bg-clip-text text-transparent from-violet-400/80 to-indigo-400/80">Wamellow Premium</h2> 67 + <h2 className="font-bold text-3xl bg-gradient-to-r bg-clip-text text-transparent from-violet-400/80 to-indigo-400/80"> 68 + Wamellow Premium 69 + {data?.status === "trialing" && ( 70 + <Badge 71 + className="relative bottom-1 ml-2" 72 + > 73 + trial — Ends {trialEndsInDays > 1 ? "in " : ""}{trialEndsInDays === 0 ? "Today" : trialEndsInDays === 1 ? "Tomorrow" : trialEndsInDays} {trialEndsInDays > 1 ? "days" : ""} 74 + </Badge> 75 + )} 76 + </h2> 63 77 <p className="text-muted-foreground">You have all premium features for <span className="font-semibold text-neutral-300">EUR {(4 + (data?.donationQuantity || 0)).toFixed(2)} / {data?.priceId.startsWith("monthly_") ? "Month" : "Year"}</span>!</p> 64 78 </div> 65 79 <div className="flex gap-1 mt-4 md:mt-0"> ··· 83 97 Your subscription will expire on <span className="font-semibold text-neutral-300">{new Date(data!.currentPeriodEnd * 1000).toLocaleDateString()}</span> and you will not be charged again. 84 98 </p> 85 99 : <p> 86 - Your subscription will be automatically renewed on <span className="font-semibold text-neutral-300">{new Date(data!.currentPeriodEnd * 1000).toLocaleDateString()}</span> and you{"'"}ll be charged <span className="font-semibold text-neutral-300">EUR {(4 + (data!.donationQuantity || 0)).toFixed(2)}</span>. 100 + Your subscription will renew on <span className="font-semibold text-neutral-300">{new Date(data!.currentPeriodEnd * 1000).toLocaleDateString()}</span>, for a total of <span className="font-semibold text-neutral-300">EUR {(4 + (data!.donationQuantity || 0)).toFixed(2)}</span>. 87 101 88 - You{"'"}re paying <span className="font-semibold text-neutral-300">EUR {(4).toFixed(2)} — Premium</span> and <span className="font-semibold text-neutral-300">EUR {(data!.donationQuantity || 0).toFixed(2)} — Donation{data!.donationQuantity ? "s" : ""}</span> 102 + You{"'"}re paying <span className="font-semibold text-neutral-300">EUR {(4).toFixed(2)} Premium</span> and <span className="font-semibold text-neutral-300">EUR {(data!.donationQuantity || 0).toFixed(2)} Donation{data!.donationQuantity ? "s" : ""}</span> 89 103 {" "} 90 104 (<Button 91 105 className="text-sm p-0 m-0 h-3 text-violet-400" ··· 136 150 open={changeDonationModalOpen} 137 151 setOpen={setChangeDonationModalOpen} 138 152 donationQuantity={data?.donationQuantity || 0} 153 + trialing={data.status === "trialing"} 139 154 edit={edit} 140 155 /> 141 156 )} ··· 235 250 open, 236 251 setOpen, 237 252 donationQuantity: defaultDonationQuantity, 253 + trialing, 238 254 edit 239 255 }: { 240 256 open: boolean; 241 257 setOpen: (open: boolean) => void; 242 258 donationQuantity: number; 259 + trialing: boolean; 243 260 edit: ApiEdit<ApiV1UsersMeBillingGetResponse>; 244 261 }) { 245 262 const [donation, setDonation] = useState(defaultDonationQuantity); ··· 294 311 <div className="flex justify-between items-center mb-4"> 295 312 <div> 296 313 <h2 className="text-lg font-medium text-neutral-100">Due Today</h2> 297 - <p className="text-sm text-neutral-500">You{"'"}ll recieve an invoice via email.</p> 314 + <p className="text-sm text-neutral-500"> 315 + {trialing 316 + ? "Due to your active trial, you will not be charged today." 317 + : "You will receive an invoice via email." 318 + } 319 + </p> 298 320 </div> 299 321 300 - <span className="text-xl font-medium text-neutral-100">€{dueToday.toFixed(2)}</span> 322 + <span className="text-xl font-medium text-neutral-100">€{trialing ? 0 : dueToday.toFixed(2)}</span> 301 323 </div> 302 324 )} 303 325