feat(models): add GPT-6 Astra and refresh OpenAI model pricing (#7482)

* feat(models): add GPT-6 Astra and tiered pricing

* fix(models): preserve provider pricing test seam

* fix(models): address catalog review findings

Author: waleedlatif1

apps/docs/content/docs/workflows/blocks/agent.mdx

@@ -108,7 +108,7 @@ Live tool-call chips stream for **OpenAI, Anthropic, Azure Anthropic, Google, Ve
 
 | Provider | Streamed thinking | Models |
 |----------|-------------------|--------|
-| OpenAI | Summaries only — Requires OpenAI organization verification; falls back to no summaries. | `gpt-5.6-sol`, `gpt-5.6-terra`, `gpt-5.6-luna`, `gpt-5.5-pro`, `gpt-5.5`, `gpt-5.4-pro`, `gpt-5.4`, `gpt-5.4-mini`, `gpt-5.4-nano`, `gpt-5.2-pro`, `gpt-5.2`, `gpt-5.1`, `gpt-5-pro`, `gpt-5`, `gpt-5-mini`, `gpt-5-nano`, `o4-mini`, `o3`, `o3-mini`, `o1` |
+| OpenAI | Summaries only — Requires OpenAI organization verification; falls back to no summaries. | `gpt-6-astra`, `gpt-5.6-sol`, `gpt-5.6-terra`, `gpt-5.6-luna`, `gpt-5.5-pro`, `gpt-5.5`, `gpt-5.4-pro`, `gpt-5.4`, `gpt-5.4-mini`, `gpt-5.4-nano`, `gpt-5.2-pro`, `gpt-5.2`, `gpt-5.1`, `gpt-5-pro`, `gpt-5`, `gpt-5-mini`, `gpt-5-nano`, `o4-mini`, `o3`, `o3-mini`, `o1` |
 | Anthropic | Summaries only — These generations omit full thinking; Sim requests summarized thinking on streaming runs. | `claude-fable-5-1`, `claude-fable-5`, `claude-sonnet-5`, `claude-opus-5`, `claude-opus-4-8`, `claude-opus-4-7`, `claude-opus-4-6`, `claude-sonnet-4-6`, `claude-opus-4-5`, `claude-opus-4-1`, `claude-sonnet-4-5`, `claude-haiku-4-5` |
 | Azure OpenAI | Summaries only — Requires OpenAI organization verification; falls back to no summaries. | `azure/gpt-5.4`, `azure/gpt-5.4-mini`, `azure/gpt-5.4-nano`, `azure/gpt-5.2`, `azure/gpt-5.1`, `azure/gpt-5.1-codex`, `azure/gpt-5`, `azure/gpt-5-mini`, `azure/gpt-5-nano`, `azure/o3`, `azure/o4-mini` |
 | Azure Anthropic | Summaries only — These generations omit full thinking; Sim requests summarized thinking on streaming runs. | `azure-anthropic/claude-opus-4-6`, `azure-anthropic/claude-opus-4-5`, `azure-anthropic/claude-sonnet-4-5`, `azure-anthropic/claude-opus-4-1`, `azure-anthropic/claude-haiku-4-5` |

apps/sim/app/(landing)/models/(shell)/[provider]/[model]/page.tsx

@@ -1,3 +1,4 @@
+import { Fragment } from 'react'
 import { ChipLink } from '@sim/emcn'
 import type { Metadata } from 'next'
 import { notFound } from 'next/navigation'
@@ -200,6 +201,28 @@ export default async function ModelPage({
               }
             />
             <InfoRow label='Output price' value={`${formatPrice(model.pricing.output)}/1M`} />
+            {model.pricing.tiers?.map((tier) => {
+              const threshold = formatTokenCount(tier.aboveInputTokens)
+
+              return (
+                <Fragment key={tier.aboveInputTokens}>
+                  <InfoRow
+                    label={`Input price (> ${threshold})`}
+                    value={`${formatPrice(tier.input)}/1M`}
+                  />
+                  <InfoRow
+                    label={`Cached input (> ${threshold})`}
+                    value={
+                      tier.cachedInput !== undefined ? `${formatPrice(tier.cachedInput)}/1M` : 'N/A'
+                    }
+                  />
+                  <InfoRow
+                    label={`Output price (> ${threshold})`}
+                    value={`${formatPrice(tier.output)}/1M`}
+                  />
+                </Fragment>
+              )
+            })}
             <InfoRow
               label='Context window'
               value={model.contextWindow ? formatTokenCount(model.contextWindow) : 'Unknown'}

apps/sim/app/(landing)/models/components/model-comparison-charts.tsx

@@ -13,6 +13,9 @@ const FEATURED_COMPARISON_PROVIDER_IDS = ['anthropic', 'openai', 'google']
 
 /** Max latest models pulled from each featured provider. */
 const MAX_MODELS_PER_PROVIDER = 4
+const CHART_BAR_HEIGHT = 1
+const CHART_BAR_END_RADIUS_X = 1
+const CHART_BAR_END_RADIUS_Y = 3 / 28
 
 const PROVIDER_ICON_MAP: Record<string, ComponentType<{ className?: string }>> = (() => {
   const map: Record<string, ComponentType<{ className?: string }>> = {}
@@ -24,6 +27,14 @@ const PROVIDER_ICON_MAP: Record<string, ComponentType<{ className?: string }>> =
   return map
 })()
 
+function getRoundedRightBarPath(x: number, width: number): string {
+  const right = x + width
+  const radiusX = Math.min(CHART_BAR_END_RADIUS_X, width / 2)
+  const radiusY = CHART_BAR_END_RADIUS_Y
+
+  return `M ${x} 0 H ${right - radiusX} Q ${right} 0 ${right} ${radiusY} V ${CHART_BAR_HEIGHT - radiusY} Q ${right} ${CHART_BAR_HEIGHT} ${right - radiusX} ${CHART_BAR_HEIGHT} H ${x} Z`
+}
+
 function selectComparisonModels(models: CatalogModel[]): CatalogModel[] {
   const seen = new Set<string>()
   const result: CatalogModel[] = []
@@ -96,14 +107,17 @@ function StackedCostChart({ models }: ChartProps) {
           Cost
         </h3>
         <span className='text-[var(--text-muted)] text-sm leading-[150%] tracking-[0.02em]'>
-          Per 1M tokens
+          Standard short-context rates per 1M tokens
         </span>
       </div>
 
       <div className='flex flex-col gap-1.5'>
         {data.entries.map(({ model, input, output, total }) => {
           const totalPct = data.maxTotal > 0 ? (total / data.maxTotal) * 100 : 0
           const inputPct = total > 0 ? (input / total) * 100 : 0
+          const plottedTotalPct = Math.max(totalPct, 3)
+          const plottedInputPct = (plottedTotalPct * inputPct) / 100
+          const plottedOutputPct = plottedTotalPct - plottedInputPct
           const color = getProviderColor(model.providerId)
 
           return (
@@ -113,29 +127,34 @@ function StackedCostChart({ models }: ChartProps) {
               className='-mx-2 flex items-center gap-3 rounded-md px-2 transition-colors hover:bg-[var(--surface-hover)]'
             >
               <ModelLabel model={model} />
-              <div className='relative flex h-7 min-w-0 flex-1 items-center'>
-                <div
-                  className='hidden h-full overflow-hidden rounded-r-[3px] sm:flex'
-                  style={{ width: `${Math.max(totalPct, 3)}%` }}
-                >
-                  <div
-                    className='h-full'
-                    style={{
-                      width: `${inputPct}%`,
-                      backgroundColor: color,
-                      opacity: 0.8,
-                    }}
-                  />
-                  <div
-                    className='h-full'
-                    style={{
-                      width: `${100 - inputPct}%`,
-                      backgroundColor: color,
-                      opacity: 0.35,
-                    }}
-                  />
+              <div className='flex h-7 min-w-0 flex-1 items-center gap-2.5'>
+                <div className='hidden h-full min-w-0 flex-1 sm:block'>
+                  <svg
+                    aria-hidden='true'
+                    className='size-full'
+                    preserveAspectRatio='none'
+                    viewBox='0 0 100 1'
+                  >
+                    {plottedInputPct > 0 &&
+                      (plottedOutputPct > 0 ? (
+                        <rect fill={color} fillOpacity={0.8} height='1' width={plottedInputPct} />
+                      ) : (
+                        <path
+                          d={getRoundedRightBarPath(0, plottedInputPct)}
+                          fill={color}
+                          fillOpacity={0.8}
+                        />
+                      ))}
+                    {plottedOutputPct > 0 && (
+                      <path
+                        d={getRoundedRightBarPath(plottedInputPct, plottedOutputPct)}
+                        fill={color}
+                        fillOpacity={0.35}
+                      />
+                    )}
+                  </svg>
                 </div>
-                <span className='shrink-0 text-[11px] text-[var(--text-muted)] sm:ml-2.5 sm:text-xs'>
+                <span className='shrink-0 text-[11px] text-[var(--text-muted)] sm:w-[148px] sm:text-xs'>
                   {formatPrice(input)} input / {formatPrice(output)} output
                 </span>
               </div>
@@ -184,16 +203,22 @@ function ContextWindowChart({ models }: ChartProps) {
               className='-mx-2 flex items-center gap-3 rounded-md px-2 transition-colors hover:bg-[var(--surface-hover)]'
             >
               <ModelLabel model={model} />
-              <div className='relative flex h-7 min-w-0 flex-1 items-center'>
-                <div
-                  className='h-full rounded-r-[3px]'
-                  style={{
-                    width: `${Math.max(pct, 3)}%`,
-                    backgroundColor: color,
-                    opacity: 0.8,
-                  }}
-                />
-                <span className='ml-2.5 shrink-0 text-[11px] text-[var(--text-muted)] sm:text-xs'>
+              <div className='flex h-7 min-w-0 flex-1 items-center gap-2.5'>
+                <div className='h-full min-w-0 flex-1'>
+                  <svg
+                    aria-hidden='true'
+                    className='size-full'
+                    preserveAspectRatio='none'
+                    viewBox='0 0 100 1'
+                  >
+                    <path
+                      d={getRoundedRightBarPath(0, Math.max(pct, 3))}
+                      fill={color}
+                      fillOpacity={0.8}
+                    />
+                  </svg>
+                </div>
+                <span className='w-10 shrink-0 text-right text-[11px] text-[var(--text-muted)] tabular-nums sm:text-xs'>
                   {formatTokenCount(value)}
                 </span>
               </div>
@@ -228,11 +253,11 @@ export function ModelComparisonCharts({ models }: ModelComparisonChartsProps) {
 
       <div className='h-px w-full bg-[var(--border)]' />
 
-      <div className='flex flex-col sm:flex-row'>
+      <div className='flex flex-col lg:flex-row'>
         <div className='flex-1 p-6'>
           <StackedCostChart models={comparisonModels} />
         </div>
-        <div className='h-px w-full bg-[var(--border)] sm:h-auto sm:w-px' />
+        <div className='h-px w-full bg-[var(--border)] lg:h-auto lg:w-px' />
         <div className='flex-1 p-6'>
           <ContextWindowChart models={comparisonModels} />
         </div>

apps/sim/app/(landing)/models/components/model-directory.tsx

@@ -201,14 +201,9 @@ export function ModelDirectory() {
                       className='size-8 rounded-xl'
                       iconClassName='size-4'
                     />
-                    <div className='min-w-0 flex-1'>
-                      <h4 className='text-[14px] text-[var(--text-primary)] leading-snug'>
-                        {provider.name}
-                      </h4>
-                      <p className='line-clamp-1 text-[12px] text-[var(--text-muted)] leading-[150%]'>
-                        {provider.description}
-                      </p>
-                    </div>
+                    <h4 className='min-w-0 flex-1 text-[14px] text-[var(--text-primary)] leading-snug'>
+                      {provider.name}
+                    </h4>
                   </div>
                 ))}
               </nav>

apps/sim/app/(landing)/models/utils.test.ts

@@ -1,5 +1,11 @@
 import { describe, expect, it } from 'vitest'
-import { buildModelCapabilityFacts, getEffectiveMaxOutputTokens, getModelBySlug } from './utils'
+import {
+  buildModelCapabilityFacts,
+  getEffectiveMaxOutputTokens,
+  getModelBySlug,
+  getPricingBounds,
+  getProviderBySlug,
+} from '@/app/(landing)/models/utils'
 
 describe('model catalog capability facts', () => {
   it.concurrent(
@@ -46,4 +52,15 @@ describe('model catalog capability facts', () => {
     expect(researchModel?.bestFor).toContain('research workflows')
     expect(generalModel?.bestFor).toBeUndefined()
   })
+
+  it.concurrent('features the explicitly recommended OpenAI model first', () => {
+    expect(getProviderBySlug('openai')?.featuredModels[0]?.id).toBe('gpt-6-astra')
+  })
+
+  it.concurrent('includes input-size tiers in structured pricing bounds', () => {
+    const model = getModelBySlug('openai', 'gpt-6-astra')
+
+    expect(model).not.toBeNull()
+    expect(getPricingBounds(model!.pricing)).toEqual({ lowPrice: 1, highPrice: 75 })
+  })
 })

apps/sim/app/(landing)/models/utils.ts

@@ -1,6 +1,7 @@
 import type { ComponentType } from 'react'
 import { slugify } from '@sim/utils/string'
 import { type ModelCapabilities, PROVIDER_DEFINITIONS } from '@/providers/models'
+import type { ModelPricing } from '@/providers/types'
 
 const PROVIDER_PREFIXES: Record<string, string[]> = {
   'azure-openai': ['azure/'],
@@ -95,12 +96,7 @@ const UPDATED_AT_DATE_FORMAT = new Intl.DateTimeFormat('en-US', {
   year: 'numeric',
 })
 
-export interface PricingInfo {
-  input: number
-  cachedInput?: number
-  output: number
-  updatedAt: string
-}
+export type PricingInfo = ModelPricing
 
 export interface CatalogFaq {
   question: string
@@ -124,6 +120,7 @@ export interface CatalogModel {
   contextWindow: number | null
   releaseDate: string | null
   deprecated: boolean
+  recommended: boolean
   pricing: PricingInfo
   capabilities: ModelCapabilities
   capabilityTags: string[]
@@ -444,6 +441,9 @@ function computeModelRelevanceScore(model: CatalogModel): number {
 }
 
 function compareModelsByRelevance(a: CatalogModel, b: CatalogModel): number {
+  const recommendationDifference = Number(b.recommended) - Number(a.recommended)
+  if (recommendationDifference !== 0) return recommendationDifference
+
   return computeModelRelevanceScore(b) - computeModelRelevanceScore(a)
 }
 
@@ -477,6 +477,7 @@ const rawProviders = Object.values(PROVIDER_DEFINITIONS).map((provider) => {
       contextWindow: model.contextWindow ?? null,
       releaseDate: model.releaseDate ?? null,
       deprecated: !!model.sunset,
+      recommended: model.recommended ?? false,
       pricing: model.pricing,
       capabilities: mergedCapabilities,
       capabilityTags,
@@ -587,13 +588,15 @@ export const TOP_MODEL_PROVIDERS = MODEL_PROVIDERS_WITH_CATALOGS.slice(0, 8).map
 )
 
 export function getPricingBounds(pricing: PricingInfo): { lowPrice: number; highPrice: number } {
+  const prices = [pricing, ...(pricing.tiers ?? [])].flatMap((tokenPricing) => [
+    tokenPricing.input,
+    tokenPricing.output,
+    ...(tokenPricing.cachedInput !== undefined ? [tokenPricing.cachedInput] : []),
+  ])
+
   return {
-    lowPrice: Math.min(
-      pricing.input,
-      pricing.output,
-      ...(pricing.cachedInput !== undefined ? [pricing.cachedInput] : [])
-    ),
-    highPrice: Math.max(pricing.input, pricing.output),
+    lowPrice: Math.min(...prices),
+    highPrice: Math.max(...prices),
   }
 }
 
@@ -708,14 +711,20 @@ export function buildProviderFaqs(provider: CatalogProvider): CatalogFaq[] {
 }
 
 export function buildModelFaqs(provider: CatalogProvider, model: CatalogModel): CatalogFaq[] {
+  const pricingTiers = model.pricing.tiers ?? []
   const faqs: CatalogFaq[] = [
     {
       question: `What is ${model.displayName}?`,
       answer: `${model.displayName} is a ${provider.name} model available in Sim. ${model.summary}`,
     },
     {
       question: `How much does ${model.displayName} cost?`,
-      answer: `${model.displayName} is listed at ${formatPrice(model.pricing.input)}/1M input tokens${model.pricing.cachedInput !== undefined ? `, ${formatPrice(model.pricing.cachedInput)}/1M cached input tokens` : ''}, and ${formatPrice(model.pricing.output)}/1M output tokens.`,
+      answer: `${model.displayName} starts at ${formatPrice(model.pricing.input)}/1M input tokens${model.pricing.cachedInput !== undefined ? `, ${formatPrice(model.pricing.cachedInput)}/1M cached input tokens` : ''}, and ${formatPrice(model.pricing.output)}/1M output tokens.${pricingTiers
+        .map(
+          (tier) =>
+            ` Above ${formatTokenCount(tier.aboveInputTokens)} input tokens, the full request is priced at ${formatPrice(tier.input)}/1M input tokens${tier.cachedInput !== undefined ? `, ${formatPrice(tier.cachedInput)}/1M cached input tokens` : ''}, and ${formatPrice(tier.output)}/1M output tokens.`
+        )
+        .join('')}`,
     },
     {
       question: `What is the context window for ${model.displayName}?`,

apps/sim/providers/cost-policy.test.ts

@@ -123,6 +123,31 @@ describe('priceModelUsage', () => {
     expect(tripled.total).toBeCloseTo(single.total * 3, 8)
   })
 
+  it('applies the highest matching input-size tier to every token bucket', () => {
+    const cost = priceModelUsage(
+      'gpt-5.6-terra',
+      {
+        input: 100_000,
+        output: 100_000,
+        cacheRead: 100_000,
+        cacheWrites: [{ tokens: 72_001, inputRateMultiplier: 1.25 }],
+      },
+      LIST_PRICE_POLICY
+    )
+
+    expect(cost).toMatchObject({ input: 0.800005, output: 1.8, total: 2.600005 })
+  })
+
+  it('preserves zero-cost behavior for unregistered dynamic models', () => {
+    const cost = priceModelUsage(
+      'dynamic-provider/model',
+      { input: 300_000, output: 100_000 },
+      LIST_PRICE_POLICY
+    )
+
+    expect(cost).toMatchObject({ input: 0, output: 0, total: 0 })
+  })
+
   it('charges nothing when the policy is not billable', () => {
     const cost = priceModelUsage(
       PRICED_MODEL,