diff --git a/apps/sim/app/(landing)/components/collaboration/collaboration.tsx b/apps/sim/app/(landing)/components/collaboration/collaboration.tsx index 13200885ba7..d7b8cff120b 100644 --- a/apps/sim/app/(landing)/components/collaboration/collaboration.tsx +++ b/apps/sim/app/(landing)/components/collaboration/collaboration.tsx @@ -1,12 +1,16 @@ 'use client' import { useCallback, useEffect, useRef, useState } from 'react' +import dynamic from 'next/dynamic' import Image from 'next/image' import Link from 'next/link' import { Badge } from '@/components/emcn' -import { AuthModal } from '@/app/(landing)/components/auth-modal/auth-modal' import { trackLandingCta } from '@/app/(landing)/landing-analytics' +const AuthModal = dynamic(() => + import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal) +) + interface DotGridProps { className?: string cols: number diff --git a/apps/sim/app/(landing)/components/features/features.tsx b/apps/sim/app/(landing)/components/features/features.tsx index 75dc371b373..f9ab0d6d6c0 100644 --- a/apps/sim/app/(landing)/components/features/features.tsx +++ b/apps/sim/app/(landing)/components/features/features.tsx @@ -2,12 +2,16 @@ import { useRef, useState } from 'react' import { type MotionValue, motion, useScroll, useTransform } from 'framer-motion' +import dynamic from 'next/dynamic' import Image from 'next/image' import { Badge } from '@/components/emcn' -import { AuthModal } from '@/app/(landing)/components/auth-modal/auth-modal' import { FeaturesPreview } from '@/app/(landing)/components/features/components/features-preview' import { trackLandingCta } from '@/app/(landing)/landing-analytics' +const AuthModal = dynamic(() => + import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal) +) + function hexToRgba(hex: string, alpha: number): string { const r = Number.parseInt(hex.slice(1, 3), 16) const g = Number.parseInt(hex.slice(3, 5), 16) diff --git a/apps/sim/app/(landing)/components/footer/footer-cta.tsx b/apps/sim/app/(landing)/components/footer/footer-cta.tsx index 9a06d79fafe..ff98ff7e156 100644 --- a/apps/sim/app/(landing)/components/footer/footer-cta.tsx +++ b/apps/sim/app/(landing)/components/footer/footer-cta.tsx @@ -2,13 +2,17 @@ import { useCallback, useRef, useState } from 'react' import { ArrowUp } from 'lucide-react' +import dynamic from 'next/dynamic' import { cn } from '@/lib/core/utils/cn' import { captureClientEvent } from '@/lib/posthog/client' -import { AuthModal } from '@/app/(landing)/components/auth-modal/auth-modal' import { useLandingSubmit } from '@/app/(landing)/components/landing-preview/components/landing-preview-panel/landing-preview-panel' import { trackLandingCta } from '@/app/(landing)/landing-analytics' import { useAnimatedPlaceholder } from '@/hooks/use-animated-placeholder' +const AuthModal = dynamic(() => + import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal) +) + const MAX_HEIGHT = 120 const CTA_BUTTON = diff --git a/apps/sim/app/(landing)/components/footer/footer.tsx b/apps/sim/app/(landing)/components/footer/footer.tsx index a27a1cf30bf..cb4e0fb7796 100644 --- a/apps/sim/app/(landing)/components/footer/footer.tsx +++ b/apps/sim/app/(landing)/components/footer/footer.tsx @@ -38,7 +38,7 @@ const BLOCK_LINKS: FooterItem[] = [ { label: 'Router', href: 'https://docs.sim.ai/blocks/router', external: true }, { label: 'Function', href: 'https://docs.sim.ai/blocks/function', external: true }, { label: 'Condition', href: 'https://docs.sim.ai/blocks/condition', external: true }, - { label: 'API', href: 'https://docs.sim.ai/blocks/api', external: true }, + { label: 'API Block', href: 'https://docs.sim.ai/blocks/api', external: true }, { label: 'Workflow', href: 'https://docs.sim.ai/blocks/workflow', external: true }, { label: 'Parallel', href: 'https://docs.sim.ai/blocks/parallel', external: true }, { label: 'Guardrails', href: 'https://docs.sim.ai/blocks/guardrails', external: true }, @@ -194,7 +194,7 @@ export default function Footer({ hideCTA }: FooterProps) { Sim + import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal) +) + +const DemoRequestModal = dynamic(() => + import('@/app/(landing)/components/demo-request/demo-request-modal').then( + (m) => m.DemoRequestModal + ) +) + const LandingPreview = dynamic( () => import('@/app/(landing)/components/landing-preview/landing-preview').then( diff --git a/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-home/landing-preview-home.tsx b/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-home/landing-preview-home.tsx index aea260a3cb0..338a3bd115a 100644 --- a/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-home/landing-preview-home.tsx +++ b/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-home/landing-preview-home.tsx @@ -334,6 +334,7 @@ export const LandingPreviewHome = memo(function LandingPreviewHome({ type='button' onClick={handleSubmit} disabled={isEmpty} + aria-label='Submit message' className='flex h-[28px] w-[28px] items-center justify-center rounded-full border-0 p-0 transition-colors' style={{ background: isEmpty ? '#808080' : '#e0e0e0', diff --git a/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-panel/landing-preview-panel.tsx b/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-panel/landing-preview-panel.tsx index 6e7ba497aeb..94e39cb27b3 100644 --- a/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-panel/landing-preview-panel.tsx +++ b/apps/sim/app/(landing)/components/landing-preview/components/landing-preview-panel/landing-preview-panel.tsx @@ -3,13 +3,13 @@ import { memo, useCallback, useEffect, useRef, useState } from 'react' import { AnimatePresence, motion } from 'framer-motion' import { ArrowUp } from 'lucide-react' +import dynamic from 'next/dynamic' import { useRouter } from 'next/navigation' import { createPortal } from 'react-dom' import { Blimp, BubbleChatPreview, ChevronDown, MoreHorizontal, Play } from '@/components/emcn' import { AgentIcon, HubspotIcon, OpenAIIcon, SalesforceIcon } from '@/components/icons' import { LandingPromptStorage } from '@/lib/core/utils/browser-storage' import { captureClientEvent } from '@/lib/posthog/client' -import { AuthModal } from '@/app/(landing)/components/auth-modal/auth-modal' import { EASE_OUT, type EditorPromptData, @@ -21,6 +21,10 @@ import { } from '@/app/(landing)/components/landing-preview/components/landing-preview-workflow/workflow-data' import { trackLandingCta } from '@/app/(landing)/landing-analytics' +const AuthModal = dynamic(() => + import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal) +) + type PanelTab = 'copilot' | 'editor' const EDITOR_BLOCK_ICONS: Record> = { diff --git a/apps/sim/app/(landing)/components/navbar/navbar.tsx b/apps/sim/app/(landing)/components/navbar/navbar.tsx index 54579bc173e..da1e114f076 100644 --- a/apps/sim/app/(landing)/components/navbar/navbar.tsx +++ b/apps/sim/app/(landing)/components/navbar/navbar.tsx @@ -1,13 +1,13 @@ 'use client' -import { useCallback, useEffect, useRef, useState, useSyncExternalStore } from 'react' +import { useCallback, useContext, useEffect, useRef, useState, useSyncExternalStore } from 'react' +import dynamic from 'next/dynamic' import Image from 'next/image' import Link from 'next/link' import { useSearchParams } from 'next/navigation' import { GithubOutlineIcon } from '@/components/icons' -import { useSession } from '@/lib/auth/auth-client' import { cn } from '@/lib/core/utils/cn' -import { AuthModal } from '@/app/(landing)/components/auth-modal/auth-modal' +import { SessionContext } from '@/app/_shell/providers/session-provider' import { BlogDropdown, type NavBlogPost, @@ -17,6 +17,10 @@ import { GitHubStars } from '@/app/(landing)/components/navbar/components/github import { trackLandingCta } from '@/app/(landing)/landing-analytics' import { getBrandConfig } from '@/ee/whitelabeling' +const AuthModal = dynamic(() => + import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal) +) + type DropdownId = 'docs' | 'blog' | null interface NavLink { @@ -48,7 +52,9 @@ interface NavbarProps { export default function Navbar({ logoOnly = false, blogPosts = [] }: NavbarProps) { const brand = getBrandConfig() const searchParams = useSearchParams() - const { data: session, isPending: isSessionPending } = useSession() + const sessionCtx = useContext(SessionContext) + const session = sessionCtx?.data ?? null + const isSessionPending = sessionCtx?.isPending ?? true const isAuthenticated = Boolean(session?.user?.id) const isBrowsingHome = searchParams.has('home') const useHomeLinks = isAuthenticated || isBrowsingHome @@ -125,7 +131,7 @@ export default function Navbar({ logoOnly = false, blogPosts = [] }: NavbarProps ) : ( Sim + import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal) +) + +const DemoRequestModal = dynamic(() => + import('@/app/(landing)/components/demo-request/demo-request-modal').then( + (m) => m.DemoRequestModal + ) +) + interface PricingTier { id: string name: string diff --git a/apps/sim/app/(landing)/components/templates/templates.tsx b/apps/sim/app/(landing)/components/templates/templates.tsx index cb799237ae3..cbe2d0609b8 100644 --- a/apps/sim/app/(landing)/components/templates/templates.tsx +++ b/apps/sim/app/(landing)/components/templates/templates.tsx @@ -470,7 +470,7 @@ export default function Templates() { aria-labelledby={`template-tab-${activeIndex}`} className='relative hidden flex-1 lg:block' > -