feat(source): Add ArthurScans

LNReader/lnreader-sources#71

.expo-shared/assets.json

@@ -1,4 +0,0 @@
-{
-  "12bb71342c6255bbf50437ec8f4441c083f47cdb74bd89160c15e4f43e52a1cb": true,
-  "40b842e832070c58deac6aa9e08fa459302ee3f9da492c7e77d93d2fbf4a56fd": true
-}

.github/workflows/build.yml

@@ -0,0 +1,45 @@
+name: CI
+on:
+    push:
+        branches:
+            - main
+jobs:
+    install-and-test:
+        name: Install dependencies
+        runs-on: ubuntu-latest
+        steps:
+            - uses: actions/checkout@v2
+            - name: Install npm dependencies
+              run: |
+                  npm install
+
+    build-android:
+        name: Build app
+        needs: install-and-test
+        runs-on: ubuntu-latest
+        steps:
+            - uses: actions/checkout@v2
+            - name: Install Dependencies
+              run: |
+                  npm install
+
+            - name: Cache Gradle Wrapper
+              uses: actions/cache@v2
+              with:
+                  path: ~/.gradle/wrapper
+                  key: ${{ runner.os }}-gradle-wrapper-${{ hashFiles('gradle/wrapper/gradle-wrapper.properties') }}
+
+            - name: Cache Gradle Dependencies
+              uses: actions/cache@v2
+              with:
+                  path: ~/.gradle/caches
+                  key: ${{ runner.os }}-gradle-caches-${{ hashFiles('gradle/wrapper/gradle-wrapper.properties') }}
+                  restore-keys: |
+                      ${{ runner.os }}-gradle-caches-
+
+            - name: Make Gradlew Executable
+              run: cd android && chmod +x ./gradlew
+
+            - name: Build Android Release
+              run: |
+                  cd android && ./gradlew assembleRelease --no-daemon

.gitignore

@@ -11,3 +11,63 @@ web-build/
 
 # macOS
 .DS_Store
+
+# @generated expo-cli sync-2138f1e3e130677ea10ea873f6d498e3890e677b
+# The following patterns were generated by expo-cli
+
+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+project.xcworkspace
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+*.hprof
+
+# node.js
+#
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# BUCK
+buck-out/
+\.buckd/
+*.keystore
+!debug.keystore
+
+# Bundle artifacts
+*.jsbundle
+
+# CocoaPods
+/ios/Pods/
+
+# Expo
+.expo/
+web-build/
+
+# @end expo-cli

App.js

@@ -1,18 +1,23 @@
 import React, { useEffect } from "react";
+import { StatusBar } from "react-native";
+
 import { useFonts } from "expo-font";
 import { Provider as PaperProvider } from "react-native-paper";
-import Main from "./src/Navigators/Main";
-
 import { Provider } from "react-redux";
 import { persistor, store } from "./src/redux/store";
 import { PersistGate } from "redux-persist/lib/integration/react";
-import { createDB, deleteDb } from "./src/Database/DBHelper";
-import { fonts } from "./src/Theme/fonts";
+import * as SplashScreen from "expo-splash-screen";
+
+import Main from "./src/navigators/Main";
+
+import { createDB } from "./src/database/DBHelper";
+import { fonts } from "./src/theme/fonts";
 
 const App = () => {
     const [loaded] = useFonts(fonts);
 
     useEffect(() => {
+        SplashScreen.preventAutoHideAsync();
         createDB();
     }, []);
 
@@ -24,6 +29,10 @@ const App = () => {
         <Provider store={store}>
             <PersistGate loading={null} persistor={persistor}>
                 <PaperProvider>
+                    <StatusBar
+                        translucent={true}
+                        backgroundColor="transparent"
+                    />
                     <Main />
                 </PaperProvider>
             </PersistGate>

README.md

@@ -1,20 +1,41 @@
-<h1 align="center">
-  <br>
-  LNReader
-  <br>
-</h1>
-
-<p align="center">LNReader is a Tachiyomi-like, free and open source light novel reader for Android.</p>
-
----
-
-## Screenshots:
 <p align="center">
-<img src="./.github/readme-images/screenshots.png" align="center" height="350" />
+  <img src="./.github/readme-images/icon_alt.png" align="center" width="128" />
+<p>
+<h1 align="center">
+  LNReader
+</h1>
+<p align="center">
+  LNReader is a Tachiyomi-like, free and open source light novel reader for Android.
+</p>
+<div align="center">
+  <a href="https://github.com/LNReader/lnreader/actions/workflows/build.yml">
+    <img alt="GitHub Workflow Status" src="https://img.shields.io/github/workflow/status/LNReader/lnreader/CI">
+  </a>
+  <a href="https://discord.gg/QdcWN4MD63">
+    <img alt="Discord Chat" src="https://img.shields.io/discord/835746409357246465.svg?logo=discord&logoColor=white&logoWidth=20&labelColor=7289DA&label=Discord&color=17cf48">
+  </a>
+  <a href="https://github.com/LNReader/lnreader/releases/latest">
+    <img alt="GitHub release (latest by date)" src="https://img.shields.io/github/v/release/LNReader/lnreader">
+  </a>
+  <a href="https://github.com/LNReader/lnreader/blob/main/LICENSE">
+    <img alt="GitHub" src="https://img.shields.io/github/license/LNReader/lnreader">
+  </a>
+</div>
+
+<br>
+<br>
+
+<p align="center">
+  <img src="./.github/readme-images/screenshots.png" align="center" />
 </p>
 
 ## Download
 Get the app from our [releases page](https://github.com/rajarsheechatterjee/LNReader/releases).
 
+## Sources
+LNReader does not have any affiliation with the content providers available.
+
+Source requests should be created at [LNReader/lnreader-sources](https://github.com/LNReader/lnreader-sources).
+
 ## License
 [MIT ](https://github.com/rajarsheechatterjee/lnreader/blob/main/LICENSE)

android/app/BUCK

@@ -0,0 +1,55 @@
+# To learn about Buck see [Docs](https://buckbuild.com/).
+# To run your application with Buck:
+# - install Buck
+# - `npm start` - to start the packager
+# - `cd android`
+# - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"`
+# - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck
+# - `buck install -r android/app` - compile, install and run application
+#
+
+load(":build_defs.bzl", "create_aar_targets", "create_jar_targets")
+
+lib_deps = []
+
+create_aar_targets(glob(["libs/*.aar"]))
+
+create_jar_targets(glob(["libs/*.jar"]))
+
+android_library(
+    name = "all-libs",
+    exported_deps = lib_deps,
+)
+
+android_library(
+    name = "app-code",
+    srcs = glob([
+        "src/main/java/**/*.java",
+    ]),
+    deps = [
+        ":all-libs",
+        ":build_config",
+        ":res",
+    ],
+)
+
+android_build_config(
+    name = "build_config",
+    package = "com.rajarsheechatterjee.LNReader",
+)
+
+android_resource(
+    name = "res",
+    package = "com.rajarsheechatterjee.LNReader",
+    res = "src/main/res",
+)
+
+android_binary(
+    name = "app",
+    keystore = "//android/keystores:debug",
+    manifest = "src/main/AndroidManifest.xml",
+    package_type = "debug",
+    deps = [
+        ":app-code",
+    ],
+)

android/app/build.gradle

@@ -0,0 +1,219 @@
+apply plugin: "com.android.application"
+
+import com.android.build.OutputFile
+
+/**
+ * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets
+ * and bundleReleaseJsAndAssets).
+ * These basically call `react-native bundle` with the correct arguments during the Android build
+ * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
+ * bundle directly from the development server. Below you can see all the possible configurations
+ * and their defaults. If you decide to add a configuration block, make sure to add it before the
+ * `apply from: "../../node_modules/react-native/react.gradle"` line.
+ *
+ * project.ext.react = [
+ *   // the name of the generated asset file containing your JS bundle
+ *   bundleAssetName: "index.android.bundle",
+ *
+ *   // the entry file for bundle generation. If none specified and
+ *   // "index.android.js" exists, it will be used. Otherwise "index.js" is
+ *   // default. Can be overridden with ENTRY_FILE environment variable.
+ *   entryFile: "index.android.js",
+ *
+ *   // https://reactnative.dev/docs/performance#enable-the-ram-format
+ *   bundleCommand: "ram-bundle",
+ *
+ *   // whether to bundle JS and assets in debug mode
+ *   bundleInDebug: false,
+ *
+ *   // whether to bundle JS and assets in release mode
+ *   bundleInRelease: true,
+ *
+ *   // whether to bundle JS and assets in another build variant (if configured).
+ *   // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants
+ *   // The configuration property can be in the following formats
+ *   //         'bundleIn${productFlavor}${buildType}'
+ *   //         'bundleIn${buildType}'
+ *   // bundleInFreeDebug: true,
+ *   // bundleInPaidRelease: true,
+ *   // bundleInBeta: true,
+ *
+ *   // whether to disable dev mode in custom build variants (by default only disabled in release)
+ *   // for example: to disable dev mode in the staging build type (if configured)
+ *   devDisabledInStaging: true,
+ *   // The configuration property can be in the following formats
+ *   //         'devDisabledIn${productFlavor}${buildType}'
+ *   //         'devDisabledIn${buildType}'
+ *
+ *   // the root of your project, i.e. where "package.json" lives
+ *   root: "../../",
+ *
+ *   // where to put the JS bundle asset in debug mode
+ *   jsBundleDirDebug: "$buildDir/intermediates/assets/debug",
+ *
+ *   // where to put the JS bundle asset in release mode
+ *   jsBundleDirRelease: "$buildDir/intermediates/assets/release",
+ *
+ *   // where to put drawable resources / React Native assets, e.g. the ones you use via
+ *   // require('./image.png')), in debug mode
+ *   resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",
+ *
+ *   // where to put drawable resources / React Native assets, e.g. the ones you use via
+ *   // require('./image.png')), in release mode
+ *   resourcesDirRelease: "$buildDir/intermediates/res/merged/release",
+ *
+ *   // by default the gradle tasks are skipped if none of the JS files or assets change; this means
+ *   // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
+ *   // date; if you have any other folders that you want to ignore for performance reasons (gradle
+ *   // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
+ *   // for example, you might want to remove it from here.
+ *   inputExcludes: ["android/**", "ios/**"],
+ *
+ *   // override which node gets called and with what additional arguments
+ *   nodeExecutableAndArgs: ["node"],
+ *
+ *   // supply additional arguments to the packager
+ *   extraPackagerArgs: []
+ * ]
+ */
+
+project.ext.react = [
+    enableHermes: true
+]
+
+apply from: '../../node_modules/react-native-unimodules/gradle.groovy'
+apply from: "../../node_modules/react-native/react.gradle"
+apply from: "../../node_modules/expo-constants/scripts/get-app-config-android.gradle"
+apply from: "../../node_modules/expo-updates/scripts/create-manifest-android.gradle"
+
+/**
+ * Set this to true to create two separate APKs instead of one:
+ *   - An APK that only works on ARM devices
+ *   - An APK that only works on x86 devices
+ * The advantage is the size of the APK is reduced by about 4MB.
+ * Upload all the APKs to the Play Store and people will download
+ * the correct one based on the CPU architecture of their device.
+ */
+def enableSeparateBuildPerCPUArchitecture = false
+
+/**
+ * Run Proguard to shrink the Java bytecode in release builds.
+ */
+def enableProguardInReleaseBuilds = false
+
+/**
+ * The preferred build flavor of JavaScriptCore.
+ *
+ * For example, to use the international variant, you can use:
+ * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
+ *
+ * The international variant includes ICU i18n library and necessary data
+ * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
+ * give correct results when using with locales other than en-US.  Note that
+ * this variant is about 6MiB larger per architecture than default.
+ */
+def jscFlavor = 'org.webkit:android-jsc:+'
+
+/**
+ * Whether to enable the Hermes VM.
+ *
+ * This should be set on project.ext.react and mirrored here.  If it is not set
+ * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode
+ * and the benefits of using Hermes will therefore be sharply reduced.
+ */
+def enableHermes = project.ext.react.get("enableHermes", false);
+
+android {
+    compileSdkVersion rootProject.ext.compileSdkVersion
+
+    compileOptions {
+        sourceCompatibility JavaVersion.VERSION_1_8
+        targetCompatibility JavaVersion.VERSION_1_8
+    }
+
+    defaultConfig {
+        applicationId 'com.rajarsheechatterjee.LNReader'
+        minSdkVersion rootProject.ext.minSdkVersion
+        targetSdkVersion rootProject.ext.targetSdkVersion
+        versionCode 1
+        versionName "1.1.4"
+    }
+    splits {
+        abi {
+            reset()
+            enable enableSeparateBuildPerCPUArchitecture
+            universalApk false  // If true, also generate a universal APK
+            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
+        }
+    }
+    signingConfigs {
+        debug {
+            storeFile file('debug.keystore')
+            storePassword 'android'
+            keyAlias 'androiddebugkey'
+            keyPassword 'android'
+        }
+    }
+    buildTypes {
+        debug {
+            signingConfig signingConfigs.debug
+        }
+        release {
+            // Caution! In production, you need to generate your own keystore file.
+            // see https://reactnative.dev/docs/signed-apk-android.
+            signingConfig signingConfigs.debug
+            minifyEnabled enableProguardInReleaseBuilds
+            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
+        }
+    }
+
+    // applicationVariants are e.g. debug, release
+    applicationVariants.all { variant ->
+        variant.outputs.each { output ->
+            // For each separate APK per architecture, set a unique version code as described here:
+            // https://developer.android.com/studio/build/configure-apk-splits.html
+            def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
+            def abi = output.getFilter(OutputFile.ABI)
+            if (abi != null) {  // null for the universal-debug, universal-release variants
+                output.versionCodeOverride =
+                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
+            }
+
+        }
+    }
+}
+
+dependencies {
+    implementation fileTree(dir: "libs", include: ["*.jar"])
+    //noinspection GradleDynamicVersion
+    implementation "com.facebook.react:react-native:+"  // From node_modules
+    implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
+    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
+      exclude group:'com.facebook.fbjni'
+    }
+    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
+        exclude group:'com.facebook.flipper'
+        exclude group:'com.squareup.okhttp3', module:'okhttp'
+    }
+    debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
+        exclude group:'com.facebook.flipper'
+    }
+    addUnimodulesDependencies()
+
+    if (enableHermes) {
+        def hermesPath = "../../node_modules/hermes-engine/android/";
+        debugImplementation files(hermesPath + "hermes-debug.aar")
+        releaseImplementation files(hermesPath + "hermes-release.aar")
+    } else {
+        implementation jscFlavor
+    }
+}
+
+// Run this once to be able to run the application with BUCK
+// puts all compile dependencies into folder libs for BUCK to use
+task copyDownloadableDepsToLibs(type: Copy) {
+    from configurations.compile
+    into 'libs'
+}
+
+apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

android/app/build_defs.bzl

@@ -0,0 +1,19 @@
+"""Helper definitions to glob .aar and .jar targets"""
+
+def create_aar_targets(aarfiles):
+    for aarfile in aarfiles:
+        name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")]
+        lib_deps.append(":" + name)
+        android_prebuilt_aar(
+            name = name,
+            aar = aarfile,
+        )
+
+def create_jar_targets(jarfiles):
+    for jarfile in jarfiles:
+        name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")]
+        lib_deps.append(":" + name)
+        prebuilt_jar(
+            name = name,
+            binary_jar = jarfile,
+        )

android/app/proguard-rules.pro

@@ -0,0 +1,10 @@
+# Add project specific ProGuard rules here.
+# By default, the flags in this file are appended to flags specified
+# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
+# You can edit the include path and order by changing the proguardFiles
+# directive in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# Add any project specific keep options here:

android/app/src/debug/AndroidManifest.xml

@@ -0,0 +1,7 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+
+    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
+</manifest>

android/app/src/debug/java/com/lnreader/ReactNativeFlipper.java

@@ -0,0 +1,69 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * <p>This source code is licensed under the MIT license found in the LICENSE file in the root
+ * directory of this source tree.
+ */
+package com.lnreader;
+
+import android.content.Context;
+import com.facebook.flipper.android.AndroidFlipperClient;
+import com.facebook.flipper.android.utils.FlipperUtils;
+import com.facebook.flipper.core.FlipperClient;
+import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
+import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
+import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
+import com.facebook.flipper.plugins.inspector.DescriptorMapping;
+import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
+import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
+import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
+import com.facebook.flipper.plugins.react.ReactFlipperPlugin;
+import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.modules.network.NetworkingModule;
+import okhttp3.OkHttpClient;
+
+public class ReactNativeFlipper {
+  public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
+    if (FlipperUtils.shouldEnableFlipper(context)) {
+      final FlipperClient client = AndroidFlipperClient.getInstance(context);
+      client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
+      client.addPlugin(new ReactFlipperPlugin());
+      client.addPlugin(new DatabasesFlipperPlugin(context));
+      client.addPlugin(new SharedPreferencesFlipperPlugin(context));
+      client.addPlugin(CrashReporterPlugin.getInstance());
+      NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
+      NetworkingModule.setCustomClientBuilder(
+          new NetworkingModule.CustomClientBuilder() {
+            @Override
+            public void apply(OkHttpClient.Builder builder) {
+              builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
+            }
+          });
+      client.addPlugin(networkFlipperPlugin);
+      client.start();
+      // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
+      // Hence we run if after all native modules have been initialized
+      ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
+      if (reactContext == null) {
+        reactInstanceManager.addReactInstanceEventListener(
+            new ReactInstanceManager.ReactInstanceEventListener() {
+              @Override
+              public void onReactContextInitialized(ReactContext reactContext) {
+                reactInstanceManager.removeReactInstanceEventListener(this);
+                reactContext.runOnNativeModulesQueueThread(
+                    new Runnable() {
+                      @Override
+                      public void run() {
+                        client.addPlugin(new FrescoFlipperPlugin());
+                      }
+                    });
+              }
+            });
+      } else {
+        client.addPlugin(new FrescoFlipperPlugin());
+      }
+    }
+  }
+}

android/app/src/main/AndroidManifest.xml

@@ -0,0 +1,89 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android" 
+  	package="com.rajarsheechatterjee.LNReader">
+
+	<!-- Internet -->
+  	<uses-permission android:name="android.permission.INTERNET"/>
+  	<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
+
+	<!-- Storage -->
+  	<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
+	<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
+
+	<!-- For background jobs -->
+  	<uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
+    <uses-permission android:name="android.permission.WAKE_LOCK"/>
+
+
+  	<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+  	<uses-permission android:name="android.permission.READ_PHONE_STATE"/>
+  	<uses-permission android:name="android.permission.VIBRATE"/>
+  	<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS"/>
+  	<uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
+  	<uses-permission android:name="com.google.android.c2dm.permission.RECEIVE"/>
+
+  	<application 
+	  	android:name=".MainApplication" 
+		android:label="@string/app_name"
+		android:icon="@mipmap/ic_launcher"
+		android:roundIcon="@mipmap/ic_launcher_round"
+		android:allowBackup="true"
+		android:theme="@style/AppTheme"
+		android:usesCleartextTraffic="true">
+    
+		<meta-data
+			android:name="expo.modules.updates.EXPO_UPDATE_URL"
+			android:value="https://exp.host/@rajarsheechatterjee/LNReader"/>
+    	
+		<meta-data
+			android:name="expo.modules.updates.EXPO_SDK_VERSION"
+			android:value="41.0.0"/>
+    
+		<meta-data
+			android:name="expo.modules.updates.ENABLED"
+			android:value="false"/>
+	
+		<meta-data
+			android:name="expo.modules.updates.EXPO_UPDATES_CHECK_ON_LAUNCH"
+			android:value="ALWAYS"/>
+	
+		<meta-data
+			android:name="expo.modules.updates.EXPO_UPDATES_LAUNCH_WAIT_MS"
+			android:value="0"/>
+	
+		<meta-data
+			android:name="expo.modules.notifications.default_notification_icon"
+			android:resource="@drawable/notification_icon"/>
+	
+		<meta-data
+			android:name="expo.modules.notifications.default_notification_color"
+			android:resource="@color/notification_icon_color"/>
+    
+		<activity
+			android:name=".MainActivity"
+			android:label="@string/app_name"
+			android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
+			android:launchMode="singleTask"
+			android:windowSoftInputMode="adjustResize"
+			android:theme="@style/Theme.App.SplashScreen"
+			android:screenOrientation="unspecified">
+			
+      		<intent-filter>
+      		  <action android:name="android.intent.action.MAIN"/>
+      		  <category android:name="android.intent.category.LAUNCHER"/>
+      		</intent-filter>
+      		
+			<intent-filter>
+      		  <action android:name="android.intent.action.VIEW"/>
+      		  <category android:name="android.intent.category.DEFAULT"/>
+      		  <category android:name="android.intent.category.BROWSABLE"/>
+      		  <data android:scheme="lnreader"/>
+      		  <data android:scheme="com.rajarsheechatterjee.LNReader"/>
+      		</intent-filter>
+		</activity>
+    	
+		<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
+    
+		<service android:name="com.asterinet.react.bgactions.RNBackgroundActionsTask" />
+		
+  	</application>
+</manifest>

android/app/src/main/java/com/rajarsheechatterjee/LNReader/MainActivity.java

@@ -0,0 +1,71 @@
+package com.rajarsheechatterjee.LNReader;
+import android.content.res.Configuration;
+import android.content.Intent;
+
+import android.os.Bundle;
+import android.graphics.Color;
+import android.view.WindowManager;
+import android.os.Build;
+import android.view.View;
+import android.view.Window;
+
+import com.facebook.react.ReactActivity;
+import com.facebook.react.ReactActivityDelegate;
+import com.facebook.react.ReactRootView;
+import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;
+
+import expo.modules.splashscreen.singletons.SplashScreen;
+import expo.modules.splashscreen.SplashScreenImageResizeMode;
+
+
+public class MainActivity extends ReactActivity {
+
+    // Added automatically by Expo Config
+    @Override
+    public void onConfigurationChanged(Configuration newConfig) {
+        super.onConfigurationChanged(newConfig);
+        Intent intent = new Intent("onConfigurationChanged");
+        intent.putExtra("newConfig", newConfig);
+        sendBroadcast(intent);
+    }
+
+    @Override
+    protected void onCreate(Bundle savedInstanceState) {
+      // SplashScreen.show(...) has to be called after super.onCreate(...)
+      // Below line is handled by '@expo/configure-splash-screen' command and it's discouraged to modify it manually
+      if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {
+          WindowManager.LayoutParams layoutParams = new WindowManager.LayoutParams();
+          layoutParams.layoutInDisplayCutoutMode = WindowManager.LayoutParams.LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES;
+          getWindow().setAttributes(layoutParams);
+      }
+
+      Window w = getWindow();
+      w.setStatusBarColor(Color.TRANSPARENT);
+      w.setNavigationBarColor(Color.TRANSPARENT);
+      w.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
+
+      super.onCreate(savedInstanceState);
+      SplashScreen.show(this, SplashScreenImageResizeMode.COVER, ReactRootView.class, false);
+
+    }
+
+
+    /**
+     * Returns the name of the main component registered from JavaScript.
+     * This is used to schedule rendering of the component.
+     */
+    @Override
+    protected String getMainComponentName() {
+        return "main";
+    }
+
+    @Override
+    protected ReactActivityDelegate createReactActivityDelegate() {
+        return new ReactActivityDelegate(this, getMainComponentName()) {
+            @Override
+            protected ReactRootView createRootView() {
+                return new RNGestureHandlerEnabledRootView(MainActivity.this);
+            }
+        };
+    }
+}

android/app/src/main/java/com/rajarsheechatterjee/LNReader/MainApplication.java

@@ -0,0 +1,128 @@
+package com.rajarsheechatterjee.LNReader;
+
+import android.app.Application;
+import android.content.Context;
+import android.net.Uri;
+
+import com.facebook.react.PackageList;
+import com.facebook.react.ReactApplication;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.ReactNativeHost;
+import com.facebook.react.ReactPackage;
+import com.facebook.react.shell.MainReactPackage;
+import com.facebook.soloader.SoLoader;
+import com.rajarsheechatterjee.LNReader.generated.BasePackageList;
+
+import org.unimodules.adapters.react.ReactAdapterPackage;
+import org.unimodules.adapters.react.ModuleRegistryAdapter;
+import org.unimodules.adapters.react.ReactModuleRegistryProvider;
+import org.unimodules.core.interfaces.Package;
+import org.unimodules.core.interfaces.SingletonModule;
+import expo.modules.constants.ConstantsPackage;
+import expo.modules.permissions.PermissionsPackage;
+import expo.modules.filesystem.FileSystemPackage;
+import expo.modules.updates.UpdatesController;
+
+import com.facebook.react.bridge.JSIModulePackage;
+import com.swmansion.reanimated.ReanimatedJSIModulePackage;
+
+import java.lang.reflect.InvocationTargetException;
+import java.util.Arrays;
+import java.util.List;
+import javax.annotation.Nullable;
+
+public class MainApplication extends Application implements ReactApplication {
+  private final ReactModuleRegistryProvider mModuleRegistryProvider = new ReactModuleRegistryProvider(
+    new BasePackageList().getPackageList()
+  );
+
+  private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
+    @Override
+    public boolean getUseDeveloperSupport() {
+      return BuildConfig.DEBUG;
+    }
+
+    @Override
+    protected List<ReactPackage> getPackages() {
+      List<ReactPackage> packages = new PackageList(this).getPackages();
+      packages.add(new ModuleRegistryAdapter(mModuleRegistryProvider));
+      return packages;
+    }
+
+    @Override
+    protected String getJSMainModuleName() {
+      return "index";
+    }
+
+    @Override
+    protected JSIModulePackage getJSIModulePackage() {
+      return new ReanimatedJSIModulePackage();
+    }
+
+    @Override
+    protected @Nullable String getJSBundleFile() {
+      if (BuildConfig.DEBUG) {
+        return super.getJSBundleFile();
+      } else {
+        return UpdatesController.getInstance().getLaunchAssetFile();
+      }
+    }
+
+    @Override
+    protected @Nullable String getBundleAssetName() {
+      if (BuildConfig.DEBUG) {
+        return super.getBundleAssetName();
+      } else {
+        return UpdatesController.getInstance().getBundleAssetName();
+      }
+    }
+  };
+
+  @Override
+  public ReactNativeHost getReactNativeHost() {
+    return mReactNativeHost;
+  }
+
+  @Override
+  public void onCreate() {
+    super.onCreate();
+    SoLoader.init(this, /* native exopackage */ false);
+
+    if (!BuildConfig.DEBUG) {
+      UpdatesController.initialize(this);
+    }
+
+    initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
+  }
+
+  /**
+   * Loads Flipper in React Native templates. Call this in the onCreate method with something like
+   * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
+   *
+   * @param context
+   * @param reactInstanceManager
+   */
+  private static void initializeFlipper(
+      Context context, ReactInstanceManager reactInstanceManager) {
+    if (BuildConfig.DEBUG) {
+      try {
+        /*
+         We use reflection here to pick up the class that initializes Flipper,
+        since Flipper library is not available in release mode
+        */
+        Class<?> aClass = Class.forName("com.rajarsheechatterjee.LNReader.ReactNativeFlipper");
+        aClass
+            .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
+            .invoke(null, context, reactInstanceManager);
+      } catch (ClassNotFoundException e) {
+        e.printStackTrace();
+      } catch (NoSuchMethodException e) {
+        e.printStackTrace();
+      } catch (IllegalAccessException e) {
+        e.printStackTrace();
+      } catch (InvocationTargetException e) {
+        e.printStackTrace();
+      }
+    }
+  }
+}

android/app/src/main/java/com/rajarsheechatterjee/LNReader/generated/BasePackageList.java

@@ -0,0 +1,28 @@
+package com.rajarsheechatterjee.LNReader.generated;
+
+import java.util.Arrays;
+import java.util.List;
+import org.unimodules.core.interfaces.Package;
+
+public class BasePackageList {
+  public List<Package> getPackageList() {
+    return Arrays.<Package>asList(
+        new expo.modules.application.ApplicationPackage(),
+        new expo.modules.constants.ConstantsPackage(),
+        new expo.modules.documentpicker.DocumentPickerPackage(),
+        new expo.modules.errorrecovery.ErrorRecoveryPackage(),
+        new expo.modules.filesystem.FileSystemPackage(),
+        new expo.modules.font.FontLoaderPackage(),
+        new expo.modules.haptics.HapticsPackage(),
+        new expo.modules.imageloader.ImageLoaderPackage(),
+        new expo.modules.keepawake.KeepAwakePackage(),
+        new expo.modules.lineargradient.LinearGradientPackage(),
+        new expo.modules.notifications.NotificationsPackage(),
+        new expo.modules.permissions.PermissionsPackage(),
+        new expo.modules.splashscreen.SplashScreenPackage(),
+        new expo.modules.sqlite.SQLitePackage(),
+        new expo.modules.updates.UpdatesPackage(),
+        new expo.modules.webbrowser.WebBrowserPackage()
+    );
+  }
+}

android/app/src/main/res/drawable/splashscreen.xml

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+  This file was created by '@expo/configure-splash-screen' and some of it's content shouldn't be modified by hand
+-->
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+  <item android:drawable="@color/splashscreen_background"/>
+</layer-list>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/iconBackground"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/iconBackground"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

android/app/src/main/res/values/colors.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<resources>
+  <color name="iconBackground">#FFFFFF</color>
+  <color name="splashscreen_background">#000000</color>
+  <color name="colorPrimary">#023c69</color>
+  <color name="colorPrimaryDark">#00000000</color>
+  <color name="navigationBarColor">#000000</color>
+  <color name="notification_icon_color">#00adb5</color>
+</resources>

android/app/src/main/res/values/strings.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<resources>
+  <string name="app_name">LNReader</string>
+</resources>

android/app/src/main/res/values/styles.xml

@@ -0,0 +1,23 @@
+<?xml
+  version="1.0"
+  encoding="UTF-8"
+  standalone="yes"
+?>
+<resources>
+  <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
+    <item name="android:textColor">#000000</item>
+    <item name="colorPrimary">@color/colorPrimary</item>
+    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
+    <item name="android:navigationBarColor">#000000</item>
+    <item name="android:statusBarColor">#000000</item>
+    
+  </style>
+  <style name="Theme.App.SplashScreen" parent="Theme.AppCompat.Light.NoActionBar">
+    <!-- Below line is handled by '@expo/configure-splash-screen' command and it's discouraged to modify it manually -->
+    <!-- Customize your splash screen theme here -->
+    <item name="android:windowBackground">@drawable/splashscreen</item>
+    <item name="android:navigationBarColor">#000000</item>
+    <item name="android:statusBarColor">#000000</item>
+   
+  </style>
+</resources>

android/build.gradle

@@ -0,0 +1,38 @@
+// Top-level build file where you can add configuration options common to all sub-projects/modules.
+
+buildscript {
+    ext {
+        buildToolsVersion = "29.0.3"
+        minSdkVersion = 21
+        compileSdkVersion = 30
+        targetSdkVersion = 30
+    }
+    repositories {
+        google()
+        jcenter()
+    }
+    dependencies {
+        classpath("com.android.tools.build:gradle:4.1.0")
+
+        // NOTE: Do not place your application dependencies here; they belong
+        // in the individual module build.gradle files
+    }
+}
+
+allprojects {
+    repositories {
+        mavenLocal()
+        maven {
+            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
+            url("$rootDir/../node_modules/react-native/android")
+        }
+        maven {
+            // Android JSC is installed from npm
+            url("$rootDir/../node_modules/jsc-android/dist")
+        }
+
+        google()
+        jcenter()
+        maven { url 'https://www.jitpack.io' }
+    }
+}

android/gradle.properties

@@ -0,0 +1,29 @@
+# Project-wide Gradle settings.
+
+# IDE (e.g. Android Studio) users:
+# Gradle settings configured through the IDE *will override*
+# any settings specified in this file.
+
+# For more details on how to configure your build environment visit
+# http://www.gradle.org/docs/current/userguide/build_environment.html
+
+# Specifies the JVM arguments used for the daemon process.
+# The setting is particularly useful for tweaking memory settings.
+# Default value: -Xmx10248m -XX:MaxPermSize=256m
+org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8
+
+# When configured, Gradle will run in incubating parallel mode.
+# This option should only be used with decoupled projects. More details, visit
+# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
+# org.gradle.parallel=true
+
+# AndroidX package structure to make it clearer which packages are bundled with the
+# Android operating system, and which are packaged with your app's APK
+# https://developer.android.com/topic/libraries/support-library/androidx-rn
+android.useAndroidX=true
+
+# Automatically convert third-party libraries to use AndroidX
+android.enableJetifier=true
+
+# Version of flipper SDK to use with React Native
+FLIPPER_VERSION=0.54.0

android/gradle/wrapper/gradle-wrapper.properties

@@ -0,0 +1,5 @@
+distributionBase=GRADLE_USER_HOME
+distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.8-all.zip
+zipStoreBase=GRADLE_USER_HOME
+zipStorePath=wrapper/dists

android/gradlew

@@ -0,0 +1,183 @@
+#!/usr/bin/env sh
+
+#
+# Copyright 2015 the original author or authors.
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      https://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+
+##############################################################################
+##
+##  Gradle start up script for UN*X
+##
+##############################################################################
+
+# Attempt to set APP_HOME
+# Resolve links: $0 may be a link
+PRG="$0"
+# Need this for relative symlinks.
+while [ -h "$PRG" ] ; do
+    ls=`ls -ld "$PRG"`
+    link=`expr "$ls" : '.*-> \(.*\)$'`
+    if expr "$link" : '/.*' > /dev/null; then
+        PRG="$link"
+    else
+        PRG=`dirname "$PRG"`"/$link"
+    fi
+done
+SAVED="`pwd`"
+cd "`dirname \"$PRG\"`/" >/dev/null
+APP_HOME="`pwd -P`"
+cd "$SAVED" >/dev/null
+
+APP_NAME="Gradle"
+APP_BASE_NAME=`basename "$0"`
+
+# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
+
+# Use the maximum available, or set MAX_FD != -1 to use that value.
+MAX_FD="maximum"
+
+warn () {
+    echo "$*"
+}
+
+die () {
+    echo
+    echo "$*"
+    echo
+    exit 1
+}
+
+# OS specific support (must be 'true' or 'false').
+cygwin=false
+msys=false
+darwin=false
+nonstop=false
+case "`uname`" in
+  CYGWIN* )
+    cygwin=true
+    ;;
+  Darwin* )
+    darwin=true
+    ;;
+  MINGW* )
+    msys=true
+    ;;
+  NONSTOP* )
+    nonstop=true
+    ;;
+esac
+
+CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
+
+# Determine the Java command to use to start the JVM.
+if [ -n "$JAVA_HOME" ] ; then
+    if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
+        # IBM's JDK on AIX uses strange locations for the executables
+        JAVACMD="$JAVA_HOME/jre/sh/java"
+    else
+        JAVACMD="$JAVA_HOME/bin/java"
+    fi
+    if [ ! -x "$JAVACMD" ] ; then
+        die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+    fi
+else
+    JAVACMD="java"
+    which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+fi
+
+# Increase the maximum file descriptors if we can.
+if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then
+    MAX_FD_LIMIT=`ulimit -H -n`
+    if [ $? -eq 0 ] ; then
+        if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then
+            MAX_FD="$MAX_FD_LIMIT"
+        fi
+        ulimit -n $MAX_FD
+        if [ $? -ne 0 ] ; then
+            warn "Could not set maximum file descriptor limit: $MAX_FD"
+        fi
+    else
+        warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT"
+    fi
+fi
+
+# For Darwin, add options to specify how the application appears in the dock
+if $darwin; then
+    GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\""
+fi
+
+# For Cygwin or MSYS, switch paths to Windows format before running java
+if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
+    APP_HOME=`cygpath --path --mixed "$APP_HOME"`
+    CLASSPATH=`cygpath --path --mixed "$CLASSPATH"`
+    JAVACMD=`cygpath --unix "$JAVACMD"`
+
+    # We build the pattern for arguments to be converted via cygpath
+    ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null`
+    SEP=""
+    for dir in $ROOTDIRSRAW ; do
+        ROOTDIRS="$ROOTDIRS$SEP$dir"
+        SEP="|"
+    done
+    OURCYGPATTERN="(^($ROOTDIRS))"
+    # Add a user-defined pattern to the cygpath arguments
+    if [ "$GRADLE_CYGPATTERN" != "" ] ; then
+        OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)"
+    fi
+    # Now convert the arguments - kludge to limit ourselves to /bin/sh
+    i=0
+    for arg in "$@" ; do
+        CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -`
+        CHECK2=`echo "$arg"|egrep -c "^-"`                                 ### Determine if an option
+
+        if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then                    ### Added a condition
+            eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"`
+        else
+            eval `echo args$i`="\"$arg\""
+        fi
+        i=`expr $i + 1`
+    done
+    case $i in
+        0) set -- ;;
+        1) set -- "$args0" ;;
+        2) set -- "$args0" "$args1" ;;
+        3) set -- "$args0" "$args1" "$args2" ;;
+        4) set -- "$args0" "$args1" "$args2" "$args3" ;;
+        5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
+        6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
+        7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
+        8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
+        9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
+    esac
+fi
+
+# Escape application args
+save () {
+    for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
+    echo " "
+}
+APP_ARGS=`save "$@"`
+
+# Collect all arguments for the java command, following the shell quoting and substitution rules
+eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS"
+
+exec "$JAVACMD" "$@"

android/gradlew.bat

@@ -0,0 +1,103 @@
+@rem
+@rem Copyright 2015 the original author or authors.
+@rem
+@rem Licensed under the Apache License, Version 2.0 (the "License");
+@rem you may not use this file except in compliance with the License.
+@rem You may obtain a copy of the License at
+@rem
+@rem      https://www.apache.org/licenses/LICENSE-2.0
+@rem
+@rem Unless required by applicable law or agreed to in writing, software
+@rem distributed under the License is distributed on an "AS IS" BASIS,
+@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+@rem See the License for the specific language governing permissions and
+@rem limitations under the License.
+@rem
+
+@if "%DEBUG%" == "" @echo off
+@rem ##########################################################################
+@rem
+@rem  Gradle startup script for Windows
+@rem
+@rem ##########################################################################
+
+@rem Set local scope for the variables with windows NT shell
+if "%OS%"=="Windows_NT" setlocal
+
+set DIRNAME=%~dp0
+if "%DIRNAME%" == "" set DIRNAME=.
+set APP_BASE_NAME=%~n0
+set APP_HOME=%DIRNAME%
+
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
+@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
+
+@rem Find java.exe
+if defined JAVA_HOME goto findJavaFromJavaHome
+
+set JAVA_EXE=java.exe
+%JAVA_EXE% -version >NUL 2>&1
+if "%ERRORLEVEL%" == "0" goto init
+
+echo.
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:findJavaFromJavaHome
+set JAVA_HOME=%JAVA_HOME:"=%
+set JAVA_EXE=%JAVA_HOME%/bin/java.exe
+
+if exist "%JAVA_EXE%" goto init
+
+echo.
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:init
+@rem Get command-line arguments, handling Windows variants
+
+if not "%OS%" == "Windows_NT" goto win9xME_args
+
+:win9xME_args
+@rem Slurp the command line arguments.
+set CMD_LINE_ARGS=
+set _SKIP=2
+
+:win9xME_args_slurp
+if "x%~1" == "x" goto execute
+
+set CMD_LINE_ARGS=%*
+
+:execute
+@rem Setup the command line
+
+set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%
+
+:end
+@rem End local scope for the variables with windows NT shell
+if "%ERRORLEVEL%"=="0" goto mainEnd
+
+:fail
+rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
+rem the _cmd.exe /c_ return code!
+if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
+exit /b 1
+
+:mainEnd
+if "%OS%"=="Windows_NT" endlocal
+
+:omega

android/settings.gradle

@@ -0,0 +1,9 @@
+rootProject.name = 'LNReader'
+
+apply from: '../node_modules/react-native-unimodules/gradle.groovy'
+includeUnimodulesProjects()
+
+apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle");
+applyNativeModulesSettingsGradle(settings)
+
+include ':app'

app.json

@@ -3,44 +3,9 @@
         "name": "LNReader",
         "slug": "LNReader",
         "scheme": "lnreader",
-        "version": "1.0.19",
-        "orientation": "default",
-        "icon": "./assets/icon.png",
-        "splash": {
-            "image": "./assets/splash.png",
-            "resizeMode": "cover",
-            "backgroundColor": "#000000"
-        },
-        "updates": {
-            "fallbackToCacheTimeout": 0,
-            "enabled": false
-        },
         "notification": {
             "icon": "./assets/notification.png",
             "color": "#00adb5"
-        },
-        "assetBundlePatterns": ["**/*"],
-        "ios": {
-            "supportsTablet": true
-        },
-        "android": {
-            "adaptiveIcon": {
-                "foregroundImage": "./assets/icon.png",
-                "backgroundColor": "#FFFFFF"
-            },
-            "package": "com.rajarsheechatterjee.LNReader"
-        },
-        "androidStatusBar": {
-            "barStyle": "light-content",
-            "backgroundColor": "#00000000",
-            "translucent": true
-        },
-        "androidNavigationBar": {
-            "barStyle": "light-content",
-            "backgroundColor": "#000000"
-        },
-        "web": {
-            "favicon": "./assets/favicon.png"
         }
     }
 }

index.js

@@ -0,0 +1,9 @@
+import 'react-native-gesture-handler';
+import { registerRootComponent } from 'expo';
+
+import App from './App';
+
+// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
+// It also ensures that whether you load the app in Expo Go or in a native build,
+// the environment is set up appropriately
+registerRootComponent(App);

metro.config.js

@@ -0,0 +1,4 @@
+// Learn more https://docs.expo.io/guides/customizing-metro
+const { getDefaultConfig } = require('expo/metro-config');
+
+module.exports = getDefaultConfig(__dirname);

package.json

@@ -1,9 +1,8 @@
 {
-  "main": "node_modules/expo/AppEntry.js",
   "scripts": {
-    "start": "expo start",
-    "android": "expo start --android",
-    "ios": "expo start --ios",
+    "start": "react-native start",
+    "android": "react-native run-android",
+    "ios": "react-native run-ios",
     "web": "expo start --web",
     "eject": "expo eject"
   },
@@ -16,48 +15,60 @@
     "@react-navigation/native": "^5.8.10",
     "@react-navigation/stack": "^5.12.8",
     "expo": "^41.0.1",
-    "expo-background-fetch": "~9.1.0",
     "expo-document-picker": "^9.1.2",
     "expo-file-system": "~11.0.2",
     "expo-font": "~9.1.0",
+    "expo-haptics": "~10.0.0",
     "expo-linear-gradient": "~9.1.0",
     "expo-linking": "~2.2.3",
     "expo-notifications": "~0.11.6",
-    "expo-permissions": "^12.0.1",
-    "expo-sharing": "~9.1.2",
-    "expo-speech": "~9.1.0",
+    "expo-splash-screen": "^0.11.2",
     "expo-sqlite": "~9.1.0",
-    "expo-status-bar": "~1.0.4",
-    "expo-task-manager": "~9.1.0",
+    "expo-updates": "~0.5.4",
     "expo-web-browser": "~9.1.0",
     "moment": "^2.29.1",
     "qs": "^6.10.1",
     "react": "16.13.1",
     "react-dom": "16.13.1",
-    "react-native": "https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz",
-    "react-native-collapsible-header-views": "^1.1.2",
+    "react-native": "^0.64.2",
+    "react-native-background-actions": "^2.6.1",
+    "react-native-cheerio": "^1.0.0-rc.4",
+    "react-native-device-info": "^8.1.3",
     "react-native-easing-gradient": "^0.1.2",
-    "react-native-fit-image": "^1.5.5",
+    "react-native-fast-image": "^8.3.4",
     "react-native-gesture-handler": "~1.10.2",
-    "react-native-offline": "^5.7.0",
+    "react-native-navigation-bar-color": "^2.0.1",
+    "react-native-pager-view": "^5.1.10",
     "react-native-paper": "^4.5.0",
-    "react-native-reanimated": "~2.1.0",
+    "react-native-reanimated": "^2.1.0",
     "react-native-safe-area-context": "3.2.0",
     "react-native-screens": "~3.0.0",
+    "react-native-swipe-gestures": "^1.0.5",
     "react-native-tab-view": "^3.0.1",
+    "react-native-tts": "^4.1.0",
+    "react-native-unimodules": "~0.13.3",
     "react-native-vector-icons": "^7.1.0",
-    "react-native-web": "~0.13.12",
-    "react-native-webview": "11.2.3",
+    "react-native-web": "^0.16.5",
+    "react-native-webview": "^11.6.2",
     "react-redux": "^7.2.2",
     "redux": "^4.0.5",
-    "redux-devtools-extension": "^2.13.9",
     "redux-persist": "^6.0.0",
     "redux-thunk": "^2.3.0",
-    "rn-sliding-up-panel": "^2.4.4",
-    "react-native-pager-view": "5.0.12"
+    "rn-sliding-up-panel": "^2.4.4"
   },
   "devDependencies": {
     "@babel/core": "~7.9.0"
   },
-  "private": true
+  "prettier": {
+    "tabWidth": 4,
+    "semi": true,
+    "singleQuote": false,
+    "quoteProps": "as-needed",
+    "trailingComma": "es5",
+    "bracketSpacing": true,
+    "arrowParens": "always"
+  },
+  "private": true,
+  "name": "lnreader",
+  "version": "1.0.0"
 }

src/Components/Appbar.js

@@ -1,142 +0,0 @@
-import React, { useRef } from "react";
-import { View, TextInput, StyleSheet } from "react-native";
-import {
-    TouchableRipple,
-    IconButton,
-    Appbar as MaterialAppbar,
-} from "react-native-paper";
-import Constants from "expo-constants";
-
-import { useNavigation } from "@react-navigation/native";
-import { useSelector } from "react-redux";
-
-export const Appbar = ({ title, onBackAction, style, children }) => {
-    const theme = useSelector((state) => state.settingsReducer.theme);
-
-    return (
-        <MaterialAppbar.Header
-            style={[{ backgroundColor: theme.colorPrimary }, style]}
-        >
-            {onBackAction && (
-                <MaterialAppbar.BackAction onPress={onBackAction} />
-            )}
-            <MaterialAppbar.Content
-                title={title}
-                titleStyle={{ color: theme.textColorPrimary }}
-            />
-            {children}
-        </MaterialAppbar.Header>
-    );
-};
-
-export const SearchAppbar = ({
-    placeholder,
-    getSearchResults,
-    setSearchText,
-    searchText,
-    getNovels,
-    setLoading,
-    screen,
-    openWebView,
-}) => {
-    const searchRef = useRef(null);
-
-    const navigation = useNavigation();
-
-    const theme = useSelector((state) => state.settingsReducer.theme);
-
-    return (
-        <TouchableRipple
-            borderless
-            onPress={() => searchRef.current.focus()}
-            style={[
-                styles.searchAppbarContainer,
-                { backgroundColor: theme.searchBarColor },
-            ]}
-        >
-            <View
-                style={{
-                    flex: 1,
-                    flexDirection: "row",
-                    justifyContent: "space-between",
-                }}
-            >
-                <View style={{ flex: 1, flexDirection: "row" }}>
-                    {screen === "Library" ? (
-                        <IconButton
-                            icon="magnify"
-                            color={theme.textColorSecondary}
-                            style={{ marginLeft: 0 }}
-                            size={23}
-                        />
-                    ) : (
-                        <IconButton
-                            icon="arrow-left"
-                            color={theme.textColorSecondary}
-                            style={{ marginLeft: 0 }}
-                            size={23}
-                            onPress={() => navigation.goBack()}
-                        />
-                    )}
-                    <TextInput
-                        ref={searchRef}
-                        style={{
-                            fontSize: 16,
-                            color: theme.textColorSecondary,
-                        }}
-                        placeholder={placeholder}
-                        placeholderTextColor={theme.textColorSecondary}
-                        onChangeText={(text) => {
-                            setSearchText(text);
-                            if (screen === "Library") {
-                                getSearchResults(text);
-                            }
-                        }}
-                        onSubmitEditing={() => {
-                            if (screen === "Extension") {
-                                getSearchResults(searchText);
-                            }
-                        }}
-                        defaultValue={searchText}
-                    />
-                </View>
-                {searchText !== "" && (
-                    <IconButton
-                        icon="close"
-                        color={theme.textColorSecondary}
-                        style={{ marginRight: 0 }}
-                        size={23}
-                        onPress={() => {
-                            setLoading?.(true);
-                            getNovels();
-                            setSearchText("");
-                        }}
-                    />
-                )}
-                {openWebView && (
-                    <IconButton
-                        icon="earth"
-                        color={theme.textColorSecondary}
-                        style={{ marginRight: 0 }}
-                        size={23}
-                        onPress={openWebView}
-                    />
-                )}
-            </View>
-        </TouchableRipple>
-    );
-};
-
-const styles = StyleSheet.create({
-    searchAppbarContainer: {
-        marginTop: Constants.statusBarHeight + 8,
-        height: 48,
-        flexDirection: "row",
-        alignItems: "center",
-        paddingHorizontal: 16,
-        marginBottom: 12,
-        borderRadius: 8,
-        marginHorizontal: 12,
-        elevation: 2,
-    },
-});

src/Components/List.js

@@ -1,92 +0,0 @@
-import React from "react";
-import { StyleSheet } from "react-native";
-
-import { List, Divider as PaperDivider } from "react-native-paper";
-import MaterialCommunityIcons from "react-native-vector-icons/MaterialCommunityIcons";
-
-const ListSection = ({ children }) => (
-    <List.Section style={styles.listSection}>{children}</List.Section>
-);
-
-const ListSubHeader = ({ children, theme }) => (
-    <List.Subheader
-        style={[styles.listSubHeader, { color: theme.colorAccent }]}
-    >
-        {children}
-    </List.Subheader>
-);
-
-const ListItem = ({
-    title,
-    description,
-    icon,
-    onPress,
-    theme,
-    right,
-    iconColor,
-    titleStyle,
-    style,
-}) => (
-    <List.Item
-        title={title}
-        style={style}
-        titleStyle={[{ color: theme.textColorPrimary }, titleStyle]}
-        description={description}
-        descriptionStyle={{ color: theme.textColorSecondary }}
-        descriptionNumberOfLines={1}
-        left={() =>
-            icon && (
-                <List.Icon
-                    color={theme.colorAccent}
-                    icon={icon}
-                    style={{ marginVertical: 0 }}
-                />
-            )
-        }
-        right={() =>
-            right && (
-                <MaterialCommunityIcons
-                    name={right}
-                    color={iconColor || "#47a84a"}
-                    size={23}
-                    style={{ marginRight: 16, textAlignVertical: "center" }}
-                />
-            )
-        }
-        onPress={onPress}
-        rippleColor={theme.rippleColor}
-    />
-);
-
-const Divider = ({ theme }) => (
-    <PaperDivider style={{ backgroundColor: theme.dividerColor, height: 1 }} />
-);
-
-const InfoItem = ({ title, icon, theme }) => (
-    <List.Item
-        title={title}
-        titleStyle={{ color: theme.textColorSecondary, fontSize: 14 }}
-        titleNumberOfLines={5}
-        left={() =>
-            icon && (
-                <List.Icon
-                    color={theme.textColorSecondary}
-                    icon={icon}
-                    style={{ marginVertical: 0 }}
-                />
-            )
-        }
-    />
-);
-
-export { ListSection, ListSubHeader, ListItem, Divider, InfoItem };
-
-const styles = StyleSheet.create({
-    listSection: {
-        flex: 1,
-        marginVertical: 0,
-    },
-    listSubHeader: {
-        paddingBottom: 5,
-    },
-});

src/Components/ListView.js

@@ -1,64 +0,0 @@
-import React from "react";
-import { StyleSheet, View, Text, Image } from "react-native";
-import { TouchableRipple } from "react-native-paper";
-
-const ListView = ({ item, downloadBadge, unreadBadge, theme, onPress }) => {
-    return (
-        <TouchableRipple
-            borderless
-            centered
-            rippleColor={theme.rippleColor}
-            style={styles.listView}
-            onPress={onPress}
-        >
-            <>
-                <Image
-                    source={{ uri: item.novelCover }}
-                    style={styles.extensionIcon}
-                />
-                <Text
-                    style={[
-                        { color: theme.textColorPrimary },
-                        styles.novelName,
-                    ]}
-                    numberOfLines={1}
-                >
-                    {item.novelName}
-                </Text>
-                <View style={styles.badgeContainer}>
-                    {downloadBadge}
-                    {unreadBadge}
-                </View>
-            </>
-        </TouchableRipple>
-    );
-};
-
-export default ListView;
-
-const styles = StyleSheet.create({
-    listView: {
-        flex: 1,
-        flexDirection: "row",
-        alignItems: "center",
-        paddingVertical: 8,
-        paddingHorizontal: 12,
-    },
-    extensionIcon: {
-        width: 40,
-        height: 40,
-        borderRadius: 4,
-    },
-    novelName: {
-        flex: 1,
-        marginLeft: 16,
-        fontSize: 15,
-        paddingRight: 8,
-        flexWrap: "wrap",
-    },
-    badgeContainer: {
-        flexDirection: "row",
-        justifyContent: "flex-end",
-        alignItems: "flex-end",
-    },
-});

src/Components/NovelCover.js

@@ -1,188 +0,0 @@
-import React from "react";
-import { StyleSheet, View, Text, ImageBackground, Image } from "react-native";
-import { LinearGradient } from "expo-linear-gradient";
-import { TouchableRipple } from "react-native-paper";
-
-import { useSelector } from "react-redux";
-import { useSettings, useTheme } from "../Hooks/reduxHooks";
-import ListView from "./ListView";
-
-const NovelCover = ({ item, onPress, libraryStatus }) => {
-    const theme = useTheme();
-    const { displayMode, novelsPerRow, showDownloadBadges, showUnreadBadges } =
-        useSettings();
-
-    const height = {
-        1: 550,
-        2: 280,
-        3: 180,
-        4: 140,
-        5: 100,
-    };
-
-    const comfortableTitle = () =>
-        displayMode === 1 && (
-            <Text
-                numberOfLines={2}
-                style={[
-                    styles.title,
-                    {
-                        color: theme.textColorPrimary,
-                        padding: 4,
-                    },
-                ]}
-            >
-                {item.novelName}
-            </Text>
-        );
-
-    const compactTitle = () =>
-        displayMode === 0 && (
-            <View style={styles.titleContainer}>
-                <LinearGradient
-                    colors={["transparent", "rgba(0,0,0,0.6)"]}
-                    style={styles.linearGradient}
-                >
-                    <Text
-                        numberOfLines={2}
-                        style={[styles.title, { color: "rgba(255,255,255,1)" }]}
-                    >
-                        {item.novelName}
-                    </Text>
-                </LinearGradient>
-            </View>
-        );
-
-    const unreadBadge = () =>
-        showUnreadBadges &&
-        item.chaptersUnread && (
-            <Text
-                style={[
-                    styles.unreadBadge,
-                    !item.chaptersDownloaded && {
-                        borderTopLeftRadius: 4,
-                        borderBottomLeftRadius: 4,
-                    },
-                    !showDownloadBadges && {
-                        borderRadius: 4,
-                    },
-                ]}
-            >
-                {item.chaptersUnread}
-            </Text>
-        );
-
-    const downloadBadge = () =>
-        showDownloadBadges &&
-        item.chaptersDownloaded && (
-            <Text
-                style={[
-                    styles.downloadBadge,
-                    !item.chaptersUnread && {
-                        borderTopRightRadius: 4,
-                        borderBottomRightRadius: 4,
-                    },
-                    !showUnreadBadges && {
-                        borderRadius: 4,
-                    },
-                ]}
-            >
-                {item.chaptersDownloaded}
-            </Text>
-        );
-
-    return displayMode !== 2 ? (
-        <View style={{ flex: 1 / novelsPerRow }}>
-            <TouchableRipple
-                borderless
-                centered
-                rippleColor={theme.rippleColor}
-                style={styles.opac}
-                onPress={onPress}
-            >
-                <>
-                    <ImageBackground
-                        source={{ uri: item.novelCover }}
-                        style={{ height: height[novelsPerRow] }}
-                        imageStyle={[
-                            { borderRadius: 4 },
-                            libraryStatus && { opacity: 0.5 },
-                        ]}
-                        progressiveRenderingEnabled={true}
-                    >
-                        <View style={{ flexDirection: "row", margin: 4 }}>
-                            {downloadBadge()}
-                            {unreadBadge()}
-                        </View>
-                        {compactTitle()}
-                    </ImageBackground>
-                    {comfortableTitle()}
-                </>
-            </TouchableRipple>
-        </View>
-    ) : (
-        <ListView
-            item={item}
-            downloadBadge={downloadBadge()}
-            unreadBadge={unreadBadge()}
-            theme={theme}
-            onPress={onPress}
-        />
-    );
-};
-
-export default NovelCover;
-
-const styles = StyleSheet.create({
-    titleContainer: {
-        flex: 1,
-        justifyContent: "flex-end",
-        borderRadius: 4,
-    },
-    title: {
-        fontFamily: "pt-sans-bold",
-        fontSize: 14,
-        padding: 8,
-    },
-    linearGradient: {
-        bottom: -1,
-        borderRadius: 4,
-    },
-    opac: {
-        paddingHorizontal: 4.5,
-        paddingVertical: 4,
-        borderRadius: 4,
-    },
-    extensionIcon: {
-        width: 42,
-        height: 42,
-        borderRadius: 4,
-    },
-    listView: {
-        flex: 1,
-        paddingVertical: 8,
-        paddingHorizontal: 12,
-        flexDirection: "row",
-        alignItems: "center",
-        borderRadius: 4,
-    },
-
-    downloadBadge: {
-        backgroundColor: "#47a84a",
-        color: "#FFFFFF",
-        borderTopLeftRadius: 4,
-        borderBottomLeftRadius: 4,
-        paddingTop: 2,
-        paddingHorizontal: 4,
-        fontSize: 12,
-    },
-    unreadBadge: {
-        backgroundColor: "#2979FF",
-        color: "#FFFFFF",
-        borderTopRightRadius: 4,
-        borderBottomRightRadius: 4,
-        paddingTop: 2,
-        paddingHorizontal: 4,
-        fontSize: 12,
-    },
-});

src/Components/NovelList.js

@@ -1,38 +0,0 @@
-import React from "react";
-import { StyleSheet, FlatList } from "react-native";
-
-import { useSettings } from "../Hooks/reduxHooks";
-
-const NovelList = ({
-    data,
-    renderItem,
-    refreshControl,
-    ListEmptyComponent,
-}) => {
-    const { displayMode, novelsPerRow } = useSettings();
-
-    const getNovelsPerRow = () => (displayMode === 2 ? 1 : novelsPerRow);
-
-    return (
-        <FlatList
-            contentContainerStyle={styles.flatListCont}
-            numColumns={getNovelsPerRow()}
-            key={getNovelsPerRow()}
-            data={data}
-            keyExtractor={(item) => item.novelUrl}
-            renderItem={renderItem}
-            refreshControl={refreshControl}
-            ListEmptyComponent={ListEmptyComponent}
-        />
-    );
-};
-
-export default NovelList;
-
-const styles = StyleSheet.create({
-    flatListCont: {
-        flexGrow: 1,
-        paddingVertical: 8,
-        paddingHorizontal: 4,
-    },
-});

src/Components/Searchbar.js

@@ -1,142 +0,0 @@
-import React, { useRef } from "react";
-import { View, TextInput, StyleSheet } from "react-native";
-import { TouchableRipple, IconButton } from "react-native-paper";
-import Constants from "expo-constants";
-import { useSettings } from "../Hooks/reduxHooks";
-import { useDispatch } from "react-redux";
-import { setAppSettings } from "../redux/settings/settings.actions";
-
-export const Searchbar = ({
-    theme,
-    placeholder,
-    searchText,
-    left,
-    onPressLeft,
-    right,
-    displayMenu,
-    onPressRight,
-    clearSearchbar,
-    onChangeText,
-    onSubmitEditing,
-    migrate,
-    onPressMigrate,
-    filter,
-}) => {
-    const searchRef = useRef(null);
-    const dispatch = useDispatch();
-    const { displayMode } = useSettings();
-
-    const displayMenuIcon = () => {
-        const icons = {
-            0: "view-module",
-            1: "view-list",
-            2: "view-module",
-        };
-
-        return icons[displayMode];
-    };
-
-    const getDisplayMode = () =>
-        displayMode === 0 ? 1 : displayMode === 1 ? 2 : displayMode === 2 && 0;
-
-    return (
-        <TouchableRipple
-            borderless
-            onPress={() => searchRef.current.focus()}
-            style={[
-                styles.searchAppbarContainer,
-                { backgroundColor: theme.searchBarColor },
-            ]}
-            rippleColor={theme.rippleColor}
-        >
-            <View style={styles.container}>
-                <View style={{ flex: 1, flexDirection: "row" }}>
-                    {left && (
-                        <IconButton
-                            icon={left}
-                            color={theme.textColorSecondary}
-                            style={{ marginLeft: 0 }}
-                            size={23}
-                            onPress={onPressLeft}
-                        />
-                    )}
-                    <TextInput
-                        ref={searchRef}
-                        style={{
-                            fontSize: 16,
-                            color: theme.textColorSecondary,
-                        }}
-                        placeholder={placeholder}
-                        placeholderTextColor={theme.textColorSecondary}
-                        onChangeText={onChangeText}
-                        onSubmitEditing={onSubmitEditing}
-                        defaultValue={searchText}
-                    />
-                </View>
-                {searchText !== "" && (
-                    <IconButton
-                        icon="close"
-                        color={theme.textColorSecondary}
-                        style={{ marginRight: 0 }}
-                        size={23}
-                        onPress={clearSearchbar}
-                    />
-                )}
-                {displayMenu && (
-                    <IconButton
-                        icon={displayMenuIcon()}
-                        color={theme.textColorSecondary}
-                        style={{ marginRight: 0 }}
-                        size={23}
-                        onPress={() =>
-                            dispatch(
-                                setAppSettings("displayMode", getDisplayMode())
-                            )
-                        }
-                    />
-                )}
-                {right && (
-                    <IconButton
-                        icon={right}
-                        color={
-                            !filter
-                                ? theme.textColorSecondary
-                                : theme.filterColor
-                        }
-                        style={{ marginRight: 0 }}
-                        size={23}
-                        onPress={onPressRight}
-                    />
-                )}
-                {migrate && (
-                    <IconButton
-                        icon={migrate}
-                        color={theme.textColorSecondary}
-                        style={{ marginRight: 0 }}
-                        size={23}
-                        onPress={onPressMigrate}
-                    />
-                )}
-            </View>
-        </TouchableRipple>
-    );
-};
-
-const styles = StyleSheet.create({
-    searchAppbarContainer: {
-        marginTop: Constants.statusBarHeight + 4,
-        height: 48,
-        flexDirection: "row",
-        alignItems: "center",
-        paddingHorizontal: 16,
-        marginBottom: 12,
-        borderRadius: 8,
-        marginHorizontal: 12,
-        elevation: 2,
-    },
-    container: {
-        flex: 1,
-        flexDirection: "row",
-        justifyContent: "space-between",
-    },
-});

src/Hooks/setStatusBarStyle.js

@@ -1,7 +0,0 @@
-import { setStatusBarStyle as setExpoStatusBarStyle } from "expo-status-bar";
-import { useTheme } from "../Hooks/reduxHooks";
-
-export const setStatusBarStyle = () => {
-    const theme = useTheme();
-    setExpoStatusBarStyle(theme.id === 1 ? "dark" : "light");
-};

src/Navigators/BottomNavigator.js

@@ -1,96 +0,0 @@
-import React from "react";
-import { View } from "react-native";
-
-import { createMaterialBottomTabNavigator } from "@react-navigation/material-bottom-tabs";
-import MaterialCommunityIcons from "react-native-vector-icons/MaterialCommunityIcons";
-
-import Library from "../Screens/Library/Library";
-import Updates from "../Screens/Updates/Updates";
-import History from "../Screens/History/History";
-import Browse from "../Screens/Browse/Browse";
-import More from "../Screens/More/More";
-
-import { useTheme } from "../Hooks/reduxHooks";
-
-const Tab = createMaterialBottomTabNavigator();
-
-const BottomNavigator = () => {
-    const theme = useTheme();
-
-    return (
-        <View style={{ flex: 1, backgroundColor: theme.colorPrimaryDark }}>
-            <Tab.Navigator
-                barStyle={{ backgroundColor: theme.colorPrimary }}
-                activeColor={theme.colorAccent}
-            >
-                <Tab.Screen
-                    name="Library"
-                    component={Library}
-                    options={{
-                        tabBarIcon: ({ color }) => (
-                            <MaterialCommunityIcons
-                                name="book-variant-multiple"
-                                color={color}
-                                size={24}
-                            />
-                        ),
-                    }}
-                />
-                <Tab.Screen
-                    name="Updates"
-                    component={Updates}
-                    options={{
-                        tabBarIcon: ({ color }) => (
-                            <MaterialCommunityIcons
-                                name="alert-decagram-outline"
-                                color={color}
-                                size={24}
-                            />
-                        ),
-                    }}
-                />
-                <Tab.Screen
-                    name="History"
-                    component={History}
-                    options={{
-                        tabBarIcon: ({ color }) => (
-                            <MaterialCommunityIcons
-                                name="history"
-                                color={color}
-                                size={24}
-                            />
-                        ),
-                    }}
-                />
-                <Tab.Screen
-                    name="Browse"
-                    component={Browse}
-                    options={{
-                        tabBarIcon: ({ color }) => (
-                            <MaterialCommunityIcons
-                                name="compass-outline"
-                                color={color}
-                                size={24}
-                            />
-                        ),
-                    }}
-                />
-                <Tab.Screen
-                    name="More"
-                    component={More}
-                    options={{
-                        tabBarIcon: ({ color }) => (
-                            <MaterialCommunityIcons
-                                name="dots-horizontal"
-                                color={color}
-                                size={24}
-                            />
-                        ),
-                    }}
-                />
-            </Tab.Navigator>
-        </View>
-    );
-};
-
-export default BottomNavigator;

src/Navigators/More.js

@@ -1,64 +0,0 @@
-import React from "react";
-import { View } from "react-native";
-import { useTheme } from "../Hooks/reduxHooks";
-
-import { createStackNavigator } from "@react-navigation/stack";
-
-import About from "../Screens/More/About";
-import Settings from "../Screens/More/Settings";
-import TrackerSettings from "../Screens/More/TrackerSettings";
-import ReaderSettings from "../Screens/More/ReaderSettings";
-import BackupSettings from "../Screens/More/BackupSettings";
-import AdvancedSettings from "../Screens/More/AdvancedSettings";
-import GeneralSettings from "../Screens/More/GeneralSettings";
-
-const Stack = createStackNavigator();
-
-const stackNavigatorConfig = { headerShown: false };
-
-const SettingsStack = () => {
-    const theme = useTheme();
-
-    return (
-        <View style={{ flex: 1, backgroundColor: theme.colorPrimaryDark }}>
-            <Stack.Navigator screenOptions={stackNavigatorConfig}>
-                <Stack.Screen name="Settings" component={Settings} />
-                <Stack.Screen
-                    name="GeneralSettings"
-                    component={GeneralSettings}
-                />
-                <Stack.Screen
-                    name="ReaderSettings"
-                    component={ReaderSettings}
-                />
-                <Stack.Screen
-                    name="TrackerSettings"
-                    component={TrackerSettings}
-                />
-                <Stack.Screen
-                    name="BackupSettings"
-                    component={BackupSettings}
-                />
-                <Stack.Screen
-                    name="AdvancedSettings"
-                    component={AdvancedSettings}
-                />
-            </Stack.Navigator>
-        </View>
-    );
-};
-
-const MoreStack = () => {
-    const theme = useTheme();
-
-    return (
-        <View style={{ flex: 1, backgroundColor: theme.colorPrimaryDark }}>
-            <Stack.Navigator screenOptions={stackNavigatorConfig}>
-                <Stack.Screen name="SettingsStack" component={SettingsStack} />
-                <Stack.Screen name="About" component={About} />
-            </Stack.Navigator>
-        </View>
-    );
-};
-
-export default MoreStack;

src/Screens/Browse/GlobalSearch.js

@@ -1,194 +0,0 @@
-import React, { useEffect, useState } from "react";
-import {
-    StyleSheet,
-    View,
-    Text,
-    FlatList,
-    ActivityIndicator,
-} from "react-native";
-import { useLibrary, useTheme } from "../../Hooks/reduxHooks";
-import { useDispatch, useSelector } from "react-redux";
-
-import { Searchbar } from "../../Components/Searchbar";
-import NovelCover from "../../Components/NovelCover";
-import NovelList from "../../Components/NovelList";
-import EmptyView from "../../Components/EmptyView";
-import GlobalSearchNovelList from "./components/GlobalSearchNovelList";
-import { ProgressBar } from "react-native-paper";
-import { showToast } from "../../Hooks/showToast";
-
-const GlobalSearch = ({ route, navigation }) => {
-    const theme = useTheme();
-    let novelName = "";
-
-    if (route.params) {
-        novelName = route.params.novelName;
-    }
-
-    const [loading, setLoading] = useState(false);
-    const [searchText, setSearchText] = useState(novelName);
-    const [searchResults, setSearchResults] = useState("");
-    const { sources, pinned } = useSelector((state) => state.sourceReducer);
-    const [progress, setProgress] = useState(0);
-
-    const library = useLibrary();
-
-    const pinnedSources = sources.filter(
-        (source) => pinned.indexOf(source.sourceId) !== -1
-    );
-
-    useEffect(() => {
-        novelName && onSubmitEditing();
-    }, []);
-
-    const clearSearchbar = () => {
-        setSearchText("");
-    };
-
-    const onChangeText = (text) => setSearchText(text);
-
-    const onSubmitEditing = () => {
-        setSearchResults("");
-
-        const getSearchUrl = (sourceId) => {
-            if (sourceId === 1) {
-                return `https://lnreader-extensions.vercel.app/api/1/search/?s=${searchText}&?o=rating`;
-            } else {
-                return `https://lnreader-extensions.vercel.app/api/${sourceId}/search/?s=${searchText}`;
-            }
-        };
-
-        pinnedSources.map((source, index) =>
-            setTimeout(() => {
-                setLoading(true);
-                fetch(getSearchUrl(source.sourceId))
-                    .then((response) => response.json())
-                    .then((json) => {
-                        setSearchResults((searchResults) => [
-                            ...searchResults,
-                            {
-                                sourceId: source.sourceId,
-                                sourceName: source.sourceName,
-                                sourceLanguage: source.sourceLanguage,
-                                novels: json,
-                            },
-                        ]);
-                        setLoading(false);
-                    })
-                    .catch((error) => {
-                        showToast(error.message);
-                        setSearchResults((searchResults) => [
-                            ...searchResults,
-                            {
-                                sourceId: source.sourceId,
-                                sourceName: source.sourceName,
-                                sourceLanguage: source.sourceLanguage,
-                                novels: [],
-                            },
-                        ]);
-                        setLoading(false);
-                    })
-                    .finally(() =>
-                        setProgress(
-                            (progress) => progress + 1 / pinnedSources.length
-                        )
-                    );
-            }, 1000 * index)
-        );
-    };
-
-    const renderItem = ({ item }) => (
-        <>
-            <View style={{ padding: 8, paddingVertical: 16 }}>
-                <Text style={{ color: theme.textColorPrimary }}>
-                    {item.sourceName}
-                </Text>
-                <Text style={{ color: theme.textColorSecondary, fontSize: 12 }}>
-                    {item.sourceLanguage}
-                </Text>
-            </View>
-            <GlobalSearchNovelList
-                data={item.novels}
-                theme={theme}
-                library={library}
-                navigation={navigation}
-            />
-        </>
-    );
-
-    return (
-        <View
-            style={[
-                styles.container,
-                { backgroundColor: theme.colorPrimaryDark },
-            ]}
-        >
-            <Searchbar
-                theme={theme}
-                placeholder="Global Search"
-                left="arrow-left"
-                onPressLeft={() => navigation.goBack()}
-                searchText={searchText}
-                onChangeText={onChangeText}
-                onSubmitEditing={onSubmitEditing}
-                clearSearchbar={clearSearchbar}
-            />
-            {progress < 1 && progress > 0 && pinned && (
-                <ProgressBar
-                    color={
-                        progress > 0.9
-                            ? theme.colorPrimaryDark
-                            : theme.colorAccent
-                    }
-                    progress={progress}
-                />
-            )}
-            <FlatList
-                contentContainerStyle={{
-                    flexGrow: 1,
-                    padding: 4,
-                }}
-                data={searchResults}
-                keyExtractor={(item) => item.sourceId.toString()}
-                renderItem={renderItem}
-                extraData={pinned}
-                ListEmptyComponent={
-                    <>
-                        {!loading && (
-                            <EmptyView
-                                icon="__φ(．．)"
-                                description={`Search a novel in your pinned sources ${
-                                    pinned.length === 0
-                                        ? "(No sources pinned)"
-                                        : ""
-                                }`}
-                            />
-                        )}
-                    </>
-                }
-                ListFooterComponent={
-                    loading && (
-                        <View
-                            style={{
-                                flex: 1,
-                                justifyContent: "center",
-                                padding: 16,
-                            }}
-                        >
-                            <ActivityIndicator
-                                size="large"
-                                color={theme.colorAccent}
-                            />
-                        </View>
-                    )
-                }
-            />
-        </View>
-    );
-};
-
-export default GlobalSearch;
-
-const styles = StyleSheet.create({
-    container: { flex: 1 },
-});

src/Screens/Browse/components/GlobalSearchNovelCover.js

@@ -1,71 +0,0 @@
-import React from "react";
-import { StyleSheet, View, Text, ImageBackground } from "react-native";
-import { TouchableRipple } from "react-native-paper";
-
-import { useTheme } from "../../../Hooks/reduxHooks";
-
-const GlobalSearchNovelCover = ({ item, onPress, libraryStatus }) => {
-    const theme = useTheme();
-
-    const comfortableTitle = () => (
-        <Text
-            numberOfLines={2}
-            style={[
-                styles.title,
-                {
-                    width: 115,
-                    color: theme.textColorPrimary,
-                    padding: 4,
-                    flexWrap: "wrap",
-                },
-            ]}
-        >
-            {item.novelName}
-        </Text>
-    );
-
-    return (
-        <View style={{ flex: 1 }}>
-            <TouchableRipple
-                borderless
-                centered
-                rippleColor={theme.rippleColor}
-                style={styles.opac}
-                onPress={onPress}
-            >
-                <>
-                    <ImageBackground
-                        source={{ uri: item.novelCover }}
-                        style={{ height: 150, width: 115 }}
-                        imageStyle={[
-                            { borderRadius: 4 },
-                            libraryStatus && { opacity: 0.5 },
-                        ]}
-                        progressiveRenderingEnabled={true}
-                    />
-                    {comfortableTitle()}
-                </>
-            </TouchableRipple>
-        </View>
-    );
-};
-
-export default GlobalSearchNovelCover;
-
-const styles = StyleSheet.create({
-    titleContainer: {
-        flex: 1,
-        justifyContent: "flex-end",
-        borderRadius: 4,
-    },
-    title: {
-        fontFamily: "pt-sans-bold",
-        fontSize: 14,
-        padding: 8,
-    },
-    opac: {
-        paddingHorizontal: 5,
-        paddingVertical: 4,
-        borderRadius: 4,
-    },
-});

src/Screens/Browse/components/GlobalSearchNovelList.js

@@ -1,55 +0,0 @@
-import React from "react";
-import { StyleSheet, FlatList, Text } from "react-native";
-import GlobalSearchNovelCover from "./GlobalSearchNovelCover";
-
-const GlobalSearchNovelList = ({ data, theme, library, navigation }) => {
-    const checkIFInLibrary = (sourceId, novelUrl) => {
-        return library.some(
-            (obj) => obj.novelUrl === novelUrl && obj.sourceId === sourceId
-        );
-    };
-
-    const renderItem = ({ item }) => (
-        <GlobalSearchNovelCover
-            item={item}
-            onPress={() =>
-                navigation.navigate("Novel", {
-                    ...item,
-                    sourceId: item.extensionId,
-                })
-            }
-            libraryStatus={checkIFInLibrary(item.extensionId, item.novelUrl)}
-        />
-    );
-
-    return (
-        <FlatList
-            contentContainerStyle={styles.flatListCont}
-            horizontal={true}
-            data={data}
-            keyExtractor={(item) => item.novelUrl}
-            renderItem={renderItem}
-            ListEmptyComponent={
-                <Text
-                    style={{
-                        color: theme.textColorSecondary,
-                        padding: 8,
-                        paddingVertical: 4,
-                    }}
-                >
-                    No results found
-                </Text>
-            }
-        />
-    );
-};
-
-export default GlobalSearchNovelList;
-
-const styles = StyleSheet.create({
-    flatListCont: {
-        flexGrow: 1,
-        paddingVertical: 8,
-        paddingHorizontal: 4,
-    },
-});

src/Screens/Browse/components/MigrationSourceCard.js

@@ -1,74 +0,0 @@
-import React from "react";
-import { View, Text, Image, StyleSheet } from "react-native";
-import { TouchableRipple } from "react-native-paper";
-
-const MigrationSourceCard = ({ item, theme, noOfNovels, onPress }) => {
-    const { sourceId, sourceName, sourceCover, sourceLanguage, status } = item;
-
-    return (
-        <TouchableRipple
-            style={styles.extensionCard}
-            onPress={onPress}
-            rippleColor={theme.rippleColor}
-        >
-            <>
-                <Image
-                    source={{ uri: sourceCover }}
-                    style={styles.extensionIcon}
-                    resizeMode="contain"
-                />
-                <View style={styles.extensionDetails}>
-                    <View>
-                        <Text
-                            style={{
-                                color: theme.textColorPrimary,
-                                fontSize: 14,
-                            }}
-                        >
-                            {sourceName} {` (${noOfNovels || 0})`}
-                        </Text>
-                        <View style={{ flexDirection: "row" }}>
-                            <Text
-                                style={{
-                                    color: theme.textColorSecondary,
-                                    fontSize: 12,
-                                }}
-                            >
-                                {sourceLanguage}
-                            </Text>
-                        </View>
-                    </View>
-                </View>
-            </>
-        </TouchableRipple>
-    );
-};
-
-export default MigrationSourceCard;
-
-const styles = StyleSheet.create({
-    extensionCard: {
-        flexDirection: "row",
-        alignItems: "center",
-        marginVertical: 4,
-        paddingVertical: 8,
-        paddingHorizontal: 20,
-    },
-    extensionIcon: {
-        width: 40,
-        height: 40,
-        borderRadius: 8,
-    },
-    extensionDetails: {
-        flex: 1,
-        flexDirection: "row",
-        justifyContent: "space-between",
-        alignItems: "center",
-        marginLeft: 16,
-    },
-    sourceStatus: {
-        color: "#C14033",
-        fontSize: 12,
-        marginLeft: 5,
-    },
-});

src/Screens/Browse/components/SourceCard.js

@@ -1,114 +0,0 @@
-import React from "react";
-import { View, Text, Image, StyleSheet } from "react-native";
-import { TouchableRipple, Button, IconButton } from "react-native-paper";
-import { useNavigation } from "@react-navigation/native";
-import { useDispatch } from "react-redux";
-import { pinSourceAction } from "../../../redux/source/source.actions";
-
-const ExtensionCard = ({ item, theme, isPinned }) => {
-    const { sourceId, sourceName, sourceCover, sourceLanguage, status } = item;
-
-    const navigation = useNavigation();
-    const dispatch = useDispatch();
-
-    const navigateToExtension = () =>
-        navigation.navigate("Extension", {
-            sourceId: item.sourceId,
-            sourceName: item.sourceName,
-            sourceUrl: item.sourceUrl,
-        });
-
-    return (
-        <TouchableRipple
-            style={styles.extensionCard}
-            onPress={navigateToExtension}
-            rippleColor={theme.rippleColor}
-        >
-            <>
-                <Image
-                    source={{ uri: sourceCover }}
-                    style={styles.extensionIcon}
-                    resizeMode="contain"
-                />
-                <View style={styles.extensionDetails}>
-                    <View>
-                        <Text
-                            style={{
-                                color: theme.textColorPrimary,
-                                fontSize: 14,
-                            }}
-                        >
-                            {sourceName}
-                        </Text>
-                        <View style={{ flexDirection: "row" }}>
-                            <Text
-                                style={{
-                                    color: theme.textColorSecondary,
-                                    fontSize: 12,
-                                }}
-                            >
-                                {sourceLanguage}
-                            </Text>
-                            <Text style={styles.sourceStatus}>
-                                {status === 0 && "• Down"}
-                            </Text>
-                        </View>
-                    </View>
-                    <View
-                        style={{ flexDirection: "row", alignItems: "center" }}
-                    >
-                        <Button
-                            labelStyle={{ letterSpacing: 0 }}
-                            uppercase={false}
-                            color={theme.colorAccent}
-                            onPress={navigateToExtension}
-                        >
-                            Browse
-                        </Button>
-                        <IconButton
-                            icon={isPinned ? "pin" : "pin-outline"}
-                            animated
-                            size={21}
-                            onPress={() => dispatch(pinSourceAction(sourceId))}
-                            color={
-                                isPinned
-                                    ? theme.colorAccent
-                                    : theme.textColorSecondary
-                            }
-                            style={{ margin: 2 }}
-                        />
-                    </View>
-                </View>
-            </>
-        </TouchableRipple>
-    );
-};
-
-export default ExtensionCard;
-
-const styles = StyleSheet.create({
-    extensionCard: {
-        flexDirection: "row",
-        alignItems: "center",
-        marginVertical: 4,
-        paddingVertical: 8,
-        paddingHorizontal: 20,
-    },
-    extensionIcon: {
-        width: 40,
-        height: 40,
-        borderRadius: 8,
-    },
-    extensionDetails: {
-        flex: 1,
-        flexDirection: "row",
-        justifyContent: "space-between",
-        alignItems: "center",
-        marginLeft: 16,
-    },
-    sourceStatus: {
-        color: "#C14033",
-        fontSize: 12,
-        marginLeft: 5,
-    },
-});

src/Screens/Chapter/Chapter.js

@@ -1,301 +0,0 @@
-import React, { useState, useEffect, useRef } from "react";
-import { StyleSheet, View, Text, ActivityIndicator } from "react-native";
-
-import { useDispatch } from "react-redux";
-import Constants from "expo-constants";
-import { IconButton, Portal } from "react-native-paper";
-import { CollapsibleHeaderScrollView } from "react-native-collapsible-header-views";
-
-import { getChapterFromDB } from "../../Database/queries/ChapterQueries";
-import { fetchChapter } from "../../Services/Source/source";
-import { showToast } from "../../Hooks/showToast";
-import {
-    usePosition,
-    useReaderSettings,
-    useTheme,
-    useTrackingStatus,
-} from "../../Hooks/reduxHooks";
-import { updateChaptersRead } from "../../redux/tracker/tracker.actions";
-import { insertHistoryAction } from "../../redux/history/history.actions";
-import {
-    errorTextColor,
-    readerBackground,
-    readerLineHeight,
-    readerTextColor,
-} from "./readerStyleController";
-import { markChapterReadAction } from "../../redux/novel/novel.actions";
-import { saveScrollPosition } from "../../redux/preferences/preference.actions";
-import { parseChapterNumber } from "../../Services/updates";
-
-import ChapterAppbar from "./components/ChapterAppbar";
-import ReaderSheet from "./components/ReaderSheet";
-import EmptyView from "../../Components/EmptyView";
-import FitImage from "react-native-fit-image";
-
-const Chapter = ({ route, navigation }) => {
-    const {
-        sourceId,
-        chapterId,
-        chapterUrl,
-        novelId,
-        novelUrl,
-        novelName,
-        chapterName,
-    } = route.params;
-    let scrollViewRef;
-    let readerSheetRef = useRef(null);
-
-    const theme = useTheme();
-    const dispatch = useDispatch();
-    const reader = useReaderSettings();
-    const { tracker, trackedNovels } = useTrackingStatus();
-    const position = usePosition(novelId, chapterId);
-
-    const isTracked = trackedNovels.find((obj) => obj.novelId === novelId);
-
-    const [chapter, setChapter] = useState({});
-    const [loading, setLoading] = useState(true);
-    const [error, setError] = useState();
-
-    const [scrollPercentage, setScrollPercentage] = useState(0);
-    const [firstLayout, setFirstLayout] = useState(true);
-    const [selectText, setSelectText] = useState(false);
-
-    const [images, setImages] = useState([]);
-
-    const getChapter = async (chapterId) => {
-        try {
-            if (chapterId) {
-                const chapterDownloaded = await getChapterFromDB(chapterId);
-
-                if (chapterDownloaded) {
-                    setChapter(chapterDownloaded);
-                    parseImages(chapterDownloaded.chapterText);
-                } else {
-                    const res = await fetchChapter(
-                        sourceId,
-                        novelUrl,
-                        chapterUrl
-                    );
-                    parseImages(res.chapterText);
-                    setChapter(res);
-                }
-            } else {
-                const res = await fetchChapter(sourceId, novelUrl, chapterUrl);
-                parseImages(res.chapterText);
-                setChapter(res);
-            }
-
-            setLoading(false);
-        } catch (error) {
-            setError(error.message);
-            setLoading(false);
-            showToast(error.message);
-        }
-    };
-
-    const parseImages = (chapterText) => {
-        let imageLinks = chapterText.match(/\[https.*?\]/g, "");
-        let chapterTextWithoutLinks;
-
-        if (imageLinks) {
-            imageLinks = imageLinks.map((link) => link.slice(1, -1));
-
-            setImages(imageLinks);
-        }
-    };
-
-    useEffect(() => {
-        getChapter(chapterId);
-        dispatch(insertHistoryAction(novelId, chapterId));
-    }, []);
-
-    const isCloseToBottom = ({
-        layoutMeasurement,
-        contentOffset,
-        contentSize,
-    }) => {
-        const paddingToBottom = 40;
-        return (
-            layoutMeasurement.height + contentOffset.y >=
-            contentSize.height - paddingToBottom
-        );
-    };
-
-    const updateTracker = () => {
-        const chapterNumber = parseChapterNumber(chapterName);
-
-        isTracked &&
-            chapterNumber &&
-            Number.isInteger(chapterNumber) &&
-            chapterNumber > isTracked.my_list_status.num_chapters_read &&
-            dispatch(
-                updateChaptersRead(
-                    isTracked.id,
-                    tracker.access_token,
-                    chapterNumber
-                )
-            );
-    };
-
-    const onScroll = ({ nativeEvent }) => {
-        const offsetY = nativeEvent.contentOffset.y;
-        const position =
-            nativeEvent.contentOffset.y + nativeEvent.layoutMeasurement.height;
-
-        const percentage = Math.round(
-            (position / nativeEvent.contentSize.height) * 100
-        );
-
-        setScrollPercentage(percentage);
-        dispatch(saveScrollPosition(offsetY, percentage, chapterId, novelId));
-
-        if (isCloseToBottom(nativeEvent)) {
-            dispatch(markChapterReadAction(chapterId, novelId));
-            updateTracker();
-        }
-    };
-
-    const scrollToSavedProgress = () => {
-        if (position && firstLayout) {
-            position.percentage < 100 &&
-                scrollViewRef.getNode().scrollTo({
-                    x: 0,
-                    y: position.position,
-                    animated: false,
-                });
-            setFirstLayout(false);
-        }
-    };
-
-    const readerStyles = [
-        {
-            paddingVertical: 16,
-            paddingBottom: 32,
-            fontSize: reader.textSize,
-            color: readerTextColor(reader.theme),
-            lineHeight: readerLineHeight(reader.textSize, reader.lineHeight),
-            textAlign: reader.textAlign,
-            paddingHorizontal: `${reader.padding}%`,
-        },
-        reader.fontFamily && {
-            fontFamily: reader.fontFamily,
-        },
-    ];
-
-    return (
-        <>
-            <CollapsibleHeaderScrollView
-                headerContainerBackgroundColor="rgba(0,0,0,0.5)"
-                ref={(ref) => (scrollViewRef = ref)}
-                CollapsibleHeaderComponent={
-                    <ChapterAppbar
-                        navigation={navigation}
-                        sourceId={sourceId}
-                        novelId={novelId}
-                        novelUrl={novelUrl}
-                        novelName={novelName}
-                        chapterName={chapterName}
-                        chapterId={chapterId}
-                        chapter={chapter}
-                        theme={theme}
-                        readerSheetRef={readerSheetRef}
-                    />
-                }
-                headerHeight={Constants.statusBarHeight + 56}
-                contentContainerStyle={[
-                    styles.screenContainer,
-                    { backgroundColor: readerBackground(reader.theme) },
-                ]}
-                onScroll={onScroll}
-                showsVerticalScrollIndicator={false}
-            >
-                {error ? (
-                    <View style={{ flex: 1, justifyContent: "center" }}>
-                        <EmptyView
-                            icon="(-_-;)・・・"
-                            description={error}
-                            style={{ color: errorTextColor(reader.theme) }}
-                        >
-                            <IconButton
-                                icon="reload"
-                                size={25}
-                                style={{ margin: 0, marginTop: 16 }}
-                                color={errorTextColor(reader.theme)}
-                                onPress={() => {
-                                    getChapter(chapterId);
-                                    setLoading(true);
-                                    setError();
-                                }}
-                            />
-                            <Text
-                                style={{ color: errorTextColor(reader.theme) }}
-                            >
-                                Retry
-                            </Text>
-                        </EmptyView>
-                    </View>
-                ) : loading ? (
-                    <View style={{ flex: 1, justifyContent: "center" }}>
-                        <ActivityIndicator
-                            size={50}
-                            color={theme.colorAccent}
-                        />
-                    </View>
-                ) : (
-                    <View style={{ flex: 1 }}>
-                        {images.length > 0 &&
-                            images.map((image, index) => (
-                                <FitImage source={{ uri: image }} />
-                            ))}
-
-                        <Text
-                            style={readerStyles}
-                            onLayout={scrollToSavedProgress}
-                            selectable={selectText}
-                        >
-                            {chapter.chapterText
-                                .trim()
-                                .replace(/\[https.*?\]/g, "")}
-                        </Text>
-                    </View>
-                )}
-                <Portal>
-                    <ReaderSheet
-                        theme={theme}
-                        reader={reader}
-                        dispatch={dispatch}
-                        bottomSheetRef={readerSheetRef}
-                        selectText={selectText}
-                        setSelectText={setSelectText}
-                    />
-                </Portal>
-            </CollapsibleHeaderScrollView>
-            <Text
-                style={[
-                    styles.scrollPercentage,
-                    { color: readerTextColor(reader.theme) },
-                ]}
-            >
-                {scrollPercentage + "%"}
-            </Text>
-        </>
-    );
-};
-
-export default Chapter;
-
-const styles = StyleSheet.create({
-    screenContainer: {
-        flexGrow: 1,
-        paddingVertical: 10,
-    },
-    scrollPercentage: {
-        position: "absolute",
-        bottom: 12,
-        alignSelf: "center",
-        fontFamily: "noto-sans",
-        fontWeight: "bold",
-        zIndex: 1,
-    },
-});

src/Screens/Chapter/components/ChapterAppbar.js

@@ -1,95 +0,0 @@
-import React, { useEffect, useState } from "react";
-
-import { Appbar } from "react-native-paper";
-import {
-    getNextChapterFromDB,
-    getPrevChapterFromDB,
-} from "../../../Database/queries/ChapterQueries";
-
-const ChapterAppbar = ({
-    navigation,
-    sourceId,
-    novelId,
-    novelName,
-    novelUrl,
-    chapterId,
-    chapterName,
-    theme,
-    readerSheetRef,
-}) => {
-    const [nextChapter, setNextChapter] = useState({});
-    const [prevChapter, setPrevChapter] = useState({});
-
-    const setPrevAndNextChap = async () => {
-        const nextChap = await getNextChapterFromDB(novelId, chapterId);
-        const prevChap = await getPrevChapterFromDB(novelId, chapterId);
-
-        setNextChapter(nextChap);
-        setPrevChapter(prevChap);
-    };
-
-    useEffect(() => {
-        setPrevAndNextChap();
-    }, []);
-
-    const navigateToPrevChapter = () =>
-        navigation.replace("Chapter", {
-            chapterUrl: prevChapter.chapterUrl,
-            chapterId: prevChapter.chapterId,
-            sourceId,
-            novelUrl,
-            novelId,
-            chapterName: prevChapter.chapterName,
-            novelName,
-        });
-
-    const navigateToNextChapter = () =>
-        navigation.replace("Chapter", {
-            chapterUrl: nextChapter.chapterUrl,
-            sourceId,
-            novelUrl,
-            novelId,
-            chapterId: nextChapter.chapterId,
-            chapterName: nextChapter.chapterName,
-            novelName,
-        });
-
-    return (
-        <Appbar.Header style={{ backgroundColor: "transparent", elevation: 0 }}>
-            <Appbar.BackAction
-                onPress={() => navigation.goBack()}
-                color="#FFFFFF"
-                size={26}
-                style={{ marginRight: 0 }}
-            />
-            <Appbar.Content
-                title={novelName}
-                titleStyle={{ color: "#FFFFFF" }}
-                subtitle={chapterName}
-                subtitleStyle={{ color: "rgba(255, 255, 255, 0.7)" }}
-            />
-            <Appbar.Action
-                icon="chevron-left"
-                size={26}
-                disabled={!prevChapter}
-                onPress={navigateToPrevChapter}
-                color="#FFFFFF"
-            />
-            <Appbar.Action
-                icon="chevron-right"
-                size={26}
-                disabled={!nextChapter}
-                onPress={navigateToNextChapter}
-                color="#FFFFFF"
-            />
-            <Appbar.Action
-                icon="dots-vertical"
-                size={26}
-                onPress={() => readerSheetRef.current.show()}
-                color="#FFFFFF"
-            />
-        </Appbar.Header>
-    );
-};
-
-export default ChapterAppbar;

src/Screens/Chapter/components/ReaderSheet.js

@@ -1,403 +0,0 @@
-import React, { useState } from "react";
-import { StyleSheet, View, Text, Dimensions } from "react-native";
-import { ToggleButton, IconButton, Menu, Switch } from "react-native-paper";
-import Slider from "@react-native-community/slider";
-import Bottomsheet from "rn-sliding-up-panel";
-import { fonts } from "../../../Services/utils/constants";
-
-import { setReaderSettings } from "../../../redux/settings/settings.actions";
-import BottomSheetHandle from "../../../Components/BottomSheetHandle";
-import { Row } from "../../../Components/Common";
-
-const ReaderSheet = ({
-    theme,
-    reader,
-    dispatch,
-    bottomSheetRef,
-    selectText,
-    setSelectText,
-}) => {
-    const [fontMenu, setFontMenu] = useState(false);
-    const openFontMenu = () => setFontMenu(true);
-    const closeFontMenu = () => setFontMenu(false);
-
-    const ReaderSettingTitle = ({ title }) => (
-        <Text style={styles.title}>{title}</Text>
-    );
-
-    return (
-        <Bottomsheet
-            ref={bottomSheetRef}
-            draggableRange={{ top: 420, bottom: 0 }}
-            snappingPoints={[0, 420]}
-            showBackdrop={true}
-            backdropOpacity={0}
-        >
-            <View style={styles.contentContainer}>
-                <BottomSheetHandle theme={theme} />
-                <View style={styles.readerSettingsContainer}>
-                    <ReaderSettingTitle title="Text Size" />
-                    <Slider
-                        style={{
-                            width: Dimensions.get("window").width,
-                            height: 40,
-                        }}
-                        value={reader.textSize}
-                        minimumValue={12}
-                        maximumValue={20}
-                        step={2}
-                        minimumTrackTintColor={theme.colorAccent}
-                        maximumTrackTintColor="#000000"
-                        thumbTintColor={theme.colorAccent}
-                        onValueChange={(value) =>
-                            dispatch(setReaderSettings("textSize", value))
-                        }
-                    />
-                    <Row
-                        style={{
-                            justifyContent: "space-between",
-                            width: "100%",
-                            paddingHorizontal: 16,
-                        }}
-                    >
-                        <ReaderSettingTitle title="Reader Theme" />
-                        <Row>
-                            <ToggleButton.Row
-                                onValueChange={(value) => {
-                                    dispatch(
-                                        setReaderSettings(
-                                            "theme",
-                                            value ?? reader.theme
-                                        )
-                                    );
-                                }}
-                                value={reader.theme}
-                            >
-                                <ToggleButton
-                                    icon={reader.theme === 1 && "check"}
-                                    color="#FFFFFF"
-                                    value={1}
-                                    style={{
-                                        backgroundColor: "#000000",
-                                        marginHorizontal: 10,
-                                        borderRadius: 50,
-                                        borderTopRightRadius: 50,
-                                        borderBottomRightRadius: 50,
-                                    }}
-                                />
-                                <ToggleButton
-                                    icon={reader.theme === 4 && "check"}
-                                    color="#FFFFFF"
-                                    value={4}
-                                    style={{
-                                        backgroundColor: "#444444",
-                                        marginHorizontal: 10,
-                                        borderWidth: 0,
-                                        borderRadius: 50,
-                                        borderTopRightRadius: 50,
-                                        borderBottomRightRadius: 50,
-                                    }}
-                                />
-                                <ToggleButton
-                                    icon={reader.theme === 2 && "check"}
-                                    color="#000000"
-                                    value={2}
-                                    style={{
-                                        backgroundColor: "#FFFFFF",
-                                        marginHorizontal: 10,
-                                        borderRadius: 50,
-                                    }}
-                                />
-                                <ToggleButton
-                                    icon={reader.theme === 3 && "check"}
-                                    color="#000000"
-                                    value={3}
-                                    style={{
-                                        backgroundColor: "#F4ECD8",
-                                        marginHorizontal: 10,
-                                        borderRadius: 50,
-                                        borderTopLeftRadius: 50,
-                                        borderBottomLeftRadius: 50,
-                                    }}
-                                />
-                            </ToggleButton.Row>
-                        </Row>
-                    </Row>
-                    <Row
-                        style={{
-                            justifyContent: "space-between",
-                            width: "100%",
-                            paddingHorizontal: 16,
-                            marginTop: 16,
-                        }}
-                    >
-                        <ReaderSettingTitle title="Text Align" />
-                        <Row>
-                            <ToggleButton.Row
-                                onValueChange={(value) =>
-                                    dispatch(
-                                        setReaderSettings(
-                                            "textAlign",
-                                            value ?? reader.textAlign
-                                        )
-                                    )
-                                }
-                                value={reader.textAlign}
-                            >
-                                <ToggleButton
-                                    icon="format-align-left"
-                                    color={
-                                        reader.textAlign === "left"
-                                            ? theme.colorAccent
-                                            : "#FFFFFF"
-                                    }
-                                    value="left"
-                                    style={{
-                                        backgroundColor: "transparent",
-                                        marginHorizontal: 10,
-                                        borderWidth: 0,
-                                        borderTopRightRadius: 4,
-                                        borderBottomRightRadius: 4,
-                                    }}
-                                />
-                                <ToggleButton
-                                    icon="format-align-justify"
-                                    color={
-                                        reader.textAlign === "justify"
-                                            ? theme.colorAccent
-                                            : "#FFFFFF"
-                                    }
-                                    value="justify"
-                                    style={{
-                                        backgroundColor: "transparent",
-                                        marginHorizontal: 10,
-                                        borderWidth: 0,
-                                        borderRadius: 4,
-                                    }}
-                                />
-                                <ToggleButton
-                                    icon="format-align-right"
-                                    color={
-                                        reader.textAlign === "right"
-                                            ? theme.colorAccent
-                                            : "#FFFFFF"
-                                    }
-                                    value="right"
-                                    style={{
-                                        backgroundColor: "transparent",
-                                        marginHorizontal: 10,
-                                        borderWidth: 0,
-                                        borderTopLeftRadius: 4,
-                                        borderBottomLeftRadius: 4,
-                                    }}
-                                />
-                            </ToggleButton.Row>
-                        </Row>
-                    </Row>
-                    <Row
-                        style={{
-                            justifyContent: "space-between",
-                            width: "100%",
-                            paddingHorizontal: 16,
-                            marginTop: 16,
-                        }}
-                    >
-                        <ReaderSettingTitle title="Padding" />
-                        <Row>
-                            <IconButton
-                                icon="minus"
-                                color={theme.colorAccent}
-                                size={26}
-                                disabled={reader.padding <= 0 ? true : false}
-                                onPress={() =>
-                                    dispatch(
-                                        setReaderSettings(
-                                            "padding",
-                                            reader.padding - 1
-                                        )
-                                    )
-                                }
-                                style={{ marginVertical: 0 }}
-                            />
-                            <Text
-                                style={{
-                                    color: "#FFFFFF",
-                                    paddingHorizontal: 24,
-                                }}
-                            >
-                                {`${reader.padding}%`}
-                            </Text>
-                            <IconButton
-                                icon="plus"
-                                color={theme.colorAccent}
-                                size={26}
-                                disabled={reader.padding >= 10 ? true : false}
-                                onPress={() =>
-                                    dispatch(
-                                        setReaderSettings(
-                                            "padding",
-                                            reader.padding + 1
-                                        )
-                                    )
-                                }
-                                style={{ marginVertical: 0 }}
-                            />
-                        </Row>
-                    </Row>
-                    <Row
-                        style={{
-                            justifyContent: "space-between",
-                            width: "100%",
-                            paddingHorizontal: 16,
-                            marginTop: 16,
-                        }}
-                    >
-                        <ReaderSettingTitle title="Line Height" />
-                        <Row>
-                            <IconButton
-                                icon="minus"
-                                color={theme.colorAccent}
-                                size={26}
-                                disabled={
-                                    reader.lineHeight <= 1.3 ? true : false
-                                }
-                                onPress={() =>
-                                    dispatch(
-                                        setReaderSettings(
-                                            "lineHeight",
-                                            reader.lineHeight - 0.1
-                                        )
-                                    )
-                                }
-                                style={{ marginVertical: 0 }}
-                            />
-                            <Text
-                                style={{
-                                    color: "#FFFFFF",
-                                    paddingHorizontal: 24,
-                                }}
-                            >
-                                {`${Math.round(reader.lineHeight * 10) / 10}%`}
-                            </Text>
-                            <IconButton
-                                icon="plus"
-                                color={theme.colorAccent}
-                                size={26}
-                                disabled={reader.lineHeight >= 2 ? true : false}
-                                onPress={() =>
-                                    dispatch(
-                                        setReaderSettings(
-                                            "lineHeight",
-                                            reader.lineHeight + 0.1
-                                        )
-                                    )
-                                }
-                                style={{ marginVertical: 0 }}
-                            />
-                        </Row>
-                    </Row>
-                    <Row
-                        style={{
-                            justifyContent: "space-between",
-                            width: "100%",
-                            paddingHorizontal: 16,
-                            marginTop: 16,
-                        }}
-                    >
-                        <ReaderSettingTitle title="Font Style" />
-                        <Menu
-                            visible={fontMenu}
-                            onDismiss={closeFontMenu}
-                            contentStyle={{ backgroundColor: theme.menuColor }}
-                            anchor={
-                                <Text
-                                    onPress={openFontMenu}
-                                    style={{
-                                        color: "white",
-                                        paddingHorizontal: 16,
-                                        fontSize: 16,
-                                        fontFamily: reader.fontFamily,
-                                    }}
-                                >
-                                    {fonts.find(
-                                        (font) =>
-                                            font.fontFamily ===
-                                            reader.fontFamily
-                                    ).name || "Default"}
-                                </Text>
-                            }
-                        >
-                            {fonts.map((font) => (
-                                <Menu.Item
-                                    key={font.fontFamily}
-                                    onPress={() =>
-                                        dispatch(
-                                            setReaderSettings(
-                                                "fontFamily",
-                                                font.fontFamily
-                                            )
-                                        )
-                                    }
-                                    icon={
-                                        font.fontFamily === reader.fontFamily &&
-                                        "check"
-                                    }
-                                    title={font.name}
-                                    style={{ backgroundColor: theme.menuColor }}
-                                    titleStyle={{
-                                        color: theme.textColorPrimary,
-                                    }}
-                                />
-                            ))}
-                        </Menu>
-                    </Row>
-                    <Row
-                        style={{
-                            justifyContent: "space-between",
-                            width: "100%",
-                            paddingHorizontal: 16,
-                            marginTop: 16,
-                        }}
-                    >
-                        <View>
-                            <ReaderSettingTitle title="Select Text " />
-                            <Text
-                                style={{
-                                    fontSize: 14,
-                                    color: "white",
-                                }}
-                            >
-                                (Justify does not work with selectable text)
-                            </Text>
-                        </View>
-                        <Switch
-                            value={selectText}
-                            onValueChange={setSelectText}
-                            color={theme.colorAccent}
-                        />
-                    </Row>
-                </View>
-            </View>
-        </Bottomsheet>
-    );
-};
-
-export default ReaderSheet;
-
-const styles = StyleSheet.create({
-    contentContainer: {
-        flex: 1,
-        borderTopLeftRadius: 8,
-        borderTopRightRadius: 8,
-        backgroundColor: "rgba(0,0,0,0.5)",
-    },
-    readerSettingsContainer: {
-        flex: 1,
-        alignItems: "center",
-        paddingTop: 30,
-    },
-    title: {
-        color: "#FFFFFF",
-        fontWeight: "bold",
-    },
-});

src/Screens/Extension/Extension.js

@@ -1,163 +0,0 @@
-import React, { useEffect, useState } from "react";
-import { StyleSheet, View, ActivityIndicator } from "react-native";
-import * as WebBrowser from "expo-web-browser";
-
-import NovelCover from "../../Components/NovelCover";
-import EmptyView from "../../Components/EmptyView";
-
-import { Searchbar } from "../../Components/Searchbar";
-import { useTheme, useLibrary } from "../../Hooks/reduxHooks";
-import NovelList from "../../Components/NovelList";
-import { showToast } from "../../Hooks/showToast";
-import ErrorView from "../../Components/ErrorView";
-
-const Extension = ({ navigation, route }) => {
-    const { sourceId, sourceName, sourceUrl } = route.params;
-
-    const theme = useTheme();
-    const library = useLibrary();
-
-    const [loading, setLoading] = useState(true);
-    const [novels, setNovels] = useState();
-    const [error, setError] = useState();
-
-    const [searchText, setSearchText] = useState("");
-
-    const getSourceUrl = () => {
-        if (sourceId === 1) {
-            return `https://lnreader-extensions.vercel.app/api/1/novels/1/?o=rating`;
-        } else {
-            return `https://lnreader-extensions.vercel.app/api/${sourceId}/novels/`;
-        }
-    };
-
-    const getSearchUrl = () => {
-        if (sourceId === 1) {
-            return `https://lnreader-extensions.vercel.app/api/1/search/?s=${searchText}&?o=rating`;
-        } else {
-            return `https://lnreader-extensions.vercel.app/api/${sourceId}/search/?s=${searchText}`;
-        }
-    };
-
-    const getNovels = async () => {
-        try {
-            const url = getSourceUrl();
-
-            const res = await fetch(url);
-            const data = await res.json();
-
-            setNovels(data);
-            setLoading(false);
-        } catch (error) {
-            setError(error.message);
-            setNovels([]);
-            setLoading(false);
-            showToast(error.message);
-        }
-    };
-
-    const clearSearchbar = () => {
-        getNovels();
-        setLoading(true);
-        setSearchText("");
-    };
-
-    const getSearchResults = () => {
-        setLoading(true);
-        fetch(getSearchUrl())
-            .then((response) => response.json())
-            .then((json) => {
-                setNovels(json);
-                setLoading(false);
-            })
-            .catch((error) => {
-                setNovels([]);
-                setLoading(false);
-                showToast(error.message);
-            });
-    };
-
-    const checkIFInLibrary = (sourceId, novelUrl) => {
-        return library.some(
-            (obj) => obj.novelUrl === novelUrl && obj.sourceId === sourceId
-        );
-    };
-
-    useEffect(() => {
-        getNovels();
-    }, []);
-
-    const renderItem = ({ item }) => (
-        <NovelCover
-            item={item}
-            onPress={() =>
-                navigation.navigate("Novel", {
-                    novelName: item.novelName,
-                    novelCover: item.novelCover,
-                    novelUrl: item.novelUrl,
-                    sourceId: item.extensionId,
-                })
-            }
-            libraryStatus={checkIFInLibrary(item.extensionId, item.novelUrl)}
-        />
-    );
-
-    const listEmptyComponent = () => (
-        <ErrorView
-            error={error || "No results found"}
-            onRetry={() => {
-                getNovels();
-                setLoading(true);
-                setError();
-            }}
-            openWebView={() => WebBrowser.openBrowserAsync(sourceUrl)}
-            theme={theme}
-        />
-    );
-
-    return (
-        <View
-            style={[
-                styles.container,
-                { backgroundColor: theme.colorPrimaryDark },
-            ]}
-        >
-            <Searchbar
-                theme={theme}
-                placeholder={`Search ${sourceName}`}
-                left="arrow-left"
-                onPressLeft={() => navigation.goBack()}
-                searchText={searchText}
-                onChangeText={(text) => setSearchText(text)}
-                onSubmitEditing={getSearchResults}
-                clearSearchbar={clearSearchbar}
-                right="earth"
-                displayMenu={true}
-                onPressRight={() => WebBrowser.openBrowserAsync(sourceUrl)}
-            />
-
-            {loading ? (
-                <View style={{ flex: 1, justifyContent: "center" }}>
-                    <ActivityIndicator size={60} color={theme.colorAccent} />
-                </View>
-            ) : (
-                <NovelList
-                    data={novels}
-                    renderItem={renderItem}
-                    ListEmptyComponent={listEmptyComponent()}
-                />
-            )}
-        </View>
-    );
-};
-
-export default Extension;
-
-const styles = StyleSheet.create({
-    container: {
-        flex: 1,
-    },
-    contentContainer: {
-        flex: 1,
-    },
-});

src/Screens/History/History.js

@@ -1,171 +0,0 @@
-import React, { useState, useEffect } from "react";
-import { StyleSheet, FlatList, ActivityIndicator, Text } from "react-native";
-
-import HistoryCard from "./components/HistoryCard";
-
-import { useDispatch, useSelector } from "react-redux";
-import EmptyView from "../../Components/EmptyView";
-
-import {
-    getHistoryAction,
-    clearAllHistoryAction,
-} from "../../redux/history/history.actions";
-
-import moment from "moment";
-import { dateFormat } from "../../Services/utils/constants";
-import { ScreenContainer } from "../../Components/Common";
-import { Searchbar } from "../../Components/Searchbar";
-import { useTheme } from "../../Hooks/reduxHooks";
-import { Button, Dialog, Portal } from "react-native-paper";
-
-const History = ({ navigation }) => {
-    const theme = useTheme();
-    const dispatch = useDispatch();
-    const { history, loading } = useSelector((state) => state.historyReducer);
-
-    const [searchText, setSearchText] = useState("");
-    const [searchResults, setSearchResults] = useState([]);
-
-    /**
-     * Confirm Clear History Dialog
-     */
-    const [visible, setVisible] = useState(false);
-    const showDialog = () => setVisible(true);
-    const hideDialog = () => setVisible(false);
-
-    useEffect(() => {
-        dispatch(getHistoryAction());
-    }, [getHistoryAction]);
-
-    const renderHistoryCard = ({ item }) => (
-        <HistoryCard
-            dispatch={dispatch}
-            item={item}
-            theme={theme}
-            navigation={navigation}
-        />
-    );
-
-    const clearSearchbar = () => setSearchText("");
-
-    const onChangeText = (text) => {
-        setSearchText(text);
-        let results = [];
-
-        text !== "" &&
-            history.map((item) => {
-                const date = item.date;
-                const novels = item.novels.filter((novel) =>
-                    novel.novelName.toLowerCase().includes(text.toLowerCase())
-                );
-
-                if (novels.length > 0) {
-                    results.push({
-                        date,
-                        novels,
-                    });
-                }
-            });
-
-        setSearchResults(results);
-    };
-
-    return (
-        <ScreenContainer theme={theme}>
-            <Searchbar
-                placeholder="Search History"
-                searchText={searchText}
-                clearSearchbar={clearSearchbar}
-                onChangeText={onChangeText}
-                left="magnify"
-                theme={theme}
-                right="trash-can-outline"
-                onPressRight={showDialog}
-            />
-            <FlatList
-                contentContainerStyle={{
-                    flexGrow: 1,
-                    paddingVertical: 8,
-                    paddingHorizontal: 16,
-                }}
-                data={searchText ? searchResults : history}
-                keyExtractor={(index) => index.toString()}
-                renderItem={({ item }) => (
-                    <FlatList
-                        keyExtractor={(item, index) => index.toString()}
-                        data={item.novels}
-                        renderItem={renderHistoryCard}
-                        ListHeaderComponent={
-                            <Text
-                                style={{
-                                    textTransform: "uppercase",
-                                    paddingVertical: 8,
-                                    color: theme.textColorSecondary,
-                                }}
-                            >
-                                {moment(item.date).calendar(null, dateFormat)}
-                            </Text>
-                        }
-                    />
-                )}
-                ListFooterComponent={
-                    loading && (
-                        <ActivityIndicator
-                            size="small"
-                            color={theme.colorAccent}
-                        />
-                    )
-                }
-                ListEmptyComponent={
-                    <EmptyView
-                        icon="(˘･_･˘)"
-                        description="Nothing read recently"
-                    />
-                }
-            />
-            <Portal>
-                <Dialog
-                    visible={visible}
-                    onDismiss={hideDialog}
-                    style={{
-                        borderRadius: 6,
-                        backgroundColor: theme.colorPrimary,
-                    }}
-                >
-                    <Dialog.Title
-                        style={{
-                            letterSpacing: 0,
-                            fontSize: 16,
-                            color: theme.textColorPrimary,
-                        }}
-                    >
-                        Are you sure? All history will be lost.
-                    </Dialog.Title>
-                    <Dialog.Actions>
-                        <Button
-                            uppercase={false}
-                            theme={{ colors: { primary: theme.colorAccent } }}
-                            onPress={hideDialog}
-                        >
-                            Cancel
-                        </Button>
-                        <Button
-                            uppercase={false}
-                            theme={{ colors: { primary: theme.colorAccent } }}
-                            onPress={() => {
-                                dispatch(clearAllHistoryAction());
-                                hideDialog();
-                            }}
-                        >
-                            Ok
-                        </Button>
-                    </Dialog.Actions>
-                </Dialog>
-            </Portal>
-        </ScreenContainer>
-    );
-};
-
-export default History;
-
-const styles = StyleSheet.create({});

src/Screens/History/components/HistoryCard.js

@@ -1,116 +0,0 @@
-import React from "react";
-
-import { StyleSheet, View, Text, Image } from "react-native";
-import { TouchableRipple, IconButton } from "react-native-paper";
-
-import moment from "moment";
-
-import { useDispatch } from "react-redux";
-import { setNovel } from "../../../redux/novel/novel.actions";
-import { parseChapterNumber } from "../../../Services/utils/helpers";
-import { deleteHistoryAction } from "../../../redux/history/history.actions";
-
-const HistoryCard = ({ item, navigation, theme, dispatch }) => {
-    return (
-        <TouchableRipple
-            style={styles.historyCard}
-            rippleColor={theme.rippleColor}
-            borderless
-            onPress={() => {
-                navigation.navigate("Novel", item);
-                dispatch(setNovel(item));
-            }}
-        >
-            <>
-                <Image
-                    source={{ uri: item.novelCover }}
-                    style={styles.historyCover}
-                />
-                <View style={styles.historyText}>
-                    <View style={{ flex: 0.9 }}>
-                        <Text
-                            style={{
-                                color: theme.textColorPrimary,
-                                fontWeight: "bold",
-                                fontSize: 16,
-                            }}
-                            numberOfLines={1}
-                        >
-                            {item.novelName}
-                        </Text>
-                        <Text
-                            style={{
-                                color: theme.textColorSecondary,
-                                marginTop: 2,
-                            }}
-                            numberOfLines={1}
-                        >
-                            {`Ch. ${parseChapterNumber(
-                                item.chapterName
-                            )} - ${moment(item.historyTimeRead)
-                                .format("h:mm a")
-                                .toUpperCase()}`}
-                        </Text>
-                    </View>
-                    <View
-                        style={{
-                            flexDirection: "row",
-                            alignItems: "center",
-                        }}
-                    >
-                        <IconButton
-                            icon="delete-outline"
-                            size={22}
-                            color={theme.textColorPrimary}
-                            style={{
-                                marginRight: 0,
-                            }}
-                            onPress={() =>
-                                dispatch(deleteHistoryAction(item.historyId))
-                            }
-                        />
-                        <IconButton
-                            icon="play"
-                            size={24}
-                            color={theme.textColorPrimary}
-                            style={{ marginRight: 0 }}
-                            onPress={() =>
-                                navigation.navigate("Chapter", {
-                                    chapterId: item.historyChapterId,
-                                    chapterUrl: item.chapterUrl,
-                                    sourceId: item.sourceId,
-                                    novelUrl: item.novelUrl,
-                                    novelId: item.novelId,
-                                    chapterName: item.chapterName,
-                                    novelName: item.novelName,
-                                })
-                            }
-                        />
-                    </View>
-                </View>
-            </>
-        </TouchableRipple>
-    );
-};
-
-export default HistoryCard;
-
-const styles = StyleSheet.create({
-    historyCard: {
-        marginVertical: 8,
-        borderRadius: 4,
-        flexDirection: "row",
-        alignItems: "center",
-    },
-    historyCover: {
-        height: 80,
-        width: 57,
-        borderRadius: 4,
-    },
-    historyText: {
-        marginLeft: 15,
-        flex: 1,
-        flexDirection: "row",
-        justifyContent: "space-between",
-    },
-});

src/Screens/Library/Library.js

@@ -1,172 +0,0 @@
-import React, { useState, useCallback, useRef } from "react";
-import {
-    StyleSheet,
-    Text,
-    View,
-    RefreshControl,
-    ActivityIndicator,
-    TouchableOpacity,
-} from "react-native";
-import { useFocusEffect } from "@react-navigation/native";
-import { useSelector, useDispatch } from "react-redux";
-
-import { Searchbar } from "../../Components/Searchbar";
-import NovelList from "../../Components/NovelList";
-import NovelCover from "../../Components/NovelCover";
-import EmptyView from "../../Components/EmptyView";
-
-import {
-    getLibraryAction,
-    searchLibraryAction,
-} from "../../redux/library/library.actions";
-import { updateLibraryAction } from "../../redux/updates/updates.actions";
-import { useSettings, useTheme } from "../../Hooks/reduxHooks";
-import { setNovel } from "../../redux/novel/novel.actions";
-import { Portal, TouchableRipple } from "react-native-paper";
-import LibraryFilterSheet from "./components/LibraryFilterSheet";
-
-const LibraryScreen = ({ navigation }) => {
-    const theme = useTheme();
-    const dispatch = useDispatch();
-    const { showNumberOfNovels } = useSettings();
-
-    const libraryFilterSheetRef = useRef(null);
-
-    const {
-        loading,
-        novels,
-        filters: { sort, filter },
-    } = useSelector((state) => state.libraryReducer);
-
-    const [refreshing, setRefreshing] = useState(false);
-    const [searchText, setSearchText] = useState("");
-
-    useFocusEffect(
-        useCallback(() => {
-            setSearchText("");
-            dispatch(getLibraryAction(sort, filter));
-        }, [getLibraryAction, sort, filter])
-    );
-
-    const onRefresh = () => {
-        setRefreshing(true);
-        dispatch(updateLibraryAction());
-        setRefreshing(false);
-    };
-
-    const clearSearchbar = () => {
-        dispatch(getLibraryAction(sort, filter));
-        setSearchText("");
-    };
-
-    const onChangeText = (text) => {
-        setSearchText(text);
-        dispatch(searchLibraryAction(text, sort, filter));
-    };
-
-    const renderItem = ({ item }) => (
-        <NovelCover
-            item={item}
-            onPress={() => {
-                navigation.navigate("Novel", item);
-                dispatch(setNovel(item));
-            }}
-        />
-    );
-
-    const refreshControl = () => (
-        <RefreshControl
-            refreshing={refreshing}
-            onRefresh={onRefresh}
-            colors={["white"]}
-            progressBackgroundColor={theme.colorAccent}
-        />
-    );
-
-    // if (!loading) {
-    //     console.log(novels);
-    // }
-
-    const listEmptyComponent = () =>
-        searchText === "" && (
-            <EmptyView
-                icon="Σ(ಠ_ಠ)"
-                description="Your library is empty. Add series to your library from Browse."
-            />
-        );
-
-    return (
-        <>
-            <View
-                style={[
-                    styles.container,
-                    { backgroundColor: theme.colorPrimaryDark },
-                ]}
-            >
-                <Searchbar
-                    placeholder={`Search Library ${
-                        showNumberOfNovels ? "(" + novels.length + ")" : ""
-                    }`}
-                    searchText={searchText}
-                    clearSearchbar={clearSearchbar}
-                    onChangeText={onChangeText}
-                    left="magnify"
-                    right="filter-variant"
-                    filter={filter}
-                    onPressRight={() => libraryFilterSheetRef.current.show()}
-                    theme={theme}
-                />
-                {loading ? (
-                    <ActivityIndicator size="small" color={theme.colorAccent} />
-                ) : (
-                    <>
-                        {searchText !== "" && (
-                            <TouchableRipple
-                                onPress={() =>
-                                    navigation.navigate("GlobalSearch", {
-                                        novelName: searchText,
-                                    })
-                                }
-                                borderless
-                                rippleColor={theme.colorAccent}
-                                style={styles.emptySearch}
-                            >
-                                <Text style={{ color: theme.colorAccent }}>
-                                    {`Search for "${searchText}" globally`}
-                                </Text>
-                            </TouchableRipple>
-                        )}
-                        <NovelList
-                            data={novels}
-                            renderItem={renderItem}
-                            refreshControl={refreshControl()}
-                            ListEmptyComponent={listEmptyComponent}
-                        />
-                        <Portal>
-                            <LibraryFilterSheet
-                                bottomSheetRef={libraryFilterSheetRef}
-                                theme={theme}
-                                dispatch={dispatch}
-                                sort={sort}
-                                filter={filter}
-                            />
-                        </Portal>
-                    </>
-                )}
-            </View>
-        </>
-    );
-};
-
-export default LibraryScreen;
-
-const styles = StyleSheet.create({
-    container: {
-        flex: 1,
-    },
-    emptySearch: {
-        alignItems: "center",
-        paddingVertical: 8,
-        borderRadius: 4,
-    },
-});

src/Screens/Library/components/LibraryFilterSheet.js

@@ -1,362 +0,0 @@
-import React, { useState } from "react";
-import {
-    StyleSheet,
-    View,
-    Text,
-    Animated,
-    useWindowDimensions,
-} from "react-native";
-import { TabView, SceneMap, TabBar } from "react-native-tab-view";
-
-import { Checkbox } from "react-native-paper";
-
-import Bottomsheet from "rn-sliding-up-panel";
-import { ListItem } from "../../../Components/List";
-import { filterLibrary } from "../../../redux/library/library.actions";
-import { useSettings } from "../../../Hooks/reduxHooks";
-import { setAppSettings } from "../../../redux/settings/settings.actions";
-
-const LibraryFilterSheet = ({
-    bottomSheetRef,
-    dispatch,
-    sort,
-    filter,
-    theme,
-}) => {
-    const [animatedValue] = useState(new Animated.Value(0));
-
-    const FirstRoute = () => (
-        <View style={{ flex: 1 }}>
-            <Checkbox.Item
-                label="Downloaded"
-                labelStyle={{
-                    fontSize: 14,
-                    color: theme.textColorPrimary,
-                }}
-                color={theme.colorAccent}
-                uncheckedColor={theme.textColorHint}
-                status={
-                    filter === "chaptersDownloaded > 0"
-                        ? "checked"
-                        : "unchecked"
-                }
-                onPress={() =>
-                    filter === "chaptersDownloaded > 0"
-                        ? dispatch(filterLibrary(sort, ""))
-                        : dispatch(
-                              filterLibrary(sort, "chaptersDownloaded > 0")
-                          )
-                }
-            />
-            <Checkbox.Item
-                label="Unread"
-                labelStyle={{
-                    fontSize: 14,
-                    color: theme.textColorPrimary,
-                }}
-                color={theme.colorAccent}
-                uncheckedColor={theme.textColorHint}
-                status={filter === "unread = 1" ? "checked" : "unchecked"}
-                onPress={() =>
-                    filter === "unread = 1"
-                        ? dispatch(filterLibrary(sort, ""))
-                        : dispatch(filterLibrary(sort, "unread = 1"))
-                }
-            />
-            <Checkbox.Item
-                label="Completed"
-                labelStyle={{
-                    fontSize: 14,
-                    color: theme.textColorPrimary,
-                }}
-                color={theme.colorAccent}
-                uncheckedColor={theme.textColorHint}
-                status={
-                    filter === "chaptersUnread IS NULL"
-                        ? "checked"
-                        : "unchecked"
-                }
-                onPress={() =>
-                    filter === "chaptersUnread IS NULL"
-                        ? dispatch(filterLibrary(sort, ""))
-                        : dispatch(
-                              filterLibrary(sort, "chaptersUnread IS NULL")
-                          )
-                }
-            />
-        </View>
-    );
-
-    const SecondRoute = () => (
-        <View style={{ flex: 1 }}>
-            <ListItem
-                style={{ paddingVertical: 10 }}
-                title="Date Added"
-                titleStyle={{ fontSize: 14 }}
-                theme={theme}
-                right={
-                    sort === "novels.novelId ASC"
-                        ? "arrow-up"
-                        : sort === "novels.novelId DESC"
-                        ? "arrow-down"
-                        : null
-                }
-                iconColor={theme.colorAccent}
-                onPress={() =>
-                    sort === "novels.novelId ASC"
-                        ? dispatch(filterLibrary("novels.novelId DESC", filter))
-                        : dispatch(filterLibrary("novels.novelId ASC", filter))
-                }
-            />
-            <ListItem
-                style={{ paddingVertical: 10 }}
-                title="Alphabetically"
-                titleStyle={{ fontSize: 14 }}
-                theme={theme}
-                right={
-                    sort === "novels.novelName ASC"
-                        ? "arrow-up"
-                        : sort === "novels.novelName DESC"
-                        ? "arrow-down"
-                        : null
-                }
-                iconColor={theme.colorAccent}
-                onPress={() =>
-                    sort === "novels.novelName ASC"
-                        ? dispatch(
-                              filterLibrary("novels.novelName DESC", filter)
-                          )
-                        : dispatch(
-                              filterLibrary("novels.novelName ASC", filter)
-                          )
-                }
-            />
-            <ListItem
-                style={{ paddingVertical: 10 }}
-                title="Unread"
-                titleStyle={{ fontSize: 14 }}
-                theme={theme}
-                right={
-                    sort === "novels.unread ASC"
-                        ? "arrow-up"
-                        : sort === "novels.unread DESC"
-                        ? "arrow-down"
-                        : null
-                }
-                iconColor={theme.colorAccent}
-                onPress={() =>
-                    sort === "novels.unread ASC"
-                        ? dispatch(filterLibrary("novels.unread DESC", filter))
-                        : dispatch(filterLibrary("novels.unread ASC", filter))
-                }
-            />
-            <ListItem
-                style={{ paddingVertical: 10 }}
-                title="Downloaded"
-                titleStyle={{ fontSize: 14 }}
-                theme={theme}
-                right={
-                    sort === "chaptersDownloaded ASC"
-                        ? "arrow-up"
-                        : sort === "chaptersDownloaded DESC"
-                        ? "arrow-down"
-                        : null
-                }
-                iconColor={theme.colorAccent}
-                onPress={() =>
-                    sort === "chaptersDownloaded ASC"
-                        ? dispatch(
-                              filterLibrary("chaptersDownloaded DESC", filter)
-                          )
-                        : dispatch(
-                              filterLibrary("chaptersDownloaded ASC", filter)
-                          )
-                }
-            />
-            <ListItem
-                style={{ paddingVertical: 10 }}
-                title="Total Chapters"
-                titleStyle={{ fontSize: 14 }}
-                theme={theme}
-                right={
-                    sort === "chaptersUnread ASC"
-                        ? "arrow-up"
-                        : sort === "chaptersUnread DESC"
-                        ? "arrow-down"
-                        : null
-                }
-                iconColor={theme.colorAccent}
-                onPress={() =>
-                    sort === "chaptersUnread ASC"
-                        ? dispatch(filterLibrary("chaptersUnread DESC", filter))
-                        : dispatch(filterLibrary("chaptersUnread ASC", filter))
-                }
-            />
-        </View>
-    );
-
-    const displayModes = [
-        { displayMode: 0, label: "Compact Grid" },
-        { displayMode: 1, label: "Comfortable Grid" },
-        { displayMode: 2, label: "List" },
-    ];
-
-    const {
-        displayMode,
-        showDownloadBadges,
-        showUnreadBadges,
-        showNumberOfNovels,
-    } = useSettings();
-
-    const renderCheckboxes = () => {
-        return displayModes.map((mode) => (
-            <Checkbox.Item
-                key={mode.displayMode}
-                label={mode.label}
-                labelStyle={{ color: theme.textColorPrimary, fontSize: 14 }}
-                status={
-                    displayMode === mode.displayMode ? "checked" : "unchecked"
-                }
-                // mode="ios"
-                uncheckedColor={theme.textColorSecondary}
-                color={theme.colorAccent}
-                onPress={() =>
-                    dispatch(setAppSettings("displayMode", mode.displayMode))
-                }
-            />
-        ));
-    };
-
-    const ThirdRoute = () => (
-        <View style={{ flex: 1 }}>
-            <Text
-                style={{
-                    color: theme.textColorSecondary,
-                    paddingHorizontal: 16,
-                    paddingVertical: 16,
-                    textTransform: "uppercase",
-                }}
-            >
-                Display Mode
-            </Text>
-            {renderCheckboxes()}
-
-            <Text
-                style={{
-                    color: theme.textColorSecondary,
-                    paddingHorizontal: 16,
-                    paddingVertical: 16,
-                    textTransform: "uppercase",
-                }}
-            >
-                Badges
-            </Text>
-            <Checkbox.Item
-                label="Download Badges"
-                labelStyle={{ color: theme.textColorPrimary, fontSize: 14 }}
-                status={showDownloadBadges ? "checked" : "unchecked"}
-                uncheckedColor={theme.textColorSecondary}
-                color={theme.colorAccent}
-                onPress={() =>
-                    dispatch(
-                        setAppSettings(
-                            "showDownloadBadges",
-                            !showDownloadBadges
-                        )
-                    )
-                }
-            />
-            <Checkbox.Item
-                label="Unread Badges"
-                labelStyle={{ color: theme.textColorPrimary, fontSize: 14 }}
-                status={showUnreadBadges ? "checked" : "unchecked"}
-                uncheckedColor={theme.textColorSecondary}
-                color={theme.colorAccent}
-                onPress={() =>
-                    dispatch(
-                        setAppSettings("showUnreadBadges", !showUnreadBadges)
-                    )
-                }
-            />
-            <Checkbox.Item
-                label="Show number of items"
-                labelStyle={{ color: theme.textColorPrimary, fontSize: 14 }}
-                status={showNumberOfNovels ? "checked" : "unchecked"}
-                uncheckedColor={theme.textColorSecondary}
-                color={theme.colorAccent}
-                onPress={() =>
-                    dispatch(
-                        setAppSettings(
-                            "showNumberOfNovels",
-                            !showNumberOfNovels
-                        )
-                    )
-                }
-            />
-        </View>
-    );
-
-    const renderScene = SceneMap({
-        first: FirstRoute,
-        second: SecondRoute,
-        third: ThirdRoute,
-    });
-
-    const layout = useWindowDimensions();
-
-    const [index, setIndex] = useState(0);
-    const [routes] = useState([
-        { key: "first", title: "Filter" },
-        { key: "second", title: "Sort" },
-        { key: "third", title: "Display" },
-    ]);
-
-    const renderTabBar = (props) => (
-        <TabBar
-            {...props}
-            indicatorStyle={{ backgroundColor: theme.colorAccent }}
-            style={{ backgroundColor: theme.colorPrimary }}
-            renderLabel={({ route, focused, color }) => (
-                <Text style={{ color, margin: 8 }}>{route.title}</Text>
-            )}
-            inactiveColor={theme.textColorSecondary}
-            activeColor={theme.colorAccent}
-            pressColor={theme.rippleColor}
-        />
-    );
-
-    return (
-        <Bottomsheet
-            animatedValue={animatedValue}
-            ref={bottomSheetRef}
-            draggableRange={{ top: 470, bottom: 0 }}
-            snappingPoints={[0, 470]}
-        >
-            <View
-                style={[
-                    styles.contentContainer,
-                    { backgroundColor: theme.colorPrimaryDark },
-                ]}
-            >
-                <TabView
-                    navigationState={{ index, routes }}
-                    renderTabBar={renderTabBar}
-                    renderScene={renderScene}
-                    onIndexChange={setIndex}
-                    initialLayout={{ width: layout.width }}
-                    style={{ borderTopRightRadius: 8, borderTopLeftRadius: 8 }}
-                />
-            </View>
-        </Bottomsheet>
-    );
-};
-
-export default LibraryFilterSheet;
-
-const styles = StyleSheet.create({
-    contentContainer: {
-        flex: 1,
-        borderTopRightRadius: 8,
-        borderTopLeftRadius: 8,
-    },
-});

src/Screens/More/About.js

@@ -1,72 +0,0 @@
-import React from "react";
-import { View } from "react-native";
-import * as Linking from "expo-linking";
-
-import { Appbar } from "../../Components/Appbar";
-
-import { useSelector } from "react-redux";
-import { Divider, ListItem, ListSection } from "../../Components/List";
-
-const AboutScreen = ({ navigation }) => {
-    const theme = useSelector((state) => state.settingsReducer.theme);
-
-    return (
-        <>
-            <Appbar title="About" onBackAction={() => navigation.goBack()} />
-            <View style={{ flex: 1, backgroundColor: theme.colorPrimaryDark }}>
-                <ListSection>
-                    <ListItem
-                        title="Version"
-                        description="Stable 1.0.19"
-                        theme={theme}
-                    />
-                    <ListItem
-                        title="Build Time"
-                        description="31-05-21 21:30 PM"
-                        theme={theme}
-                    />
-                    <ListItem
-                        title="What's new"
-                        onPress={() =>
-                            Linking.openURL(
-                                "https://github.com/rajarsheechatterjee/lnreader/commits/main"
-                            )
-                        }
-                        theme={theme}
-                    />
-                    <Divider theme={theme} />
-                    <ListItem
-                        title="Discord"
-                        description="https://discord.gg/QdcWN4MD63"
-                        onPress={() =>
-                            Linking.openURL("https://discord.gg/QdcWN4MD63")
-                        }
-                        theme={theme}
-                    />
-                    <ListItem
-                        title="Github"
-                        description="https://github.com/rajarsheechatterjee/lnreader"
-                        onPress={() =>
-                            Linking.openURL(
-                                "https://github.com/rajarsheechatterjee/lnreader"
-                            )
-                        }
-                        theme={theme}
-                    />
-                    <ListItem
-                        title="Sources"
-                        description="https://github.com/rajarsheechatterjee/lnreader-sources"
-                        onPress={() =>
-                            Linking.openURL(
-                                "https://github.com/rajarsheechatterjee/lnreader-sources"
-                            )
-                        }
-                        theme={theme}
-                    />
-                </ListSection>
-            </View>
-        </>
-    );
-};
-
-export default AboutScreen;

src/Screens/More/GeneralSettings.js

@@ -1,129 +0,0 @@
-import React, { useState } from "react";
-import { useDispatch, useSelector } from "react-redux";
-
-import { Appbar } from "../../Components/Appbar";
-import {
-    Divider,
-    ListItem,
-    ListSection,
-    ListSubHeader,
-} from "../../Components/List";
-import { ScreenContainer } from "../../Components/Common";
-
-import { useTheme } from "../../Hooks/reduxHooks";
-import DisplayModeModal from "./components/DisplayModeModal";
-import GridSizeModal from "./components/GridSizeModal";
-import ThemeModal from "./components/ThemeModal";
-import AccentColorModal from "./components/AccentColorModal";
-
-const GenralSettings = ({ navigation }) => {
-    const theme = useTheme();
-    const dispatch = useDispatch();
-
-    const { displayMode, novelsPerRow } = useSelector(
-        (state) => state.settingsReducer
-    );
-
-    const displayModeLabel = (displayMode) => {
-        const label = {
-            0: "Compact Grid",
-            1: "Comfortable Grid",
-            2: "List",
-        };
-
-        return label[displayMode] ?? "Compact Grid";
-    };
-
-    /**
-     * Display Mode Modal
-     */
-    const [displayModalVisible, setDisplayModalVisible] = useState(false);
-    const showDisplayModal = () => setDisplayModalVisible(true);
-    const hideDisplayModal = () => setDisplayModalVisible(false);
-
-    /**
-     * Theme Modal
-     */
-    const [themeModalVisible, setthemeModalVisible] = useState(false);
-    const showthemeModal = () => setthemeModalVisible(true);
-    const hidethemeModal = () => setthemeModalVisible(false);
-
-    /**
-     * Grid Size Modal
-     */
-    const [gridSizeModalVisible, setGridSizeModalVisible] = useState(false);
-    const showGridSizeModal = () => setGridSizeModalVisible(true);
-    const hideGridSizeModal = () => setGridSizeModalVisible(false);
-
-    /**
-     * Accent Color Modal
-     */
-    const [accentColorModal, setAccentColorModal] = useState(false);
-    const showAccentColorModal = () => setAccentColorModal(true);
-    const hideAccentColorModal = () => setAccentColorModal(false);
-
-    return (
-        <ScreenContainer theme={theme}>
-            <Appbar title="General" onBackAction={() => navigation.goBack()} />
-            <ListSection>
-                <ListSubHeader theme={theme}>Display</ListSubHeader>
-                <ListItem
-                    title="Display Mode"
-                    description={displayModeLabel(displayMode)}
-                    onPress={showDisplayModal}
-                    theme={theme}
-                />
-                <ListItem
-                    title="Items per row in library"
-                    description={`${novelsPerRow} items per row`}
-                    onPress={showGridSizeModal}
-                    theme={theme}
-                />
-                <Divider theme={theme} />
-                <ListSubHeader theme={theme}>Theme</ListSubHeader>
-                <ListItem
-                    title="Theme"
-                    description={theme.name}
-                    onPress={showthemeModal}
-                    theme={theme}
-                />
-                <ListItem
-                    title="Accent Color"
-                    description={theme.colorAccent}
-                    onPress={showAccentColorModal}
-                    theme={theme}
-                    iconColor={theme.colorAccent}
-                    right="circle"
-                />
-            </ListSection>
-            <DisplayModeModal
-                displayMode={displayMode}
-                displayModalVisible={displayModalVisible}
-                hideDisplayModal={hideDisplayModal}
-                dispatch={dispatch}
-                theme={theme}
-            />
-            <GridSizeModal
-                dispatch={dispatch}
-                novelsPerRow={novelsPerRow}
-                gridSizeModalVisible={gridSizeModalVisible}
-                hideGridSizeModal={hideGridSizeModal}
-                theme={theme}
-            />
-            <ThemeModal
-                dispatch={dispatch}
-                themeModalVisible={themeModalVisible}
-                hidethemeModal={hidethemeModal}
-                theme={theme}
-            />
-            <AccentColorModal
-                dispatch={dispatch}
-                accentColorModal={accentColorModal}
-                hideAccentColorModal={hideAccentColorModal}
-                theme={theme}
-            />
-        </ScreenContainer>
-    );
-};
-
-export default GenralSettings;

src/Screens/More/More.js

@@ -1,66 +0,0 @@
-import React from "react";
-import { StyleSheet, View, Image } from "react-native";
-
-import { Appbar } from "../../Components/Appbar";
-import { ListItem, ListSection } from "../../Components/List";
-
-import { useTheme } from "../../Hooks/reduxHooks";
-
-const MoreScreen = ({ navigation }) => {
-    const theme = useTheme();
-
-    return (
-        <>
-            <Appbar title="More" style={{ elevation: 0 }} />
-            <View style={{ flex: 1, backgroundColor: theme.colorPrimaryDark }}>
-                <View style={{ overflow: "hidden", paddingBottom: 4 }}>
-                    <View
-                        style={{
-                            paddingTop: 10,
-                            paddingBottom: 25,
-                            alignItems: "center",
-                            backgroundColor: theme.colorPrimary,
-                            elevation: 4,
-                        }}
-                    >
-                        <Image
-                            source={require("../../../assets/logo.png")}
-                            style={{
-                                height: 80,
-                                width: 80,
-                                tintColor: theme.textColorPrimary,
-                            }}
-                        />
-                    </View>
-                </View>
-                <ListSection>
-                    <ListItem
-                        title="Settings"
-                        icon="cog-outline"
-                        onPress={() =>
-                            navigation.navigate("MoreStack", {
-                                screen: "SettingsStack",
-                            })
-                        }
-                        theme={theme}
-                    />
-
-                    <ListItem
-                        title="About"
-                        icon="information-outline"
-                        onPress={() =>
-                            navigation.navigate("MoreStack", {
-                                screen: "About",
-                            })
-                        }
-                        theme={theme}
-                    />
-                </ListSection>
-            </View>
-        </>
-    );
-};
-
-export default MoreScreen;
-
-const styles = StyleSheet.create({});

src/Screens/More/ReaderSettings.js

@@ -1,20 +0,0 @@
-import React from "react";
-import { useDispatch } from "react-redux";
-
-import { Appbar } from "../../Components/Appbar";
-import { ScreenContainer } from "../../Components/Common";
-
-import { useTheme } from "../../Hooks/reduxHooks";
-
-const ReaderSettings = ({ navigation }) => {
-    const theme = useTheme();
-    const dispatch = useDispatch();
-
-    return (
-        <ScreenContainer theme={theme}>
-            <Appbar title="Reader" onBackAction={() => navigation.goBack()} />
-        </ScreenContainer>
-    );
-};
-
-export default ReaderSettings;

src/Screens/More/components/AccentColorModal.js

@@ -1,80 +0,0 @@
-import React, { useState } from "react";
-import { StyleSheet, Text } from "react-native";
-import { Modal, Portal, TextInput } from "react-native-paper";
-import { setAccentColor } from "../../../redux/settings/settings.actions";
-
-const AccentColorModal = ({
-    dispatch,
-    accentColorModal,
-    hideAccentColorModal,
-    theme,
-}) => {
-    const [text, setText] = useState(theme.colorAccent);
-    const [error, setError] = useState();
-
-    return (
-        <Portal>
-            <Modal
-                visible={accentColorModal}
-                onDismiss={() => {
-                    hideAccentColorModal();
-                    setText();
-                    setError();
-                }}
-                contentContainerStyle={[
-                    styles.containerStyle,
-                    { backgroundColor: theme.colorPrimary },
-                ]}
-            >
-                <Text
-                    style={[
-                        styles.dialogTitle,
-                        { color: theme.textColorPrimary },
-                    ]}
-                >
-                    Hex Color Code
-                </Text>
-                <TextInput
-                    value={text}
-                    defaultValue={theme.colorAccent}
-                    onChangeText={(text) => setText(text)}
-                    onSubmitEditing={() => {
-                        if (text.match(/^#[0-9a-f]{3,6}$/i)) {
-                            dispatch(setAccentColor(text));
-                            hideAccentColorModal();
-                        } else {
-                            setError("Enter a valid hex color code");
-                        }
-                    }}
-                    mode="outlined"
-                    theme={{
-                        colors: {
-                            primary: theme.colorAccent,
-                            placeholder: theme.textColorHint,
-                            text: theme.textColorPrimary,
-                            background: "transparent",
-                        },
-                    }}
-                    underlineColor={theme.textColorHint}
-                    dense
-                    error={error}
-                />
-                <Text style={{ color: "#FF0033", paddingTop: 8 }}>{error}</Text>
-            </Modal>
-        </Portal>
-    );
-};
-
-export default AccentColorModal;
-
-const styles = StyleSheet.create({
-    containerStyle: {
-        margin: 30,
-        padding: 20,
-        borderRadius: 8,
-    },
-    dialogTitle: {
-        fontSize: 18,
-        marginBottom: 16,
-    },
-});

src/Screens/More/components/ThemeModal.js

@@ -1,58 +0,0 @@
-import React from "react";
-import { StyleSheet } from "react-native";
-import { Portal, Modal, Checkbox } from "react-native-paper";
-
-import { setStatusBarStyle } from "expo-status-bar";
-import { setAppTheme } from "../../../redux/settings/settings.actions";
-
-const ThemeModal = ({ themeModalVisible, hidethemeModal, dispatch, theme }) => {
-    const themes = [
-        { id: 0, name: "AMOLED Dark", statusBar: "light" },
-        { id: 1, name: "Light", statusBar: "dark" },
-        { id: 2, name: "Dark", statusBar: "light" },
-        { id: 3, name: "Midnight Dusk", statusBar: "light" },
-        { id: 4, name: "Lime", statusBar: "light" },
-        { id: 5, name: "Iris Blue", statusBar: "light" },
-    ];
-
-    const renderThemeCheckboxes = () =>
-        themes.map((item) => (
-            <Checkbox.Item
-                key={item.id}
-                label={item.name}
-                labelStyle={{ color: theme.textColorPrimary }}
-                status={theme.id === item.id ? "checked" : "unchecked"}
-                mode="ios"
-                color={theme.colorAccent}
-                onPress={() => {
-                    dispatch(setAppTheme(item.id));
-                    setStatusBarStyle(item.statusBar);
-                }}
-            />
-        ));
-
-    return (
-        <Portal>
-            <Modal
-                visible={themeModalVisible}
-                onDismiss={hidethemeModal}
-                contentContainerStyle={[
-                    styles.containerStyle,
-                    { backgroundColor: theme.colorPrimaryDark },
-                ]}
-            >
-                {renderThemeCheckboxes()}
-            </Modal>
-        </Portal>
-    );
-};
-
-export default ThemeModal;
-
-const styles = StyleSheet.create({
-    containerStyle: {
-        padding: 20,
-        margin: 20,
-        borderRadius: 6,
-    },
-});

src/Screens/Novel/Novel.js

@@ -1,386 +0,0 @@
-import React, { useEffect, useRef, useState } from "react";
-import {
-    StyleSheet,
-    View,
-    FlatList,
-    RefreshControl,
-    StatusBar,
-    Dimensions,
-    Share,
-} from "react-native";
-
-import { Provider, Portal, Appbar, IconButton, Menu } from "react-native-paper";
-import { useDispatch } from "react-redux";
-
-import {
-    bookmarkChapterAction,
-    deleteAllChaptersAction,
-    downloadAllChaptersAction,
-    getNovelAction,
-    markChapterReadAction,
-    markChaptersRead,
-    markChapterUnreadAction,
-    markPreviousChaptersReadAction,
-    sortAndFilterChapters,
-    updateNovelAction,
-} from "../../redux/novel/novel.actions";
-import {
-    useContinueReading,
-    useNovel,
-    usePreferences,
-    useTheme,
-} from "../../Hooks/reduxHooks";
-import { showToast } from "../../Hooks/showToast";
-
-import ChapterItem from "./components/ChapterItem";
-import NovelInfoHeader from "./components/NovelHeader";
-import ChaptersSettingsSheet from "./components/ChaptersSettingsSheet";
-import TrackSheet from "./components/Tracker/TrackSheet";
-import ChapterActionsSheet from "./components/ChapterActionsSheet";
-import { Row } from "../../Components/Common";
-
-const Novel = ({ route, navigation }) => {
-    const item = route.params;
-    const { sourceId, novelUrl, novelName, followed, novelId } = item;
-
-    const theme = useTheme();
-    const dispatch = useDispatch();
-    const { novel, chapters, loading, updating, downloading } = useNovel();
-
-    const [selected, setSelected] = useState([]);
-    const [downloadMenu, showDownloadMenu] = useState(false);
-
-    let chaptersSettingsSheetRef = useRef(null);
-    let trackerSheetRef = useRef(null);
-    let chapterActionsSheetRef = useRef(null);
-
-    const {
-        sort = "ORDER BY chapterId ASC",
-        filter = "",
-        showChapterTitles = false,
-    } = usePreferences(novel.novelId);
-
-    let { lastReadChapter, position } = useContinueReading(
-        chapters,
-        novel.novelId
-    );
-
-    useEffect(() => {
-        dispatch(
-            getNovelAction(followed, sourceId, novelUrl, novelId, sort, filter)
-        );
-    }, [getNovelAction]);
-
-    const onRefresh = () => {
-        dispatch(updateNovelAction(sourceId, novelUrl, novelId, sort, filter));
-        showToast(`Updated ${novelName}`);
-    };
-
-    const refreshControl = () => (
-        <RefreshControl
-            onRefresh={onRefresh}
-            refreshing={updating}
-            colors={[theme.textColorPrimary]}
-            progressBackgroundColor={theme.colorPrimary}
-        />
-    );
-
-    const renderItem = ({ item, index }) => (
-        <ChapterItem
-            theme={theme}
-            chapter={item}
-            index={index}
-            novelUrl={novelUrl}
-            dispatch={dispatch}
-            sourceId={sourceId}
-            navigation={navigation}
-            lastReadChapter={lastReadChapter}
-            position={position}
-            downloading={downloading}
-            selected={selected}
-            novelName={novelName}
-            selected={selected}
-            setSelected={setSelected}
-            showChapterTitles={showChapterTitles}
-            chapterActionsSheetRef={chapterActionsSheetRef}
-        />
-    );
-
-    return (
-        <Provider>
-            <View
-                style={[
-                    styles.container,
-                    { backgroundColor: theme.colorPrimaryDark },
-                ]}
-            >
-                {selected.length > 0 ? (
-                    <View
-                        style={{
-                            backgroundColor: theme.colorPrimary,
-                            position: "absolute",
-                            zIndex: 1,
-                            width: Dimensions.get("window").width,
-                            flexDirection: "row",
-                            alignItems: "center",
-                            paddingTop: StatusBar.currentHeight,
-                            paddingBottom: 8,
-                        }}
-                    >
-                        <Appbar.Action
-                            icon="close"
-                            color={theme.textColorPrimary}
-                            onPress={() => {
-                                setSelected([]);
-                            }}
-                        />
-                        <Appbar.Content
-                            title={selected.length}
-                            titleStyle={{ color: theme.textColorPrimary }}
-                        />
-                        <Appbar.Action
-                            icon="bookmark-outline"
-                            color={theme.textColorPrimary}
-                            onPress={() => {
-                                dispatch(bookmarkChapterAction(selected));
-                                setSelected([]);
-                            }}
-                        />
-
-                        {selected.some((obj) => obj.read === 0) && (
-                            <Appbar.Action
-                                icon="check"
-                                color={theme.textColorPrimary}
-                                onPress={() => {
-                                    dispatch(
-                                        markChaptersRead(
-                                            selected,
-                                            novel.novelId
-                                        )
-                                    );
-                                    setSelected([]);
-                                }}
-                            />
-                        )}
-                        {selected.some((obj) => obj.read === 1) && (
-                            <Appbar.Action
-                                icon="check-outline"
-                                color={theme.textColorPrimary}
-                                onPress={() => {
-                                    dispatch(
-                                        markChapterUnreadAction(
-                                            selected,
-                                            novel.novelId
-                                        )
-                                    );
-                                    setSelected([]);
-                                }}
-                            />
-                        )}
-                        {selected.length === 1 && (
-                            <Appbar.Action
-                                icon="playlist-check"
-                                color={theme.textColorPrimary}
-                                onPress={() => {
-                                    dispatch(
-                                        markPreviousChaptersReadAction(
-                                            selected[0].chapterId,
-                                            selected[0].novelId
-                                        )
-                                    );
-                                    setSelected([]);
-                                }}
-                            />
-                        )}
-                        {selected.some((obj) => obj.downloaded === 1) && (
-                            <Appbar.Action
-                                icon="trash-can-outline"
-                                color={theme.textColorPrimary}
-                                onPress={() => {
-                                    dispatch(deleteAllChaptersAction(selected));
-                                    setSelected([]);
-                                }}
-                            />
-                        )}
-
-                        {selected.some((obj) => obj.downloaded === 0) && (
-                            <Appbar.Action
-                                icon="download-outline"
-                                color={theme.textColorPrimary}
-                                onPress={() => {
-                                    dispatch(
-                                        downloadAllChaptersAction(
-                                            novel.sourceId,
-                                            novel.novelUrl,
-                                            selected
-                                        )
-                                    );
-                                    setSelected([]);
-                                }}
-                            />
-                        )}
-                        <Appbar.Action
-                            icon="select-all"
-                            color={theme.textColorPrimary}
-                            onPress={() => {
-                                setSelected(chapters);
-                            }}
-                        />
-                    </View>
-                ) : (
-                    <View
-                        style={{
-                            position: "absolute",
-                            zIndex: 1,
-                            height: StatusBar.currentHeight + 54,
-                            width: "100%",
-                            flexDirection: "row",
-                            justifyContent: "space-between",
-                        }}
-                    >
-                        <IconButton
-                            icon="arrow-left"
-                            color="white"
-                            size={24}
-                            style={{ marginTop: StatusBar.currentHeight + 8 }}
-                            onPress={() => navigation.goBack()}
-                        />
-                        <Row>
-                            <Menu
-                                visible={downloadMenu}
-                                onDismiss={() => showDownloadMenu(false)}
-                                anchor={
-                                    <IconButton
-                                        icon="download"
-                                        color="white"
-                                        size={24}
-                                        style={{
-                                            marginTop:
-                                                StatusBar.currentHeight + 8,
-                                        }}
-                                        onPress={() => showDownloadMenu(true)}
-                                    />
-                                }
-                                contentStyle={{
-                                    backgroundColor: theme.menuColor,
-                                }}
-                            >
-                                <Menu.Item
-                                    title="Download all"
-                                    style={{ backgroundColor: theme.menuColor }}
-                                    titleStyle={{
-                                        color: theme.textColorPrimary,
-                                    }}
-                                    onPress={() =>
-                                        dispatch(
-                                            downloadAllChaptersAction(
-                                                novel.sourceId,
-                                                novel.novelUrl,
-                                                chapters
-                                            )
-                                        )
-                                    }
-                                />
-                                <Menu.Item
-                                    title="Delete downloads"
-                                    style={{ backgroundColor: theme.menuColor }}
-                                    titleStyle={{
-                                        color: theme.textColorPrimary,
-                                    }}
-                                    onPress={() =>
-                                        dispatch(
-                                            deleteAllChaptersAction(chapters)
-                                        )
-                                    }
-                                />
-                            </Menu>
-                            <IconButton
-                                icon="share-variant"
-                                color="white"
-                                size={21}
-                                style={{
-                                    marginTop: StatusBar.currentHeight + 8,
-                                    marginRight: 16,
-                                }}
-                                onPress={() =>
-                                    Share.share({
-                                        message: novel.sourceUrl,
-                                    })
-                                }
-                            />
-                        </Row>
-                    </View>
-                )}
-                <FlatList
-                    data={!loading && chapters}
-                    keyExtractor={(item) => item.chapterId.toString()}
-                    removeClippedSubviews={true}
-                    maxToRenderPerBatch={5}
-                    windowSize={15}
-                    initialNumToRender={7}
-                    renderItem={renderItem}
-                    ListHeaderComponent={
-                        <NovelInfoHeader
-                            item={item}
-                            novel={novel}
-                            theme={theme}
-                            filter={filter}
-                            loading={loading}
-                            lastRead={lastReadChapter}
-                            dispatch={dispatch}
-                            chapters={chapters}
-                            navigation={navigation}
-                            trackerSheetRef={trackerSheetRef}
-                            chaptersSettingsSheetRef={chaptersSettingsSheetRef}
-                        />
-                    }
-                    refreshControl={refreshControl()}
-                />
-                {!loading && (
-                    <Portal>
-                        <ChaptersSettingsSheet
-                            novelUrl={novelUrl}
-                            bottomSheetRef={chaptersSettingsSheetRef}
-                            dispatch={dispatch}
-                            sortAndFilterChapters={sortAndFilterChapters}
-                            novelId={novel.novelId}
-                            sort={sort}
-                            theme={theme}
-                            filter={filter}
-                            showChapterTitles={showChapterTitles}
-                        />
-                        <TrackSheet
-                            bottomSheetRef={trackerSheetRef}
-                            novelId={novel.novelId}
-                            novelName={novel.novelName}
-                            theme={theme}
-                        />
-                        {/* <ChapterActionsSheet
-                            theme={theme}
-                            selected={selected}
-                            chapters={chapters}
-                            dispatch={dispatch}
-                            setSelected={setSelected}
-                            bottomSheetRef={chapterActionsSheetRef}
-                            markChapterReadAction={markChapterReadAction}
-                            markChapterUnreadAction={markChapterUnreadAction}
-                            bookmarkChapterAction={bookmarkChapterAction}
-                        /> */}
-                    </Portal>
-                )}
-            </View>
-        </Provider>
-    );
-};
-
-export default Novel;
-
-const styles = StyleSheet.create({
-    container: { flex: 1 },
-    rowBack: {
-        alignItems: "center",
-        flex: 1,
-        flexDirection: "row",
-        justifyContent: "space-between",
-    },
-});

src/Screens/Novel/components/ChapterActionsSheet.js

@@ -1,176 +0,0 @@
-import React, { useState } from "react";
-import { StyleSheet, View, Text, Animated } from "react-native";
-import { List } from "react-native-paper";
-
-import Bottomsheet from "rn-sliding-up-panel";
-import BottomSheetHandle from "../../../Components/BottomSheetHandle";
-import { ListItem } from "../../../Components/List";
-import {
-    markPreviousChaptersReadAction,
-    markPreviousChaptersUnreadAction,
-} from "../../../redux/novel/novel.actions";
-
-const ChapterActionsSheet = ({
-    bottomSheetRef,
-    selected,
-    theme,
-    markChapterReadAction,
-    markChapterUnreadAction,
-    dispatch,
-    bookmarkChapterAction,
-    setSelected,
-}) => {
-    const [animatedValue] = useState(new Animated.Value(0));
-
-    return (
-        <Bottomsheet
-            animatedValue={animatedValue}
-            ref={bottomSheetRef}
-            draggableRange={{ top: 270, bottom: 0 }}
-            snappingPoints={[0, 270]}
-        >
-            <View
-                style={[
-                    styles.contentContainer,
-                    { backgroundColor: theme.colorPrimary },
-                ]}
-            >
-                <Text
-                    style={{
-                        color: theme.textColorPrimary,
-                        textAlign: "center",
-                        paddingTop: 16,
-                        paddingBottom: 8,
-                        fontSize: 16,
-                    }}
-                    numberOfLines={1}
-                >
-                    {selected?.chapterName}
-                </Text>
-                <List.Item
-                    title="Mark previous chapters as read"
-                    titleStyle={{ color: theme.textColorPrimary, fontSize: 15 }}
-                    left={() => (
-                        <List.Icon
-                            color={theme.textColorPrimary}
-                            icon="eye-check"
-                            style={{ marginVertical: 0 }}
-                        />
-                    )}
-                    onPress={() => {
-                        dispatch(
-                            markPreviousChaptersReadAction(
-                                selected?.chapterId,
-                                selected?.novelId
-                            )
-                        );
-                        // bottomSheetRef.current.hide();
-                    }}
-                    rippleColor={theme.rippleColor}
-                />
-                <List.Item
-                    title="Mark previous chapters as unread"
-                    titleStyle={{ color: theme.textColorPrimary, fontSize: 15 }}
-                    left={() => (
-                        <List.Icon
-                            color={theme.textColorPrimary}
-                            icon="eye-off"
-                            style={{ marginVertical: 0 }}
-                        />
-                    )}
-                    onPress={() => {
-                        dispatch(
-                            markPreviousChaptersUnreadAction(
-                                selected?.chapterId,
-                                selected?.novelId
-                            )
-                        );
-                        // bottomSheetRef.current.hide();
-                    }}
-                    rippleColor={theme.rippleColor}
-                />
-                <List.Item
-                    title={
-                        selected?.read
-                            ? "Mark chapter as unread"
-                            : "Mark chapter as read"
-                    }
-                    titleStyle={{ color: theme.textColorPrimary, fontSize: 15 }}
-                    left={() => (
-                        <List.Icon
-                            color={theme.textColorPrimary}
-                            icon={selected?.read ? "eye-off" : "eye"}
-                            style={{ marginVertical: 0 }}
-                        />
-                    )}
-                    onPress={() => {
-                        if (selected?.read) {
-                            dispatch(
-                                markChapterUnreadAction(selected?.chapterId)
-                            );
-                            setSelected((selected) => ({
-                                ...selected,
-                                read: 0,
-                            }));
-                        } else {
-                            dispatch(
-                                markChapterReadAction(
-                                    selected?.chapterId,
-                                    selected?.novelId
-                                )
-                            );
-                            setSelected((selected) => ({
-                                ...selected,
-                                read: 1,
-                            }));
-                        }
-                        // bottomSheetRef.current.hide();
-                    }}
-                    rippleColor={theme.rippleColor}
-                />
-                <List.Item
-                    title={
-                        selected?.bookmark
-                            ? "Remove bookmark"
-                            : "Bookmark chapter"
-                    }
-                    titleStyle={{ color: theme.textColorPrimary, fontSize: 15 }}
-                    left={() => (
-                        <List.Icon
-                            color={theme.textColorPrimary}
-                            icon={
-                                selected?.bookmark ? "bookmark-off" : "bookmark"
-                            }
-                            style={{ marginVertical: 0 }}
-                        />
-                    )}
-                    onPress={() => {
-                        dispatch(
-                            bookmarkChapterAction(
-                                selected?.bookmark,
-                                selected?.chapterId
-                            )
-                        );
-                        setSelected((selected) => ({
-                            ...selected,
-                            bookmark: !selected.bookmark,
-                        }));
-
-                        // bottomSheetRef.current.hide();
-                    }}
-                    rippleColor={theme.rippleColor}
-                />
-            </View>
-        </Bottomsheet>
-    );
-};
-
-export default ChapterActionsSheet;
-
-const styles = StyleSheet.create({
-    contentContainer: {
-        flex: 1,
-        borderTopRightRadius: 8,
-        borderTopLeftRadius: 8,
-    },
-});

src/Screens/Novel/components/ChapterItem.js

@@ -1,258 +0,0 @@
-import React, { useState } from "react";
-import { View, Text, ActivityIndicator, StyleSheet } from "react-native";
-
-import { TouchableRipple, IconButton, Menu } from "react-native-paper";
-
-import {
-    deleteChapterAction,
-    downloadChapterAction,
-} from "../../../redux/novel/novel.actions";
-import { parseChapterNumber } from "../../../Services/utils/helpers";
-
-const ChapterItem = ({
-    novelUrl,
-    novelName,
-    chapter,
-    sourceId,
-    dispatch,
-    theme,
-    navigation,
-    downloading,
-    index,
-    position,
-    selected,
-    setSelected,
-    showChapterTitles,
-    chapterActionsSheetRef,
-}) => {
-    const [deleteChapterMenu, setDeleteChapterMenu] = useState(false);
-    const showDeleteChapterMenu = () => setDeleteChapterMenu(true);
-    const hideDeleteChapterMenu = () => setDeleteChapterMenu(false);
-
-    const navigateToChapter = () =>
-        navigation.navigate("Chapter", {
-            sourceId,
-            novelUrl,
-            novelId: chapter.novelId,
-            chapterId: chapter.chapterId,
-            chapterUrl: chapter.chapterUrl,
-            chapterName: chapter.chapterName,
-            novelName: novelName,
-        });
-
-    const displayDownloadButton = () => {
-        if (downloading.indexOf(chapter.chapterId) !== -1) {
-            return (
-                <ActivityIndicator
-                    color={theme.textColorHint}
-                    size={25}
-                    style={{ margin: 3.5, padding: 5 }}
-                />
-            );
-        } else if (chapter.downloaded === 1) {
-            return (
-                <Menu
-                    visible={deleteChapterMenu}
-                    onDismiss={hideDeleteChapterMenu}
-                    anchor={
-                        <IconButton
-                            icon="check-circle"
-                            animated
-                            color={theme.textColorPrimary}
-                            size={25}
-                            onPress={showDeleteChapterMenu}
-                            style={{ margin: 2 }}
-                        />
-                    }
-                    contentStyle={{ backgroundColor: theme.menuColor }}
-                >
-                    <Menu.Item
-                        onPress={() =>
-                            dispatch(
-                                deleteChapterAction(
-                                    chapter.chapterId,
-                                    chapter.chapterName
-                                )
-                            )
-                        }
-                        title="Delete"
-                        titleStyle={{ color: theme.textColorPrimary }}
-                    />
-                </Menu>
-            );
-        } else {
-            return (
-                <IconButton
-                    icon="arrow-down-circle-outline"
-                    animated
-                    color={theme.textColorHint}
-                    size={25}
-                    onPress={() =>
-                        dispatch(
-                            downloadChapterAction(
-                                sourceId,
-                                novelUrl,
-                                chapter.chapterUrl,
-                                chapter.chapterName,
-                                chapter.chapterId
-                            )
-                        )
-                    }
-                    style={{ margin: 2 }}
-                />
-            );
-        }
-    };
-
-    const bookmarkButton = () => {
-        if (chapter.bookmark) {
-            return (
-                <IconButton
-                    icon="bookmark"
-                    color={theme.colorAccent}
-                    size={18}
-                    style={{ marginLeft: 2 }}
-                />
-            );
-        }
-    };
-
-    const isSelected = (chapterId) => {
-        return selected.some((obj) => obj.chapterId === chapterId);
-    };
-
-    return (
-        <TouchableRipple
-            style={[
-                styles.chapterCardContainer,
-                isSelected(chapter.chapterId) && {
-                    backgroundColor: theme.rippleColor,
-                },
-            ]}
-            onPress={() => {
-                if (selected.length === 0) {
-                    navigateToChapter();
-                } else {
-                    if (isSelected(chapter.chapterId)) {
-                        setSelected((selected) =>
-                            selected.filter(
-                                (item) => item.chapterId !== chapter.chapterId
-                            )
-                        );
-                    } else {
-                        setSelected((selected) => [...selected, chapter]);
-                    }
-                }
-            }}
-            onLongPress={() => {
-                if (isSelected(chapter.chapterId)) {
-                    setSelected((selected) =>
-                        selected.filter(
-                            (item) => item.chapterId !== chapter.chapterId
-                        )
-                    );
-                } else {
-                    setSelected((selected) => [...selected, chapter]);
-                }
-                // chapterActionsSheetRef.current.show();
-            }}
-            rippleColor={theme.rippleColor}
-        >
-            <>
-                <View>
-                    <View
-                        style={{
-                            flexDirection: "row",
-                            alignItems: "center",
-                        }}
-                    >
-                        {bookmarkButton()}
-                        <View>
-                            <Text
-                                style={[
-                                    { color: theme.textColorPrimary },
-                                    chapter.read && {
-                                        color: theme.textColorHint,
-                                    },
-                                ]}
-                                numberOfLines={1}
-                            >
-                                {showChapterTitles
-                                    ? parseChapterNumber(chapter.chapterName)
-                                        ? "Chapter " +
-                                          parseChapterNumber(
-                                              chapter.chapterName
-                                          )
-                                        : "Chapter " + index
-                                    : chapter.chapterName.substring(0, 50)}
-                            </Text>
-                            <View
-                                style={{
-                                    flexDirection: "row",
-                                    marginTop: 5,
-                                }}
-                            >
-                                {chapter.releaseDate && (
-                                    <Text
-                                        style={[
-                                            {
-                                                color: theme.textColorSecondary,
-                                                fontSize: 12,
-                                            },
-                                            chapter.read && {
-                                                color: theme.textColorHint,
-                                            },
-                                        ]}
-                                        numberOfLines={1}
-                                    >
-                                        {chapter.releaseDate}
-                                    </Text>
-                                )}
-                                {position &&
-                                    !chapter.read &&
-                                    position[chapter.chapterId] &&
-                                    position[chapter.chapterId].percentage <
-                                        100 &&
-                                    position[chapter.chapterId].percentage >
-                                        0 && (
-                                        <Text
-                                            style={[
-                                                {
-                                                    color: theme.textColorHint,
-                                                    fontSize: 12,
-                                                    marginLeft: 0,
-                                                },
-                                                chapter.releaseDate && {
-                                                    marginLeft: 5,
-                                                },
-                                            ]}
-                                            numberOfLines={1}
-                                        >
-                                            {chapter.releaseDate && "• "}
-                                            {"Progress " +
-                                                position[chapter.chapterId]
-                                                    .percentage +
-                                                "%"}
-                                        </Text>
-                                    )}
-                            </View>
-                        </View>
-                    </View>
-                </View>
-                <View>{displayDownloadButton()}</View>
-            </>
-        </TouchableRipple>
-    );
-};
-
-export default ChapterItem;
-
-const styles = StyleSheet.create({
-    chapterCardContainer: {
-        paddingHorizontal: 15,
-        paddingVertical: 7,
-        flexDirection: "row",
-        justifyContent: "space-between",
-        alignItems: "center",
-    },
-});

src/Screens/Novel/components/Info/GenreChip.js

@@ -1,30 +0,0 @@
-import React from "react";
-import { Text, StyleSheet } from "react-native";
-
-export const GenreChip = ({ children, theme }) => (
-    <Text
-        style={[
-            styles.genreChip,
-            {
-                color: theme.colorAccent,
-                borderColor: theme.colorAccent,
-                backgroundColor: theme.colorPrimary,
-            },
-        ]}
-    >
-        {children}
-    </Text>
-);
-
-const styles = StyleSheet.create({
-    genreChip: {
-        flex: 1,
-        justifyContent: "center",
-        paddingVertical: 2,
-        paddingHorizontal: 10,
-        marginHorizontal: 2,
-        fontSize: 13,
-        borderWidth: 1,
-        borderRadius: 50,
-    },
-});

src/Screens/Novel/components/Info/NovelDetailsComponents.js

@@ -1,216 +0,0 @@
-import React from "react";
-import {
-    FlatList,
-    Image,
-    ImageBackground,
-    StyleSheet,
-    Text,
-    View,
-} from "react-native";
-
-import { Chip, IconButton } from "react-native-paper";
-import { MaterialCommunityIcons } from "@expo/vector-icons";
-import { LinearGradient } from "expo-linear-gradient";
-import easeGradient from "react-native-easing-gradient";
-
-const NovelInfoContainer = ({ children }) => (
-    <View style={styles.novelInfoContainer}>{children}</View>
-);
-
-const CoverImage = ({ children, source, theme }) => {
-    const { colors, locations } = easeGradient({
-        colorStops: {
-            0: { color: "rgba(0,0,0,0.2)" },
-            1: { color: theme.colorPrimaryDark },
-        },
-    });
-
-    return (
-        <ImageBackground source={source} style={styles.coverImage}>
-            <LinearGradient
-                colors={colors}
-                locations={locations}
-                style={styles.linearGradient}
-            >
-                {children}
-            </LinearGradient>
-        </ImageBackground>
-    );
-};
-
-const NovelThumbnail = ({ source }) => (
-    <Image source={source} style={styles.novelThumbnail} />
-);
-
-const NovelTitle = ({ theme, children, onLongPress, onPress }) => (
-    <Text
-        onLongPress={onLongPress}
-        onPress={onPress}
-        numberOfLines={2}
-        style={[styles.novelTitle, { color: theme.textColorPrimary }]}
-    >
-        {children}
-    </Text>
-);
-
-const NovelAuthor = ({ theme, children }) => (
-    <Text
-        style={[styles.novelAuthor, { color: theme.textColorSecondary }]}
-        numberOfLines={2}
-    >
-        {children}
-    </Text>
-);
-
-const NovelInfo = ({ theme, children }) => (
-    <Text
-        style={[styles.novelInfo, { color: theme.textColorSecondary }]}
-        numberOfLines={1}
-    >
-        {children}
-    </Text>
-);
-
-const FollowButton = ({ theme, onPress, followed }) => (
-    <View style={{ alignItems: "center", flex: 1 }}>
-        <IconButton
-            icon={followed ? "heart" : "heart-outline"}
-            color={followed ? theme.colorAccent : theme.textColorSecondary}
-            size={24}
-            style={{ margin: 0 }}
-            onPress={onPress}
-        />
-        <Text
-            style={{
-                fontSize: 12,
-                color: followed ? theme.colorAccent : theme.textColorSecondary,
-            }}
-        >
-            {followed ? "In Library" : "Add to library"}
-        </Text>
-    </View>
-);
-
-const TrackerButton = ({ theme, isTracked, onPress }) => (
-    <View style={{ alignItems: "center", flex: 1 }}>
-        <IconButton
-            icon={isTracked ? "check" : "sync"}
-            color={isTracked ? theme.colorAccent : theme.textColorSecondary}
-            size={24}
-            style={{ margin: 0 }}
-            onPress={onPress}
-        />
-        <Text
-            style={{
-                fontSize: 12,
-                color: isTracked ? theme.colorAccent : theme.textColorSecondary,
-            }}
-        >
-            {isTracked ? "Tracked" : "Tracking"}
-        </Text>
-    </View>
-);
-
-const GenreChip = ({ children, theme }) => (
-    <Text
-        style={[
-            styles.genreChip,
-            {
-                color: theme.colorAccent,
-                borderColor: theme.colorAccent,
-                backgroundColor: theme.colorPrimary,
-            },
-        ]}
-    >
-        {children}
-    </Text>
-);
-
-const NovelGenres = ({ theme, genre }) => {
-    const data = genre.split(",");
-
-    const renderItem = ({ item }) => (
-        <GenreChip theme={theme}>{item}</GenreChip>
-    );
-
-    return (
-        <FlatList
-            contentContainerStyle={styles.novelGenres}
-            horizontal
-            data={data}
-            keyExtractor={(item) => item}
-            renderItem={renderItem}
-            showsHorizontalScrollIndicator={false}
-        />
-    );
-};
-
-export {
-    NovelInfoContainer,
-    CoverImage,
-    NovelThumbnail,
-    NovelTitle,
-    NovelAuthor,
-    NovelInfo,
-    FollowButton,
-    TrackerButton,
-    NovelGenres,
-};
-
-const styles = StyleSheet.create({
-    novelInfoContainer: {
-        flex: 1,
-        flexDirection: "row",
-        margin: 16,
-        paddingTop: 90,
-    },
-    coverImage: {
-        height: 285,
-    },
-    linearGradient: {
-        height: 286,
-    },
-    novelThumbnail: {
-        height: 160,
-        width: 110,
-        margin: 3.2,
-        borderRadius: 6,
-    },
-    novelTitle: {
-        fontWeight: "bold",
-        fontSize: 18,
-    },
-    novelAuthor: {
-        marginVertical: 3,
-        fontSize: 14,
-        fontWeight: "bold",
-    },
-    novelInfo: {
-        marginVertical: 3,
-        fontSize: 14,
-    },
-    followButton: {
-        height: 32,
-        justifyContent: "center",
-        alignItems: "center",
-        marginLeft: 16,
-        paddingLeft: 4,
-        borderWidth: 0,
-        elevation: 0,
-    },
-    novelGenres: {
-        // marginTop: 12,
-        paddingHorizontal: 16,
-        paddingBottom: 16,
-    },
-    genreChip: {
-        flex: 1,
-        justifyContent: "center",
-        paddingVertical: 2,
-        paddingHorizontal: 10,
-        marginHorizontal: 2,
-        fontSize: 13,
-        borderWidth: 1,
-        borderRadius: 50,
-    },
-});

src/Screens/Novel/components/Info/NovelSummary.js

@@ -1,58 +0,0 @@
-import React, { useState } from "react";
-import { View, Text, StyleSheet } from "react-native";
-
-const NovelSummary = ({ summary, followed, theme }) => {
-    const [more, showMore] = useState(!followed);
-
-    return (
-        summary && (
-            <View style={styles.summaryContainer}>
-                <Text
-                    style={{
-                        color: theme.textColorSecondary,
-                        lineHeight: 20,
-                    }}
-                    numberOfLines={more ? 200 : 2}
-                    onPress={() => showMore(!more)}
-                    ellipsizeMode="clip"
-                >
-                    {summary}
-                </Text>
-                <Text
-                    style={[
-                        {
-                            color: theme.colorAccent,
-                            backgroundColor: theme.colorPrimaryDark,
-                        },
-                        styles.showMoreButton,
-                    ]}
-                    onPress={() => showMore(!more)}
-                >
-                    {more ? "Less" : "More"}
-                </Text>
-            </View>
-        )
-    );
-};
-
-export default NovelSummary;
-
-const styles = StyleSheet.create({
-    summaryContainer: {
-        paddingHorizontal: 16,
-        marginVertical: 16,
-    },
-    // summaryHeader: {
-    //     marginTop: 5,
-    //     paddingVertical: 5,
-    //     fontSize: 15,
-    //     fontWeight: "bold",
-    // },
-    showMoreButton: {
-        fontWeight: "bold",
-        position: "absolute",
-        bottom: 0,
-        right: 18,
-        paddingLeft: 6,
-    },
-});

src/Screens/Novel/components/Info/ReadButton.js

@@ -1,57 +0,0 @@
-import React from "react";
-import { StyleSheet } from "react-native";
-
-import { Button } from "react-native-paper";
-
-const ReadButton = ({ navigation, novel, chapters, theme, lastRead }) => {
-    return (
-        chapters.length > 0 &&
-        (lastRead ? (
-            <Button
-                color="white"
-                style={[
-                    { backgroundColor: theme.colorAccent },
-                    styles.startButton,
-                ]}
-                uppercase={false}
-                labelStyle={{ letterSpacing: 0, color: theme.colorButtonText }}
-                onPress={() => {
-                    navigation.navigate("Chapter", {
-                        chapterId: lastRead.chapterId,
-                        chapterUrl: lastRead.chapterUrl,
-                        novelUrl: novel.novelUrl,
-                        novelId: lastRead.novelId,
-                        sourceId: novel.sourceId,
-                        chapterName: lastRead.chapterName,
-                        novelName: novel.novelName,
-                    });
-                }}
-            >
-                {novel.unread ? `Start reading ` : `Continue reading `}
-                {lastRead.chapterName}
-            </Button>
-        ) : (
-            <Button
-                color={theme.textColorHint}
-                style={[
-                    styles.startButton,
-                    { backgroundColor: theme.colorDisabled },
-                ]}
-                uppercase={false}
-                labelStyle={{ letterSpacing: 0 }}
-            >
-                All chapters read
-            </Button>
-        ))
-    );
-};
-
-export default ReadButton;
-
-const styles = StyleSheet.create({
-    startButton: {
-        marginTop: 8,
-        marginBottom: 16,
-        marginHorizontal: 16,
-    },
-});