feat(compass-collection): Render Output Script in Result Screen - Mock Data Generator CLOUDP-333858

[jcobis]

Description

Connect the document generation engine to the result screen to render the output script.
Updates the array length map mocked up in previous PR to be simpler.

(Note that I was branching off another PR before it was merged, which is why there are some commits appended in the commit history)

Checklist

• New tests and/or benchmarks are included
• Documentation is changed or added
• If this change updates the UI, screenshots/videos are added and a design review is requested
• I have signed the MongoDB Contributor License Agreement (https://www.mongodb.com/legal/contributor-agreement)

Types of changes

• Backport Needed
• Patch (non-breaking change which fixes an issue)
• Minor (non-breaking change which adds functionality)
• Major (fix or feature that would cause existing functionality to change)

[Copilot]

Pull Request Overview

This PR connects the document generation engine to the Mock Data Generator's result screen to render the output script. It refactors the array length mapping system from a complex nested structure to a simpler flat mapping using dot notation with [] markers for arrays, and integrates this with the script generation utilities.

• Updates processSchema to return both field information and array length mapping
• Simplifies ArrayLengthMap type from nested object structure to flat Record<string, number>
• Connects the script generation to the result screen component with proper data flow

Reviewed Changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
transform-schema-to-field-info.ts	Adds array length calculation and updates processSchema to return both field info and array length map
transform-schema-to-field-info.spec.ts	Updates tests to handle new processSchema return structure with fieldInfo and arrayLengthMap properties
schema-analysis-types.ts	Adds arrayLengthMap property to SchemaAnalysisCompletedState interface
collection-tab.ts	Updates reducer and action to handle arrayLengthMap from processSchema result
to-simplified-field-info.ts	Updates function signature to accept fieldInfo property from processSchema result
script-screen.tsx	Integrates script generation with faker schema and array length map, renders actual generated script
script-generation-utils.ts	Simplifies ArrayLengthMap type and updates rendering logic to use flat dot notation paths
script-generation-utils.spec.ts	Updates test cases to use simplified array length map structure
mock-data-generator-modal.tsx	Connects array length map from schema analysis to script screen component
mock-data-generator-modal.spec.tsx	Updates tests to provide completed faker schema generation state for script screen tests

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[gribnoysup]

Just a general note, you have a lot of logic in this file formatting the script (and it still looks pretty messy) whereas we already have prettier bundled in the app and use it in other parts of the app for output code formatting, you can remove all this indenting logic and just format the script at the very end of this process:

import { prettify } from '@mongodb-js/code-editor';

// ...

funciton renderScript() {
  // ...
  return prettify(unformattedScriptString, 'javascript')
}

[jcobis]

Good to know, changed!

[gribnoysup]

This is a weird split in component responsibilities, feels better suited for the ScriptScreen. So is the property passing, all this stuff is coming from state, so you should just connect the ScriptScreen component to this state directly as the redux documentation recommends

[gribnoysup]

That's an unexpected usage of style property, this is static, so can be defined as a className outside of render with css({})

[gribnoysup]

Spacing is off here

[jcobis]

Fixed

[jcobis]

Changing some of the simpler tests to be less strict because formatting is now handled by prettier