Skip to content

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

Merged
waleedlatif1 merged 1 commit into
stagingfrom
fix-client-tosorted
Jul 1, 2026
Merged

fix(landing): avoid unpolyfilled ES2023 array methods (toSorted/toReversed) in client code#5340
waleedlatif1 merged 1 commit into
stagingfrom
fix-client-tosorted

Conversation

@waleedlatif1

Copy link
Copy Markdown
Collaborator

Summary

  • Array.prototype.toSorted/toReversed (ES2023) require Safari 16+ / iOS 16+ and Next.js/SWC does not polyfill prototype methods (vercel/next.js#58421 was closed unmerged per maintainer policy). So the react-doctor pass in improvement(landing): react-doctor health pass across the landing surface #5326 introduced a runtime TypeError: … toSorted is not a function on Safari 15 / iOS 15 — breaking sorting on the models page and the landing preview (logs/resource) plus the lifecycle monitor icon.
  • Reverts the 6 call sites to [...arr].sort() / [...arr].reverse() — immutable (copies first), universally supported, and matching the existing codebase idiom (8 other [...x].sort() sites).
  • Drops the "lib": ["ES2023", …] override in apps/sim/tsconfig.json that only existed to type-check toSorted; back on the inherited ES2022 lib, these methods no longer type-check, restoring the guardrail against re-introduction.
  • Swept the entire repo (apps + packages): these were the only toSorted/toReversed/toSpliced usages — the issue exists nowhere else.

Type of Change

  • Bug fix

Testing

tsc --noEmit clean on the ES2022 baseline (0 errors), biome check clean, bun run lint clean. Verified no remaining ES2023 array-method usages repo-wide. Browser support + Next.js no-polyfill behavior validated against caniuse and the Next.js issue/PR threads.

Checklist

  • Code follows project style guidelines
  • Self-reviewed my changes
  • Tests added/updated and passing
  • No new warnings introduced
  • I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

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.
@vercel

vercel Bot commented Jul 1, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Skipped Skipped Jul 1, 2026 11:14pm

Request Review

@cursor

cursor Bot commented Jul 1, 2026

Copy link
Copy Markdown

PR Summary

Low Risk
Behavior-preserving compatibility swap on landing/marketing surfaces; no auth, data, or API changes.

Overview
Fixes Safari 15 / iOS 15 runtime failures (toSorted / toReversed is not a function) on landing UI where Next.js does not polyfill those ES2023 prototype methods.

All six call sites now use [...arr].sort() or [...arr].reverse() instead of toSorted / toReversed, keeping the same immutable-sort behavior in landing preview logs/resource tables, models comparison and featured-model ordering, integration prompt mention sorting, and the lifecycle monitor icon bar draw order.

apps/sim/tsconfig.json drops the local lib: ES2023 override so TypeScript falls back to the inherited ES2022 lib and no longer types those methods—reducing the chance they get reintroduced without runtime support.

Reviewed by Cursor Bugbot for commit 6677cb6. Configure here.

@greptile-apps

greptile-apps Bot commented Jul 1, 2026

Copy link
Copy Markdown
Contributor

Greptile Summary

This PR fixes a runtime TypeError on Safari 15 / iOS 15 introduced by a previous refactor that adopted ES2023 Array.prototype.toSorted/toReversed — methods that Next.js/SWC does not polyfill and that are absent in older Safari versions. All six call sites are reverted to the immutable spread-then-sort/reverse idiom already used throughout the codebase.

  • Six toSorted()/toReversed() calls across five landing-page files are replaced with [...arr].sort() / [...arr].reverse(), preserving immutability while restoring universal browser compatibility.
  • The "lib": ["ES2023", ...] override in apps/sim/tsconfig.json is removed, restoring the inherited ES2022 TypeScript lib so these methods no longer type-check and cannot silently re-enter the codebase.

Confidence Score: 5/5

Safe to merge — all changes are minimal, targeted replacements of ES2023 array methods with universally-supported equivalents, plus a tsconfig cleanup that restores a type-level guardrail.

Every substitution is semantically equivalent: [...arr].sort() and [...arr].reverse() produce the same immutable result as toSorted/toReversed and match the idiom used in eight other places in the codebase. The integrations/[slug]/page.tsx case calls .sort() directly on a fresh Array.from() result — no external array is mutated. Removing the ES2023 lib override from tsconfig.json is a one-line change that only restricts which type definitions are available, with no runtime effect. No new logic is introduced.

No files require special attention.

Important Files Changed

Filename Overview
apps/sim/app/(landing)/components/landing-preview/components/landing-preview-logs/landing-preview-logs.tsx Replaces filtered.toSorted() with [...filtered].sort() — semantically identical, universally compatible.
apps/sim/app/(landing)/components/landing-preview/components/landing-preview-resource/landing-preview-resource.tsx Replaces filtered.toSorted() with [...filtered].sort() — same pattern as logs fix, correct.
apps/sim/app/(landing)/components/lifecycle/components/lifecycle-icons/lifecycle-icons.tsx Replaces MONITOR_BARS.toReversed() with [...MONITOR_BARS].reverse() — spread avoids mutating the constant, behavior preserved.
apps/sim/app/(landing)/integrations/(shell)/[slug]/page.tsx Replaces .toSorted() with .sort() on a fresh Array.from() result — no mutation of shared state, safe fix.
apps/sim/app/(landing)/models/components/model-comparison-charts.tsx Replaces models.toSorted() with [...models].sort() — immutable sort on passed-in array, correct.
apps/sim/app/(landing)/models/utils.ts Replaces models.toSorted() with [...models].sort() — correct immutable replacement.
apps/sim/tsconfig.json Drops the "lib": ["ES2023", ...] override, restoring the inherited ES2022 baseline and re-enabling the type-system guardrail against toSorted/toReversed/toSpliced.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[Client renders landing page] --> B{Browser supports ES2023 Array methods?}
    B -- Safari 16+ or Chrome or Firefox --> C[toSorted / toReversed works]
    B -- Safari 15 or iOS 15 or older --> D[TypeError - method not found]

    subgraph Fix Applied
        E["spread array first: ...arr"] --> F["call .sort() or .reverse() on copy"]
        F --> H[Original unchanged - all browsers supported]
    end

    D -- PR fix --> E
    C -- PR fix --> E
Loading
%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
flowchart TD
    A[Client renders landing page] --> B{Browser supports ES2023 Array methods?}
    B -- Safari 16+ or Chrome or Firefox --> C[toSorted / toReversed works]
    B -- Safari 15 or iOS 15 or older --> D[TypeError - method not found]

    subgraph Fix Applied
        E["spread array first: ...arr"] --> F["call .sort() or .reverse() on copy"]
        F --> H[Original unchanged - all browsers supported]
    end

    D -- PR fix --> E
    C -- PR fix --> E
Loading

Reviews (1): Last reviewed commit: "fix(landing): avoid unpolyfilled ES2023 ..." | Re-trigger Greptile

@waleedlatif1 waleedlatif1 merged commit 4e8b88f into staging Jul 1, 2026
17 checks passed
@waleedlatif1 waleedlatif1 deleted the fix-client-tosorted branch July 1, 2026 23:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant