Reading Settings: Adding 'Blogs post' setting to the new Reading Settings page

[mashikag]

Proposed Changes

• Add Blogs post setting to the new Reading Settings page

Testing Instructions

• Run local version of calypso
• Go to http://calypso.localhost:3000/settings/reading/<YOUR-BLOG>
• Ensure the setting:
  • displays the correct value
  • can be modified and saved
• Validate that the modified value actually affects how many posts are displayed on a blog posts page
• Smile

Pre-merge Checklist

• Have you written new tests for your changes?
• Have you tested the feature in Simple (P9HQHe-k8-p2), Atomic (P9HQHe-jW-p2), and self-hosted Jetpack sites (PCYsg-g6b-p2)?
• Have you checked for TypeScript, React or other console errors?
• Have you used memoizing on expensive computations? More info in Memoizing with create-selector and Using memoizing selectors and Our Approach to Data
• Have we added the "[Status] String Freeze" label as soon as any new strings were ready for translation (p4TIVU-5Jq-p2)?
• For changes affecting Jetpack: Have we added the "[Status] Needs Privacy Updates" label if this pull request changes what data or activity we track or use (p4TIVU-ajp-p2)?

Closes #70410

[github-actions]

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-51169

Jetpack Cloud live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-51169&env=jetpack

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

App Entrypoints (~4 bytes added 📈 [gzipped])

name           parsed_size           gzip_size
entry-stepper        +63 B  (+0.0%)       +4 B  (+0.0%)
entry-main           +63 B  (+0.0%)       +3 B  (+0.0%)

Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.

Sections (~7701 bytes added 📈 [gzipped])

name              parsed_size            gzip_size
settings-reading     +26025 B  (+10.2%)    +7701 B  (+9.2%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[ivan-ottinger]

I know the PR hasn't been marked for review yet, but since I was looking at it, I thought I could just share a couple things I noticed anyways (even though there's a chance you have been already planning to apply some of them in the future commits). 🙂

[ivan-ottinger]

Second review round

Tested with Simple, Atomic and Jetpack-connected sites. The posts_per_page setting loads and saves correctly and the change reflects instantly on the site.

I did not notice any regressions, nor JS/React errors/warnings, neither issues with the code.

Since the feature is still behind the feature flag and hasn't been launched, we don't need to wait for string translations. 👍🏼

[a8ci18n]

This Pull Request is now available for translation here: https://translate.wordpress.com/deliverables/7663442

Thank you @mashikag for including a screenshot in the description! This is really helpful for our translators.

[a8ci18n]

Translation for this Pull Request has now been finished.