fix(landing): avoid unpolyfilled ES2023 array methods in client code (#5340)

toSorted/toReversed require Safari 16+/iOS 16+ and Next.js/SWC does not polyfill prototype methods (vercel/next.js#58421 closed unmerged), so #5326 broke sorting on the models page and landing preview for Safari 15/iOS 15 with a runtime TypeError. Revert the 6 call sites to [...arr].sort()/[...arr].reverse() (immutable, universally supported, matches the existing codebase idiom) and drop the ES2023 tsconfig lib override that only existed to type-check them.

Author: waleedlatif1

apps/sim/app/(landing)/components/landing-preview/components/landing-preview-logs/landing-preview-logs.tsx

@@ -141,7 +141,7 @@ export function LandingPreviewLogs() {
       : MOCK_LOGS
 
     if (!sortKey) return filtered
-    return filtered.toSorted((a, b) => {
+    return [...filtered].sort((a, b) => {
       const av = sortKey === 'cost' ? a.cost.replace(/\D/g, '') : a[sortKey]
       const bv = sortKey === 'cost' ? b.cost.replace(/\D/g, '') : b[sortKey]
       const cmp = av.localeCompare(bv, undefined, { numeric: true, sensitivity: 'base' })

apps/sim/app/(landing)/components/landing-preview/components/landing-preview-resource/landing-preview-resource.tsx

@@ -62,7 +62,7 @@ export function LandingPreviewResource({
       : rows
 
     if (!sortColId) return filtered
-    return filtered.toSorted((a, b) => {
+    return [...filtered].sort((a, b) => {
       const av = a.cells[sortColId]?.label ?? ''
       const bv = b.cells[sortColId]?.label ?? ''
       const cmp = av.localeCompare(bv, undefined, { numeric: true, sensitivity: 'base' })

apps/sim/app/(landing)/components/lifecycle/components/lifecycle-icons/lifecycle-icons.tsx

@@ -121,7 +121,7 @@ export function MonitorIcon(props: IconProps) {
   return (
     <IconFrame {...props}>
       {/* Far → near so nearer bars occlude the ones behind them. */}
-      {MONITOR_BARS.toReversed().map((bar) => (
+      {[...MONITOR_BARS].reverse().map((bar) => (
         <IsoBox key={bar.x} cx={bar.x} topY={bar.ground - bar.h} w={5} h={bar.h} />
       ))}
     </IconFrame>

apps/sim/app/(landing)/integrations/(shell)/[slug]/page.tsx

@@ -129,7 +129,7 @@ function escapeRegex(value: string): string {
  * names.
  */
 function mentionifyPromptForNames(prompt: string, names: readonly string[]): string {
-  const unique = Array.from(new Set(names.filter((n) => n.trim().length >= 2))).toSorted(
+  const unique = Array.from(new Set(names.filter((n) => n.trim().length >= 2))).sort(
     (a, b) => b.length - a.length
   )
   if (unique.length === 0) return prompt

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

@@ -27,7 +27,7 @@ function selectComparisonModels(models: CatalogModel[]): CatalogModel[] {
   const seen = new Set<string>()
   const result: CatalogModel[] = []
 
-  const sorted = models.toSorted((a, b) => {
+  const sorted = [...models].sort((a, b) => {
     const score = (m: CatalogModel) => {
       const reseller = RESELLER_PROVIDERS.has(m.providerId) ? -50 : 0
       const reasoning = m.capabilities.reasoningEffort || m.capabilities.thinking ? 10 : 0

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

@@ -513,7 +513,7 @@ const rawProviders = Object.values(PROVIDER_DEFINITIONS).map((provider) => {
     models.find((model) => model.id === provider.defaultModel)?.displayName ||
     (provider.defaultModel ? formatModelDisplayName(provider.id, provider.defaultModel) : 'Dynamic')
 
-  const featuredModels = models.toSorted(compareModelsByRelevance).slice(0, 6)
+  const featuredModels = [...models].sort(compareModelsByRelevance).slice(0, 6)
 
   return {
     id: provider.id,

apps/sim/tsconfig.json

@@ -2,7 +2,6 @@
   "extends": "@sim/tsconfig/nextjs.json",
   "compilerOptions": {
     "baseUrl": ".",
-    "lib": ["ES2023", "DOM", "DOM.Iterable"],
     "paths": {
       "@/*": ["./*"],
       "@/components/*": ["components/*"],