diff --git a/package-lock.json b/package-lock.json
index a31b076a..cad6b9db 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7466,6 +7466,11 @@
"redux-saga": "^1.0.2"
}
},
+ "react-native-pager-view": {
+ "version": "5.0.12",
+ "resolved": "https://registry.npmjs.org/react-native-pager-view/-/react-native-pager-view-5.0.12.tgz",
+ "integrity": "sha512-QmHUnQeP2qcxDofEOnKRmoUue0RaT55lhNJDfcQ1/SNuxif4Q2UyvDfqeItm1+toaE5tVnXqoreZh82FqUqnvw=="
+ },
"react-native-paper": {
"version": "4.8.1",
"resolved": "https://registry.npmjs.org/react-native-paper/-/react-native-paper-4.8.1.tgz",
@@ -7513,6 +7518,11 @@
"resolved": "https://registry.npmjs.org/react-native-screens/-/react-native-screens-3.0.0.tgz",
"integrity": "sha512-35II5oxTaVp3OP8y0eLPOPpQkxG4fRKQ+dL1YSE1we5kCZFOU0l/Rn0T79HbyUu1LPwUZr6lZupPs0ULnRyMuQ=="
},
+ "react-native-tab-view": {
+ "version": "3.0.1",
+ "resolved": "https://registry.npmjs.org/react-native-tab-view/-/react-native-tab-view-3.0.1.tgz",
+ "integrity": "sha512-L7qXtYz5Z+NdWyu38zaJrlHA/8H6rNFRZXe3ydym12UEEPPoefbVZ71b9YK2O6QP0u4pUlzMpMVM/Lsz2DJ4jg=="
+ },
"react-native-vector-icons": {
"version": "7.1.0",
"resolved": "https://registry.npmjs.org/react-native-vector-icons/-/react-native-vector-icons-7.1.0.tgz",
diff --git a/package.json b/package.json
index 44a5b480..8c06be06 100644
--- a/package.json
+++ b/package.json
@@ -44,6 +44,7 @@
"react-native-reanimated": "~2.1.0",
"react-native-safe-area-context": "3.2.0",
"react-native-screens": "~3.0.0",
+ "react-native-tab-view": "^3.0.1",
"react-native-vector-icons": "^7.1.0",
"react-native-web": "~0.13.12",
"react-native-webview": "11.2.3",
@@ -52,7 +53,8 @@
"redux-devtools-extension": "^2.13.9",
"redux-persist": "^6.0.0",
"redux-thunk": "^2.3.0",
- "rn-sliding-up-panel": "^2.4.4"
+ "rn-sliding-up-panel": "^2.4.4",
+ "react-native-pager-view": "5.0.12"
},
"devDependencies": {
"@babel/core": "~7.9.0"
diff --git a/src/Components/List.js b/src/Components/List.js
index 493091f7..402b5409 100644
--- a/src/Components/List.js
+++ b/src/Components/List.js
@@ -1,6 +1,8 @@
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 }) => (
{children}
@@ -23,9 +25,11 @@ const ListItem = ({
right,
iconColor,
titleStyle,
+ style,
}) => (
right && (
-
)
}
diff --git a/src/Components/NovelCover.js b/src/Components/NovelCover.js
index 26256a9a..37234c93 100644
--- a/src/Components/NovelCover.js
+++ b/src/Components/NovelCover.js
@@ -9,7 +9,8 @@ import ListView from "./ListView";
const NovelCover = ({ item, onPress, libraryStatus }) => {
const theme = useTheme();
- const { displayMode, novelsPerRow } = useSettings();
+ const { displayMode, novelsPerRow, showDownloadBadges, showUnreadBadges } =
+ useSettings();
const height = {
1: 550,
@@ -102,8 +103,8 @@ const NovelCover = ({ item, onPress, libraryStatus }) => {
progressiveRenderingEnabled={true}
>
- {downloadBadge()}
- {unreadBadge()}
+ {showDownloadBadges && downloadBadge()}
+ {showUnreadBadges && unreadBadge()}
{compactTitle()}
diff --git a/src/Screens/Library/components/LibraryFilterSheet.js b/src/Screens/Library/components/LibraryFilterSheet.js
index 8691e33a..0505e90b 100644
--- a/src/Screens/Library/components/LibraryFilterSheet.js
+++ b/src/Screens/Library/components/LibraryFilterSheet.js
@@ -1,12 +1,20 @@
import React, { useState } from "react";
-import { StyleSheet, View, Text, Animated } from "react-native";
+import {
+ StyleSheet,
+ View,
+ Text,
+ Animated,
+ useWindowDimensions,
+} from "react-native";
+import { TabView, SceneMap, TabBar } from "react-native-tab-view";
-import { List, RadioButton, Checkbox } from "react-native-paper";
+import { Checkbox } from "react-native-paper";
import Bottomsheet from "rn-sliding-up-panel";
-import BottomSheetHandle from "../../../Components/BottomSheetHandle";
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,
@@ -17,227 +25,327 @@ const LibraryFilterSheet = ({
}) => {
const [animatedValue] = useState(new Animated.Value(0));
+ const FirstRoute = () => (
+
+ 0"
+ ? "checked"
+ : "unchecked"
+ }
+ onPress={() =>
+ filter === "chaptersDownloaded > 0"
+ ? dispatch(filterLibrary(sort, ""))
+ : dispatch(
+ filterLibrary(sort, "chaptersDownloaded > 0")
+ )
+ }
+ />
+
+ filter === "unread = 1"
+ ? dispatch(filterLibrary(sort, ""))
+ : dispatch(filterLibrary(sort, "unread = 1"))
+ }
+ />
+
+ filter === "chaptersUnread IS NULL"
+ ? dispatch(filterLibrary(sort, ""))
+ : dispatch(
+ filterLibrary(sort, "chaptersUnread IS NULL")
+ )
+ }
+ />
+
+ );
+
+ const SecondRoute = () => (
+
+
+ sort === "novels.novelId ASC"
+ ? dispatch(filterLibrary("novels.novelId DESC", filter))
+ : dispatch(filterLibrary("novels.novelId ASC", filter))
+ }
+ />
+
+ sort === "novels.novelName ASC"
+ ? dispatch(
+ filterLibrary("novels.novelName DESC", filter)
+ )
+ : dispatch(
+ filterLibrary("novels.novelName ASC", filter)
+ )
+ }
+ />
+
+ sort === "novels.unread ASC"
+ ? dispatch(filterLibrary("novels.unread DESC", filter))
+ : dispatch(filterLibrary("novels.unread ASC", filter))
+ }
+ />
+
+ sort === "chaptersDownloaded ASC"
+ ? dispatch(
+ filterLibrary("chaptersDownloaded DESC", filter)
+ )
+ : dispatch(
+ filterLibrary("chaptersDownloaded ASC", filter)
+ )
+ }
+ />
+
+ sort === "chaptersUnread ASC"
+ ? dispatch(filterLibrary("chaptersUnread DESC", filter))
+ : dispatch(filterLibrary("chaptersUnread ASC", filter))
+ }
+ />
+
+ );
+
+ 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) => (
+
+ dispatch(setAppSettings("displayMode", mode.displayMode))
+ }
+ />
+ ));
+ };
+
+ const ThirdRoute = () => (
+
+
+ Display Mode
+
+ {renderCheckboxes()}
+
+
+ Badges
+
+
+ dispatch(
+ setAppSettings(
+ "showDownloadBadges",
+ !showDownloadBadges
+ )
+ )
+ }
+ />
+
+ dispatch(
+ setAppSettings("showUnreadBadges", !showUnreadBadges)
+ )
+ }
+ />
+
+ dispatch(
+ setAppSettings(
+ "showNumberOfNovels",
+ !showNumberOfNovels
+ )
+ )
+ }
+ />
+
+ );
+
+ 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) => (
+ (
+ {route.title}
+ )}
+ inactiveColor={theme.textColorSecondary}
+ activeColor={theme.colorAccent}
+ pressColor={theme.rippleColor}
+ />
+ );
+
return (
-
-
-
- SORT
-
-
- sort === "novels.novelId ASC"
- ? dispatch(
- filterLibrary(
- "novels.novelId DESC",
- filter
- )
- )
- : dispatch(
- filterLibrary(
- "novels.novelId ASC",
- filter
- )
- )
- }
- />
-
- sort === "novels.novelName ASC"
- ? dispatch(
- filterLibrary(
- "novels.novelName DESC",
- filter
- )
- )
- : dispatch(
- filterLibrary(
- "novels.novelName ASC",
- filter
- )
- )
- }
- />
-
- sort === "novels.unread ASC"
- ? dispatch(
- filterLibrary(
- "novels.unread DESC",
- filter
- )
- )
- : dispatch(
- filterLibrary("novels.unread ASC", filter)
- )
- }
- />
-
- sort === "chaptersDownloaded ASC"
- ? dispatch(
- filterLibrary(
- "chaptersDownloaded DESC",
- filter
- )
- )
- : dispatch(
- filterLibrary(
- "chaptersDownloaded ASC",
- filter
- )
- )
- }
- />
-
- sort === "chaptersUnread ASC"
- ? dispatch(
- filterLibrary(
- "chaptersUnread DESC",
- filter
- )
- )
- : dispatch(
- filterLibrary(
- "chaptersUnread ASC",
- filter
- )
- )
- }
- />
-
-
-
- Filter
-
- 0"
- ? "checked"
- : "unchecked"
- }
- onPress={() =>
- filter === "chaptersDownloaded > 0"
- ? dispatch(filterLibrary(sort, ""))
- : dispatch(
- filterLibrary(
- sort,
- "chaptersDownloaded > 0"
- )
- )
- }
- />
-
- filter === "unread = 1"
- ? dispatch(filterLibrary(sort, ""))
- : dispatch(filterLibrary(sort, "unread = 1"))
- }
- />
-
- filter === "chaptersUnread IS NULL"
- ? dispatch(filterLibrary(sort, ""))
- : dispatch(
- filterLibrary(
- sort,
- "chaptersUnread IS NULL"
- )
- )
- }
- />
-
+
);
@@ -248,7 +356,5 @@ export default LibraryFilterSheet;
const styles = StyleSheet.create({
contentContainer: {
flex: 1,
- borderTopRightRadius: 8,
- borderTopLeftRadius: 8,
},
});
diff --git a/src/redux/settings/settings.reducer.js b/src/redux/settings/settings.reducer.js
index b6fd1ab6..51b3e795 100644
--- a/src/redux/settings/settings.reducer.js
+++ b/src/redux/settings/settings.reducer.js
@@ -51,6 +51,9 @@ const initialState = {
fontFamily: null,
lineHeight: 1.5,
},
+ showDownloadBadges: true,
+ showUnreadBadges: true,
+ showNumberOfNovels: false,
};
const settingsReducer = (state = initialState, action) => {