Merge branch 'LNReader:master' into novel-updates-rating

Author: Batorian

.prettierrc.js

@@ -7,4 +7,5 @@ module.exports = {
   trailingComma: 'all',
   arrowParens: 'avoid',
   quoteProps: 'preserve',
+  endOfLine: 'auto', // stop prettier from getting mad on windows
 };

App.tsx

@@ -1,4 +1,5 @@
 import 'react-native-gesture-handler';
+import 'react-native-url-polyfill/auto';
 import { enableFreeze } from 'react-native-screens';
 
 enableFreeze(true);

android/app/src/main/assets/css/index.css

@@ -30,6 +30,7 @@ body {
 
 body.page-reader { 
   overflow: hidden;
+  padding-bottom: unset;
 }
 
 #LNReader-chapter {

android/app/src/main/assets/js/core.js

@@ -412,6 +412,7 @@ window.addEventListener('DOMContentLoaded', async () => {
     if (reader.generalSettings.val.pageReader) {
       const diffX =
         (e.changedTouches[0].screenX - this.initialX) / reader.layoutWidth;
+      reader.chapterElement.style.transition = 'unset';
       reader.chapterElement.style.transform =
         'translateX(-' + (pageReader.page.val - diffX) * 100 + '%)';
     }
@@ -421,6 +422,7 @@ window.addEventListener('DOMContentLoaded', async () => {
     const diffX = e.changedTouches[0].screenX - this.initialX;
     const diffY = e.changedTouches[0].screenY - this.initialY;
     if (reader.generalSettings.val.pageReader) {
+      reader.chapterElement.style.transition = '200ms';
       const diffXPercentage = diffX / reader.layoutWidth;
       if (diffXPercentage < -0.3) {
         pageReader.movePage(pageReader.page.val + 1);

crowdin.yml

@@ -1,4 +1,4 @@
-pull_request_title: 'chore: Update translations'
+pull_request_title: 'chore: Update Translations'
 commit_message: '[ci skip]'
 files:
   - source: /strings/languages/en/strings.json

package-lock.json

@@ -44,7 +44,6 @@
     "i18n-js": "^3.8.0",
     "lodash-es": "^4.17.21",
     "protobufjs": "^7.2.6",
-    "qs": "^6.12.0",
     "react": "18.2.0",
     "react-native": "0.72.10",
     "react-native-background-actions": "^3.0.1",
@@ -62,6 +61,7 @@
     "react-native-screens": "^3.22.0",
     "react-native-shimmer-placeholder": "^2.0.9",
     "react-native-tab-view": "^3.5.2",
+    "react-native-url-polyfill": "^2.0.0",
     "react-native-vector-icons": "^9.0.0",
     "react-native-webview": "^13.10.5",
     "react-native-zip-archive": "^7.0.0",

package.json

@@ -1,17 +1,25 @@
-import React, { Ref, useCallback } from 'react';
+import React, { RefObject, useCallback, useRef } from 'react';
 import {
   BottomSheetBackdrop,
   BottomSheetBackdropProps,
   BottomSheetModal,
   BottomSheetModalProps,
 } from '@gorhom/bottom-sheet';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { useBackHandler } from '@hooks/index';
+import { BottomSheetModalMethods } from '@gorhom/bottom-sheet/lib/typescript/types';
 
 interface BottomSheetProps extends Omit<BottomSheetModalProps, 'ref'> {
-  bottomSheetRef: Ref<BottomSheetModal> | null;
+  bottomSheetRef: RefObject<BottomSheetModalMethods> | null;
 }
 
-const BottomSheet: React.FC<BottomSheetProps> = props => {
+const BottomSheet: React.FC<BottomSheetProps> = ({
+  bottomSheetRef,
+  children,
+  onChange,
+  ...otherProps
+}) => {
+  const indexRef = useRef<number>();
   const { bottom } = useSafeAreaInsets();
   const renderBackdrop = useCallback(
     (backdropProps: BottomSheetBackdropProps) => (
@@ -23,15 +31,26 @@ const BottomSheet: React.FC<BottomSheetProps> = props => {
     ),
     [],
   );
+  useBackHandler(() => {
+    if (typeof indexRef.current === 'number' && indexRef.current !== -1) {
+      bottomSheetRef?.current?.close();
+      return true;
+    }
+    return false;
+  });
   return (
     <BottomSheetModal
-      ref={props.bottomSheetRef}
+      ref={bottomSheetRef}
       backdropComponent={renderBackdrop}
       handleComponent={null}
       containerStyle={{ paddingBottom: bottom }}
-      {...props}
+      onChange={index => {
+        onChange?.(index);
+        indexRef.current = index;
+      }}
+      {...otherProps}
     >
-      {props.children}
+      {children}
     </BottomSheetModal>
   );
 };

src/components/BottomSheet/BottomSheet.tsx

@@ -7,10 +7,10 @@ import { coverPlaceholderColor } from '../theme/colors';
 import color from 'color';
 import { ThemeColors } from '@theme/types';
 import { NovelItem } from '@plugins/types';
-import { LibraryNovelInfo } from '@database/types';
+import { NovelInfo } from '@database/types';
 
 interface ListViewProps {
-  item: NovelItem | LibraryNovelInfo;
+  item: NovelItem | NovelInfo;
   downloadBadge?: React.ReactNode;
   unreadBadge?: React.ReactNode;
   inLibraryBadge?: React.ReactNode;

src/components/ListView.tsx

@@ -53,7 +53,7 @@ interface INovelCover<TNovel> {
   libraryStatus: boolean;
   theme: ThemeColors;
   isSelected: boolean;
-  addSkeletonLoading: boolean;
+  addSkeletonLoading?: boolean;
   onLongPress: (item: TNovel) => void;
   selectedNovelIds: number[];
 }
@@ -86,8 +86,7 @@ function NovelCover<TNovel extends CoverItemLibrary | CoverItemPlugin>({
 
   const coverHeight = useMemo(
     () => (window.width / numColumns) * (4 / 3),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [numColumns],
+    [window.width, numColumns],
   );
 
   const selectNovel = () => onLongPress(item);