Media: Manage media scale through Redux preferences state

[aduth]

Related: #8270

This pull request seeks to migrate the media scale preference from the legacy Flux implementation to the newer Redux-based preferences state. In doing so, it introduces a new standalone component for rendering the scale control, which is an app component controlling the preference value. This value is injected directly into the <MediaLibraryList /> component where it is used.

<MediaLibrary /> is one of two components still using <PreferencesData />, the other being <PollInvitation /> slated to be removed in #8270. If #8270 is merged before this, I will rebase and remove the <PreferencesData /> component.

Testing Instructions:

Verify that there are no regressions in behavior of the post editor media library scale control at both desktop and mobile viewport sizes. Notably, you should confirm that the media scale allows smooth scrolling between predefined scale options and that a network request to save the preference is triggered after a one second delay. Upon refreshing, your preference should be persisted.

Ensure that Mocha tests pass:

npm run test-client

cc @deBhal @nylen

[matticbot]

Test live: https://calypso.live/?branch=update/media-redux-preferences

[deBhal]

#8270 Is merged and deployed, so you're clear to drop PreferencesData

[aduth]

#8270 Is merged and deployed, so you're clear to drop PreferencesData

Rebased and removed. Thanks!

[nylen]

I left a note about adding some more explanation to our scaling constants. An alternative would be to explicitly deal with the number of media items per row in the code, which is what it is really trying to achieve (it was written in the quickest way to get from what existed to what we wanted). But that's a pre-existing issue and not necessary for this PR to achieve its goals.

The code looks good, and nice to see the removed component and getting the scaling logic moved into its own component.

This works well. The new approach of rendering both the slider and the mobile controls (and showing the correct one via CSS) also eliminates some weirdness around changing viewport sizes.

[nylen]

This seems a bit "magical" on its own - I would add a comment similar to what was there before:

// Choices are 12, 8, 6, 4, and 3 items per row, with some horizontal padding between items

[aduth]

Thanks for the review @nylen . I added documentation for the constants in the rebased 3c8b4c2.