Update reader width live when updating in reader view (#581)

Basically, instead of updating the width of the image after clicking
`ok`, the width is adjusted live, which makes it easier to figure out
the right value for the manga being viewed.

While implementing this, I realized we can't update the backend every
time we re-render when `liveUpdate` is true, so I've updated the logic
for persisting settings to support skipping the API call to save the
settings in the backend, and only perform the API it when the user
clicks ok on the number setting.

Signed-off-by: Chance Zibolski <chance.zibolski@gmail.com>

src/components/navbar/ReaderNavBar.tsx

@@ -118,7 +118,7 @@ const OpenDrawerButton = styled(IconButton)(({ theme }) => ({
 
 interface IProps {
     settings: IReaderSettings;
-    setSettingValue: (key: keyof IReaderSettings, value: AllowedMetadataValueTypes) => void;
+    setSettingValue: (key: keyof IReaderSettings, value: AllowedMetadataValueTypes, persist?: boolean) => void;
     manga: TManga;
     chapter: TChapter;
     curPage: number;
@@ -150,10 +150,10 @@ export function ReaderNavBar(props: IProps) {
 
     const disableChapterNavButtons = retrievingNextChapter;
 
-    const updateSettingValue = (key: keyof IReaderSettings, value: AllowedMetadataValueTypes) => {
+    const updateSettingValue = (key: keyof IReaderSettings, value: AllowedMetadataValueTypes, persist?: boolean) => {
         // prevent closing the navBar when updating the "staticNav" setting
         setUpdateDrawerOnRender(key !== 'staticNav');
-        setSettingValue(key, value);
+        setSettingValue(key, value, persist);
     };
 
     const updateDrawer = (open: boolean) => {