simstudioai · waleedlatif1 · Apr 16, 2026 · Apr 16, 2026 · Apr 16, 2026 · Apr 16, 2026
diff --git a/apps/sim/app/(landing)/components/collaboration/collaboration.tsx b/apps/sim/app/(landing)/components/collaboration/collaboration.tsx
@@ -1,12 +1,17 @@
 '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),
+  { loading: () => null }
+)
+
 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
@@ -2,12 +2,17 @@
 
 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),
+  { loading: () => null }
+)
+
 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
@@ -2,13 +2,18 @@
 
 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),
+  { loading: () => null }
+)
+
 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
@@ -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) {
               <Link href='/' aria-label='Sim home'>
                 <Image
                   src='/logo/sim-landing.svg'
-                  alt='Sim'
+                  alt=''
                   width={85}
                   height={26}
                   className='h-[26.4px] w-auto'

diff --git a/apps/sim/app/(landing)/components/hero/hero.tsx b/apps/sim/app/(landing)/components/hero/hero.tsx
@@ -2,10 +2,21 @@
 
 import dynamic from 'next/dynamic'
 import { cn } from '@/lib/core/utils/cn'
-import { AuthModal } from '@/app/(landing)/components/auth-modal/auth-modal'
-import { DemoRequestModal } from '@/app/(landing)/components/demo-request/demo-request-modal'
 import { trackLandingCta } from '@/app/(landing)/landing-analytics'
 
+const AuthModal = dynamic(
+  () => import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal),
+  { loading: () => null }
+)
+
+const DemoRequestModal = dynamic(
+  () =>
+    import('@/app/(landing)/components/demo-request/demo-request-modal').then(
+      (m) => m.DemoRequestModal
+    ),
+  { loading: () => null }
+)
+
 const LandingPreview = dynamic(
   () =>
     import('@/app/(landing)/components/landing-preview/landing-preview').then(

diff --git a/...ding)/components/landing-preview/components/landing-preview-home/landing-preview-home.tsx b/...ding)/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/...ng)/components/landing-preview/components/landing-preview-panel/landing-preview-panel.tsx b/...ng)/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,11 @@ 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),
+  { loading: () => null }
+)
+
 type PanelTab = 'copilot' | 'editor'
 
 const EDITOR_BLOCK_ICONS: Record<string, React.ComponentType<{ className?: string }>> = {

diff --git 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,11 @@ 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),
+  { loading: () => null }
+)
+
 type DropdownId = 'docs' | 'blog' | null
 
 interface NavLink {
@@ -48,7 +53,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 +132,7 @@ export default function Navbar({ logoOnly = false, blogPosts = [] }: NavbarProps
         ) : (
           <Image
             src='/logo/sim-landing.svg'
-            alt='Sim'
+            alt=''
             width={71}
             height={22}
             className='h-[22px] w-auto'

diff --git a/apps/sim/app/(landing)/components/pricing/pricing.tsx b/apps/sim/app/(landing)/components/pricing/pricing.tsx
@@ -1,10 +1,22 @@
 'use client'
 
+import dynamic from 'next/dynamic'
 import { Badge } from '@/components/emcn'
-import { AuthModal } from '@/app/(landing)/components/auth-modal/auth-modal'
-import { DemoRequestModal } from '@/app/(landing)/components/demo-request/demo-request-modal'
 import { trackLandingCta } from '@/app/(landing)/landing-analytics'
 
+const AuthModal = dynamic(
+  () => import('@/app/(landing)/components/auth-modal/auth-modal').then((m) => m.AuthModal),
+  { loading: () => null }
+)
+
+const DemoRequestModal = dynamic(
+  () =>
+    import('@/app/(landing)/components/demo-request/demo-request-modal').then(
+      (m) => m.DemoRequestModal
+    ),
+  { loading: () => null }
+)
+
 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
@@ -470,7 +470,7 @@ export default function Templates() {
                 aria-labelledby={`template-tab-${activeIndex}`}
                 className='relative hidden flex-1 lg:block'
               >
-                <div aria-hidden='true' className='h-full'>
+                <div aria-hidden='true' inert className='h-full'>
                   <LandingPreviewWorkflow
                     key={activeIndex}
                     workflow={activeWorkflow}

diff --git a/apps/sim/app/_shell/providers/posthog-provider.tsx b/apps/sim/app/_shell/providers/posthog-provider.tsx
@@ -35,6 +35,7 @@ export function PostHogProvider({ children }: { children: React.ReactNode }) {
             capture_performance: false,
             capture_dead_clicks: false,
             enable_heatmaps: false,
+            disable_session_recording: true,
             session_recording: {
               maskAllInputs: false,
               maskInputOptions: {

diff --git a/apps/sim/app/_shell/providers/session-provider.tsx b/apps/sim/app/_shell/providers/session-provider.tsx
@@ -92,6 +92,13 @@ export function SessionProvider({ children }: { children: React.ReactNode }) {
               email_verified: data.user.emailVerified,
               created_at: data.user.createdAt,
             })
+            if (
+              typeof posthog.startSessionRecording === 'function' &&
+              typeof posthog.sessionRecordingStarted === 'function' &&
+              !posthog.sessionRecordingStarted()
+            ) {
+              posthog.startSessionRecording()
+            }
           } else {
             posthog.reset()
           }

diff --git a/apps/sim/app/workspace/[workspaceId]/home/components/mothership-chat/mothership-chat.tsx b/apps/sim/app/workspace/[workspaceId]/home/components/mothership-chat/mothership-chat.tsx
@@ -10,7 +10,10 @@ import {
 } from '@/app/workspace/[workspaceId]/home/components/message-content'
 import { PendingTagIndicator } from '@/app/workspace/[workspaceId]/home/components/message-content/components/special-tags'
 import { QueuedMessages } from '@/app/workspace/[workspaceId]/home/components/queued-messages'
-import { UserInput } from '@/app/workspace/[workspaceId]/home/components/user-input'
+import {
+  UserInput,
+  type UserInputHandle,
+} from '@/app/workspace/[workspaceId]/home/components/user-input'
 import { UserMessageContent } from '@/app/workspace/[workspaceId]/home/components/user-message-content'
 import type {
   ChatMessage,
@@ -36,14 +39,12 @@ interface MothershipChatProps {
   messageQueue: QueuedMessage[]
   onRemoveQueuedMessage: (id: string) => void
   onSendQueuedMessage: (id: string) => Promise<void>
-  onEditQueuedMessage: (id: string) => void
+  onEditQueuedMessage: (id: string) => QueuedMessage | undefined
   userId?: string
   chatId?: string
   onContextAdd?: (context: ChatContext) => void
   onContextRemove?: (context: ChatContext) => void
   onWorkspaceResourceSelect?: (resource: MothershipResource) => void
-  editValue?: string
-  onEditValueConsumed?: () => void
   layout?: 'mothership-view' | 'copilot-view'
   initialScrollBlocked?: boolean
   animateInput?: boolean
@@ -91,8 +92,6 @@ export function MothershipChat({
   onContextAdd,
   onContextRemove,
   onWorkspaceResourceSelect,
-  editValue,
-  onEditValueConsumed,
   layout = 'mothership-view',
   initialScrollBlocked = false,
   animateInput = false,
@@ -106,11 +105,24 @@ export function MothershipChat({
   })
   const hasMessages = messages.length > 0
   const initialScrollDoneRef = useRef(false)
+  const userInputRef = useRef<UserInputHandle>(null)
   const handleSendQueuedHead = useCallback(() => {
     const topMessage = messageQueue[0]
     if (!topMessage) return
     void onSendQueuedMessage(topMessage.id)
   }, [messageQueue, onSendQueuedMessage])
+  const handleEditQueued = useCallback(
+    (id: string) => {
+      const msg = onEditQueuedMessage(id)
+      if (msg) userInputRef.current?.loadQueuedMessage(msg)
+    },
+    [onEditQueuedMessage]
+  )
+  const handleEditQueuedTail = useCallback(() => {
+    const tail = messageQueue[messageQueue.length - 1]
+    if (!tail) return
+    handleEditQueued(tail.id)
+  }, [messageQueue, handleEditQueued])
 
   useLayoutEffect(() => {
     if (!hasMessages) {
@@ -205,19 +217,19 @@ export function MothershipChat({
             messageQueue={messageQueue}
             onRemove={onRemoveQueuedMessage}
             onSendNow={onSendQueuedMessage}
-            onEdit={onEditQueuedMessage}
+            onEdit={handleEditQueued}
           />
           <UserInput
+            ref={userInputRef}
             onSubmit={onSubmit}
             isSending={isStreamActive}
             onStopGeneration={onStopGeneration}
             isInitialView={false}
             userId={userId}
             onContextAdd={onContextAdd}
             onContextRemove={onContextRemove}
-            editValue={editValue}
-            onEditValueConsumed={onEditValueConsumed}
             onSendQueuedHead={handleSendQueuedHead}
+            onEditQueuedTail={handleEditQueuedTail}
           />
         </div>
       </div>