267 lines
12 KiB
TypeScript
267 lines
12 KiB
TypeScript
import { Meta, StoryObj } from "@storybook/nextjs-vite";
|
||
import { TrialPaymentTemplate } from "./TrialPaymentTemplate";
|
||
import { fn } from "storybook/test";
|
||
import type { TrialPaymentScreenDefinition } from "@/lib/funnel/types";
|
||
|
||
const defaultScreen: TrialPaymentScreenDefinition = {
|
||
id: "trial-payment-screen-story",
|
||
template: "trialPayment",
|
||
title: { text: "" },
|
||
subtitle: { text: "" },
|
||
bottomActionButton: { show: false, showPrivacyTermsConsent: false },
|
||
headerBlock: {
|
||
timerSeconds: 600,
|
||
text: { text: "⚠️ Your sketch expires soon!" },
|
||
timer: { text: "" },
|
||
},
|
||
unlockYourSketch: {
|
||
title: { text: "Unlock Your Sketch" },
|
||
subtitle: { text: "Just One Click to Reveal Your Match!" },
|
||
image: { src: "/trial-payment/portrait-female.jpg" },
|
||
blur: { text: { text: "Unlock to reveal your personalized portrait" }, icon: "lock" },
|
||
buttonText: "Get Me Soulmate Sketch",
|
||
},
|
||
joinedToday: {
|
||
count: { text: "954" },
|
||
text: { text: "Joined today" },
|
||
},
|
||
trustedByOver: {
|
||
text: { text: "Trusted by over 355,000 people." },
|
||
},
|
||
findingOneGuide: {
|
||
header: {
|
||
emoji: { text: "❤️" },
|
||
title: { text: "Finding the One Guide" },
|
||
},
|
||
text: {
|
||
text:
|
||
"You're not just looking for someone — you're. You're not just looking for someone — you'reYou're not just looking for someone — you'reYou're not just looking for someone — you'reYou're not just looking for someone — you're. You're not just looking for someone — you're. You're not just looking for someone — you'reYou're not just looking for someone — you'reYou're not just looking for someone — you'reYou're not just looking for someone — you're",
|
||
},
|
||
blur: { text: { text: "Чтобы открыть весь отчёт, нужен полный доступ." }, icon: "lock" },
|
||
},
|
||
tryForDays: {
|
||
title: { text: "Попробуйте в течение 7 дней!" },
|
||
textList: {
|
||
items: [
|
||
{ text: "Receive a hand-drawn sketch of your soulmate, crafted by a trained AI-model." },
|
||
{ text: "Reveal the path to your soulmate with the Finding the One guide." },
|
||
{ text: "Talk to live experts and get guidance on finding your soulmate." },
|
||
{ text: "Start your 7-day trial for just $1.00 — then only $14.50/week for full access." },
|
||
{ text: "Cancel anytime—just 24 hours before renewal." },
|
||
],
|
||
},
|
||
},
|
||
totalPrice: {
|
||
couponContainer: {
|
||
title: { text: "Coupon\nCode" },
|
||
buttonText: "SOULMATE94",
|
||
},
|
||
priceContainer: {
|
||
title: { text: "Total" },
|
||
price: { text: "$1.00" },
|
||
oldPrice: { text: "$14.99" },
|
||
discount: { text: "94% discount applied" },
|
||
},
|
||
},
|
||
paymentButtons: {
|
||
buttons: [
|
||
{ text: "Pay", icon: "pay" },
|
||
{ text: "Pay", icon: "google" },
|
||
{ text: "Credit or debit card", icon: "card", primary: true },
|
||
],
|
||
},
|
||
moneyBackGuarantee: {
|
||
title: { text: "30-DAY MONEY-BACK GUARANTEE" },
|
||
text: { text: "If you don't receive your soulmate sketch, we'll refund your money!" },
|
||
},
|
||
policy: {
|
||
text: { text: "By clicking Continue, you agree to our Terms of Use & Service and Privacy Policy. You also acknowledge that your 1 week introductory plan to Respontika, billed at $1.00, will automatically renew at $14.50 every 1 week unless canceled before the end of the trial period." },
|
||
},
|
||
usersPortraits: {
|
||
title: { text: "Our Users' Soulmate Portraits" },
|
||
images: [
|
||
{ src: "/trial-payment/users-portraits/1.jpg" },
|
||
{ src: "/trial-payment/users-portraits/2.jpg" },
|
||
{ src: "/trial-payment/users-portraits/3.jpg" },
|
||
],
|
||
buttonText: "Get me soulmate sketch",
|
||
},
|
||
joinedTodayWithAvatars: {
|
||
count: { text: "954" },
|
||
text: { text: "people joined today" },
|
||
avatars: {
|
||
images: [
|
||
{ src: "/trial-payment/avatars/1.jpg" },
|
||
{ src: "/trial-payment/avatars/2.jpg" },
|
||
{ src: "/trial-payment/avatars/3.jpg" },
|
||
{ src: "/trial-payment/avatars/4.jpg" },
|
||
{ src: "/trial-payment/avatars/5.jpg" },
|
||
],
|
||
},
|
||
},
|
||
progressToSeeSoulmate: {
|
||
title: { text: "See Your Soulmate – Just One Step Away" },
|
||
progress: { value: 92 },
|
||
leftText: { text: "Step 2 of 5" },
|
||
rightText: { text: "99% Complete" },
|
||
},
|
||
stepsToSeeSoulmate: {
|
||
steps: [
|
||
{
|
||
title: { text: "Questions Answered" },
|
||
description: { text: "You've provided all the necessary information about your preferences and personality." },
|
||
icon: "questions",
|
||
isActive: true,
|
||
},
|
||
{
|
||
title: { text: "Profile Analysis" },
|
||
description: { text: "Our advanced system is creating your perfect soulmate profile." },
|
||
icon: "profile",
|
||
isActive: true,
|
||
},
|
||
{
|
||
title: { text: "Sketch Creation" },
|
||
description: { text: "Your personalized soulmate sketch will be created." },
|
||
icon: "sketch",
|
||
isActive: false,
|
||
},
|
||
{
|
||
title: { text: "Астрологические Идеи" },
|
||
description: { text: "Уникальные астрологические рекомендации, усиливающие совместимость." },
|
||
icon: "astro",
|
||
isActive: false,
|
||
},
|
||
{
|
||
title: { text: "Персонализированный чат с экспертом" },
|
||
description: { text: "Персональные советы от экспертов по отношениям." },
|
||
icon: "chat",
|
||
isActive: false,
|
||
},
|
||
],
|
||
buttonText: "Show Me My Soulmate",
|
||
},
|
||
reviews: {
|
||
title: { text: "Loved and Trusted Worldwide" },
|
||
items: [
|
||
{
|
||
name: { text: "Jennifer Wilson 🇺🇸" },
|
||
text: { text: "**“Я увидела свои ошибки… и нашла мужа”**\nПортрет сразу зацепил — было чувство, что я уже где-то его видела. Но настоящий перелом произошёл после гайда: я поняла, почему снова и снова выбирала «не тех». И самое удивительное — вскоре я познакомилась с мужчиной, который оказался точной копией того самого портрета. Сейчас он мой муж, и когда мы сравнили рисунок с его фото, сходство было просто вау." },
|
||
avatar: { src: "/trial-payment/reviews/avatars/1.jpg" },
|
||
portrait: { src: "/trial-payment/reviews/portraits/1.jpg" },
|
||
photo: { src: "/trial-payment/reviews/photos/1.jpg" },
|
||
rating: 5,
|
||
date: { text: "1 day ago" },
|
||
},
|
||
{
|
||
name: { text: "Amanda Davis 🇨🇦" },
|
||
text: { text: "**“Я поняла своего партнёра лучше за один вечер, чем за несколько лет”**\nПрошла тест ради интереса — портрет нас удивил. Но настоящий прорыв случился, когда я прочитала гайд о второй половинке. Там были точные подсказки о том, как мы можем поддерживать друг друга. Цена смешная, а ценность огромная: теперь у нас меньше недопониманий и больше тепла." },
|
||
avatar: { src: "/trial-payment/reviews/avatars/2.jpg" },
|
||
portrait: { src: "/trial-payment/reviews/portraits/2.jpg" },
|
||
photo: { src: "/trial-payment/reviews/photos/2.jpg" },
|
||
rating: 5,
|
||
date: { text: "4 days ago" },
|
||
},
|
||
{
|
||
name: { text: "Michael Johnson 🇬🇧" },
|
||
text: { text: "**“Увидел её лицо — и мурашки по коже”**\nКогда пришёл результат теста и показали портрет, я реально замер. Это была та самая девушка, с которой я начал встречаться пару недель назад. И гайд прямо описал, почему мы тянемся друг к другу. Честно, я не ожидал такого совпадения." },
|
||
avatar: { src: "/trial-payment/reviews/avatars/3.jpg" },
|
||
portrait: { src: "/trial-payment/reviews/portraits/3.jpg" },
|
||
photo: { src: "/trial-payment/reviews/photos/3.jpg" },
|
||
rating: 5,
|
||
date: { text: "1 week ago" },
|
||
},
|
||
],
|
||
},
|
||
commonQuestions: {
|
||
title: { text: "Common Questions" },
|
||
items: [
|
||
{
|
||
question: "When will I receive my sketch?",
|
||
answer:
|
||
"Your personalized soulmate sketch will be delivered within 24-48 hours after completing your order. You'll receive an email notification when it's ready for viewing in your account.",
|
||
},
|
||
{
|
||
question: "How do I cancel my subscription?",
|
||
answer:
|
||
"You can cancel anytime from your account settings. Make sure to cancel at least 24 hours before the renewal date to avoid being charged.",
|
||
},
|
||
{
|
||
question: "How accurate are the readings?",
|
||
answer:
|
||
"Our readings are based on a combination of your answers and advanced pattern analysis. While they provide valuable insights, they are intended for guidance and entertainment purposes.",
|
||
},
|
||
{
|
||
question: "Is my data secure and private?",
|
||
answer:
|
||
"Yes. We follow strict data protection standards. Your data is encrypted and never shared with third parties without your consent.",
|
||
},
|
||
],
|
||
},
|
||
stillHaveQuestions: {
|
||
title: { text: "Still have questions? We're here to help!" },
|
||
actionButtonText: "Get me Soulmate Sketch",
|
||
contactButtonText: "Contact Support",
|
||
},
|
||
footer: {
|
||
title: { text: "WIT LAB ©" },
|
||
contacts: {
|
||
title: { text: "CONTACTS" },
|
||
email: { href: "https://witlab.us", text: "Contact" },
|
||
address: { text: "Wit Lab 2108 N ST STE N SACRAMENTO, CA95816, US" },
|
||
},
|
||
legal: {
|
||
title: { text: "LEGAL" },
|
||
links: [
|
||
{ href: "https://witlab.us/terms", text: "Terms of Service" },
|
||
{ href: "https://witlab.us/privacy", text: "Privacy Policy" },
|
||
{ href: "https://witlab.us/refund", text: "Refund Policy" },
|
||
],
|
||
copyright: {
|
||
text:
|
||
"Copyright © 2025 Wit Lab™. All rights reserved. All trademarks referenced herein are the properties of their respective owners.",
|
||
},
|
||
},
|
||
paymentMethods: {
|
||
title: { text: "PAYMENT METHODS" },
|
||
methods: [
|
||
{ src: "/trial-payment/payment-methods/visa.svg", alt: "visa" },
|
||
{ src: "/trial-payment/payment-methods/mastercard.svg", alt: "mastercard" },
|
||
{ src: "/trial-payment/payment-methods/discover.svg", alt: "discover" },
|
||
{ src: "/trial-payment/payment-methods/apple.svg", alt: "apple" },
|
||
{ src: "/trial-payment/payment-methods/google.svg", alt: "google" },
|
||
{ src: "/trial-payment/payment-methods/paypal.svg", alt: "paypal" },
|
||
],
|
||
},
|
||
},
|
||
};
|
||
|
||
const meta: Meta<typeof TrialPaymentTemplate> = {
|
||
title: "Funnel Templates/TrialPaymentTemplate",
|
||
component: TrialPaymentTemplate,
|
||
tags: ["autodocs"],
|
||
parameters: {
|
||
layout: "fullscreen",
|
||
},
|
||
args: {
|
||
screen: defaultScreen,
|
||
onContinue: fn(),
|
||
canGoBack: true,
|
||
onBack: fn(),
|
||
screenProgress: { current: 8, total: 10 },
|
||
defaultTexts: {
|
||
nextButton: "Continue",
|
||
continueButton: "Continue",
|
||
},
|
||
},
|
||
argTypes: {
|
||
screen: { control: { type: "object" } },
|
||
},
|
||
};
|
||
|
||
export default meta;
|
||
type Story = StoryObj<typeof meta>;
|
||
|
||
export const Default: Story = {};
|
||
|
||
|