@sfenton/react-native-readium-with-cfi/lib/web/hooks/useSettingsObserver.js

A react-native wrapper for https://readium.org/ with CFI support

import { useDeepCompareEffect } from 'use-deep-compare';
export const useSettingsObserver = (reader, preferences) => {
    useDeepCompareEffect(() => {
        if (reader && preferences) {
            const settings = preferencesToUserSettings(preferences);
            reader?.applyUserSettings(settings);
        }
    }, [preferences, !!reader]);
};
const preferencesToUserSettings = (preferences) => ({
    appearance: preferences.theme
        ? themeToUserSettingsAppearance(preferences.theme)
        : undefined,
    fontSize: preferences.fontSize ? preferences.fontSize * 100 : undefined,
    // fontOverride: boolean;
    // fontFamily: number;
    verticalScroll: preferences.scroll,
    columnCount: columnCountToUserSettingsColumnCount(preferences.columnCount),
    // direction: number;
    wordSpacing: preferences.wordSpacing,
    letterSpacing: preferences.letterSpacing,
    pageMargins: preferences.pageMargins,
    lineHeight: preferences.lineHeight,
    // userProperties?: UserProperties;
    // view: BookView;
});
const themeToUserSettingsAppearance = (theme) => {
    if (theme === 'dark') {
        return 'night';
    }
    if (theme === 'sepia') {
        return 'sepia';
    }
    return 'day';
};
const columnCountToUserSettingsColumnCount = (columnCount) => {
    if (columnCount === '1') {
        return 1;
    }
    if (columnCount === '2') {
        return 2;
    }
    return undefined;
};