fix: Dashboard crashes when adding Parse Pointer JSON to array field in data browser

[mtrezza]

New Pull Request Checklist

• I am not disclosing a vulnerability.
• I am creating this PR in reference to an issue.

Issue Description

Closes: #3079

Summary by CodeRabbit

• Refactor

  • Restructured array item rendering to display as an organized list with improved layout management.

• Style

  • Enhanced scrollbar styling for array lists with custom appearance and improved overflow handling.
  • Updated list item spacing and flex behavior for better visual alignment.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[parse-github-assistant]

🚀 Thanks for opening this pull request! We appreciate your effort in improving the project. Please let us know once your pull request is ready for review.

[parseplatformorg]

✅ Snyk checks have passed. No issues have been found so far.

Status	Scanner	Critical	High	Medium	Low	Total (0)
✅	Open Source Security	0	0	0	0	0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

[coderabbitai]

📝 Walkthrough

Walkthrough

The changes modify how array fields are displayed in the BrowserCell component. Arrays are now rendered with index-based keys in a <ul> element styled with a new .pointerList CSS class. The copyable representation is changed from JSX to JSON.stringify to avoid infinite render loops. Styling transitions from .hasMore to .pointerList with improved scrollbar behavior.

Changes

Cohort / File(s)	Summary
Array rendering and styling src/components/BrowserCell/BrowserCell.react.js, src/components/BrowserCell/BrowserCell.scss	Updated array display to use index-based keys instead of value-based keys and render items in a <ul> with .pointerList styling. Changed copyableValue from JSX to JSON.stringify() to prevent infinite render loops. Removed hasMore class logic for arrays. Replaced .hasMore CSS rules with new .pointerList block featuring flex column layout, custom WebKit scrollbar styling, and adjusted item spacing.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main change: fixing a dashboard crash when adding Parse Pointer JSON to array fields in the data browser.
Description check	✅ Passed	The PR description includes the required checklist items and references the linked issue (#3079), but lacks details on approach, affected components, and testing considerations.
Linked Issues check	✅ Passed	The code changes address the core issue by modifying array handling in BrowserCell to prevent crashes: using JSON.stringify for copyableValue instead of JSX avoids infinite render loops, and restructuring the list rendering with proper styling prevents the crash reported in #3079.
Out of Scope Changes check	✅ Passed	All changes are scoped to the BrowserCell component's array handling and associated styles, directly addressing the crash issue in #3079 without introducing unrelated modifications.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[parseplatformorg]

🎉 This change has been released in version 8.3.0-alpha.8