feat(ios, android, web): Move from deprecated UserSettings API to the new Preferences API

[TechWilk]

BREAKING CHANGE: This update moves the library to the newer Preferences API for managing the reader font size, theme, etc.

Resolves #79

[jspizziri]

@TechWilk thanks for this PR! I'll be reviewing this week and reaching out with any questions.

[jspizziri]

@TechWilk , I pulled your branch and fired up the example project on iOS. At first glance there seem to be a number of issues. I've attached a screen recording demonstrating them below; however they are as follows:

1. The theme is not properly applying.
2. The font size and page margin are not applying at all.
3. The chapters of the ebook are not properly paged and are simply overflowing into a scrollview.

Let me know if I'm missing something.

readium-upgrade-issues-demo-compressed.mp4

[TechWilk]

That doesn't look right. I'll take another look through it. Something isn't applying the preferences properly which would explain all three issues you've listed.

The scrolling (issue 3) is now a configurable behaviour, as preferences.scroll: boolean, though it should be defaulting to false to have the existing pagination behaviour.

For clarity, I've cherry-picked the branch off a fork which is in production so I know the changes work and I've probably just missed something small in the rebasing. Clearly I didn't check it as well as I should have so apologies. As and when I get time I'll be trying to send more PRs upstream.

[jspizziri]

@TechWilk, no worries, the cherry-picking makes sense.

Another thing I found is that the Android side has a build failure:

e: file:///Users/jspizziri/Documents/Projects/react-native-readium/android/src/main/java/com/reactnativereadium/ReadiumViewManager.kt:118:26 Unresolved reference 'EpubReaderFragment'.
e: file:///Users/jspizziri/Documents/Projects/react-native-readium/android/src/main/java/com/reactnativereadium/ReadiumViewManager.kt:119:25 Unresolved reference 'EpubReaderFragment'.
e: file:///Users/jspizziri/Documents/Projects/react-native-readium/android/src/main/java/com/reactnativereadium/ReadiumViewManager.kt:120:10 Unresolved reference 'updatePreferencesFromMap'.
e: file:///Users/jspizziri/Documents/Projects/react-native-readium/android/src/main/java/com/reactnativereadium/reader/EpubReaderFragment.kt:19:36 Unresolved reference 'UserSettings'.

[TechWilk]

I've found & pushed the missing iOS code - the preferences are now applied properly.

I'll take another look at the Android build failure next week & see what I missed there.

[TechWilk]

Ok I've found the missing Android changes too so things should all be in order for you now.

[jspizziri]

@TechWilk , this is all looking great! I left a couple of questions/comments for you.

The biggest blocker at this point is that web doesn't work at all (I'm guessing you don't use web), due to the fact that the underlying reader there still uses the old settings API. I'm looking into alternatives like ts-toolkit (which is ultimately what I want to migrate to).

It may be the case that I merge this as a major version alpha or something and isolate the web issue off to a future PR.

[TechWilk]

I've addressed your comments. Let me know how you'd like to proceed with the memoization one.

You're quite right, I've never used the web portion. I can see the dilemma but without pushing forward with the preferences changes you'll get stuck with the native toolkits as they've both got major version bumps which require the new preferences. The only other option I can think of is writing a mapping function which takes the most important Preferences and maps them to their equivalent UserSettings so that react-native-readium handles the backwards compatibility for a few key settings.

[TechWilk]

Thinking about the web, I wonder if something like this is actually quite achievable for backwards compatibility, where we just convert the main settings that you care about:

eden-interactive@8614a40

[TechWilk]

Try that now, the web should now compile. I've exposed the settings used by the example. There are a couple more which aren't as easy to figure out from the TypeScript types (e.g. fontFamily: number;) and will need a little more debugging to sort out properly.

[jspizziri]

@TechWilk this is awesome! I'm going to go ahead and merge this as is. I did some experimentation with ts-toolkit and I think in the next few weeks I'll try to migrate web to that, but for now this is perfect.