| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354 |
- import { GreenPage, Block, Conversation, DesignSettings, MediaSource, AIGCArticle, FormBlock, AwardBlock, FooterBlock } from '../types';
- import { subDays } from 'date-fns';
- const themeColors = [
- 'from-green-400 to-blue-500',
- 'from-purple-500 to-pink-500',
- 'from-yellow-400 to-orange-600',
- 'from-teal-400 to-cyan-500',
- 'from-red-500 to-indigo-600',
- 'from-rose-400 to-red-500',
- ];
- const createInitialAIGCArticles = (): AIGCArticle[] => [
- {
- id: 'aigc-article-1',
- title: 'The Rise of AI in Modern Web Development',
- summary: 'An in-depth look at how artificial intelligence is revolutionizing the way we build and interact with websites, from automated testing to intelligent UI generation.',
- content: `
- <h2>The Dawn of a New Era</h2>
- <p>From automated testing to intelligent UI generation, AI is no longer a futuristic concept but a <strong>present-day tool for developers</strong>. The landscape of web development is shifting at an unprecedented pace, with machine learning models now capable of writing code, designing user interfaces, and even deploying applications.</p>
- <p>One of the most significant impacts is in the realm of UI/UX design. Tools powered by generative AI can create stunning, user-friendly mockups from simple text prompts. <em>This dramatically accelerates the prototyping phase</em>, allowing teams to iterate on ideas faster than ever before. We're seeing a future where the line between designer and developer blurs, thanks to these intelligent assistants.</p>
- <img src="https://picsum.photos/seed/ai-article-1/600/400" alt="AI and code" style="width: 100%; height: auto; border-radius: 8px; margin: 1em 0;" />
- <h2>Challenges and Opportunities</h2>
- <p>Of course, this revolution doesn't come without its challenges. Questions around code quality, security vulnerabilities in AI-generated scripts, and the ethical implications of job displacement are paramount. However, the opportunities are boundless. Developers can now focus on more complex architectural problems, leaving routine coding tasks to their AI partners. For more information, you can read this <a href="https://example.com" target="_blank" rel="noopener noreferrer">in-depth analysis</a>.</p>
- `,
- publicationDate: subDays(new Date(), 5).toISOString(),
- sourceType: 'generated',
- },
- {
- id: 'aigc-article-2',
- title: 'Sustainable Living: 10 Tips for an Eco-Friendly Home',
- summary: 'Discover simple yet effective ways to reduce your carbon footprint and create a greener living space, from your kitchen to your garden.',
- content: `
- <h2>It Starts at Home</h2>
- <p>Sustainability is more than just a buzzword; it's a lifestyle that begins right in our own homes. Creating an eco-friendly living space doesn't require a complete overhaul. Simple, consistent changes can lead to a significant positive impact on the environment and even your wallet.</p>
- <img src="https://picsum.photos/seed/eco-article-1/600/400" alt="A green home" style="width: 100%; height: auto; border-radius: 8px; margin: 1em 0;" />
- <h2>Practical Steps You Can Take Today</h2>
- <p>Here are a few tips to get started:</p>
- <ol>
- <li><strong>Reduce, Reuse, Recycle:</strong> The classic three R's are more important than ever.</li>
- <li><strong>Compost Food Scraps:</strong> Reduce landfill waste and create nutrient-rich soil for your garden.</li>
- <li><strong>Switch to LED Lighting:</strong> They use significantly less energy and last much longer than traditional bulbs.</li>
- <li><em>Fix Leaky Faucets:</em> A small drip can waste gallons of water every day.</li>
- </ol>
- <p>By adopting these habits, you contribute to a healthier planet for future generations. It's a journey of continuous learning and improvement. Check out <a href="https://example.com/eco" target="_blank" rel="noopener noreferrer">this resource</a> for more ideas.</p>
- `,
- publicationDate: subDays(new Date(), 12).toISOString(),
- sourceType: 'generated',
- },
- {
- id: 'aigc-article-3',
- title: 'A Guide to Mindful Productivity in a Distracted World',
- summary: 'Learn how to achieve more by focusing on the present moment, reducing stress, and working smarter, not harder, even with constant digital interruptions.',
- content: `
- <h2>The Myth of Multitasking</h2>
- <p>In our fast-paced, hyper-connected world, the ability to focus is a superpower. We're often led to believe that multitasking is the key to productivity, but research shows the opposite is true. Juggling multiple tasks at once can lead to increased stress, more errors, and diminished creativity. <strong>True productivity comes from single-tasking with deep focus.</strong></p>
- <h2>Techniques for a Focused Mind</h2>
- <p>Mindfulness is the practice of being present and fully engaged with whatever we're doing. Here’s how to apply it to your work:</p>
- <ul>
- <li><strong>The Pomodoro Technique:</strong> Work in focused 25-minute intervals, followed by a short break. This helps maintain high energy levels throughout the day.</li>
- <li><strong>Digital Detox:</strong> Schedule specific times to check email and social media, rather than letting them interrupt your workflow.</li>
- <li><em>Mindful Breathing:</em> Before starting a big task, take a minute to focus on your breath. This simple act can calm your nervous system and improve concentration.</li>
- </ul>
- <img src="https://picsum.photos/seed/mindful-article-1/600/400" alt="A calm workspace" style="width: 100%; height: auto; border-radius: 8px; margin: 1em 0;" />
- <p>By integrating mindfulness into your daily routine, you can transform your relationship with work, reducing burnout and achieving a greater sense of accomplishment.</p>
- `,
- publicationDate: subDays(new Date(), 20).toISOString(),
- sourceType: 'generated',
- },
- ];
- const createInitialBlocks = (): Block[] => {
- const defaultFormBlock: FormBlock = {
- id: 'form-1',
- type: 'form',
- visible: true,
- title: 'Contact Us',
- description: 'Have a question or want to work together? Drop us a line!',
- submitButtonText: 'Submit Inquiry',
- fields: [
- { id: 'name', label: 'Full Name', enabled: true, required: true },
- { id: 'email', label: 'Email Address', enabled: true, required: true },
- { id: 'company', label: 'Company / Organization', enabled: true, required: false },
- { id: 'phone', label: 'Phone Number', enabled: true, required: false },
- { id: 'industry', label: 'Industry', enabled: false, required: false },
- { id: 'position', label: 'Position', enabled: false, required: false },
- { id: 'country', label: 'Country', enabled: false, required: false },
- ],
- purposeOptions: [
- { id: `po-d-1`, label: 'General Inquiry' },
- { id: `po-d-2`, label: 'Partnership' },
- { id: `po-d-3`, label: 'Support Request' },
- ]
- };
- const defaultFooterBlock: FooterBlock = {
- id: 'footer-1',
- type: 'footer',
- visible: true,
- layout: 'standard',
- copyrightText: `© ${new Date().getFullYear()} GreenPage AI. All Rights Reserved.`,
- legalText: 'Made with ❤️ by the GreenPage Team',
- statement: '',
- navLinks: [
- { id: 'fl-1', title: 'Home', url: '#' },
- { id: 'fl-2', title: 'About', url: '#' },
- { id: 'fl-3', title: 'Contact', url: '#' },
- ],
- otherLinks: [
- { id: 'fl-4', title: 'Privacy Policy', url: '#' },
- ],
- };
- return [
- { id: 'chat-1', type: 'chat', layout: 'under_avatar', visible: true },
- { id: 'header-1', type: 'header', text: 'Welcome to my page!', visible: true, titleAlignment: 'center' },
- { id: 'link-1', type: 'link', title: 'My Personal Website', url: 'https://example.com', iconUrl: 'https://www.google.com/s2/favicons?domain=example.com&sz=64', thumbnailUrl: "https://picsum.photos/seed/link-thumb-1/100/100", visible: true },
- { id: 'link-2', type: 'link', title: 'Follow me on Twitter', url: 'https://twitter.com', iconUrl: 'https://www.google.com/s2/favicons?domain=twitter.com&sz=64', visible: true },
- { id: 'header-2', type: 'header', text: 'My Work', visible: true, titleAlignment: 'left' },
- { id: 'image-1', type: 'image', sources: [
- { type: 'url', value: "https://picsum.photos/seed/gallery-image-1/400/300"},
- { type: 'url', value: "https://picsum.photos/seed/gallery-image-2/400/300" },
- { type: 'url', value: "https://picsum.photos/seed/gallery-image-3/400/300"}
- ], layout: 'grid', visible: true },
- { id: 'text-1', type: 'text', content: 'This is a gallery of my recent projects.\nFeel free to browse through and let me know what you think!', visible: true, textAlign: 'left', fontSize: '16px', fontColor: '#E5E7EB', isBold: false, isItalic: true },
- { id: 'header-product', type: 'header', text: 'My Favorite Products', visible: true, titleAlignment: 'left' },
- {
- id: 'product-1',
- type: 'product',
- layout: 'grid',
- items: [
- { id: 'prod-mock-1', url: 'https://amazon.com', title: 'Amazon Echo Dot (5th Gen)', imageUrl: 'https://picsum.photos/seed/amazon-product/400/400', price: '$49.99' },
- { id: 'prod-mock-2', url: 'https://shopee.com', title: 'Wireless Bluetooth Earbuds', imageUrl: 'https://picsum.photos/seed/shopee-product/400/400', price: '₱899.00' }
- ],
- visible: true,
- },
- { id: 'header-awards', type: 'header', text: 'Awards & Recognition', visible: true, titleAlignment: 'left' },
- {
- id: 'award-1',
- type: 'award',
- visible: true,
- layout: 'grid',
- items: [
- { id: 'award-item-1', title: 'Webby Award Winner', subtitle: 'Internet Excellence', year: '2023', imageSource: { type: 'url', value: 'https://picsum.photos/seed/webby-award/100' }},
- { id: 'award-item-2', title: 'Innovator of the Year', subtitle: 'Tech Forward Magazine', year: '2022', imageSource: { type: 'url', value: 'https://picsum.photos/seed/innovator-award/100' }},
- ]
- } as AwardBlock,
- { id: 'header-4', type: 'header', text: 'Featured Videos', visible: true, titleAlignment: 'left' },
- { id: 'video-2', type: 'video', sources: [{ type: 'url', value: 'https://storage.googleapis.com/gtv-videos-bucket/sample/ForBiggerBlazes.mp4' }, { type: 'url', value: 'https://storage.googleapis.com/gtv-videos-bucket/sample/ForBiggerEscapes.mp4' }], layout: 'grid', visible: true },
- { id: 'video-1', type: 'video', sources: [{ type: 'url', value: 'https://storage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4' }], layout: 'single', visible: true },
- { id: 'header-news', type: 'header', text: 'Latest News', visible: true, titleAlignment: 'left' },
- {
- id: 'news-aigc-1',
- type: 'news',
- layout: 'list',
- source: 'aigc',
- articleIds: ['aigc-article-1', 'aigc-article-3'],
- visible: true,
- },
- { id: 'header-5', type: 'header', text: 'From Around the Web', visible: true, titleAlignment: 'left' },
- {
- id: 'news-custom-1',
- type: 'news',
- layout: 'grid',
- source: 'custom',
- customItems: [
- { id: 'custom-news-1', title: 'TechCrunch: The Latest in Tech', summary: 'Your source for breaking technology news, analysis, and opinions.', url: 'https://techcrunch.com' },
- { id: 'custom-news-2', title: 'A List Apart: For People Who Make Websites', summary: 'Exploring the design, development, and meaning of web content.', url: 'https://alistapart.com' },
- ],
- visible: true,
- },
- { id: 'header-3', type: 'header', text: 'Get In Touch', visible: true, titleAlignment: 'center' },
- defaultFormBlock,
- { id: 'email-1', type: 'email', label: 'Send me an Email', email: 'hello@example.com', visible: true, displayMode: 'labelAndValue' },
- { id: 'phone-1', type: 'phone', label: 'Give me a Call', phone: '+1-234-567-8900', visible: true, displayMode: 'labelOnly' },
- { id: 'map-1', type: 'map', address: 'Eiffel Tower, Champ de Mars, 5 Av. Anatole France, 75007 Paris, France', visible: true, displayStyle: 'interactiveMap', backgroundImageSource: { type: 'url', value: 'https://picsum.photos/seed/eiffel/600/400' } },
- { id: 'pdf-1', type: 'pdf', source: { type: 'url', value: 'https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf' }, visible: true},
- { id: 'social-1', type: 'social', links: [
- { id: 'social-link-1', platform: 'twitter', url: 'https://twitter.com/johndoe'},
- { id: 'social-link-2', platform: 'github', url: 'https://github.com/johndoe'},
- ], visible: true },
- {
- id: 'enterprise-info-1',
- type: 'enterprise_info',
- visible: true,
- alignment: 'left',
- items: [
- { id: 'ei-1', icon: 'building', label: 'Company Name', value: 'GreenPage AI Suite' },
- { id: 'ei-2', icon: 'location', label: 'Headquarters', value: '123 Innovation Drive, Tech City' },
- { id: 'ei-3', icon: 'calendar', label: 'Founded', value: '2023' },
- { id: 'ei-4', icon: 'users', label: 'Company Size', value: '50-100 employees' },
- ]
- },
- defaultFooterBlock,
- ];
- };
- const createInitialDesignSettings = (): DesignSettings => {
- return {
- theme: 'dark',
- customThemeColors: {
- background: '#111827',
- text: '#FFFFFF',
- button: '#374151',
- buttonText: '#FFFFFF',
- },
- buttonStyle: 'filled',
- buttonShape: 'rounded',
- fontFamily: 'sans',
- fontColor: '#FFFFFF',
- fontSize: 'text-base',
- backgroundType: 'gradient',
- backgroundValue: 'bg-gradient-to-br from-gray-800 to-gray-900',
- userBackgroundImages: [],
- avatarSource: {
- type: 'url',
- value: 'https://api.dicebear.com/8.x/adventurer/svg?seed=GreenPageUser'
- },
- bannerSettings: {
- type: 'image',
- value: '', // Not used for image type, kept for color/gradient
- imageSource: {
- type: 'url',
- value: "https://picsum.photos/seed/default-banner/1200/300",
- },
- height: 300,
- width: 'contained',
- },
- sideNavSettings: {
- backgroundColor: 'transparent',
- textColor: '#d1d5db',
- activeLinkColor: '#10b981',
- hoverBackgroundColor: '#374151',
- hoverTextColor: '#ffffff',
- fontFamily: 'sans',
- fontSize: '14px',
- navFloatStyle: 'normal',
- navBackgroundStyle: 'compact',
- },
- chatWidgetSettings: {
- iconColor: '#10b981',
- headerBackgroundColor: '#10b981',
- headerTextColor: '#FFFFFF',
- panelBackgroundColor: '#1f2937',
- userMessageBackgroundColor: '#3b82f6',
- userMessageTextColor: '#FFFFFF',
- aiMessageBackgroundColor: '#374151',
- aiMessageTextColor: '#FFFFFF',
- },
- };
- };
- const createInitialConversations = (): Conversation[] => {
- return [
- { id: 'c1', visitorId: 'v1', timestamp: new Date().toISOString(), visitCount: 3, interactions: [{id: 'm1', sender: 'user', text: 'What are your shipping policies?'}, {id: 'm2', sender: 'ai', text: 'We ship worldwide within 5-7 business days.'}], status: 'resolved', firstResponseTime: 12 },
- { id: 'c2', visitorId: 'v2', timestamp: subDays(new Date(), 1).toISOString(), visitCount: 1, interactions: [{id: 'm3', sender: 'user', text: 'Hello?'}, {id: 'm4', sender: 'ai', text: 'Hi! How can I help you today?'}], status: 'open', firstResponseTime: 5 },
- { id: 'c3', visitorId: 'v3', timestamp: subDays(new Date(), 3).toISOString(), visitCount: 2, interactions: [{id: 'm5', sender: 'user', text: 'Is this item in stock?'}, {id: 'm6', sender: 'ai', text: 'Let me check that for you.'}], status: 'open', firstResponseTime: 8 },
- { id: 'c4', visitorId: 'v1', timestamp: subDays(new Date(), 2).toISOString(), visitCount: 3, interactions: [{id: 'm7', sender: 'user', text: 'Can I return an item?'}, {id: 'm8', sender: 'ai', text: 'Yes, we have a 30-day return policy on all items.'}], status: 'resolved', firstResponseTime: 25 },
- ];
- };
- const createInitialVideos = () => {
- return [
- { id: 'vid1', title: 'Product Demo', thumbnailUrl: "https://picsum.photos/seed/vid1/200/120", videoUrl: 'https://storage.googleapis.com/gtv-videos-bucket/sample/ForBiggerFun.mp4' },
- { id: 'vid2', title: 'Weekly Update', thumbnailUrl: "https://picsum.photos/seed/vid2/200/120", videoUrl: 'https://storage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4' },
- { id: 'vid3', title: 'Team Introduction', thumbnailUrl: "https://picsum.photos/seed/vid3/200/120", videoUrl: 'https://storage.googleapis.com/gtv-videos-bucket/sample/ForBiggerMeltdowns.mp4' },
- { id: 'vid4', title: 'Behind the Scenes', thumbnailUrl: "https://picsum.photos/seed/vid4/200/120", videoUrl: 'https://storage.googleapis.com/gtv-videos-bucket/sample/SubaruOutbackOnStreetAndDirt.mp4' },
- { id: 'vid5', title: 'Costa Rica Adventures', thumbnailUrl: "https://picsum.photos/seed/costa-rica/200/120", videoUrl: 'https://storage.googleapis.com/gtv-videos-bucket/sample/WeAreGoingOnAnAdventure.mp4' },
- { id: 'vid6', title: 'The Beauty of Art', thumbnailUrl: "https://picsum.photos/seed/art-beauty/200/120", videoUrl: 'https://storage.googleapis.com/gtv-videos-bucket/sample/WhatCarCanYouGetForAGrand.mp4' },
- ];
- };
- export const createEmptyPage = (name: string): GreenPage => {
- const pageId = `page_${Date.now()}_${Math.random()}`;
- const designSettings = createInitialDesignSettings();
- designSettings.avatarSource = {
- type: 'url',
- value: `https://api.dicebear.com/8.x/initials/svg?seed=${encodeURIComponent(name)}`
- };
- return {
- id: pageId,
- name: name,
- slug: name.toLowerCase().replace(/\s+/g, '-'),
- themeColor: themeColors[Math.floor(Math.random() * themeColors.length)],
- pageSettings: {
- blocks: [
- { id: 'chat-1', type: 'chat', layout: 'under_avatar', visible: true }
- ], // Start with just a chat block
- design: designSettings,
- },
- aiAssistantSettings: {
- persona: `You are a helpful assistant for the page "${name}". Be friendly and professional.`,
- voiceId: 'vo1',
- language: 'English',
- conversationStyle: 'professional',
- knowledgeBaseFiles: [],
- knowledgeBaseUrls: [],
- forbiddenUserKeywords: [],
- forbiddenAIKeywords: [],
- },
- analyticsData: {
- conversations: [],
- formSubmissions: [],
- },
- aigcSettings: {
- videos: [],
- articles: [],
- schedule: [],
- userMedia: [],
- }
- };
- };
- export const createNewPage = (name: string): GreenPage => {
- const pageId = `page_${Date.now()}_${Math.random()}`;
- const designSettings = createInitialDesignSettings();
- designSettings.avatarSource = {
- type: 'url',
- value: `https://api.dicebear.com/8.x/initials/svg?seed=${encodeURIComponent(name)}`
- };
- return {
- id: pageId,
- name: name,
- slug: name.toLowerCase().replace(/\s+/g, '-'),
- themeColor: themeColors[Math.floor(Math.random() * themeColors.length)],
- pageSettings: {
- blocks: createInitialBlocks(),
- design: designSettings,
- },
- aiAssistantSettings: {
- persona: `You are a helpful assistant for the page "${name}". Be friendly and professional.`,
- voiceId: 'vo1',
- language: 'English',
- conversationStyle: 'professional',
- knowledgeBaseFiles: [],
- knowledgeBaseUrls: [],
- forbiddenUserKeywords: [],
- forbiddenAIKeywords: [],
- },
- analyticsData: {
- conversations: [], // Start with no conversation data
- formSubmissions: [],
- },
- aigcSettings: {
- videos: createInitialVideos(), // Provide library content for user to explore
- articles: createInitialAIGCArticles(), // Provide library content for user to explore
- schedule: [],
- userMedia: [],
- }
- };
- };
|