[Explore] add style persistence across refresh

[abbyhu2000]

Description

This PR does two persistence:

1. Persist the chart type and its styling configurations across refresh

Screen.Recording.2025-07-01.at.6.19.10.PM.mov

2. Persist the chart type and its styling configurations across different query execution if the new query can still be mapped to the previous chart type

Screen.Recording.2025-07-01.at.6.19.42.PM.mov

Issues Resolved

Screenshot

Testing the changes

Changelog

Check List

• All tests pass
  • yarn test:jest
  • yarn test:jest_integration
• New functionality includes testing.
• New functionality has been documented.
• Update CHANGELOG.md
• Commits are signed per the DCO using --signoff

[github-actions]

❌ Empty Changelog Section

The Changelog section in your PR description is empty. Please add a valid changelog entry or entries. If you did add a changelog entry, check to make sure that it was not accidentally included inside the comment block in the Changelog section.

[github-actions]

❌ Empty Changelog Section

The Changelog section in your PR description is empty. Please add a valid changelog entry or entries. If you did add a changelog entry, check to make sure that it was not accidentally included inside the comment block in the Changelog section.

[codecov]

Codecov Report

Attention: Patch coverage is 0% with 3 lines in your changes missing coverage. Please review.

Please upload report for BASE (query_explore@5ece016). Learn more about missing BASE report.

Files with missing lines	Patch %	Lines
...nents/visualizations/visualization_empty_state.tsx	0.00%	3 Missing ⚠️

Additional details and impacted files

@@               Coverage Diff                @@
##             query_explore   #10049   +/-   ##
================================================
  Coverage                 ?   60.09%           
================================================
  Files                    ?     4078           
  Lines                    ?   103990           
  Branches                 ?    16556           
================================================
  Hits                     ?    62491           
  Misses                   ?    37353           
  Partials                 ?     4146           

Flag	Coverage Δ
Linux_1	27.89% <ø> (?)
Linux_2	41.63% <ø> (?)
Windows_1	27.90% <ø> (?)
Windows_2	41.61% <ø> (?)
Windows_3	39.29% <ø> (?)
Windows_4	30.02% <0.00%> (?)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[github-actions]

❌ Empty Changelog Section

The Changelog section in your PR description is empty. Please add a valid changelog entry or entries. If you did add a changelog entry, check to make sure that it was not accidentally included inside the comment block in the Changelog section.

[FriedhelmWS]

Hi there, it seems that the code here doesn't really persist chart type from URL but set the set the visualizationType in visualizationData with the state we stored in redux. I think we didn't really store the chart type in URL right?

[abbyhu2000]

the redux store is in sync with the URL in src/plugins/explore/public/application/utils/state_management/utils/redux_persistence.ts thus we do store chart type and style options in URL since we stored them in the visualization tab slice.

For example, an example URL would be, where in _a we store chart type and styleOptions

_q=(dataset:(dataSource:(id:d7978560-4186-11f0-96ab-2f97beb6b9be,title:localhost9200,type:OpenSearch),id:'5THyDa_d7978560-4186-11f0-96ab-2f97beb6b9be_ff959d40-b880-11e8-a6d9-e546fe2bba5f',isRemoteDataset:!f,language:PPL,timeFieldName:order_date,title:opensearch_dashboards_sample_data_ecommerce,type:INDEX_PATTERN),language:PPL,query:'source%20%3D%20opensearch_dashboards_sample_data_ecommerce%20%7C%20stats%20count()%20by%20order_date’)&

_a=(legacy:(columns:!(_source),interval:auto,isDirty:!f,sort:!()),tab:(logs:(),visualizations:(chartType:line,styleOptions:(addLegend:!t,addTimeMarker:!f,categoryAxes:!((id:CategoryAxis-1,labels:(filter:!t,rotate:0,show:!t,truncate:100),position:bottom,show:!t,title:(text:''),type:category)),grid:(categoryLines:!f,valueLines:!f),legendPosition:right,lineMode:stepped,lineStyle:line,lineWidth:2,thresholdLines:!((color:%23E7664C,id:'1',name:'',show:!f,style:full,value:10,width:1),(color:%2354B399,id:e01b40a4-82e0-4c5e-acd5-a9c24b8a8e2c,name:'Threshold%201',show:!t,style:full,value:50,width:1)),tooltipOptions:(mode:hidden),valueAxes:!((id:ValueAxis-1,labels:(filter:!f,rotate:0,show:!t,truncate:100),name:LeftAxis-1,position:left,show:!t,title:(text:''),type:value))))),ui:(activeTabId:explore_visualization_tab,prompt:'',showDatasetFields:!t))