Add a feature to allow saving custom reader settings for each comic. (#459)

* Add a feature to allow saving custom reader settings for each  comic.

* Comic-specific settings disabled by default

.github/ISSUE_TEMPLATE/bug.yaml

@@ -7,6 +7,32 @@ body:
     attributes:
       value: |
         Thank you for reporting a problem, please complete the title and fill in the following information.
+        
+        感谢您的反馈，请填写完整标题并填写以下信息。
+        
+        **Please do not report any issues related to config files.**
+        
+        **请不要报告与配置文件相关的任何问题。**
+        
+        This project is a comic reader that allows users write their own config files. And there is no built-in comic source.
+        
+        本项目是一个漫画阅读器，允许用户编写自己的配置文件，并且没有内置漫画源。
+  - type: dropdown
+    id: bugType
+    attributes:
+      label: Bug type
+      description: What type of bug are you reporting?
+      options:
+        - Crash
+        - UI
+        - Performance
+        - Security
+        - Reader
+        - JS Engine
+        - Comic Source
+        - Other
+    validations:
+      required: true
   - type: textarea
     id: what-happened
     attributes:
@@ -19,7 +45,8 @@ body:
     attributes:
       label: Version
       description: | 
-        App version
+        App version.
+        
         Please try to update if it is not the latest version
     validations:
       required: true

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1 @@
+blank_issues_enabled: false

.github/ISSUE_TEMPLATE/enhancement.yaml

@@ -7,6 +7,16 @@ body:
     attributes:
       value: |
         Welcome to make a feature request, please fill in the following information after completing the title.
+        
+        欢迎提出功能建议，请填写完整标题后填写以下信息。
+        
+        **Please do not report any issues related to config files.**
+
+        **请不要报告与配置文件相关的任何问题。**
+
+        This project is a comic reader that allows users write their own config files. And there is no built-in comic source.
+
+        本项目是一个漫画阅读器，允许用户编写自己的配置文件，并且没有内置漫画源。
   - type: textarea
     id: what-happened
     attributes:

.github/ISSUE_TEMPLATE/other.yaml

@@ -1,9 +0,0 @@
-name: other
-description: Other contents
-body:
-  - type: textarea
-    id: what-happened
-    attributes:
-      label: Content
-    validations:
-      required: true

.github/workflows/fastlane.yml

@@ -4,8 +4,12 @@ on:
   workflow_dispatch:
   push:
       branches: [ "master" ]
+      paths:
+        - 'fastlane/**'
   pull_request:
       branches: [ "master" ]
+      paths:
+        - 'fastlane/**'
 
 jobs:
   go:

.github/workflows/issue_check.yml

@@ -0,0 +1,29 @@
+name: Check Issue
+
+on:
+  issues:
+    types: [opened]
+
+permissions:
+  contents: read
+  issues: write
+
+jobs:
+  check:
+    name: Check Issue
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        id: checkout
+        uses: actions/checkout@v4
+
+      - name: Check Issue
+        id: check
+        uses: wgh136/gpt_issue_checker@v1.0.2
+        with:
+          api-url: ${{ secrets.API_URL }} 
+          api-key: ${{ secrets.API_KEY }}
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          prompt: "You are a repository issue checker. The project is a comic app that supports view local or network comics using config files. To view a comic source, user must add a config file. User should not report any issue related to config file to the project repository because there is another repository for managing config files. You are given an issue content and you need to decide whether to close the issue. If you decide to close the issue, you should also provide a comment explaining why you are closing the issue. If you decide not to close the issue, you should provide a comment which is a summary of the issue. You should response with a JSON object with the following keys: should_close, should_comment, comment."
+          model: "gpt-4o"

.github/workflows/main.yml

@@ -26,6 +26,9 @@ jobs:
           echo "$CERTIFICATE" | base64 --decode > signing_certificate.p12
           security import signing_certificate.p12 -k ~/Library/Keychains/login.keychain -P "$CERTIFICATE_PASSWORD" -T /usr/bin/codesign
 
+      - name: Check rust-toolchain.toml
+        run: rustup show
+
       # Step 2: Build the Flutter macOS app
       - name: Build Flutter macOS App
         run: flutter build macos --release
@@ -39,12 +42,18 @@ jobs:
           ln -s /Applications dist/dmg_contents/Applications
           hdiutil create -volname "venera" -srcfolder dist/dmg_contents -ov -format UDZO "dist/venera.dmg"
 
+      - name: Add version to filename
+        run: |
+          APP_VERSION=$(grep "version:" pubspec.yaml | cut -d':' -f2 | tr -d ' ')
+          mkdir -p result
+          mv dist/venera.dmg result/venera-$APP_VERSION.dmg
+
       # Step 4: Attach and upload artifacts (optional)
       - name: Upload DMG
         uses: actions/upload-artifact@v4
         with:
-          name: venera.dmg
+          name: macos_build
-          path: dist/venera.dmg
+          path: result/
   Build_IOS:
     runs-on: macos-15
     steps:
@@ -62,12 +71,17 @@ jobs:
           mv /Users/runner/work/venera/venera/build/ios/iphoneos/Runner.app /Users/runner/work/venera/venera/build/ios/iphoneos/Payload
           cd /Users/runner/work/venera/venera/build/ios/iphoneos/
           zip -r venera-ios.ipa Payload
+      - name: Add version to filename
+        run: |
+          APP_VERSION=$(grep "version:" pubspec.yaml | cut -d':' -f2 | tr -d ' ')
+          mkdir -p result
+          mv build/ios/iphoneos/venera-ios.ipa result/venera-ios-$APP_VERSION.ipa
       - uses: actions/upload-artifact@v4
         with:
-          name: app-ios.ipa
+          name: ios_build
-          path: /Users/runner/work/venera/venera/build/ios/iphoneos/venera-ios.ipa
+          path: result/
   Build_Android:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     steps:
       - uses: actions/checkout@v3
       - uses: subosito/flutter-action@v2
@@ -86,6 +100,8 @@ jobs:
         with:
           distribution: 'oracle'
           java-version: '17'
+      - name: Check rust-toolchain.toml
+        run: rustup show
       - run: flutter pub get
       - run: flutter build apk --release
       - uses: actions/upload-artifact@v4
@@ -114,7 +130,7 @@ jobs:
           name: windows_build
           path: build/windows/Venera-*
   Build_Linux:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
     steps:
       - uses: actions/checkout@v4
       - uses: subosito/flutter-action@v2
@@ -126,7 +142,7 @@ jobs:
           sudo apt-get update -y
           sudo apt-get install -y ninja-build libgtk-3-dev webkit2gtk-4.1
           dart pub global activate flutter_to_debian
-      - run: python3 debian/build.py
+      - run: python3 debian/build.py x64
       - run: dart run flutter_to_arch
       - run: |
           sudo rm -rf build/linux/arch/app.tar.gz
@@ -141,19 +157,37 @@ jobs:
         with:
           name: arch_build
           path: build/linux/arch/
+  Build_Linux_ARM64:
+    runs-on: ubuntu-22.04-arm
+    steps:
+      - uses: actions/checkout@v4
+      - uses: subosito/flutter-action@v2
+        with:
+          channel: 'master'
+          flutter-version-file: pubspec.yaml
+      - run: |
+          flutter pub get
+          sudo apt-get update -y
+          sudo apt-get install -y ninja-build libgtk-3-dev webkit2gtk-4.1
+          dart pub global activate flutter_to_debian
+      - run: python3 debian/build.py arm64
+      - uses: actions/upload-artifact@v4
+        with:
+          name: deb_arm64_build
+          path: build/linux/x64/release/debian # This is a bug related to flutter_to_debian, but it's not a big deal.
 
   Release:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-22.04
-    needs: [Build_MacOS, Build_IOS, Build_Android, Build_Windows, Build_Linux]
+    needs: [Build_MacOS, Build_IOS, Build_Android, Build_Windows, Build_Linux, Build_Linux_ARM64]
     if: github.event_name == 'release'  # 仅在 push 事件时执行
     steps:
       - uses: actions/download-artifact@v4
         with:
-          name: venera.dmg
+          name: macos_build
           path: outputs
       - uses: actions/download-artifact@v4
         with:
-          name: app-ios.ipa
+          name: ios_build
           path: outputs
       - uses: actions/download-artifact@v4
         with:
@@ -171,6 +205,10 @@ jobs:
         with:
           name: arch_build
           path: outputs
+      - uses: actions/download-artifact@v4
+        with:
+          name: deb_arm64_build
+          path: outputs
       - uses: softprops/action-gh-release@v2
         with:
           tag_name: ${{ github.ref_name }}
@@ -182,5 +220,6 @@ jobs:
             outputs/*.exe
             outputs/*.deb
             outputs/*.zst
+            outputs/*.AppImage
         env:
           GITHUB_TOKEN: ${{ secrets.ACTION_GITHUB_TOKEN }}

.github/workflows/update_alt_store.yml

@@ -0,0 +1,76 @@
+name: Update AltStore Source
+
+on:
+  workflow_run:
+    workflows: ["Build ALL"]
+    types: [completed]
+  workflow_dispatch:
+
+jobs:
+  update-source:
+    runs-on: ubuntu-latest
+    if: github.event_name == 'workflow_dispatch' || github.event.workflow_run.conclusion == 'success'
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v3
+
+    - name: Set up Python
+      uses: actions/setup-python@v4
+      with:
+        python-version: '3.x'
+
+    - name: Install dependencies
+      run: |
+        python -m pip install --upgrade pip
+        pip install requests
+
+    - name: Record job start time
+      id: job_start_time
+      run: echo "start_time=$(date +%s)" >> $GITHUB_OUTPUT
+
+    - name: Update AltStore source
+      id: update_source
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      run: |
+        python update_alt_store.py
+        git config --global user.name 'GitHub Action'
+        git config --global user.email 'action@github.com'
+        git add alt_store.json
+        if git diff --staged --quiet; then
+          echo "changes=false" >> $GITHUB_OUTPUT
+        else
+          git commit -m "Updated source with latest release"
+          git push
+          echo "changes=true" >> $GITHUB_OUTPUT
+        fi
+
+    - name: Calculate job duration
+      id: duration
+      if: always()
+      run: |
+        end_time=$(date +%s)
+        duration=$((end_time - ${{ steps.job_start_time.outputs.start_time }}))
+        echo "duration=$duration seconds" >> $GITHUB_OUTPUT
+
+    - name: Create job summary
+      run: |
+        if [[ "${{ steps.update_source.outputs.changes }}" == "true" ]]; then
+          echo "## Update Altstore Source Summary 🚀" >> $GITHUB_STEP_SUMMARY
+          echo "✅ Changes Detected and Applied" >> $GITHUB_STEP_SUMMARY
+          echo "" >> $GITHUB_STEP_SUMMARY
+          echo "The alt_store.json file has been updated with the latest release information." >> $GITHUB_STEP_SUMMARY
+        else
+          echo "## Update Altstore Source Summary 🚀" >> $GITHUB_STEP_SUMMARY
+          echo "🔍 No Changes Detected" >> $GITHUB_STEP_SUMMARY
+          echo "" >> $GITHUB_STEP_SUMMARY
+          echo "The alt_store.json file is up to date. No changes were necessary." >> $GITHUB_STEP_SUMMARY
+        fi
+        echo "" >> $GITHUB_STEP_SUMMARY
+        echo "🕐 Execution Time" >> $GITHUB_STEP_SUMMARY
+        echo "" >> $GITHUB_STEP_SUMMARY
+        echo "This job took ${{ steps.duration.outputs.duration }} to complete." >> $GITHUB_STEP_SUMMARY
+        echo "" >> $GITHUB_STEP_SUMMARY
+        echo "📆 Next Scheduled Run" >> $GITHUB_STEP_SUMMARY
+        echo "" >> $GITHUB_STEP_SUMMARY
+        echo "The next scheduled run will be tomorrow at midnight UTC." >> $GITHUB_STEP_SUMMARY

README.md

@@ -1,10 +1,9 @@
 # venera
-
 [![flutter](https://img.shields.io/badge/flutter-3.27.1-blue)](https://flutter.dev/)
 [![License](https://img.shields.io/github/license/venera-app/venera)](https://github.com/venera-app/venera/blob/master/LICENSE)
 [![Download](https://img.shields.io/github/v/release/venera-app/venera)](https://github.com/venera-app/venera/releases)
 [![stars](https://img.shields.io/github/stars/venera-app/venera?style=flat)](https://github.com/venera-app/venera/stargazers)
-[![Telegram](https://img.shields.io/badge/Telegram-2CA5E0?style=flat&logo=telegram&logoColor=white)](https://t.me/+Ws-IpmUutzkxMjhl)
+[![Telegram](https://img.shields.io/badge/Telegram-2CA5E0?style=flat&logo=telegram&logoColor=white)](https://t.me/venera_release)
 
 A comic reader that support reading local and network comics.
 
@@ -13,7 +12,6 @@ A comic reader that support reading local and network comics.
      height="75">](https://f-droid.org/packages/com.github.wgh136.venera/)
 
 ## Features
-
 - Read local comics
 - Use javascript to create comic sources
 - Read comics from network sources
@@ -23,15 +21,13 @@ A comic reader that support reading local and network comics.
 - Login to comment, rate, and other operations if the source supports
 
 ## Build from source
-
 1. Clone the repository
 2. Install flutter, see [flutter.dev](https://flutter.dev/docs/get-started/install)
 3. Install rust, see [rustup.rs](https://rustup.rs/)
 4. Build for your platform: e.g. `flutter build apk`
 
 ## Create a new comic source
-
+See [Comic Source](doc/comic_source.md)
-See [venera-configs](https://github.com/venera-app/venera-configs)
 
 ## Thanks
 

alt_store.json

@@ -0,0 +1,64 @@
+{
+  "name": "Venera",
+  "identifier": "com.github.wgh136.venera.source",
+  "website": "https://github.com/venera-app/venera",
+  "subtitle": "Venera official AltStore Source.",
+  "description": "This is the official AltStore Source for Venera.\n\n A comic reader that supports reading local and network comics",
+  "tintColor": "#0784FC",
+  "iconURL": "https://raw.githubusercontent.com/venera-app/venera/master/assets/app_icon.png",
+  "apps": [
+    {
+      "beta": false,
+      "name": "Venera",
+      "bundleIdentifier": "com.github.wgh136.venera",
+      "developerName": "wgh136",
+      "subtitle": "A comic reader that supports reading local and network comics",
+      "version": "1.4.5",
+      "versionDate": "2025-06-18",
+      "versionDescription": "1. Fixed an abnormal single image height issue when \"imagesPerPage > 1\". 379  \r\n2. Fixed an invalid page calculation issue when \"showSingleImageOnFirstPage\" is enabled.  \r\n3. Fixed an issue with incorrect reading history when displaying a single image on the first page.  \r\n4. Fixed abnormal history recording when pages are not flipped. 392  \r\n5. Fixed an issue where the download task would stop after exiting the reader. 387  \r\n6. Fixed a \"RangeError\" when translating tags. 356  \r\n7. Reset the current folder to null on the favorites page if the folder is invalid. 389  \r\n8. Fixed various issues when using a custom download path on Android. 400  \r\n9. Set the initial chapter to the first downloaded chapter if no history exists when starting to read a local comic. 405  \r\n10. Removed the config file repository URL from the app.",
+      "downloadURL": "https://github.com/venera-app/venera/releases/download/v1.4.5/venera-ios-1.4.5%2B145.ipa",
+      "localizedDescription": "A comic reader that supports reading local and network comics",
+      "iconURL": "https://raw.githubusercontent.com/venera-app/venera/master/assets/app_icon.png",
+      "tintColor": "#0784FC",
+      "category": "utilities",
+      "size": 14960268,
+      "appPermissions": {
+        "entitlements": [
+          "application-identifier",
+          "com.apple.security.application-groups",
+          "get-task-allow",
+          "keychain-access-groups",
+          "com.apple.developer.kernel.extended-virtual-addressing",
+          "com.apple.developer.kernel.increased-memory-limit",
+          "com.apple.developer.healthkit.background-delivery"
+        ],
+        "privacy": {
+          "NSFaceIDUsageDescription": "Face ID or Touch ID is used to protect your privacy when opening the app, ensuring secure access to your reading content.",
+          "NSPhotoLibraryAddUsageDescription": "Used to save comic images you've favorited or downloaded to your photo library for easy access and sharing.",
+          "NSPhotoLibraryUsageDescription": "Used to select images from your photo library when needed, and to save comic images you've collected to your device."
+        }
+      },
+      "versions": [
+        {
+          "version": "1.4.5",
+          "date": "2025-06-18",
+          "localizedDescription": "1. Fixed an abnormal single image height issue when \"imagesPerPage > 1\". 379  \r\n2. Fixed an invalid page calculation issue when \"showSingleImageOnFirstPage\" is enabled.  \r\n3. Fixed an issue with incorrect reading history when displaying a single image on the first page.  \r\n4. Fixed abnormal history recording when pages are not flipped. 392  \r\n5. Fixed an issue where the download task would stop after exiting the reader. 387  \r\n6. Fixed a \"RangeError\" when translating tags. 356  \r\n7. Reset the current folder to null on the favorites page if the folder is invalid. 389  \r\n8. Fixed various issues when using a custom download path on Android. 400  \r\n9. Set the initial chapter to the first downloaded chapter if no history exists when starting to read a local comic. 405  \r\n10. Removed the config file repository URL from the app.",
+          "downloadURL": "https://github.com/venera-app/venera/releases/download/v1.4.5/venera-ios-1.4.5%2B145.ipa",
+          "size": 14960268
+        }
+      ]
+    }
+  ],
+  "news": [
+    {
+      "appID": "com.github.wgh136.venera",
+      "caption": "Update of Venera just got released!",
+      "date": "2025-06-18T09:02:01Z",
+      "identifier": "release-v1.4.5",
+      "notify": true,
+      "tintColor": "#0784FC",
+      "title": "v1.4.5 - Venera  18/06/25",
+      "url": "https://github.com/venera-app/venera/releases/tag/v1.4.5"
+    }
+  ]
+}

android/app/build.gradle

@@ -32,7 +32,7 @@ keystoreProperties.load(new FileInputStream(keystorePropertiesFile))
 android {
     namespace = "com.github.wgh136.venera"
     compileSdk = flutter.compileSdkVersion
-    ndkVersion "25.1.8937393"
+    ndkVersion "28.0.13004108"
 
     splits{
         abi {
@@ -67,7 +67,6 @@ android {
     }
 
     defaultConfig {
-        // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
         applicationId = "com.github.wgh136.venera"
         // You can update the following values to match your application needs.
         // For more information, see: https://docs.flutter.dev/deployment/android#reviewing-the-gradle-build-configuration.
@@ -83,9 +82,19 @@ android {
                 abiFilters "armeabi-v7a", "arm64-v8a", "x86_64"
             }
             signingConfig signingConfigs.release
+        }
+        debug {
+            ndk {
+                abiFilters "armeabi-v7a", "arm64-v8a", "x86_64"
+            }
+            signingConfig signingConfigs.debug
+        }
+    }
+
     applicationVariants.all { variant ->
         variant.outputs.all { output ->
             def abi = output.getFilter(com.android.build.OutputFile.ABI)
+            if (variant.buildType.name == "release") {
                 if (abi != null) {
                     outputFileName = "venera-${variant.versionName}-${abi}.apk"
                     def abiVersionCode = project.ext.abiCodes.get(abi)
@@ -96,7 +105,8 @@ android {
                     outputFileName = "venera-${variant.versionName}.apk"
                     versionCodeOverride = variant.versionCode * 10
                 }
-                }
+            } else if (variant.buildType.name == "debug") {
+                versionCodeOverride = variant.versionCode * 10 + 4
             }
         }
     }
@@ -114,6 +124,6 @@ flutter {
 }
 
 dependencies {
-    implementation "androidx.activity:activity-ktx:1.9.2"
+    implementation "androidx.activity:activity-ktx:1.10.1"
     implementation 'androidx.documentfile:documentfile:1.0.1'
 }

android/app/src/main/AndroidManifest.xml

@@ -47,6 +47,11 @@
                 <category android:name="android.intent.category.BROWSABLE" />
                 <data android:scheme="https" android:host="exhentai.org" android:pathPrefix="/g" />
             </intent-filter>
+            <intent-filter android:label="@string/share_text">
+                <action android:name="android.intent.action.SEND" />
+                <category android:name="android.intent.category.DEFAULT" />
+                <data android:mimeType="text/plain" />
+            </intent-filter>
         </activity>
         <!-- Don't delete the meta-data below.
              This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->

android/app/src/main/kotlin/com/github/wgh136/venera/MainActivity.kt

@@ -7,6 +7,7 @@ import android.content.Intent
 import android.content.pm.PackageManager
 import android.net.Uri
 import android.os.Build
+import android.os.Bundle
 import android.os.Environment
 import android.provider.Settings
 import android.util.Log
@@ -40,6 +41,41 @@ class MainActivity : FlutterFragmentActivity() {
 
     private val nextLocalRequestCode = AtomicInteger()
 
+    private val sharedTexts = ArrayList<String>()
+
+    private var textShareHandler: ((String) -> Unit)? = null
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        if (intent?.action == Intent.ACTION_SEND) {
+            if (intent.type == "text/plain") {
+                val text = intent.getStringExtra(Intent.EXTRA_TEXT)
+                if (text != null)
+                    handleSharedText(text)
+            }
+        }
+    }
+
+    override fun onNewIntent(intent: Intent) {
+        super.onNewIntent(intent)
+        if (intent.action == Intent.ACTION_SEND) {
+            if (intent.type == "text/plain") {
+                val text = intent.getStringExtra(Intent.EXTRA_TEXT)
+                if (text != null)
+                    handleSharedText(text)
+            }
+        }
+    }
+
+    private fun handleSharedText(text: String) {
+        if (textShareHandler != null) {
+            textShareHandler?.invoke(text)
+        } else {
+            sharedTexts.add(text)
+        }
+    }
+
     private fun <I, O> startContractForResult(
         contract: ActivityResultContract<I, O>,
         input: I,
@@ -134,6 +170,26 @@ class MainActivity : FlutterFragmentActivity() {
             val mimeType = req.arguments<String>()
             openFile(res, mimeType!!)
         }
+
+        val shareTextChannel = EventChannel(flutterEngine.dartExecutor.binaryMessenger, "venera/text_share")
+        shareTextChannel.setStreamHandler(
+            object : EventChannel.StreamHandler {
+                override fun onListen(arguments: Any?, events: EventChannel.EventSink) {
+                    textShareHandler = {text ->
+                        events.success(text)
+                    }
+                    if (sharedTexts.isNotEmpty()) {
+                        for (text in sharedTexts) {
+                            events.success(text)
+                        }
+                        sharedTexts.clear()
+                    }
+                }
+
+                override fun onCancel(arguments: Any?) {
+                    textShareHandler = null
+                }
+            })
     }
 
     private fun getProxy(): String {

android/app/src/main/res/values-zh-rCN/strings.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <string name="share_text">搜索</string>
+</resources>

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

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <string name="share_text">搜尋</string>
+</resources>

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

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <string name="share_text">Search</string>
+</resources>

android/gradle/wrapper/gradle-wrapper.properties

@@ -2,4 +2,4 @@ distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.4-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.11.1-all.zip

android/settings.gradle

@@ -18,7 +18,7 @@ pluginManagement {
 
 plugins {
     id "dev.flutter.flutter-plugin-loader" version "1.0.0"
-    id "com.android.application" version '8.3.2' apply false
+    id "com.android.application" version '8.9.0' apply false
     id "org.jetbrains.kotlin.android" version "1.8.10" apply false
 }
 

assets/init.js

@@ -39,6 +39,32 @@ let Convert = {
         });
     },
 
+    /**
+     * @param str {string}
+     * @returns {ArrayBuffer}
+     */
+    encodeGbk: (str) => {
+        return sendMessage({
+            method: "convert",
+            type: "gbk",
+            value: str,
+            isEncode: true
+        });
+    },
+
+    /**
+     * @param value {ArrayBuffer}
+     * @returns {string}
+     */
+    decodeGbk: (value) => {
+        return sendMessage({
+            method: "convert",
+            type: "gbk",
+            value: value,
+            isEncode: false
+        });
+    },
+
     /**
      * @param {ArrayBuffer} value
      * @returns {string}
@@ -176,7 +202,7 @@ let Convert = {
     decryptAesCbc: (value, key, iv) => {
         return sendMessage({
             method: "convert",
-            type: "aes-ecb",
+            type: "aes-cbc",
             value: value,
             key: key,
             iv: iv,
@@ -496,7 +522,7 @@ let Network = {
 /**
  * [fetch] function for sending HTTP requests. Same api as the browser fetch.
  * @param url {string}
- * @param options {{method: string, headers: Object, body: any}}
+ * @param [options] {{method?: string, headers?: Object, body?: any}}
  * @returns {Promise<{ok: boolean, status: number, statusText: string, headers: {}, arrayBuffer: (function(): Promise<ArrayBuffer>), text: (function(): Promise<string>), json: (function(): Promise<any>)}>}
  * @since 1.2.0
  */
@@ -921,7 +947,7 @@ function Comic({id, title, subtitle, subTitle, cover, tags, description, maxPage
  * @param description {string?}
  * @param tags {Map<string, string[]> | {} | null | undefined}
  * @param chapters {Map<string, string> | {} | null | undefined} - key: chapter id, value: chapter title
- * @param isFavorite {boolean | null | undefined} - favorite status. If the comic source supports multiple folders, this field should be null
+ * @param isFavorite {boolean | null | undefined} - favorite status.
  * @param subId {string?} - a param which is passed to comments api
  * @param thumbnails {string[]?} - for multiple page thumbnails, set this to null, and use `loadThumbnails` api to load thumbnails
  * @param recommend {Comic[]?} - related comics
@@ -1086,6 +1112,19 @@ class ComicSource {
         });
     }
 
+    translation = {}
+
+    /**
+     * Translate given string with the current locale using the translation object.
+     * @param key {string}
+     * @returns {string}
+     * @since 1.2.5
+     */
+    translate(key) {
+        let locale = APP.locale;
+        return this.translation[locale]?.[key] ?? key;
+    }
+
     init() { }
 
     static sources = {}
@@ -1205,6 +1244,10 @@ class Image {
     }
 }
 
+/**
+ * UI related apis
+ * @since 1.2.0
+ */
 let UI = {
     /**
      * Show a message
@@ -1222,7 +1265,9 @@ let UI = {
      * Show a dialog. Any action will close the dialog.
      * @param title {string}
      * @param content {string}
-     * @param actions {{text:string, callback: () => void}[]}
+     * @param actions {{text:string, callback: () => void | Promise<void>, style: "text"|"filled"|"danger"}[]} - If callback returns a promise, the button will show a loading indicator until the promise is resolved.
+     * @returns {Promise<void>} - Resolved when the dialog is closed.
+     * @since 1.2.1
      */
     showDialog: (title, content, actions) => {
         sendMessage({
@@ -1245,4 +1290,125 @@ let UI = {
             url: url,
         })
     },
+
+    /**
+     * Show a loading dialog.
+     * @param onCancel {() => void | null | undefined} - Called when the loading dialog is canceled. If [onCancel] is null, the dialog cannot be canceled by the user.
+     * @returns {number} - A number that can be used to cancel the loading dialog.
+     * @since 1.2.1
+     */
+    showLoading: (onCancel) => {
+        return sendMessage({
+            method: 'UI',
+            function: 'showLoading',
+            onCancel: onCancel
+        })
+    },
+
+    /**
+     * Cancel a loading dialog.
+     * @param id {number} - returned by [showLoading]
+     * @since 1.2.1
+     */
+    cancelLoading: (id) => {
+        sendMessage({
+            method: 'UI',
+            function: 'cancelLoading',
+            id: id
+        })
+    },
+
+    /**
+     * Show an input dialog
+     * @param title {string}
+     * @param validator {(string) => string | null | undefined} - A function that validates the input. If the function returns a string, the dialog will show the error message.
+     * @param image {string?} - Available since 1.4.6. An optional image to show in the dialog. You can use this to show a captcha.
+     * @returns {Promise<string | null>} - The input value. If the dialog is canceled, return null.
+     */
+    showInputDialog: (title, validator, image) => {
+        return sendMessage({
+            method: 'UI',
+            function: 'showInputDialog',
+            title: title,
+            image: image,
+            validator: validator
+        })
+    },
+
+    /**
+     * Show a select dialog
+     * @param title {string}
+     * @param options {string[]}
+     * @param initialIndex {number?}
+     * @returns {Promise<number | null>} - The selected index. If the dialog is canceled, return null.
+     */
+    showSelectDialog: (title, options, initialIndex) => {
+        return sendMessage({
+            method: 'UI',
+            function: 'showSelectDialog',
+            title: title,
+            options: options,
+            initialIndex: initialIndex
+        })
+    }
+}
+
+/**
+ * App related apis
+ * @since 1.2.1
+ */
+let APP = {
+    /**
+     * Get the app version
+     * @returns {string} - The app version
+     */
+    get version() {
+        return appVersion // defined in the engine
+    },
+
+    /**
+     * Get current app locale
+     * @returns {string} - The app locale, in the format of [languageCode]_[countryCode]
+     */
+    get locale() {
+        return sendMessage({
+            method: 'getLocale'
+        })
+    },
+
+    /**
+     * Get current running platform
+     * @returns {string} - The platform name, "android", "ios", "windows", "macos", "linux"
+     */
+    get platform() {
+        return sendMessage({
+            method: 'getPlatform'
+        })
+    }
+}
+
+/**
+ * Set clipboard text
+ * @param text {string}
+ * @returns {Promise<void>}
+ * 
+ * @since 1.3.4
+ */
+function setClipboard(text) {
+    return sendMessage({
+        method: 'setClipboard',
+        text: text
+    })
+}
+
+/**
+ * Get clipboard text
+ * @returns {Promise<string>}
+ * 
+ * @since 1.3.4
+ */
+function getClipboard() {
+    return sendMessage({
+        method: 'getClipboard'
+    })
 }

assets/translation.json

@@ -106,7 +106,8 @@
     "Continuous (Right to Left)": "连续（从右到左）",
     "Continuous (Top to Bottom)": "连续（从上到下）",
     "Auto page turning interval": "自动翻页间隔",
-    "The number of pic in screen (Only Gallery Mode)": "同屏幕图片数量(仅画廊模式)",
+    "The number of pic in screen for landscape (Only Gallery Mode)": "横屏同屏幕图片数量(仅画廊模式)",
+    "The number of pic in screen for portrait (Only Gallery Mode)": "竖屏同屏幕图片数量(仅画廊模式)",
     "Theme Mode": "主题模式",
     "System": "系统",
     "Light": "浅色",
@@ -139,23 +140,18 @@
     "Block": "屏蔽",
     "Add new favorite to": "添加新收藏到",
     "Move favorite after reading": "阅读后移动收藏",
-    "Delete folder?" : "刪除文件夾？",
+    "Delete folder?": "删除文件夹?",
-    "Delete folder '@f' ?" : "删除文件夹 '@f' ？",
+    "Delete folder '@f' ?": "删除文件夹 '@f' ?",
     "Import from file": "从文件导入",
     "Failed to import": "导入失败",
     "Cache Limit": "缓存限制",
     "Set Cache Limit": "设置缓存限制",
     "Size in MB": "大小（MB）",
-    "Select a directory which contains the comic directories." : "选择一个包含漫画文件夹的目录",
+    "Select a directory which contains the comic directories.": "选择一个包含漫画文件夹的目录",
     "Help": "帮助",
-    "A directory is considered as a comic only if it matches one of the following conditions:" : "只有当目录满足以下条件之一时，才被视为漫画：",
-    "1. The directory only contains image files." : "1. 目录只包含图片文件。",
-    "2. The directory contains directories which contain image files. Each directory is considered as a chapter." : "2. 目录包含多个包含图片文件的目录。每个目录被视为一个章节。",
-    "If the directory contains a file named 'cover.*', it will be used as the cover image. Otherwise the first image will be used." : "如果目录包含一个名为'cover.*'的文件，它将被用作封面图片。否则将使用第一张图片。",
-    "The directory name will be used as the comic title. And the name of chapter directories will be used as the chapter titles.\n" : "目录名称将被用作漫画标题。章节目录的名称将被用作章节标题。\n",
     "Export as cbz": "导出为cbz",
-    "Select an archive file (cbz, zip, 7z, cb7)" : "选择一个归档文件 (cbz, zip, 7z, cb7)",
+    "Select an archive file (cbz, zip, 7z, cb7)": "选择一个归档文件 (cbz, zip, 7z, cb7)",
-    "An archive file" : "一个归档文件",
+    "An archive file": "一个归档文件",
     "Fullscreen": "全屏",
     "Exit": "退出",
     "View more": "查看更多",
@@ -165,7 +161,7 @@
     "Date Desc": "日期降序",
     "Start": "开始",
     "Export App Data": "导出应用数据",
-    "Import App Data (Please restart after success)": "导入应用数据(成功后请手动重启)",
+    "Import App Data": "导入应用数据",
     "Export": "导出",
     "Download Threads": "下载线程数",
     "Update Time": "更新时间",
@@ -194,6 +190,7 @@
     "Operation": "操作",
     "Upload": "上传",
     "Saved": "已保存",
+    "Saved Failed": "保存失败",
     "Sync Data": "同步数据",
     "Syncing Data": "正在同步数据",
     "Data Sync": "数据同步",
@@ -201,9 +198,9 @@
     "Long press on the favorite button to quickly add to this folder": "长按收藏按钮快速添加到这个文件夹",
     "Added": "已添加",
     "Turn page by volume keys": "使用音量键翻页",
-    "Display time & battery info in reader":"在阅读器中显示时间和电量信息",
+    "Display time & battery info in reader": "在阅读器中显示时间和电量信息",
-    "EhViewer downloads":"EhViewer下载",
+    "EhViewer downloads": "EhViewer下载",
-    "Select an EhViewer database and a download folder.":"选择EhViewer的下载数据（导出的db文件）与存放下载内容的目录",
+    "Select an EhViewer database and a download folder.": "选择EhViewer的下载数据（导出的db文件）与存放下载内容的目录",
     "(EhViewer)Default": "(EhViewer)默认",
     "If you import an EhViewer's database, program will automatically create folders according to the download label in that database.": "若通过EhViewer数据库导入漫画，程序将会按其中的下载标签自动创建收藏文件夹。",
     "Multi-Select": "进入多选模式",
@@ -234,17 +231,19 @@
     "Clear History": "清除历史",
     "Are you sure you want to clear your history?": "确定要清除您的历史记录吗？",
     "No Explore Pages": "没有探索页面",
-    "Add a comic source in home page": "在主页添加一个漫画源",
+    "Please add some sources": "请添加一些源",
     "Please check your settings": "请检查您的设置",
     "No Category Pages": "没有分类页面",
+    "Group @group": "第 @group 组",
     "Chapter @ep": "第 @ep 章",
     "Page @page": "第 @page 页",
+    "Remove local favorite and history": "删除本地收藏和历史记录",
     "Also remove files on disk": "同时删除磁盘上的文件",
     "Copy to app local path": "将漫画复制到本地存储目录中",
     "Delete all unavailable local favorite items": "删除所有无效的本地收藏",
     "Deleted @a favorite items.": "已删除 @a 条无效收藏",
     "New version available": "有新版本可用",
-    "A new version is available. Do you want to update now?" : "有新版本可用。您要现在更新吗？",
+    "A new version is available. Do you want to update now?": "有新版本可用。您要现在更新吗？",
     "No new version available": "没有新版本可用",
     "Export as pdf": "导出为pdf",
     "Export as epub": "导出为epub",
@@ -291,15 +290,15 @@
     "Copy the title successfully": "复制标题成功",
     "The comic is invalid, please long press to delete, you can double click the title to copy": "该漫画已失效, 请长按删除, 可以双击标题进行复制",
     "No search results found": "未找到搜索结果",
-    "Added @c comics to download queue." : "已添加 @c 本漫画到下载队列",
+    "Added @c comics to download queue.": "已添加 @c 本漫画到下载队列",
     "Download started": "下载已开始",
     "Click favorite": "点击收藏",
     "End": "末尾",
     "None": "无",
     "View Detail": "查看详情",
-    "Select a directory which contains multiple archive files." : "选择一个包含多个归档文件的目录",
+    "Select a directory which contains multiple archive files.": "选择一个包含多个归档文件的目录",
-    "Multiple archive files" : "多个归档文件",
+    "Multiple archive files": "多个归档文件",
-    "No valid comics found" : "未找到有效的漫画",
+    "No valid comics found": "未找到有效的漫画",
     "Enable DNS Overrides": "启用DNS覆写",
     "DNS Overrides": "DNS覆写",
     "Custom Image Processing": "自定义图片处理",
@@ -318,7 +317,99 @@
     "Imported @a comics": "已导入 @a 本漫画",
     "New Version": "新版本",
     "@c updates": "@c 项更新",
-    "No updates": "无更新"
+    "No updates": "无更新",
+    "Set comic source list url": "设置漫画源列表URL",
+    "Deselect All": "取消全选",
+    "Add keyword": "添加关键词",
+    "Keyword": "关键词",
+    "Manage": "管理",
+    "Verify": "验证",
+    "Cloudflare verification required": "需要Cloudflare验证",
+    "Success": "成功",
+    "Compressing": "压缩中",
+    "Exporting": "导出中",
+    "Search Sources": "搜索源",
+    "Removed": "已移除",
+    "Added to favorites": "已添加到收藏",
+    "Not added": "未添加",
+    "Create a folder": "新建收藏夹",
+    "Created successfully": "创建成功",
+    "name": "名称",
+    "Reverse tap to turn Pages": "反转点击翻页",
+    "Show all": "显示全部",
+    "Number of images preloaded": "预加载图片数量",
+    "Ascending": "升序",
+    "Descending": "降序",
+    "Last Reading": "上次阅读",
+    "Replies": "回复",
+    "Follow Updates": "追更",
+    "Not Configured": "未配置",
+    "Choose a folder to follow updates.": "选择一个文件夹以追更",
+    "Choose Folder": "选择文件夹",
+    "No folders available": "没有可用的文件夹",
+    "Updating comics...": "更新漫画中...",
+    "Automatic update checking enabled.": "已启用自动更新检查",
+    "The app will check for updates at most once a day.": "APP将每天最多检查一次更新",
+    "Change Folder": "更改文件夹",
+    "Check Now": "立即检查",
+    "Updates": "更新",
+    "No updates found": "未找到更新",
+    "All Comics": "全部漫画",
+    "The comic will be marked as no updates as soon as you read it.": "漫画将在您阅读后立即标记为无更新",
+    "Disable": "禁用",
+    "Once the operation is successful, app will automatically sync data with the server.": "操作成功后, APP将自动与服务器同步数据",
+    "Cache cleared": "缓存已清除",
+    "Disabled": "已禁用",
+    "Auto Sync Data": "自动同步数据",
+    "Mark all as read": "全部标记为已读",
+    "Do you want to mark all as read?": "您要全部标记为已读吗？",
+    "Swipe down for previous chapter": "向下滑动查看上一章",
+    "Swipe up for next chapter": "向上滑动查看下一章",
+    "Initial Page": "初始页面",
+    "Home Page": "主页",
+    "Favorites Page": "收藏页面",
+    "Explore Page": "探索页面",
+    "Categories Page": "分类页面",
+    "Convert to local": "转换为本地",
+    "Refresh": "刷新",
+    "Paging": "分页",
+    "Continuous": "连续",
+    "Display mode of comic list": "漫画列表的显示模式",
+    "Show Page Number": "显示页码",
+    "Jump to page": "跳转到页面",
+    "Page": "页面",
+    "Jump": "跳转",
+    "Copy Image": "复制图片",
+    "A valid WebDav directory URL": "有效的WebDav目录URL",
+    "Shut Down": "关闭",
+    "Uploading data...": "正在上传数据...",
+    "Pages": "页数",
+    "Long press zoom position": "长按缩放位置",
+    "Press position": "按压位置",
+    "Screen center": "屏幕中心",
+    "Suggestions": "建议",
+    "Do not report any issues related to sources to App repo.": "请不要向App仓库报告任何与源相关的问题",
+    "Show single image on first page": "在首页显示单张图片",
+    "Show system status bar": "显示系统状态栏",
+    "Click to select an image": "点击选择一张图片",
+    "Repo URL": "仓库地址",
+    "The URL should point to a 'index.json' file": "该URL应指向一个'index.json'文件",
+    "Double tap to zoom": "双击缩放",
+    "Clear Unfavorited": "清除未收藏",
+    "Reverse": "反转",
+    "Delete Chapters": "删除章节",
+    "Open Folder": "打开文件夹",
+    "Path copied to clipboard": "路径已复制到剪贴板",
+    "Reverse default chapter order": "反转默认章节顺序",
+    "Reload Configs": "重新加载配置文件",
+    "Reload": "重载",
+    "Disable Length Limitation": "禁用长度限制",
+    "Only valid for this run": "仅对本次运行有效",
+    "Logs": "日志",
+    "Export logs": "导出日志",
+    "Clear specific reader settings for all comics": "清除所有漫画的特殊阅读设置",
+    "Clear specific reader settings for this comic": "清除该漫画的特殊阅读设置",
+    "Enable comic specific settings": "为每本漫画保存特定设置"
   },
   "zh_TW": {
     "Home": "首頁",
@@ -328,7 +419,7 @@
     "Settings": "設定",
     "Search": "搜尋",
     "History": "歷史",
-    "Local": "本地",
+    "Local": "本機",
     "Import": "匯入",
     "Comic Source": "漫畫源",
     "Accounts": "帳戶",
@@ -340,14 +431,14 @@
     "help": "幫助",
     "Select": "選擇",
     "Selected @a comics": "已選擇 @a 部漫畫",
-    "Imported @a comics, loaded @b pages, received @c comics": "已匯入 @a 部漫畫, 加載 @b 頁, 接收到 @c 部漫畫",
+    "Imported @a comics, loaded @b pages, received @c comics": "已匯入 @a 部漫畫, 載入 @b 頁, 接收到 @c 部漫畫",
     "Downloading": "下載中",
     "Back": "後退",
     "Delete": "刪除",
     "Full Screen": "全螢幕",
     "Auto Page Turning": "自動翻頁",
     "Chapters": "章節",
-    "Save Image": "保存圖片",
+    "Save Image": "儲存圖片",
     "Share": "分享",
     "Details": "詳情",
     "Description": "描述",
@@ -355,19 +446,19 @@
     "Add to favorites": "加入收藏",
     "Error": "錯誤",
     "Retry": "重試",
-    "Folders": "文件夾",
+    "Folders": "資料夾",
-    "Delete Folder": "刪除文件夾",
+    "Delete Folder": "刪除資料夾",
     "Rename": "重新命名",
     "Reorder": "重新排序",
     "Network": "網路",
     "more": "更多",
-    "Select a folder": "選擇一個文件夾",
+    "Select a folder": "選擇一個資料夾",
-    "Folder": "文件夾",
+    "Folder": "資料夾",
     "Confirm": "確認",
     "Remove comic from favorite?": "從收藏中移除漫畫？",
     "Move": "移動",
-    "Move to folder": "移動到文件夾",
+    "Move to folder": "移動到資料夾",
-    "Copy to folder": "複製到文件夾",
+    "Copy to folder": "複製到資料夾",
     "Delete Comic": "刪除漫畫",
     "Delete @c comics?": "刪除 @c 本漫畫？",
     "Add comic source": "添加漫畫源",
@@ -379,43 +470,43 @@
     "Check updates": "檢查更新",
     "Edit": "編輯",
     "Update": "更新",
-    "Log in": "登錄",
+    "Log in": "登入",
     "Log out": "登出",
-    "Re-login": "重新登錄",
+    "Re-login": "重新登入",
-    "Click if login expired": "點擊此處如果登錄已過期",
+    "Click if login expired": "點擊此處如果登入已過期",
-    "Login": "登錄",
+    "Login": "登入",
-    "Username": "用戶名",
+    "Username": "使用者名稱",
     "Password": "密碼",
     "Continue": "繼續",
-    "Create Account": "創建帳戶",
+    "Create Account": "建立帳戶",
     "Next": "前進",
-    "Login with webview": "通過網頁登錄",
+    "Login with webview": "透過網頁登入",
     "Read": "閱讀",
     "Download": "下載",
     "Favorite": "收藏",
     "Comments": "評論",
-    "Information": "信息",
+    "Information": "資訊",
     "Uploader": "上傳者",
     "Upload Time": "上傳時間",
     "Preview": "預覽",
     "Comment": "評論",
     "Submit": "提交",
     "Add": "添加",
-    "New Folder": "新建文件夾",
+    "New Folder": "建立資料夾",
     "Reading": "閱讀中",
     "Appearance": "外觀",
-    "Local Favorites": "本地收藏",
+    "Local Favorites": "本機收藏",
     "APP": "應用",
     "About": "關於",
-    "Display mode of comic tile": "漫畫縮略圖的顯示模式",
+    "Display mode of comic tile": "漫畫縮圖的顯示模式",
     "Detailed": "詳細",
     "Brief": "簡潔",
-    "Size of comic tile": "漫畫縮略圖的大小",
+    "Size of comic tile": "漫畫縮圖的大小",
     "Explore Pages": "探索頁面",
     "Category Pages": "分類頁面",
-    "Show favorite status on comic tile": "在漫畫縮略圖上顯示收藏狀態",
+    "Show favorite status on comic tile": "在漫畫縮圖上顯示收藏狀態",
-    "Show history on comic tile": "在漫畫縮略圖上顯示歷史記錄",
+    "Show history on comic tile": "在漫畫縮圖上顯示歷史記錄",
-    "Keyword blocking": "關鍵詞屏蔽",
+    "Keyword blocking": "關鍵字封鎖",
     "Tap to turn Pages": "點擊翻頁",
     "Page animation": "頁面動畫",
     "Reading mode": "閱讀模式",
@@ -426,10 +517,11 @@
     "Continuous (Right to Left)": "連續（從右到左）",
     "Continuous (Top to Bottom)": "連續（從上到下）",
     "Auto page turning interval": "自動翻頁間隔",
-    "The number of pic in screen (Only Gallery Mode)": "同螢幕圖片數量(僅畫廊模式)",
+    "The number of pic in screen for landscape (Only Gallery Mode)": "橫向同螢幕圖片數量(僅畫廊模式)",
+    "The number of pic in screen for portrait (Only Gallery Mode)": "直向同螢幕圖片數量(僅畫廊模式)",
     "Theme Mode": "主題模式",
     "System": "系統",
-    "Light": "浅色",
+    "Light": "淺色",
     "Dark": "深色",
     "Theme Color": "主題顏色",
     "Red": "紅色",
@@ -439,43 +531,38 @@
     "Orange": "橙色",
     "Blue": "藍色",
     "App": "應用",
-    "Data": "數據",
+    "Data": "資料",
-    "Storage Path for local comics": "本地漫畫的存儲路徑",
+    "Storage Path for local comics": "本機漫畫的儲存路徑",
-    "Set New Storage Path": "設置新的存儲路徑",
+    "Set New Storage Path": "設定新的儲存路徑",
-    "Set": "設置",
+    "Set": "設定",
-    "Cache Size": "緩存大小",
+    "Cache Size": "快取大小",
-    "Clear Cache": "清除緩存",
+    "Clear Cache": "清除快取",
     "Clear": "清除",
     "Log": "日誌",
     "Open Log": "打開日誌",
     "Open": "打開",
-    "User": "用戶",
+    "User": "使用者",
     "Language": "語言",
     "Proxy": "代理",
     "Venera is a free and open-source app for comic reading.": "Venera是一個免費的開源漫畫閱讀應用。",
     "Check for updates": "檢查更新",
     "Check": "檢查",
     "Network Favorite Pages": "網路收藏頁面",
-    "Block": "屏蔽",
+    "Block": "封鎖",
     "Add new favorite to": "添加新收藏到",
     "Move favorite after reading": "閱讀後移動收藏",
-    "Delete folder?" : "刪除文件夾？",
+    "Delete folder?": "刪除資料夾？",
-    "Delete folder '@f' ?" : "刪除文件夾 '@f' ？",
+    "Delete folder '@f' ?": "刪除資料夾 '@f' ？",
     "Import from file": "從文件匯入",
     "Failed to import": "匯入失敗",
-    "Cache Limit": "緩存限制",
+    "Cache Limit": "快取限制",
-    "Set Cache Limit": "設置緩存限制",
+    "Set Cache Limit": "設定快取限制",
     "Size in MB": "大小（MB）",
-    "Select a directory which contains the comic directories." : "選擇一個包含漫畫文件夾的目錄",
+    "Select a directory which contains the comic directories.": "選擇一個包含漫畫資料夾的目錄",
     "Help": "幫助",
-    "A directory is considered as a comic only if it matches one of the following conditions:" : "只有當目錄滿足以下條件之一時，才被視為漫畫：",
-    "1. The directory only contains image files." : "1. 目錄只包含圖片文件。",
-    "2. The directory contains directories which contain image files. Each directory is considered as a chapter." : "2. 目錄包含多個包含圖片文件的目錄。每個目錄被視為一個章節。",
-    "If the directory contains a file named 'cover.*', it will be used as the cover image. Otherwise the first image will be used." : "如果目錄包含一個名為'cover.*'的文件，它將被用作封面圖片。否則將使用第一張圖片。",
-    "The directory name will be used as the comic title. And the name of chapter directories will be used as the chapter titles.\n" : "目錄名稱將被用作漫畫標題。章節目錄的名稱將被用作章節標題。\n",
     "Export as cbz": "匯出為cbz",
-    "Select an archive file (cbz, zip, 7z, cb7)" : "選擇一個歸檔文件 (cbz, zip, 7z, cb7)",
+    "Select an archive file (cbz, zip, 7z, cb7)": "選擇一個歸檔文件 (cbz, zip, 7z, cb7)",
-    "An archive file" : "一個歸檔文件",
+    "An archive file": "一個歸檔文件",
     "Fullscreen": "全螢幕",
     "Exit": "退出",
     "View more": "查看更多",
@@ -485,15 +572,15 @@
     "Date Desc": "日期降序",
     "Start": "開始",
     "Reversed successfully": "反轉成功",
-    "Export App Data": "匯出應用數據",
+    "Export App Data": "匯出應用資料",
-    "Import App Data (Please restart after success)": "匯入應用數據(成功后請手動重啟)",
+    "Import App Data": "匯入應用資料",
     "Export": "匯出",
-    "Download Threads": "下載線程數",
+    "Download Threads": "下載執行緒數",
     "Update Time": "更新時間",
     "Copy ID": "複製ID",
     "Copy URL": "複製URL",
-    "Create": "創建",
+    "Create": "建立",
-    "Folder Name": "文件夾名稱",
+    "Folder Name": "資料夾名稱",
     "Ranking": "排行",
     "Download Selected": "下載選中",
     "Download All": "下載全部",
@@ -504,9 +591,9 @@
     "Updates Available": "更新可用",
     "Unselected": "未選擇",
     "Long press and drag to reorder.": "長按並拖動以重新排序。",
-    "Limit image width": "限制圖片寬度",
+    "Limit image width": "限製圖片寬度",
     "When using Continuous(Top to Bottom) mode": "當使用連續（從上到下）模式",
-    "Open link": "打開鏈接",
+    "Open link": "打開連結",
     "Open comic": "打開漫畫",
     "Move To First": "移動到最前",
     "Cancel": "取消",
@@ -514,15 +601,16 @@
     "Pause": "暫停",
     "Operation": "操作",
     "Upload": "上傳",
-    "Saved": "已保存",
+    "Saved": "已儲存",
-    "Sync Data": "同步數據",
+    "Saved Failed": "儲存失敗",
-    "Syncing Data": "正在同步數據",
+    "Sync Data": "同步資料",
-    "Data Sync": "數據同步",
+    "Syncing Data": "正在同步資料",
+    "Data Sync": "資料同步",
     "Quick Favorite": "快速收藏",
-    "Long press on the favorite button to quickly add to this folder": "長按收藏按鈕快速添加到這個文件夾",
+    "Long press on the favorite button to quickly add to this folder": "長按收藏按鈕快速添加到這個資料夾",
     "Added": "已添加",
     "Turn page by volume keys": "使用音量鍵翻頁",
-    "Display time & battery info in reader": "在閱讀器中顯示時間和電量信息",
+    "Display time & battery info in reader": "在閱讀器中顯示時間和電量資訊",
     "EhViewer downloads": "EhViewer下載",
     "Select an EhViewer database and a download folder.": "選擇EhViewer的下載資料（匯出的db檔案）與存放下載內容的目錄",
     "(EhViewer)Default": "(EhViewer)預設",
@@ -536,45 +624,47 @@
     "Select in range": "區間選擇",
     "Finished": "已完成",
     "Updating": "更新中",
-    "Update Comics Info": "更新漫畫信息",
+    "Update Comics Info": "更新漫畫資訊",
-    "Create Folder": "新建文件夾",
+    "Create Folder": "建立資料夾",
-    "Select an image on screen": "選擇屏幕上的圖片",
+    "Select an image on screen": "選擇螢幕上的圖片",
-    "Added @count comics to download queue.": "已添加 @count 本漫畫到下載隊列",
+    "Added @count comics to download queue.": "已添加 @count 本漫畫到下載佇列",
     "Authorization Required": "需要身份驗證",
     "Sync": "同步",
-    "The folder is Linked to @source": "文件夾已關聯到 @source",
+    "The folder is Linked to @source": "資料夾已關聯到 @source",
-    "Source Folder": "源文件夾",
+    "Source Folder": "來源資料夾",
-    "Use a config file": "使用配置文件",
+    "Use a config file": "使用設定檔",
     "Comic Source list": "漫畫源列表",
     "View": "查看",
     "Copy": "複製",
     "Copied": "已複製",
-    "Search History": "搜索歷史",
+    "Search History": "搜尋歷史",
-    "Clear Search History": "清除搜索歷史",
+    "Clear Search History": "清除搜尋歷史",
-    "Search in": "搜索於",
+    "Search in": "搜尋於",
     "Clear History": "清除歷史",
     "Are you sure you want to clear your history?": "確定要清除您的歷史記錄嗎？",
     "No Explore Pages": "沒有探索頁面",
-    "Add a comic source in home page": "在主頁添加一個漫畫源",
+    "Please add some sources": "請添加一些源",
     "Please check your settings": "請檢查您的設定",
     "No Category Pages": "沒有分類頁面",
+    "Group @group": "第 @group 組",
     "Chapter @ep": "第 @ep 章",
     "Page @page": "第 @page 頁",
-    "Also remove files on disk": "同時刪除磁盤上的文件",
+    "Remove local favorite and history": "刪除本機收藏和歷史記錄",
-    "Copy to app local path": "將漫畫複製到本地儲存目錄中",
+    "Also remove files on disk": "同時刪除磁碟上的文件",
-    "Delete all unavailable local favorite items": "刪除所有無效的本地收藏",
+    "Copy to app local path": "將漫畫複製到本機儲存目錄中",
+    "Delete all unavailable local favorite items": "刪除所有無效的本機收藏",
     "Deleted @a favorite items.": "已刪除 @a 條無效收藏",
     "New version available": "有新版本可用",
-    "A new version is available. Do you want to update now?" : "有新版本可用。您要現在更新嗎？",
+    "A new version is available. Do you want to update now?": "有新版本可用。您要現在更新嗎？",
     "No new version available": "沒有新版本可用",
     "Export as pdf": "匯出為pdf",
     "Export as epub": "匯出為epub",
-    "Aggregated Search": "聚合搜索",
+    "Aggregated Search": "聚合搜尋",
-    "No search results found": "未找到搜索結果",
+    "No search results found": "未找到搜尋結果",
-    "Added @c comics to download queue." : "已添加 @c 本漫畫到下載隊列",
+    "Added @c comics to download queue.": "已添加 @c 本漫畫到下載佇列",
     "Download started": "下載已開始",
     "Click favorite": "點擊收藏",
-    "Local comic collection is not supported at present": "本地收藏暫不支持",
+    "Local comic collection is not supported at present": "本機收藏暫不支援",
     "The cover cannot be uncollected here": "封面不能在此取消收藏",
     "Uncollected the image": "取消收藏圖片",
     "Successfully collected": "收藏成功",
@@ -583,7 +673,7 @@
     "On the image browsing page, you can quickly collect images by sliding horizontally or vertically according to your reading mode": "在圖片瀏覽頁面, 你可以根據你的閱讀模式橫向或者縱向滑動快速收藏圖片",
     "Calculate your favorite from @a comics and @b images": "從 @a 本漫畫和 @b 張圖片中, 計算你最喜歡的",
     "After the parentheses are the number of pictures or the number of pictures compared to the number of comic pages": "括號後是圖片數量或圖片數比漫畫頁數",
-    "The chapter order of the comic may have changed, temporarily not supported for collection": "漫畫的章節順序可能發生了變化, 暫不支持收藏此章節",
+    "The chapter order of the comic may have changed, temporarily not supported for collection": "漫畫的章節順序可能發生了變化, 暫不支援收藏此章節",
     "Author: ": "作者: ",
     "Tags: ": "標籤: ",
     "Comics(number): ": "漫畫(數量): ",
@@ -591,7 +681,7 @@
     "Time Filter": "時間篩選",
     "Image Favorites Greater Than": "圖片收藏數大於",
     "Collection time": "收藏時間",
-    "Not enable": "不启用",
+    "Not enable": "不啟用",
     "Double Tap": "雙擊",
     "Swipe": "滑動",
     "favoritesCompareComicPages": "收藏數與漫畫頁數比較",
@@ -602,7 +692,7 @@
     "Favorite Num": "收藏數",
     "Favorite Num Compare Comic Pages": "收藏數比漫畫頁數",
     "All": "全部",
-    "Last Week": "上周",
+    "Last Week": "上週",
     "Last Month": "上月",
     "Last Half Year": "半年",
     "Last Year": "一年",
@@ -618,27 +708,119 @@
     "End": "末尾",
     "None": "無",
     "View Detail": "查看詳情",
-    "Select a directory which contains multiple archive files." : "選擇一個包含多個歸檔文件的目錄",
+    "Select a directory which contains multiple archive files.": "選擇一個包含多個歸檔文件的目錄",
-    "Multiple archive files" : "多個歸檔文件",
+    "Multiple archive files": "多個歸檔文件",
-    "No valid comics found" : "未找到有效的漫畫",
+    "No valid comics found": "未找到有效的漫畫",
     "Enable DNS Overrides": "啟用DNS覆寫",
     "DNS Overrides": "DNS覆寫",
-    "Custom Image Processing": "自定義圖片處理",
+    "Custom Image Processing": "自訂圖片處理",
     "Enable": "啟用",
     "Aggregated": "聚合",
-    "Default Search Target": "默認搜索目標",
+    "Default Search Target": "預設搜尋目標",
     "Auto Language Filters": "自動語言篩選",
     "Check for updates on startup": "啟動時檢查更新",
     "Start Time": "開始時間",
     "End Time": "結束時間",
-    "Custom": "自定義",
+    "Custom": "自訂",
-    "Reset": "重置",
+    "Reset": "重設",
     "Tags": "標籤",
     "Authors": "作者",
     "Comics": "漫畫",
     "Imported @a comics": "已匯入 @a 部漫畫",
     "New Version": "新版本",
     "@c updates": "@c 項更新",
-    "No updates": "無更新"
+    "No updates": "無更新",
+    "Set comic source list url": "設定漫畫源列表URL",
+    "Deselect All": "取消全選",
+    "Add keyword": "添加關鍵字",
+    "Keyword": "關鍵字",
+    "Manage": "管理",
+    "Verify": "驗證",
+    "Cloudflare verification required": "需要Cloudflare驗證",
+    "Success": "成功",
+    "Compressing": "壓縮中",
+    "Exporting": "匯出中",
+    "Search Sources": "搜尋源",
+    "Removed": "已移除",
+    "Added to favorites": "已添加到收藏",
+    "Not added": "未添加",
+    "Create a folder": "建立收藏夾",
+    "Created successfully": "建立成功",
+    "name": "名稱",
+    "Reverse tap to turn Pages": "反轉點擊翻頁",
+    "Show all": "顯示全部",
+    "Number of images preloaded": "預載入圖片數量",
+    "Ascending": "升序",
+    "Descending": "降序",
+    "Last Reading": "上次閱讀",
+    "Replies": "回覆",
+    "Follow Updates": "追更",
+    "Not Configured": "未配置",
+    "Choose a folder to follow updates.": "選擇一個資料夾以追更",
+    "Choose Folder": "選擇資料夾",
+    "No folders available": "沒有可用的資料夾",
+    "Updating comics...": "更新漫畫中...",
+    "Automatic update checking enabled.": "已啟用自動更新檢查",
+    "The app will check for updates at most once a day.": "APP將每天最多檢查一次更新",
+    "Change Folder": "更改資料夾",
+    "Check Now": "立即檢查",
+    "Updates": "更新",
+    "No updates found": "未找到更新",
+    "All Comics": "全部漫畫",
+    "The comic will be marked as no updates as soon as you read it.": "漫畫將在您閱讀後立即標記為無更新",
+    "Disable": "停用",
+    "Once the operation is successful, app will automatically sync data with the server.": "操作成功後, APP將自動與伺服器同步資料",
+    "Cache cleared": "快取已清除",
+    "Disabled": "已停用",
+    "Auto Sync Data": "自動同步資料",
+    "Mark all as read": "全部標記為已讀",
+    "Do you want to mark all as read?": "您要全部標記為已讀嗎？",
+    "Swipe down for previous chapter": "向下滑動查看上一章",
+    "Swipe up for next chapter": "向上滑動查看下一章",
+    "Initial Page": "初始頁面",
+    "Home Page": "首頁",
+    "Favorites Page": "收藏頁面",
+    "Explore Page": "探索頁面",
+    "Categories Page": "分類頁面",
+    "Convert to local": "轉換為本地",
+    "Refresh": "刷新",
+    "Paging": "分頁",
+    "Continuous": "連續",
+    "Display mode of comic list": "漫畫列表的顯示模式",
+    "Show Page Number": "顯示頁碼",
+    "Jump to page": "跳轉到頁面",
+    "Page": "頁面",
+    "Jump": "跳轉",
+    "Copy Image": "複製圖片",
+    "A valid WebDav directory URL": "有效的WebDav目錄URL",
+    "Shut Down": "關閉",
+    "Uploading data...": "正在上傳數據...",
+    "Pages": "頁數",
+    "Long press zoom position": "長按縮放位置",
+    "Press position": "按壓位置",
+    "Screen center": "螢幕中心",
+    "Suggestions": "建議",
+    "Do not report any issues related to sources to App repo.": "請不要向App倉庫報告任何與源相關的問題",
+    "Show single image on first page": "在首頁顯示單張圖片",
+    "Show system status bar": "顯示系統狀態欄",
+    "Click to select an image": "點擊選擇一張圖片",
+    "Repo URL": "倉庫地址",
+    "The URL should point to a 'index.json' file": "該URL應指向一個'index.json'文件",
+    "Double tap to zoom": "雙擊縮放",
+    "Clear Unfavorited": "清除未收藏",
+    "Reverse": "反轉",
+    "Delete Chapters": "刪除章節",
+    "Open Folder": "打開資料夾",
+    "Path copied to clipboard": "路徑已複製到剪貼簿",
+    "Reverse default chapter order": "反轉預設章節順序",
+    "Reload Configs": "重新載入設定檔",
+    "Reload": "重載",
+    "Disable Length Limitation": "禁用長度限制",
+    "Only valid for this run": "僅對本次運行有效",
+    "Logs": "日誌",
+    "Export logs": "匯出日誌",
+    "Clear specific reader settings for all comics": "清除所有漫畫的特殊閱讀設定",
+    "Clear specific reader settings for this comic": "清除該漫畫的特殊閱讀設定",
+    "Enable comic specific settings": "為每本漫畫保存特定設定"
   }
 }

debian/build.py

@@ -1,5 +1,7 @@
 import subprocess
+import sys
 
+arch = sys.argv[1]
 debianContent = ''
 desktopContent = ''
 version = ''
@@ -12,7 +14,14 @@ with open('pubspec.yaml', 'r') as f:
     version = str.split(str.split(f.read(), 'version: ')[1], '+')[0]
 
 with open('debian/debian.yaml', 'w') as f:
-    f.write(debianContent.replace('{{Version}}', version))
+    content = debianContent.replace('{{Version}}', version)
+    if arch == 'x64':
+        content = content.replace('{{Arch}}', 'x64')
+        content = content.replace('{{Architecture}}', 'amd64')
+    elif arch == 'arm64':
+        content = content.replace('{{Arch}}', 'arm64')
+        content = content.replace('{{Architecture}}', 'arm64')
+    f.write(content)
 with open('debian/gui/venera.desktop', 'w') as f:
     f.write(desktopContent.replace('{{Version}}', version))
 

debian/debian.yaml

@@ -1,13 +1,13 @@
 flutter_app: 
   command: venera
-  arch: x64
+  arch: {{Arch}}
   parent: /usr/local/lib
-  nonInteractive: false
+  nonInteractive: true
 
 control:
   Package: venera
   Version: {{Version}}
-  Architecture: amd64
+  Architecture: {{Architecture}}
   Priority: optional
   Depends: libwebkit2gtk-4.1-0, libgtk-3-0
   Maintainer: nyne

debian/gui/venera.desktop

@@ -6,3 +6,4 @@ Terminal=false
 Type=Application
 Categories=Utility
 Keywords=Flutter;comic;images;
+Icon=venera

doc/comic_source.md

@@ -0,0 +1,694 @@
+# Comic Source
+
+## Introduction
+
+Venera is a comic reader that can read comics from various sources. 
+
+All comic sources are written in javascript. 
+Venera uses [flutter_qjs](https://github.com/wgh136/flutter_qjs) as js engine which is forked from [ekibun](https://github.com/ekibun/flutter_qjs).
+
+This document will describe how to write a comic source for Venera.
+
+## Comic Source List
+
+Venera can display a list of comic sources in the app.
+
+You can use the following repo url:
+```
+https://git.nyne.dev/nyne/venera-configs/raw/branch/main/index.json
+```
+The repo is maintained by the Venera team.
+
+> The link is a mirror of the original repo. To contribute your comic source, please visit the [original repo](https://github.com/venera-app/venera-configs)
+
+You should provide a repository url to let the app load the comic source list.
+The url should point to a JSON file that contains the list of comic sources.
+
+The JSON file should have the following format:
+
+```json
+[
+  {
+    "name": "Source Name",
+    "url": "https://example.com/source.js",
+    "filename": "Relative path to the source file",
+    "version": "1.0.0",
+    "description": "A brief description of the source"
+  }
+]
+```
+
+Only one of `url` and `filename` should be provided.
+The description field is optional.
+
+## Create a Comic Source
+
+### Preparation
+
+- Install Venera. Using flutter to run the project is recommended since it's easier to debug.
+- An editor that supports javascript.
+- Download template and venera javascript api from [here](https://github.com/venera-app/venera-configs).
+
+### Start Writing
+
+The template contains detailed comments and examples. You can refer to it when writing your own comic source.
+
+Here is a brief introduction to the template:
+
+> Note: Javascript api document is [here](js_api.md).
+
+#### Write basic information
+
+```javascript
+class NewComicSource extends ComicSource {
+    // Note: The fields which are marked as [Optional] should be removed if not used
+
+    // name of the source
+    name = ""
+
+    // unique id of the source
+    key = ""
+
+    version = "1.0.0"
+
+    minAppVersion = "1.0.0"
+
+    // update url
+    url = ""
+// ...
+}
+```
+
+In this part, you need to do the following:
+- Change the class name to your source name.
+- Fill in the name, key, version, minAppVersion, and url fields.
+
+#### init function
+
+```javascript
+    /**
+     * [Optional] init function
+     */
+    init() {
+
+    }
+```
+
+The function will be called when the source is initialized. You can do some initialization work here.
+
+Remove this function if not used.
+
+#### Account
+
+```javascript
+// [Optional] account related
+    account = {
+        /**
+         * [Optional] login with account and password, return any value to indicate success
+         * @param account {string}
+         * @param pwd {string}
+         * @returns {Promise<any>}
+         */
+        login: async (account, pwd) => {
+
+        },
+
+        /**
+         * [Optional] login with webview
+         */
+        loginWithWebview: {
+            url: "",
+            /**
+             * check login status
+             * @param url {string} - current url
+             * @param title {string} - current title
+             * @returns {boolean} - return true if login success
+             */
+            checkStatus: (url, title) => {
+
+            },
+            /**
+             * [Optional] Callback when login success
+             */
+            onLoginSuccess: () => {
+
+            },
+        },
+
+        /**
+         * [Optional] login with cookies
+         * Note: If `this.account.login` is implemented, this will be ignored
+         */
+        loginWithCookies: {
+            fields: [
+                "ipb_member_id",
+                "ipb_pass_hash",
+                "igneous",
+                "star",
+            ],
+            /**
+             * Validate cookies, return false if cookies are invalid.
+             *
+             * Use `Network.setCookies` to set cookies before validate.
+             * @param values {string[]} - same order as `fields`
+             * @returns {Promise<boolean>}
+             */
+            validate: async (values) => {
+
+            },
+        },
+
+        /**
+         * logout function, clear account related data
+         */
+        logout: () => {
+
+        },
+
+        // {string?} - register url
+        registerWebsite: null
+    }
+```
+
+In this part, you can implement login, logout, and register functions.
+
+Remove this part if not used.
+
+#### Explore page
+
+```javascript
+    // explore page list
+    explore = [
+        {
+            // title of the page.
+            // title is used to identify the page, it should be unique
+            title: "",
+
+            /// multiPartPage or multiPageComicList or mixed
+            type: "multiPartPage",
+
+            /**
+             * load function
+             * @param page {number | null} - page number, null for `singlePageWithMultiPart` type
+             * @returns {{}}
+             * - for `multiPartPage` type, return {title: string, comics: Comic[], viewMore: string?}[]
+             * - for `multiPageComicList` type, for each page(1-based), return {comics: Comic[], maxPage: number}
+             * - for `mixed` type, use param `page` as index. for each index(0-based), return {data: [], maxPage: number?}, data is an array contains Comic[] or {title: string, comics: Comic[], viewMore: string?}
+             */
+            load: async (page) => {
+
+            },
+
+            /**
+             * Only use for `multiPageComicList` type.
+             * `loadNext` would be ignored if `load` function is implemented.
+             * @param next {string | null} - next page token, null if first page
+             * @returns {Promise<{comics: Comic[], next: string?}>} - next is null if no next page.
+             */
+            loadNext(next) {},
+        }
+    ]
+```
+
+In this part, you can implement the explore page.
+
+A comic source can have multiple explore pages.
+
+There are three types of explore pages:
+- multiPartPage: An explore page contains multiple parts, each part contains multiple comics.
+- multiPageComicList: An explore page contains multiple comics, the comics are loaded page by page.
+- mixed: An explore page contains multiple parts, each part can be a list of comics or a block of comics which have a title and a view more button.
+
+#### Category Page
+
+```javascript
+    // categories
+    category = {
+        /// title of the category page, used to identify the page, it should be unique
+        title: "",
+        parts: [
+            {
+                // title of the part
+                name: "Theme",
+
+                // fixed or random
+                // if random, need to provide `randomNumber` field, which indicates the number of comics to display at the same time
+                type: "fixed",
+
+                // number of comics to display at the same time
+                // randomNumber: 5,
+
+                categories: ["All", "Adventure", "School"],
+
+                // category or search
+                // if `category`, use categoryComics.load to load comics
+                // if `search`, use search.load to load comics
+                itemType: "category",
+
+                // [Optional] {string[]?} must have same length as categories, used to provide loading param for each category
+                categoryParams: ["all", "adventure", "school"],
+
+                // [Optional] {string} cannot be used with `categoryParams`, set all category params to this value
+                groupParam: null,
+            }
+        ],
+        // enable ranking page
+        enableRankingPage: false,
+    }
+```
+
+Category page is a static page that contains multiple parts, each part contains multiple categories.
+
+A comic source can only have one category page.
+
+#### Category Comics Page
+
+```javascript
+    /// category comic loading related
+    categoryComics = {
+        /**
+         * load comics of a category
+         * @param category {string} - category name
+         * @param param {string?} - category param
+         * @param options {string[]} - options from optionList
+         * @param page {number} - page number
+         * @returns {Promise<{comics: Comic[], maxPage: number}>}
+         */
+        load: async (category, param, options, page) => {
+
+        },
+        // provide options for category comic loading
+        optionList: [
+            {
+                // For a single option, use `-` to separate the value and text, left for value, right for text
+                options: [
+                    "newToOld-New to Old",
+                    "oldToNew-Old to New"
+                ],
+                // [Optional] {string[]} - show this option only when the value not in the list
+                notShowWhen: null,
+                // [Optional] {string[]} - show this option only when the value in the list
+                showWhen: null
+            }
+        ],
+        ranking: {
+            // For a single option, use `-` to separate the value and text, left for value, right for text
+            options: [
+                "day-Day",
+                "week-Week"
+            ],
+            /**
+             * load ranking comics
+             * @param option {string} - option from optionList
+             * @param page {number} - page number
+             * @returns {Promise<{comics: Comic[], maxPage: number}>}
+             */
+            load: async (option, page) => {
+
+            }
+        }
+    }
+```
+
+When user clicks on a category, the category comics page will be displayed.
+
+This part is used to load comics of a category.
+
+#### Search
+
+```javascript
+    /// search related
+    search = {
+        /**
+         * load search result
+         * @param keyword {string}
+         * @param options {(string | null)[]} - options from optionList
+         * @param page {number}
+         * @returns {Promise<{comics: Comic[], maxPage: number}>}
+         */
+        load: async (keyword, options, page) => {
+
+        },
+
+        /**
+         * load search result with next page token.
+         * The field will be ignored if `load` function is implemented.
+         * @param keyword {string}
+         * @param options {(string)[]} - options from optionList
+         * @param next {string | null}
+         * @returns {Promise<{comics: Comic[], maxPage: number}>}
+         */
+        loadNext: async (keyword, options, next) => {
+
+        },
+
+        // provide options for search
+        optionList: [
+            {
+                // [Optional] default is `select`
+                // type: select, multi-select, dropdown
+                // For select, there is only one selected value
+                // For multi-select, there are multiple selected values or none. The `load` function will receive a json string which is an array of selected values
+                // For dropdown, there is one selected value at most. If no selected value, the `load` function will receive a null
+                type: "select",
+                // For a single option, use `-` to separate the value and text, left for value, right for text
+                options: [
+                    "0-time",
+                    "1-popular"
+                ],
+                // option label
+                label: "sort",
+                // default selected options
+                default: null,
+            }
+        ],
+
+        // enable tags suggestions
+        enableTagsSuggestions: false,
+        // [Optional] handle tag suggestion click
+        onTagSuggestionSelected: (namespace, tag) => {
+            // return the text to insert into search box
+            return `${namespace}:${tag}`
+        },
+    }
+```
+
+This part is used to load search results.
+
+`load` and `loadNext` functions are used to load search results. 
+If `load` function is implemented, `loadNext` function will be ignored.
+
+#### Favorites
+
+```javascript
+    // favorite related
+    favorites = {
+        // whether support multi folders
+        multiFolder: false,
+        /**
+         * add or delete favorite.
+         * throw `Login expired` to indicate login expired, App will automatically re-login and re-add/delete favorite
+         * @param comicId {string}
+         * @param folderId {string}
+         * @param isAdding {boolean} - true for add, false for delete
+         * @param favoriteId {string?} - [Comic.favoriteId]
+         * @returns {Promise<any>} - return any value to indicate success
+         */
+        addOrDelFavorite: async (comicId, folderId, isAdding, favoriteId) => {
+            
+        },
+        /**
+         * load favorite folders.
+         * throw `Login expired` to indicate login expired, App will automatically re-login retry.
+         * if comicId is not null, return favorite folders which contains the comic.
+         * @param comicId {string?}
+         * @returns {Promise<{folders: {[p: string]: string}, favorited: string[]}>} - `folders` is a map of folder id to folder name, `favorited` is a list of folder id which contains the comic
+         */
+        loadFolders: async (comicId) => {
+
+        },
+        /**
+         * add a folder
+         * @param name {string}
+         * @returns {Promise<any>} - return any value to indicate success
+         */
+        addFolder: async (name) => {
+
+        },
+        /**
+         * delete a folder
+         * @param folderId {string}
+         * @returns {Promise<void>} - return any value to indicate success
+         */
+        deleteFolder: async (folderId) => {
+
+        },
+        /**
+         * load comics in a folder
+         * throw `Login expired` to indicate login expired, App will automatically re-login retry.
+         * @param page {number}
+         * @param folder {string?} - folder id, null for non-multi-folder
+         * @returns {Promise<{comics: Comic[], maxPage: number}>}
+         */
+        loadComics: async (page, folder) => {
+
+        },
+        /**
+         * load comics with next page token
+         * @param next {string | null} - next page token, null for first page
+         * @param folder {string}
+         * @returns {Promise<{comics: Comic[], next: string?}>}
+         */
+        loadNext: async (next, folder) => {
+
+        },
+    }
+```
+
+This part is used to manage network favorites of the source.
+
+`load` and `loadNext` functions are used to load search results.
+If `load` function is implemented, `loadNext` function will be ignored.
+
+#### Comic Details
+
+```javascript
+    /// single comic related
+    comic = {
+        /**
+         * load comic info
+         * @param id {string}
+         * @returns {Promise<ComicDetails>}
+         */
+        loadInfo: async (id) => {
+
+        },
+        /**
+         * [Optional] load thumbnails of a comic
+         *
+         * To render a part of an image as thumbnail, return `${url}@x=${start}-${end}&y=${start}-${end}`
+         * - If width is not provided, use full width
+         * - If height is not provided, use full height
+         * @param id {string}
+         * @param next {string?} - next page token, null for first page
+         * @returns {Promise<{thumbnails: string[], next: string?}>} - `next` is next page token, null for no more
+         */
+        loadThumbnails: async (id, next) => {
+
+        },
+
+        /**
+         * rate a comic
+         * @param id
+         * @param rating {number} - [0-10] app use 5 stars, 1 rating = 0.5 stars,
+         * @returns {Promise<any>} - return any value to indicate success
+         */
+        starRating: async (id, rating) => {
+
+        },
+
+        /**
+         * load images of a chapter
+         * @param comicId {string}
+         * @param epId {string?}
+         * @returns {Promise<{images: string[]}>}
+         */
+        loadEp: async (comicId, epId) => {
+
+        },
+        /**
+         * [Optional] provide configs for an image loading
+         * @param url
+         * @param comicId
+         * @param epId
+         * @returns {ImageLoadingConfig | Promise<ImageLoadingConfig>}
+         */
+        onImageLoad: (url, comicId, epId) => {
+            return {}
+        },
+        /**
+         * [Optional] provide configs for a thumbnail loading
+         * @param url {string}
+         * @returns {ImageLoadingConfig | Promise<ImageLoadingConfig>}
+         *
+         * `ImageLoadingConfig.modifyImage` and `ImageLoadingConfig.onLoadFailed` will be ignored.
+         * They are not supported for thumbnails.
+         */
+        onThumbnailLoad: (url) => {
+            return {}
+        },
+        /**
+         * [Optional] like or unlike a comic
+         * @param id {string}
+         * @param isLike {boolean} - true for like, false for unlike
+         * @returns {Promise<void>}
+         */
+        likeComic: async (id, isLike) =>  {
+
+        },
+        /**
+         * [Optional] load comments
+         *
+         * Since app version 1.0.6, rich text is supported in comments.
+         * Following html tags are supported: ['a', 'b', 'i', 'u', 's', 'br', 'span', 'img'].
+         * span tag supports style attribute, but only support font-weight, font-style, text-decoration.
+         * All images will be placed at the end of the comment.
+         * Auto link detection is enabled, but only http/https links are supported.
+         * @param comicId {string}
+         * @param subId {string?} - ComicDetails.subId
+         * @param page {number}
+         * @param replyTo {string?} - commentId to reply, not null when reply to a comment
+         * @returns {Promise<{comments: Comment[], maxPage: number?}>}
+         */
+        loadComments: async (comicId, subId, page, replyTo) => {
+
+        },
+        /**
+         * [Optional] send a comment, return any value to indicate success
+         * @param comicId {string}
+         * @param subId {string?} - ComicDetails.subId
+         * @param content {string}
+         * @param replyTo {string?} - commentId to reply, not null when reply to a comment
+         * @returns {Promise<any>}
+         */
+        sendComment: async (comicId, subId, content, replyTo) => {
+
+        },
+        /**
+         * [Optional] like or unlike a comment
+         * @param comicId {string}
+         * @param subId {string?} - ComicDetails.subId
+         * @param commentId {string}
+         * @param isLike {boolean} - true for like, false for unlike
+         * @returns {Promise<void>}
+         */
+        likeComment: async (comicId, subId, commentId, isLike) => {
+
+        },
+        /**
+         * [Optional] vote a comment
+         * @param id {string} - comicId
+         * @param subId {string?} - ComicDetails.subId
+         * @param commentId {string} - commentId
+         * @param isUp {boolean} - true for up, false for down
+         * @param isCancel {boolean} - true for cancel, false for vote
+         * @returns {Promise<number>} - new score
+         */
+        voteComment: async (id, subId, commentId, isUp, isCancel) => {
+
+        },
+        // {string?} - regex string, used to identify comic id from user input
+        idMatch: null,
+        /**
+         * [Optional] Handle tag click event
+         * @param namespace {string}
+         * @param tag {string}
+         * @returns {{action: string, keyword: string, param: string?}}
+         */
+        onClickTag: (namespace, tag) => {
+
+        },
+        /**
+         * [Optional] Handle links
+         */
+        link: {
+            /**
+             * set accepted domains
+             */
+            domains: [
+                'example.com'
+            ],
+            /**
+             * parse url to comic id
+             * @param url {string}
+             * @returns {string | null}
+             */
+            linkToId: (url) => {
+
+            }
+        },
+        // enable tags translate
+        enableTagsTranslate: false,
+    }
+
+```
+
+This part is used to load comic details.
+
+#### Settings
+
+```javascript
+    /*
+    [Optional] settings related
+    Use this.loadSetting to load setting
+    ```
+    let setting1Value = this.loadSetting('setting1')
+    console.log(setting1Value)
+    ```
+     */
+    settings = {
+        setting1: {
+            // title
+            title: "Setting1",
+            // type: input, select, switch
+            type: "select",
+            // options
+            options: [
+                {
+                    // value
+                    value: 'o1',
+                    // [Optional] text, if not set, use value as text
+                    text: 'Option 1',
+                },
+            ],
+            default: 'o1',
+        },
+        setting2: {
+            title: "Setting2",
+            type: "switch",
+            default: true,
+        },
+        setting3: {
+            title: "Setting3",
+            type: "input",
+            validator: null, // string | null, regex string
+            default: '',
+        },
+        setting4: {
+            title: "Setting4",
+            type: "callback",
+            buttonText: "Click me",
+            /**
+             * callback function
+             *
+             * If the callback function returns a Promise, the button will show a loading indicator until the promise is resolved.
+             * @returns {void | Promise<any>}
+             */
+            callback: () => {
+                // do something
+            }
+        }
+    }
+```
+
+This part is used to provide settings for the source.
+
+
+#### Translations
+
+```javascript
+    // [Optional] translations for the strings in this config
+    translation = {
+        'zh_CN': {
+            'Setting1': '设置1',
+            'Setting2': '设置2',
+            'Setting3': '设置3',
+        },
+        'zh_TW': {},
+        'en': {}
+    }
+```
+
+This part is used to provide translations for the source.
+
+> Note: strings in the UI api will not be translated automatically. You need to translate them manually.

doc/import_comic.md

@@ -0,0 +1,61 @@
+# Import Comic
+
+## Introduction
+
+Venera supports importing comics from local files.
+However, the comic files must be in a specific format.
+
+## Comic Directory
+
+A directory considered as a comic directory only if it follows one of the following two types of structure:
+
+**Without Chapter**
+
+```
+comic_directory
+├── cover.[ext]
+├── img1.[ext]
+├── img2.[ext]
+├── img3.[ext]
+├── ...
+```
+
+**With Chapter**
+
+```
+comic_directory
+├── cover.[ext]
+├── chapter1
+│   ├── img1.[ext]
+│   ├── img2.[ext]
+│   ├── img3.[ext]
+│   ├── ...
+├── chapter2
+│   ├── img1.[ext]
+│   ├── img2.[ext]
+│   ├── img3.[ext]
+│   ├── ...
+├── ...
+```
+
+The file name can be anything, but the extension must be a valid image extension.
+
+The page order is determined by the file name. App will sort the files by name and display them in that order.
+
+Cover image is optional. 
+If there is a file named `cover.[ext]` in the directory, it will be considered as the cover image.
+Otherwise, the first image will be considered as the cover image.
+
+The name of directory will be used as comic title. And the name of chapter directory will be used as chapter title.
+
+## Archive
+
+Venera supports importing comics from archive files.
+
+The archive file must follow [Comic Book Archive](https://en.wikipedia.org/wiki/Comic_book_archive_file) format.
+
+Currently, Venera supports the following archive formats:
+- `.cbz`
+- `.cb7`
+- `.zip`
+- `.7z`

doc/js_api.md

@@ -0,0 +1,513 @@
+# Javascript API
+
+## Overview
+
+The Javascript API is a set of functions that used to interact application.
+
+There are following parts in the API:
+- [Convert](#Convert)
+- [Network](#Network)
+- [Html](#Html)
+- [UI](#UI)
+- [Utils](#Utils)
+- [Types](#Types)
+
+
+## Convert
+
+Convert is a set of functions that used to convert data between different types.
+
+### `Convert.encodeUtf8(str: string): ArrayBuffer`
+
+Convert a string to an ArrayBuffer.
+
+### `Convert.decodeUtf8(value: ArrayBuffer): string`
+
+Convert an ArrayBuffer to a string.
+
+### `Convert.encodeBase64(value: ArrayBuffer): string`
+
+Convert an ArrayBuffer to a base64 string.
+
+### `Convert.decodeBase64(value: string): ArrayBuffer`
+
+Convert a base64 string to an ArrayBuffer.
+
+### `Convert.md5(value: ArrayBuffer): ArrayBuffer`
+
+Calculate the md5 hash of an ArrayBuffer.
+
+### `Convert.sha1(value: ArrayBuffer): ArrayBuffer`
+
+Calculate the sha1 hash of an ArrayBuffer.
+
+### `Convert.sha256(value: ArrayBuffer): ArrayBuffer`
+
+Calculate the sha256 hash of an ArrayBuffer.
+
+### `Convert.sha512(value: ArrayBuffer): ArrayBuffer`
+
+Calculate the sha512 hash of an ArrayBuffer.
+
+### `Convert.hmac(key: ArrayBuffer, value: ArrayBuffer, hash: string): ArrayBuffer`
+
+Calculate the hmac hash of an ArrayBuffer.
+
+### `Convert.hmacString(key: ArrayBuffer, value: ArrayBuffer, hash: string): string`
+
+Calculate the hmac hash of an ArrayBuffer and return a string.
+
+### `Convert.decryptAesEcb(value: ArrayBuffer, key: ArrayBuffer): ArrayBuffer`
+
+Decrypt an ArrayBuffer with AES ECB mode.
+
+### `Convert.decryptAesCbc(value: ArrayBuffer, key: ArrayBuffer, iv: ArrayBuffer): ArrayBuffer`
+
+Decrypt an ArrayBuffer with AES CBC mode.
+
+### `Convert.decryptAesCfb(value: ArrayBuffer, key: ArrayBuffer, iv: ArrayBuffer): ArrayBuffer`
+
+Decrypt an ArrayBuffer with AES CFB mode.
+
+### `Convert.decryptAesOfb(value: ArrayBuffer, key: ArrayBuffer, iv: ArrayBuffer): ArrayBuffer`
+
+Decrypt an ArrayBuffer with AES OFB mode.
+
+### `Convert.decryptRsa(value: ArrayBuffer, key: ArrayBuffer): ArrayBuffer`
+
+Decrypt an ArrayBuffer with RSA.
+
+### `Convert.hexEncode(value: ArrayBuffer): string`
+
+Convert an ArrayBuffer to a hex string.
+
+## Network
+
+Network is a set of functions that used to send network requests and manage network resources.
+
+### `Network.fetchBytes(method: string, url: string, headers: object, data: ArrayBuffer): Promise<{status: number, headers: object, body: ArrayBuffer}>`
+
+Send a network request and return the response as an ArrayBuffer.
+
+### `Network.sendRequest(method: string, url: string, headers: object, data: ArrayBuffer): Promise<{status: number, headers: object, body: string}>`
+
+Send a network request and return the response as a string.
+
+### `Network.get(url: string, headers: object): Promise<{status: number, headers: object, body: string}>`
+
+Send a GET request and return the response as a string.
+
+### `Network.post(url: string, headers: object, data: ArrayBuffer): Promise<{status: number, headers: object, body: string}>`
+
+Send a POST request and return the response as a string.
+
+### `Network.put(url: string, headers: object, data: ArrayBuffer): Promise<{status: number, headers: object, body: string}>`
+
+Send a PUT request and return the response as a string.
+
+### `Network.delete(url: string, headers: object): Promise<{status: number, headers: object, body: string}>`
+
+Send a DELETE request and return the response as a string.
+
+### `Network.patch(url: string, headers: object, data: ArrayBuffer): Promise<{status: number, headers: object, body: string}>`
+
+Send a PATCH request and return the response as a string.
+
+### `Network.setCookies(url: string, cookies: Cookie[]): void`
+
+Set cookies for a specific url.
+
+### `Network.getCookies(url: string): Cookie[]`
+
+Get cookies for a specific url.
+
+### `Network.deleteCookies(url: string): void`
+
+Delete cookies for a specific url.
+
+### `fetch`
+
+The fetch function is a wrapper of the `Network.fetchBytes` function. Same as the `fetch` function in the browser.
+
+## Html
+
+Api for parsing HTML.
+
+### `new HtmlDocument(html: string): HtmlDocument`
+
+Create a HtmlDocument object from a html string.
+
+### `HtmlDocument.querySelector(selector: string): HtmlElement`
+
+Find the first element that matches the selector.
+
+### `HtmlDocument.querySelectorAll(selector: string): HtmlElement[]`
+
+Find all elements that match the selector.
+
+### `HtmlDocument.getElementById(id: string): HtmlElement`
+
+Find the element with the id.
+
+### `HtmlDocument.dispose(): void`
+
+Dispose the HtmlDocument object.
+
+### `HtmlElement.querySelector(selector: string): HtmlElement`
+
+Find the first element that matches the selector.
+
+### `HtmlElement.querySelectorAll(selector: string): HtmlElement[]`
+
+Find all elements that match the selector.
+
+### `HtmlElement.getElementById(id: string): HtmlElement`
+
+Find the element with the id.
+
+### `get HtmlElement.text(): string`
+
+Get the text content of the element.
+
+### `get HtmlElement.attributes(): object`
+
+Get the attributes of the element.
+
+### `get HtmlElement.children(): HtmlElement[]`
+
+Get the children
+
+### `get HtmlElement.nodes(): HtmlNode[]`
+
+Get the child nodes
+
+### `get HtmlElement.parent(): HtmlElement | null`
+
+Get the parent element
+
+### `get HtmlElement.innerHtml(): string`
+
+Get the inner html
+
+### `get HtmlElement.classNames(): string[]`
+
+Get the class names
+
+### `get HtmlElement.id(): string | null`
+
+Get the id
+
+### `get HtmlElement.localName(): string`
+
+Get the local name
+
+### `get HtmlElement.previousSibling(): HtmlElement | null`
+
+Get the previous sibling
+
+### `get HtmlElement.nextSibling(): HtmlElement | null`
+
+Get the next sibling
+
+### `get HtmlNode.type(): string`
+
+Get the node type ("text", "element", "comment", "document", "unknown")
+
+### `HtmlNode.toElement(): HtmlElement | null`
+
+Convert the node to an element
+
+### `get HtmlNode.text(): string`
+
+Get the text content of the node
+
+## UI
+
+### `UI.showMessage(message: string): void`
+
+Show a message.
+
+### `UI.showDialog(title: string, content: string, actions: {text: string, callback: () => void | Promise<void>, style: "text"|"filled"|"danger"}[]): void`
+
+Show a dialog. Any action will close the dialog.
+
+### `UI.launchUrl(url: string): void`
+
+Open a url in external browser.
+
+### `UI.showLoading(onCancel: () => void | null | undefined): number`
+
+Show a loading dialog.
+
+### `UI.cancelLoading(id: number): void`
+
+Cancel a loading dialog.
+
+### `UI.showInputDialog(title: string, validator: (string) => string | null | undefined): string | null`
+
+Show an input dialog.
+
+### `UI.showSelectDialog(title: string, options: string[], initialIndex?: number): number | null`
+
+Show a select dialog.
+
+## Utils
+
+### `createUuid(): string`
+
+create a time-based uuid.
+
+### `randomInt(min: number, max: number): number`
+
+Generate a random integer between min and max.
+
+### `randomDouble(min: number, max: number): number`
+
+Generate a random double between min and max.
+
+### console
+
+Send log to application console. Same api as the browser console.
+
+## Types
+
+### `Cookie`
+
+```javascript
+/**
+ * Create a cookie object.
+ * @param name {string}
+ * @param value {string}
+ * @param domain {string}
+ * @constructor
+ */
+function Cookie({name, value, domain}) {
+    this.name = name;
+    this.value = value;
+    this.domain = domain;
+}
+```
+
+### `Comic`
+
+```javascript
+/**
+ * Create a comic object
+ * @param id {string}
+ * @param title {string}
+ * @param subtitle {string}
+ * @param subTitle {string} - equal to subtitle
+ * @param cover {string}
+ * @param tags {string[]}
+ * @param description {string}
+ * @param maxPage {number?}
+ * @param language {string?}
+ * @param favoriteId {string?} - Only set this field if the comic is from favorites page
+ * @param stars {number?} - 0-5, double
+ * @constructor
+ */
+function Comic({id, title, subtitle, subTitle, cover, tags, description, maxPage, language, favoriteId, stars}) {
+    this.id = id;
+    this.title = title;
+    this.subtitle = subtitle;
+    this.subTitle = subTitle;
+    this.cover = cover;
+    this.tags = tags;
+    this.description = description;
+    this.maxPage = maxPage;
+    this.language = language;
+    this.favoriteId = favoriteId;
+    this.stars = stars;
+}
+```
+
+### `ComicDetails`
+```javascript
+/**
+ * Create a comic details object
+ * @param title {string}
+ * @param subtitle {string}
+ * @param subTitle {string} - equal to subtitle
+ * @param cover {string}
+ * @param description {string?}
+ * @param tags {Map<string, string[]> | {} | null | undefined}
+ * @param chapters {Map<string, string> | {} | null | undefined} - key: chapter id, value: chapter title
+ * @param isFavorite {boolean | null | undefined} - favorite status. If the comic source supports multiple folders, this field should be null
+ * @param subId {string?} - a param which is passed to comments api
+ * @param thumbnails {string[]?} - for multiple page thumbnails, set this to null, and use `loadThumbnails` api to load thumbnails
+ * @param recommend {Comic[]?} - related comics
+ * @param commentCount {number?}
+ * @param likesCount {number?}
+ * @param isLiked {boolean?}
+ * @param uploader {string?}
+ * @param updateTime {string?}
+ * @param uploadTime {string?}
+ * @param url {string?}
+ * @param stars {number?} - 0-5, double
+ * @param maxPage {number?}
+ * @param comments {Comment[]?}- `since 1.0.7` App will display comments in the details page.
+ * @constructor
+ */
+function ComicDetails({title, subtitle, subTitle, cover, description, tags, chapters, isFavorite, subId, thumbnails, recommend, commentCount, likesCount, isLiked, uploader, updateTime, uploadTime, url, stars, maxPage, comments}) {
+    this.title = title;
+    this.subtitle = subtitle ?? subTitle;
+    this.cover = cover;
+    this.description = description;
+    this.tags = tags;
+    this.chapters = chapters;
+    this.isFavorite = isFavorite;
+    this.subId = subId;
+    this.thumbnails = thumbnails;
+    this.recommend = recommend;
+    this.commentCount = commentCount;
+    this.likesCount = likesCount;
+    this.isLiked = isLiked;
+    this.uploader = uploader;
+    this.updateTime = updateTime;
+    this.uploadTime = uploadTime;
+    this.url = url;
+    this.stars = stars;
+    this.maxPage = maxPage;
+    this.comments = comments;
+}
+```
+
+### `Comment`
+```javascript
+/**
+ * Create a comment object
+ * @param userName {string}
+ * @param avatar {string?}
+ * @param content {string}
+ * @param time {string?}
+ * @param replyCount {number?}
+ * @param id {string?}
+ * @param isLiked {boolean?}
+ * @param score {number?}
+ * @param voteStatus {number?} - 1: upvote, -1: downvote, 0: none
+ * @constructor
+ */
+function Comment({userName, avatar, content, time, replyCount, id, isLiked, score, voteStatus}) {
+    this.userName = userName;
+    this.avatar = avatar;
+    this.content = content;
+    this.time = time;
+    this.replyCount = replyCount;
+    this.id = id;
+    this.isLiked = isLiked;
+    this.score = score;
+    this.voteStatus = voteStatus;
+}
+```
+
+### `ImageLoadingConfig`
+```javascript
+/**
+ * Create image loading config
+ * @param url {string?}
+ * @param method {string?} - http method, uppercase
+ * @param data {any} - request data, may be null
+ * @param headers {Object?} - request headers
+ * @param onResponse {((ArrayBuffer) => ArrayBuffer)?} - modify response data
+ * @param modifyImage {string?}
+ *  A js script string.
+ *  The script will be executed in a new Isolate.
+ *  A function named `modifyImage` should be defined in the script, which receives an [Image] as the only argument, and returns an [Image]..
+ * @param onLoadFailed {(() => ImageLoadingConfig)?} - called when the image loading failed
+ * @constructor
+ * @since 1.0.5
+ *
+ * To keep the compatibility with the old version, do not use the constructor. Consider creating a new object with the properties directly.
+ */
+function ImageLoadingConfig({url, method, data, headers, onResponse, modifyImage, onLoadFailed}) {
+    this.url = url;
+    this.method = method;
+    this.data = data;
+    this.headers = headers;
+    this.onResponse = onResponse;
+    this.modifyImage = modifyImage;
+    this.onLoadFailed = onLoadFailed;
+}
+```
+
+### `ComicSource`
+```javascript
+class ComicSource {
+    name = ""
+
+    key = ""
+
+    version = ""
+
+    minAppVersion = ""
+
+    url = ""
+
+    /**
+     * load data with its key
+     * @param {string} dataKey
+     * @returns {any}
+     */
+    loadData(dataKey) {
+        return sendMessage({
+            method: 'load_data',
+            key: this.key,
+            data_key: dataKey
+        })
+    }
+
+    /**
+     * load a setting with its key
+     * @param key {string}
+     * @returns {any}
+     */
+    loadSetting(key) {
+        return sendMessage({
+            method: 'load_setting',
+            key: this.key,
+            setting_key: key
+        })
+    }
+
+    /**
+     * save data
+     * @param {string} dataKey
+     * @param data
+     */
+    saveData(dataKey, data) {
+        return sendMessage({
+            method: 'save_data',
+            key: this.key,
+            data_key: dataKey,
+            data: data
+        })
+    }
+
+    /**
+     * delete data
+     * @param {string} dataKey
+     */
+    deleteData(dataKey) {
+        return sendMessage({
+            method: 'delete_data',
+            key: this.key,
+            data_key: dataKey,
+        })
+    }
+
+    /**
+     *
+     * @returns {boolean}
+     */
+    get isLogged() {
+        return sendMessage({
+            method: 'isLogged',
+            key: this.key,
+        });
+    }
+
+    init() { }
+
+    static sources = {}
+}
+```

ios/Podfile

@@ -1,5 +1,5 @@
 # Uncomment this line to define a global platform for your project
-platform :ios, '15.0'
+platform :ios, '13.0'
 
 # CocoaPods analytics sends network stats synchronously affecting flutter build latency.
 ENV['COCOAPODS_DISABLE_STATS'] = 'true'

ios/Runner/Info.plist

@@ -53,5 +53,7 @@
 	<true/>
 	<key>NSFaceIDUsageDescription</key>
   <string>Ensure that the operation is being performed by the user themselves.</string>
+  <key>LSApplicationCategoryType</key>
+  <string>public.app-category.books</string>
 </dict>
 </plist>

lib/components/appbar.dart

@@ -1,12 +1,14 @@
 part of 'components.dart';
 
 class Appbar extends StatefulWidget implements PreferredSizeWidget {
-  const Appbar(
+  const Appbar({
-      {required this.title,
+    required this.title,
     this.leading,
     this.actions,
     this.backgroundColor,
-      super.key});
+    this.style = AppbarStyle.blur,
+    super.key,
+  });
 
   final Widget title;
 
@@ -16,6 +18,8 @@ class Appbar extends StatefulWidget implements PreferredSizeWidget {
 
   final Color? backgroundColor;
 
+  final AppbarStyle style;
+
   @override
   State<Appbar> createState() => _AppbarState();
 
@@ -76,7 +80,7 @@ class _AppbarState extends State<Appbar> {
     var content = Container(
       decoration: BoxDecoration(
         color: widget.backgroundColor ??
-            context.colorScheme.surface.toOpacity(0.72),
+            context.colorScheme.surface.toOpacity(0.86),
       ),
       height: _kAppBarHeight + context.padding.top,
       child: Row(
@@ -108,11 +112,19 @@ class _AppbarState extends State<Appbar> {
         ],
       ).paddingTop(context.padding.top),
     );
+    if (widget.style == AppbarStyle.shadow) {
+      return Material(
+        color: context.colorScheme.surface,
+        elevation: _scrolledUnder ? 2 : 0,
+        child: content,
+      );
+    } else {
       return BlurEffect(
         blur: _scrolledUnder ? 15 : 0,
         child: content,
       );
     }
+  }
 }
 
 enum AppbarStyle {
@@ -219,7 +231,7 @@ class _MySliverAppBarDelegate extends SliverPersistentHeaderDelegate {
         child: BlurEffect(
           blur: 15,
           child: Material(
-            color: context.colorScheme.surface.toOpacity(0.72),
+            color: context.colorScheme.surface.toOpacity(0.86),
             elevation: 0,
             borderRadius: BorderRadius.circular(radius),
             child: body,
@@ -256,18 +268,28 @@ class _MySliverAppBarDelegate extends SliverPersistentHeaderDelegate {
   }
 }
 
-class FilledTabBar extends StatefulWidget {
+class AppTabBar extends StatefulWidget {
-  const FilledTabBar({super.key, this.controller, required this.tabs});
+  const AppTabBar({
+    super.key,
+    this.controller,
+    required this.tabs,
+    this.actionButton,
+    this.withUnderLine = true,
+  });
 
   final TabController? controller;
 
   final List<Tab> tabs;
 
+  final Widget? actionButton;
+
+  final bool withUnderLine;
+
   @override
-  State<FilledTabBar> createState() => _FilledTabBarState();
+  State<AppTabBar> createState() => _AppTabBarState();
 }
 
-class _FilledTabBarState extends State<FilledTabBar> {
+class _AppTabBarState extends State<AppTabBar> {
   late TabController _controller;
 
   late List<GlobalKey> keys;
@@ -315,7 +337,7 @@ class _FilledTabBarState extends State<FilledTabBar> {
   }
 
   @override
-  void didUpdateWidget(covariant FilledTabBar oldWidget) {
+  void didUpdateWidget(covariant AppTabBar oldWidget) {
     if (widget.controller != oldWidget.controller) {
       _controller = widget.controller ?? DefaultTabController.of(context);
       _controller.animation!.addListener(onTabChanged);
@@ -366,7 +388,8 @@ class _FilledTabBarState extends State<FilledTabBar> {
             painter: painter,
             child: _TabRow(
               callback: _tabLayoutCallback,
-              children: List.generate(widget.tabs.length, buildTab),
+              children: List.generate(widget.tabs.length, buildTab)
+                ..addIfNotNull(widget.actionButton?.padding(tabPadding)),
             ),
           ).paddingHorizontal(4),
         );
@@ -376,15 +399,18 @@ class _FilledTabBarState extends State<FilledTabBar> {
       key: tabBarKey,
       height: _kTabHeight,
       width: double.infinity,
-        decoration: BoxDecoration(
+      decoration: widget.withUnderLine
+          ? BoxDecoration(
               border: Border(
                 bottom: BorderSide(
                   color: context.colorScheme.outlineVariant,
                   width: 0.6,
                 ),
               ),
-        ),
+            )
-        child: widget.tabs.isEmpty ? const SizedBox() : child);
+          : null,
+      child: widget.tabs.isEmpty ? const SizedBox() : child,
+    );
   }
 
   int? previousIndex;
@@ -544,7 +570,7 @@ class _IndicatorPainter extends CustomPainter {
 
     var rect = Rect.fromLTWH(
       tabLeft + padding.left + horizontalPadding,
-      _FilledTabBarState._kTabHeight - 3.6,
+      _AppTabBarState._kTabHeight - 3.6,
       tabRight - tabLeft - padding.horizontal - horizontalPadding * 2,
       3,
     );
@@ -606,6 +632,7 @@ class _TabViewBodyState extends State<TabViewBody> {
   void didChangeDependencies() {
     super.didChangeDependencies();
     _controller = widget.controller ?? DefaultTabController.of(context);
+    _currentIndex = _controller.index;
     _controller.addListener(updateIndex);
   }
 
@@ -621,7 +648,6 @@ class _TabViewBodyState extends State<TabViewBody> {
   }
 }
 
-
 class SearchBarController {
   _SearchBarMixin? _state;
 
@@ -894,3 +920,42 @@ class _SearchBarState extends State<AppSearchBar> with _SearchBarMixin {
     );
   }
 }
+
+class TabActionButton extends StatelessWidget {
+  const TabActionButton({
+    super.key,
+    required this.icon,
+    required this.text,
+    required this.onPressed,
+  });
+
+  final Icon icon;
+
+  final String text;
+
+  final void Function() onPressed;
+
+  static const _kTabHeight = 46.0;
+
+  @override
+  Widget build(BuildContext context) {
+    return InkWell(
+      onTap: onPressed,
+      borderRadius: BorderRadius.circular(8),
+      child: Container(
+        height: _kTabHeight,
+        padding: const EdgeInsets.symmetric(horizontal: 12),
+        child: IconTheme(
+          data: IconThemeData(size: 20, color: context.colorScheme.primary),
+          child: Row(
+            children: [
+              icon,
+              const SizedBox(width: 8),
+              Text(text, style: ts.withColor(context.colorScheme.primary)),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/components/code.dart

@@ -55,7 +55,7 @@ class _CodeEditorState extends State<CodeEditor> {
 
   Widget buildLineNumbers() {
     return SizedBox(
-      width: 32,
+      width: 36,
       child: Column(
         children: [
           for (var i = 1; i <= lineCount; i++)

lib/components/comic.dart

@@ -23,14 +23,16 @@ ImageProvider? _findImageProvider(Comic comic) {
 }
 
 class ComicTile extends StatelessWidget {
-  const ComicTile(
+  const ComicTile({
-      {super.key,
+    super.key,
     required this.comic,
     this.enableLongPressed = true,
     this.badge,
     this.menuOptions,
     this.onTap,
-      this.onLongPressed});
+    this.onLongPressed,
+    this.heroID,
+  });
 
   final Comic comic;
 
@@ -44,6 +46,8 @@ class ComicTile extends StatelessWidget {
 
   final VoidCallback? onLongPressed;
 
+  final int? heroID;
+
   void _onTap() {
     if (onTap != null) {
       onTap!();
@@ -55,6 +59,7 @@ class ComicTile extends StatelessWidget {
         sourceKey: comic.sourceKey,
         cover: comic.cover,
         title: comic.title,
+        heroID: heroID,
       ),
     );
   }
@@ -137,8 +142,7 @@ class ComicTile extends StatelessWidget {
             .isExist(comic.id, ComicType(comic.sourceKey.hashCode))
         : false;
     var history = appdata.settings['showHistoryStatusOnTile']
-        ? HistoryManager()
+        ? HistoryManager().find(comic.id, ComicType(comic.sourceKey.hashCode))
-            .findSync(comic.id, ComicType(comic.sourceKey.hashCode))
         : null;
     if (history?.page == 0) {
       history!.page = 1;
@@ -210,18 +214,8 @@ class ComicTile extends StatelessWidget {
   Widget _buildDetailedMode(BuildContext context) {
     return LayoutBuilder(builder: (context, constrains) {
       final height = constrains.maxHeight - 16;
-      return InkWell(
+
-          borderRadius: BorderRadius.circular(12),
+      Widget image = Container(
-          onTap: _onTap,
-          onLongPress: enableLongPressed ? () => _onLongPressed(context) : null,
-          onSecondaryTapDown: (detail) => onSecondaryTap(detail, context),
-          child: Padding(
-            padding: const EdgeInsets.fromLTRB(16, 8, 24, 8),
-            child: Row(
-              children: [
-                Hero(
-                  tag: "cover${comic.id}${comic.sourceKey}",
-                  child: Container(
         width: height * 0.68,
         height: double.infinity,
         decoration: BoxDecoration(
@@ -237,8 +231,25 @@ class ComicTile extends StatelessWidget {
         ),
         clipBehavior: Clip.antiAlias,
         child: buildImage(context),
-                  ),
+      );
-                ),
+
+      if (heroID != null) {
+        image = Hero(
+          tag: "cover$heroID",
+          child: image,
+        );
+      }
+
+      return InkWell(
+        borderRadius: BorderRadius.circular(12),
+        onTap: _onTap,
+        onLongPress: enableLongPressed ? () => _onLongPressed(context) : null,
+        onSecondaryTapDown: (detail) => onSecondaryTap(detail, context),
+        child: Padding(
+          padding: const EdgeInsets.fromLTRB(16, 8, 24, 8),
+          child: Row(
+            children: [
+              image,
               SizedBox.fromSize(
                 size: const Size(16, 5),
               ),
@@ -252,35 +263,23 @@ class ComicTile extends StatelessWidget {
                   badge: badge ?? comic.language,
                   tags: comic.tags,
                   maxLines: 2,
-                    enableTranslate: ComicSource.find(comic.sourceKey)
+                  enableTranslate:
-                            ?.enableTagsTranslate ??
+                      ComicSource.find(comic.sourceKey)?.enableTagsTranslate ??
                           false,
                   rating: comic.stars,
                 ),
               ),
             ],
           ),
-          ));
+        ),
+      );
     });
   }
 
   Widget _buildBriefMode(BuildContext context) {
     return LayoutBuilder(
       builder: (context, constraints) {
-        return InkWell(
+        Widget image = Container(
-          borderRadius: BorderRadius.circular(8),
-          onTap: _onTap,
-          onLongPress: enableLongPressed ? () => _onLongPressed(context) : null,
-          onSecondaryTapDown: (detail) => onSecondaryTap(detail, context),
-          child: Column(
-            children: [
-              Expanded(
-                child: Stack(
-                  children: [
-                    Positioned.fill(
-                      child: Hero(
-                        tag: "cover${comic.id}${comic.sourceKey}",
-                        child: Container(
           decoration: BoxDecoration(
             color: context.colorScheme.secondaryContainer,
             borderRadius: BorderRadius.circular(8),
@@ -294,8 +293,27 @@ class ComicTile extends StatelessWidget {
           ),
           clipBehavior: Clip.antiAlias,
           child: buildImage(context),
-                        ),
+        );
-                      ),
+
+        if (heroID != null) {
+          image = Hero(
+            tag: "cover$heroID",
+            child: image,
+          );
+        }
+
+        return InkWell(
+          borderRadius: BorderRadius.circular(8),
+          onTap: _onTap,
+          onLongPress: enableLongPressed ? () => _onLongPressed(context) : null,
+          onSecondaryTapDown: (detail) => onSecondaryTap(detail, context),
+          child: Column(
+            children: [
+              Expanded(
+                child: Stack(
+                  children: [
+                    Positioned.fill(
+                      child: image,
                     ),
                     Align(
                       alignment: Alignment.bottomRight,
@@ -316,7 +334,12 @@ class ComicTile extends StatelessWidget {
                         }
 
                         var children = <Widget>[];
-                        for (var line in text.split('\n')) {
+                        var lines = text.split('\n');
+                        lines.removeWhere((e) => e.trim().isEmpty);
+                        if (lines.length > 3) {
+                          lines = lines.sublist(0, 3);
+                        }
+                        for (var line in lines) {
                           children.add(Container(
                             margin: const EdgeInsets.fromLTRB(2, 0, 2, 2),
                             padding: constraints.maxWidth < 80
@@ -356,14 +379,13 @@ class ComicTile extends StatelessWidget {
               ),
               Padding(
                 padding: const EdgeInsets.fromLTRB(4, 4, 4, 0),
-                child: TextScroll(
+                child: Text(
                   comic.title.replaceAll('\n', ''),
-                  mode: TextScrollMode.endless,
+                  maxLines: 1,
+                  overflow: TextOverflow.clip,
                   style: const TextStyle(
                     fontWeight: FontWeight.w500,
                   ),
-                  delayBefore: Duration(milliseconds: 500),
-                  velocity: const Velocity(pixelsPerSecond: Offset(40, 0)),
                 ),
               ),
             ],
@@ -446,7 +468,9 @@ class ComicTile extends StatelessWidget {
                   children: [
                     for (var word in all)
                       OptionChip(
-                        text: word,
+                        text: (comic.tags?.contains(word) ?? false)
+                            ? word.translateTagIfNeed
+                            : word,
                         isSelected: words.contains(word),
                         onTap: () {
                           setState(() {
@@ -539,10 +563,8 @@ class _ComicDescription extends StatelessWidget {
             softWrap: true,
             overflow: TextOverflow.ellipsis,
           ),
-        const SizedBox(
+        const SizedBox(height: 4),
-          height: 4,
+        if (tags != null && tags!.isNotEmpty)
-        ),
-        if (tags != null)
           Expanded(
             child: LayoutBuilder(builder: (context, constraints) {
               if (constraints.maxHeight < 22) {
@@ -551,7 +573,7 @@ class _ComicDescription extends StatelessWidget {
               int cnt = (constraints.maxHeight - 22).toInt() ~/ 25;
               return Container(
                 clipBehavior: Clip.antiAlias,
-                height: 22 + cnt * 25,
+                height: 21 + cnt * 24,
                 width: double.infinity,
                 decoration: const BoxDecoration(),
                 child: Wrap(
@@ -563,19 +585,16 @@ class _ComicDescription extends StatelessWidget {
                   children: [
                     for (var s in tags!)
                       Container(
-                          height: 22,
+                        height: 21,
-                          padding: const EdgeInsets.fromLTRB(3, 2, 3, 2),
+                        padding: const EdgeInsets.symmetric(horizontal: 4),
                         constraints: BoxConstraints(
                           maxWidth: constraints.maxWidth * 0.45,
                         ),
                         decoration: BoxDecoration(
                           color: s == "Unavailable"
-                                ? Theme.of(context).colorScheme.errorContainer
+                              ? context.colorScheme.errorContainer
-                                : Theme.of(context)
+                              : context.colorScheme.secondaryContainer,
-                                    .colorScheme
+                          borderRadius: BorderRadius.circular(8),
-                                    .secondaryContainer,
-                            borderRadius:
-                                const BorderRadius.all(Radius.circular(8)),
                         ),
                         child: Center(
                           widthFactor: 1,
@@ -587,7 +606,9 @@ class _ComicDescription extends StatelessWidget {
                             softWrap: true,
                             overflow: TextOverflow.ellipsis,
                             maxLines: 1,
-                              ))),
+                          ),
+                        ),
+                      ),
                   ],
                 ),
               ).toAlign(Alignment.topCenter);
@@ -608,6 +629,8 @@ class _ComicDescription extends StatelessWidget {
                     style: const TextStyle(
                       fontSize: 12.0,
                     ),
+                    maxLines: (tags == null || tags!.isEmpty) ? 3 : 2,
+                    overflow: TextOverflow.ellipsis,
                   ),
                 ],
               ),
@@ -624,7 +647,8 @@ class _ComicDescription extends StatelessWidget {
                     "${badge![0].toUpperCase()}${badge!.substring(1).toLowerCase()}",
                     style: const TextStyle(fontSize: 12),
                   ),
-                  )),
+                ),
+              ),
           ],
         )
       ],
@@ -738,16 +762,27 @@ class SliverGridComics extends StatefulWidget {
 
 class _SliverGridComicsState extends State<SliverGridComics> {
   List<Comic> comics = [];
+  List<int> heroIDs = [];
+
+  static int _nextHeroID = 0;
+
+  void generateHeroID() {
+    heroIDs.clear();
+    for (var i = 0; i < comics.length; i++) {
+      heroIDs.add(_nextHeroID++);
+    }
+  }
 
   @override
   void didUpdateWidget(covariant SliverGridComics oldWidget) {
-    if (oldWidget.comics != widget.comics) {
+    if (!comics.isEqualTo(widget.comics)) {
       comics.clear();
       for (var comic in widget.comics) {
         if (isBlocked(comic) == null) {
           comics.add(comic);
         }
       }
+      generateHeroID();
     }
     super.didUpdateWidget(oldWidget);
   }
@@ -759,6 +794,7 @@ class _SliverGridComicsState extends State<SliverGridComics> {
         comics.add(comic);
       }
     }
+    generateHeroID();
     HistoryManager().addListener(update);
     super.initState();
   }
@@ -784,6 +820,7 @@ class _SliverGridComicsState extends State<SliverGridComics> {
   Widget build(BuildContext context) {
     return _SliverGridComics(
       comics: comics,
+      heroIDs: heroIDs,
       selection: widget.selections,
       onLastItemBuild: widget.onLastItemBuild,
       badgeBuilder: widget.badgeBuilder,
@@ -797,6 +834,7 @@ class _SliverGridComicsState extends State<SliverGridComics> {
 class _SliverGridComics extends StatelessWidget {
   const _SliverGridComics({
     required this.comics,
+    required this.heroIDs,
     this.onLastItemBuild,
     this.badgeBuilder,
     this.menuBuilder,
@@ -807,6 +845,8 @@ class _SliverGridComics extends StatelessWidget {
 
   final List<Comic> comics;
 
+  final List<int> heroIDs;
+
   final Map<Comic, bool>? selection;
 
   final void Function()? onLastItemBuild;
@@ -838,11 +878,13 @@ class _SliverGridComics extends StatelessWidget {
             onLongPressed: onLongPressed != null
                 ? () => onLongPressed!(comics[index])
                 : null,
+            heroID: heroIDs[index],
           );
           if (selection == null) {
             return comic;
           }
           return AnimatedContainer(
+            key: ValueKey(comics[index].id),
             duration: const Duration(milliseconds: 150),
             decoration: BoxDecoration(
               color: isSelected
@@ -1104,7 +1146,7 @@ class ComicListState extends State<ComicList> {
         setState(() {});
       });
     }
-    if (_loading[page] == true) {
+    if (_data[page] != null || _loading[page] == true) {
       return;
     }
     _loading[page] = true;
@@ -1114,8 +1156,8 @@ class ComicListState extends State<ComicList> {
         if (!mounted) return;
         if (res.success) {
           if (res.data.isEmpty) {
-            _data[page] = const [];
             setState(() {
+              _data[page] = const [];
               _maxPage = page;
             });
           } else {
@@ -1165,6 +1207,11 @@ class ComicListState extends State<ComicList> {
 
   @override
   Widget build(BuildContext context) {
+    var type = appdata.settings['comicListDisplayMode'];
+    return type == 'paging' ? buildPagingMode() : buildContinuousMode();
+  }
+
+  Widget buildPagingMode() {
     if (_error != null) {
       return Column(
         children: [
@@ -1213,6 +1260,85 @@ class ComicListState extends State<ComicList> {
       ],
     );
   }
+
+  Widget buildContinuousMode() {
+    if (_error != null && _data.isEmpty) {
+      return Column(
+        children: [
+          if (widget.errorLeading != null) widget.errorLeading!,
+          _buildPageSelector(),
+          Expanded(
+            child: NetworkError(
+              withAppbar: false,
+              message: _error!,
+              retry: () {
+                setState(() {
+                  _error = null;
+                });
+              },
+            ),
+          ),
+        ],
+      );
+    }
+    if (_data[_page] == null) {
+      _loadPage(_page);
+      return Column(
+        children: [
+          if (widget.errorLeading != null) widget.errorLeading!,
+          const Expanded(
+            child: Center(
+              child: CircularProgressIndicator(),
+            ),
+          ),
+        ],
+      );
+    }
+    return SmoothCustomScrollView(
+      key: enablePageStorage ? PageStorageKey('scroll$_page') : null,
+      controller: widget.controller,
+      slivers: [
+        if (widget.leadingSliver != null) widget.leadingSliver!,
+        SliverGridComics(
+          comics: _data.values.expand((element) => element).toList(),
+          menuBuilder: widget.menuBuilder,
+          onLastItemBuild: () {
+            if (_error == null && (_maxPage == null || _page < _maxPage!)) {
+              _loadPage(_data.length + 1);
+            }
+          },
+        ),
+        if (_error != null)
+          SliverToBoxAdapter(
+            child: Column(
+              children: [
+                Row(
+                  children: [
+                    const Icon(Icons.error_outline),
+                    const SizedBox(width: 8),
+                    Expanded(child: Text(_error!, maxLines: 3)),
+                  ],
+                ),
+                const SizedBox(height: 8),
+                Center(
+                  child: OutlinedButton(
+                    onPressed: () {
+                      setState(() {
+                        _error = null;
+                      });
+                    },
+                    child: Text("Retry".tl),
+                  ),
+                ),
+              ],
+            ).paddingHorizontal(16).paddingVertical(8),
+          )
+        else if (_maxPage == null || _page < _maxPage!)
+          const SliverListLoadingIndicator(),
+        if (widget.trailingSliver != null) widget.trailingSliver!,
+      ],
+    );
+  }
 }
 
 class StarRating extends StatelessWidget {
@@ -1499,17 +1625,20 @@ class _SMClipper extends CustomClipper<Rect> {
 }
 
 class SimpleComicTile extends StatelessWidget {
-  const SimpleComicTile({super.key, required this.comic, this.onTap});
+  const SimpleComicTile(
+      {super.key, required this.comic, this.onTap, this.withTitle = false});
 
   final Comic comic;
 
   final void Function()? onTap;
 
+  final bool withTitle;
+
   @override
   Widget build(BuildContext context) {
     var image = _findImageProvider(comic);
 
-    var child = image == null
+    Widget child = image == null
         ? const SizedBox()
         : AnimatedImage(
             image: image,
@@ -1519,9 +1648,21 @@ class SimpleComicTile extends StatelessWidget {
             filterQuality: FilterQuality.medium,
           );
 
-    return AnimatedTapRegion(
+    child = Container(
+      width: 98,
+      height: 136,
+      decoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(8),
+        color: Theme.of(context).colorScheme.secondaryContainer,
+      ),
+      clipBehavior: Clip.antiAlias,
+      child: child,
+    );
+
+    child = AnimatedTapRegion(
       borderRadius: 8,
-      onTap: onTap ?? () {
+      onTap: onTap ??
+          () {
             context.to(
               () => ComicPage(
                 id: comic.id,
@@ -1529,16 +1670,29 @@ class SimpleComicTile extends StatelessWidget {
               ),
             );
           },
-      child: Container(
-        width: 92,
-        height: 114,
-        decoration: BoxDecoration(
-          borderRadius: BorderRadius.circular(8),
-          color: Theme.of(context).colorScheme.secondaryContainer,
-        ),
-        clipBehavior: Clip.antiAlias,
       child: child,
+    );
+
+    if (withTitle) {
+      child = Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          child,
+          const SizedBox(height: 4),
+          SizedBox(
+            width: 92,
+            child: Center(
+              child: Text(
+                comic.title.replaceAll('\n', ''),
+                maxLines: 1,
+                overflow: TextOverflow.ellipsis,
               ),
+            ),
+          ),
+        ],
       );
     }
+
+    return child;
+  }
 }

lib/components/components.dart

@@ -1,5 +1,6 @@
 import 'dart:async';
 import 'dart:collection';
+import 'dart:convert';
 import 'dart:math' as math;
 import 'dart:ui' as ui;
 
@@ -9,7 +10,6 @@ import 'package:flutter/rendering.dart';
 import 'package:flutter/scheduler.dart';
 import 'package:flutter/services.dart';
 import 'package:syntax_highlight/syntax_highlight.dart';
-import 'package:text_scroll/text_scroll.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/app_page_route.dart';
 import 'package:venera/foundation/appdata.dart';
@@ -22,11 +22,13 @@ import 'package:venera/foundation/image_provider/cached_image.dart';
 import 'package:venera/foundation/image_provider/history_image_provider.dart';
 import 'package:venera/foundation/image_provider/local_comic_image.dart';
 import 'package:venera/foundation/local.dart';
+import 'package:venera/foundation/log.dart';
 import 'package:venera/foundation/res.dart';
 import 'package:venera/network/cloudflare.dart';
-import 'package:venera/pages/comic_page.dart';
+import 'package:venera/pages/comic_details_page/comic_page.dart';
 import 'package:venera/pages/favorites/favorites_page.dart';
 import 'package:venera/utils/ext.dart';
+import 'package:venera/utils/io.dart';
 import 'package:venera/utils/tags_translation.dart';
 import 'package:venera/utils/translations.dart';
 

lib/components/gesture.dart

@@ -58,26 +58,12 @@ class _AnimatedTapRegionState extends State<AnimatedTapRegion> {
       },
       child: GestureDetector(
         onTap: widget.onTap,
-        child: AnimatedContainer(
+        child: AnimatedPhysicalModel(
           duration: _fastAnimationDuration,
-          decoration: BoxDecoration(
+          elevation: isHovered ? 3 : 1,
+          color: context.colorScheme.surface,
+          shadowColor: context.colorScheme.shadow,
           borderRadius: BorderRadius.circular(widget.borderRadius),
-            boxShadow: isHovered
-                ? [
-                    BoxShadow(
-                      color: context.colorScheme.outline,
-                      blurRadius: 2,
-                      offset: const Offset(0, 2),
-                    ),
-                  ]
-                : [
-                    BoxShadow(
-                      color: context.colorScheme.outlineVariant,
-                      blurRadius: 1,
-                      offset: const Offset(0, 1),
-                    ),
-                  ],
-          ),
           child: widget.child,
         ),
       ),

lib/components/image.dart

@@ -277,17 +277,19 @@ class _AnimatedImageState extends State<AnimatedImage>
 
     if (_imageInfo != null) {
       if (widget.part != null) {
-        return CustomPaint(
+        result =  CustomPaint(
+          isComplex: true,
           painter: ImagePainter(
             image: _imageInfo!.image,
             part: widget.part!,
+            fit: widget.fit ?? BoxFit.cover,
           ),
           child: SizedBox(
             width: widget.width,
             height: widget.height,
           ),
         );
-      }
+      } else {
         result = RawImage(
           image: _imageInfo?.image,
           width: widget.width,
@@ -306,6 +308,7 @@ class _AnimatedImageState extends State<AnimatedImage>
           isAntiAlias: widget.isAntiAlias,
           filterQuality: widget.filterQuality,
         );
+      }
     } else if (_lastException != null) {
       result = const Center(
         child: Icon(Icons.error),
@@ -362,10 +365,13 @@ class ImagePainter extends CustomPainter {
 
   final ImagePart part;
 
+  final BoxFit fit;
+
   /// Render a part of the image.
   const ImagePainter({
     required this.image,
     this.part = const ImagePart(),
+    this.fit = BoxFit.cover,
   });
 
   @override
@@ -377,7 +383,8 @@ class ImagePainter extends CustomPainter {
         part.y2 ?? image.height.toDouble(),
       ),
     );
-    final Rect dst = Offset.zero & size;
+    var fitted = applyBoxFit(fit, Size(src.width, src.height), size).destination;
+    var dst = Alignment.center.inscribe(fitted, Offset.zero & size);
     canvas.drawImageRect(image, src, dst, Paint());
   }
 

lib/components/js_ui.dart

@@ -0,0 +1,245 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_qjs/flutter_qjs.dart';
+import 'package:url_launcher/url_launcher_string.dart';
+import 'package:venera/foundation/app.dart';
+import 'package:venera/foundation/js_engine.dart';
+
+import 'components.dart';
+
+mixin class JsUiApi {
+  final Map<int, LoadingDialogController> _loadingDialogControllers = {};
+
+  dynamic handleUIMessage(Map<String, dynamic> message) {
+    switch (message['function']) {
+      case 'showMessage':
+        var m = message['message'];
+        if (m.toString().isNotEmpty) {
+          App.rootContext.showMessage(message: m.toString());
+        }
+      case 'showDialog':
+        return _showDialog(message);
+      case 'launchUrl':
+        var url = message['url'];
+        if (url.toString().isNotEmpty) {
+          launchUrlString(url.toString());
+        }
+      case 'showLoading':
+        var onCancel = message['onCancel'];
+        if (onCancel != null && onCancel is! JSInvokable) {
+          return;
+        }
+        return _showLoading(onCancel);
+      case 'cancelLoading':
+        var id = message['id'];
+        if (id is int) {
+          _cancelLoading(id);
+        }
+      case 'showInputDialog':
+        var title = message['title'];
+        var validator = message['validator'];
+        var image = message['image'];
+        if (title is! String) return;
+        if (validator != null && validator is! JSInvokable) return;
+        if (image != null && image is! String) return;
+        return _showInputDialog(title, validator, image);
+      case 'showSelectDialog':
+        var title = message['title'];
+        var options = message['options'];
+        var initialIndex = message['initialIndex'];
+        if (title is! String) return;
+        if (options is! List) return;
+        if (initialIndex != null && initialIndex is! int) return;
+        return _showSelectDialog(
+          title,
+          options.whereType<String>().toList(),
+          initialIndex,
+        );
+    }
+  }
+
+  Future<void> _showDialog(Map<String, dynamic> message) {
+    BuildContext? dialogContext;
+    var title = message['title'];
+    var content = message['content'];
+    var actions = <Widget>[];
+    for (var action in message['actions']) {
+      if (action['callback'] is! JSInvokable) {
+        continue;
+      }
+      var callback = action['callback'] as JSInvokable;
+      var text = action['text'].toString();
+      var style = (action['style'] ?? 'text').toString();
+      actions.add(_JSCallbackButton(
+        text: text,
+        callback: JSAutoFreeFunction(callback),
+        style: style,
+        onCallbackFinished: () {
+          dialogContext?.pop();
+        },
+      ));
+    }
+    if (actions.isEmpty) {
+      actions.add(TextButton(
+        onPressed: () {
+          dialogContext?.pop();
+        },
+        child: Text('OK'),
+      ));
+    }
+    return showDialog(
+      context: App.rootContext,
+      builder: (context) {
+        dialogContext = context;
+        return ContentDialog(
+          title: title,
+          content: Text(content).paddingHorizontal(16),
+          actions: actions,
+        );
+      },
+    ).then((value) {
+      dialogContext = null;
+    });
+  }
+
+  int _showLoading(JSInvokable? onCancel) {
+    var func = onCancel == null ? null : JSAutoFreeFunction(onCancel);
+    var controller = showLoadingDialog(
+      App.rootContext,
+      barrierDismissible: onCancel != null,
+      allowCancel: onCancel != null,
+      onCancel: onCancel == null
+          ? null
+          : () {
+              func?.call([]);
+            },
+    );
+    var i = 0;
+    while (_loadingDialogControllers.containsKey(i)) {
+      i++;
+    }
+    _loadingDialogControllers[i] = controller;
+    return i;
+  }
+
+  void _cancelLoading(int id) {
+    var controller = _loadingDialogControllers.remove(id);
+    controller?.close();
+  }
+
+  Future<String?> _showInputDialog(String title, JSInvokable? validator, String? image) async {
+    String? result;
+    var func = validator == null ? null : JSAutoFreeFunction(validator);
+    await showInputDialog(
+      context: App.rootContext,
+      title: title,
+      image: image,
+      onConfirm: (v) {
+        if (func != null) {
+          var res = func.call([v]);
+          if (res != null) {
+            return res.toString();
+          } else {
+            result = v;
+          }
+        } else {
+          result = v;
+        }
+        return null;
+      },
+    );
+    return result;
+  }
+
+  Future<int?> _showSelectDialog(
+    String title,
+    List<String> options,
+    int? initialIndex,
+  ) {
+    if (options.isEmpty) {
+      return Future.value(null);
+    }
+    if (initialIndex != null &&
+        (initialIndex >= options.length || initialIndex < 0)) {
+      initialIndex = null;
+    }
+    return showSelectDialog(
+      title: title,
+      options: options,
+      initialIndex: initialIndex,
+    );
+  }
+}
+
+class _JSCallbackButton extends StatefulWidget {
+  const _JSCallbackButton({
+    required this.text,
+    required this.callback,
+    required this.style,
+    this.onCallbackFinished,
+  });
+
+  final JSAutoFreeFunction callback;
+
+  final String text;
+
+  final String style;
+
+  final void Function()? onCallbackFinished;
+
+  @override
+  State<_JSCallbackButton> createState() => _JSCallbackButtonState();
+}
+
+class _JSCallbackButtonState extends State<_JSCallbackButton> {
+  bool isLoading = false;
+
+  void onClick() async {
+    if (isLoading) {
+      return;
+    }
+    var res = widget.callback.call([]);
+    if (res is Future) {
+      setState(() {
+        isLoading = true;
+      });
+      await res;
+      setState(() {
+        isLoading = false;
+      });
+    }
+    widget.onCallbackFinished?.call();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return switch (widget.style) {
+      "filled" => FilledButton(
+          onPressed: onClick,
+          child: isLoading
+              ? CircularProgressIndicator(strokeWidth: 1.4)
+                  .fixWidth(18)
+                  .fixHeight(18)
+              : Text(widget.text),
+        ),
+      "danger" => FilledButton(
+          onPressed: onClick,
+          style: ButtonStyle(
+            backgroundColor: WidgetStateProperty.all(context.colorScheme.error),
+          ),
+          child: isLoading
+              ? CircularProgressIndicator(strokeWidth: 1.4)
+                  .fixWidth(18)
+                  .fixHeight(18)
+              : Text(widget.text),
+        ),
+      _ => TextButton(
+          onPressed: onClick,
+          child: isLoading
+              ? CircularProgressIndicator(strokeWidth: 1.4)
+                  .fixWidth(18)
+                  .fixHeight(18)
+              : Text(widget.text),
+        ),
+    };
+  }
+}

lib/components/layout.dart

@@ -2,7 +2,10 @@ part of 'components.dart';
 
 class SliverGridViewWithFixedItemHeight extends StatelessWidget {
   const SliverGridViewWithFixedItemHeight(
-      {required this.delegate, required this.maxCrossAxisExtent, required this.itemHeight, super.key});
+      {required this.delegate,
+      required this.maxCrossAxisExtent,
+      required this.itemHeight,
+      super.key});
 
   final SliverChildDelegate delegate;
 
@@ -62,7 +65,8 @@ class SliverGridDelegateWithFixedHeight extends SliverGridDelegate {
   @override
   bool shouldRelayout(covariant SliverGridDelegate oldDelegate) {
     if (oldDelegate is! SliverGridDelegateWithFixedHeight) return true;
-    if (oldDelegate.maxCrossAxisExtent != maxCrossAxisExtent || oldDelegate.itemHeight != itemHeight) {
+    if (oldDelegate.maxCrossAxisExtent != maxCrossAxisExtent ||
+        oldDelegate.itemHeight != itemHeight) {
       return true;
     }
     return false;
@@ -70,28 +74,29 @@ class SliverGridDelegateWithFixedHeight extends SliverGridDelegate {
 }
 
 class SliverGridDelegateWithComics extends SliverGridDelegate {
-  SliverGridDelegateWithComics([this.useBriefMode = false, this.scale]);
+  SliverGridDelegateWithComics();
 
-  final bool useBriefMode;
+  final bool useBriefMode = appdata.settings['comicDisplayMode'] == 'brief';
 
-  final double? scale;
+  final double scale = (appdata.settings['comicTileScale'] as num).toDouble();
 
   @override
   SliverGridLayout getLayout(SliverConstraints constraints) {
-    if (appdata.settings['comicDisplayMode'] == 'brief' || useBriefMode) {
+    if (useBriefMode) {
       return getBriefModeLayout(
         constraints,
-        scale ?? (appdata.settings['comicTileScale'] as num).toDouble(),
+        scale,
       );
     } else {
       return getDetailedModeLayout(
         constraints,
-        scale ?? (appdata.settings['comicTileScale'] as num).toDouble(),
+        scale,
       );
     }
   }
 
-  SliverGridLayout getDetailedModeLayout(SliverConstraints constraints, double scale) {
+  SliverGridLayout getDetailedModeLayout(
+      SliverConstraints constraints, double scale) {
     const minCrossAxisExtent = 360;
     final itemHeight = 152 * scale;
     final width = constraints.crossAxisExtent;
@@ -106,11 +111,14 @@ class SliverGridDelegateWithComics extends SliverGridDelegate {
         reverseCrossAxis: false);
   }
 
-  SliverGridLayout getBriefModeLayout(SliverConstraints constraints, double scale) {
+  SliverGridLayout getBriefModeLayout(
+      SliverConstraints constraints, double scale) {
     final maxCrossAxisExtent = 192.0 * scale;
-    const childAspectRatio = 0.68;
+    const childAspectRatio = 0.64;
     const crossAxisSpacing = 0.0;
-    int crossAxisCount = (constraints.crossAxisExtent / (maxCrossAxisExtent + crossAxisSpacing)).ceil();
+    int crossAxisCount =
+        (constraints.crossAxisExtent / (maxCrossAxisExtent + crossAxisSpacing))
+            .ceil();
     // Ensure a minimum count of 1, can be zero and result in an infinite extent
     // below when the window size is 0.
     crossAxisCount = math.max(1, crossAxisCount);
@@ -132,6 +140,52 @@ class SliverGridDelegateWithComics extends SliverGridDelegate {
 
   @override
   bool shouldRelayout(covariant SliverGridDelegate oldDelegate) {
+    if (oldDelegate is! SliverGridDelegateWithComics) return true;
+    if (oldDelegate.scale != scale ||
+        oldDelegate.useBriefMode != useBriefMode) {
       return true;
     }
+    return false;
+  }
+}
+
+class SliverLazyToBoxAdapter extends StatelessWidget {
+  /// Creates a sliver that contains a single box widget which can be lazy loaded.
+  const SliverLazyToBoxAdapter({super.key, required this.child});
+
+  final Widget child;
+
+  @override
+  Widget build(BuildContext context) {
+    return SliverList.list(children: [
+      SizedBox(),
+      child,
+    ]);
+  }
+}
+
+class SliverAnimatedVisibility extends StatelessWidget {
+  const SliverAnimatedVisibility({
+    super.key,
+    required this.visible,
+    required this.child,
+  });
+
+  final bool visible;
+
+  final Widget child;
+
+  @override
+  Widget build(BuildContext context) {
+    var child = visible ? this.child : const SizedBox.shrink();
+
+    return SliverToBoxAdapter(
+      child: AnimatedSize(
+        duration: const Duration(milliseconds: 200),
+        curve: Curves.easeInOut,
+        alignment: Alignment.topCenter,
+        child: child,
+      ),
+    );
+  }
 }

lib/components/loading.dart

@@ -6,6 +6,7 @@ class NetworkError extends StatelessWidget {
     required this.message,
     this.retry,
     this.withAppbar = true,
+    this.buttonText,
   });
 
   final String message;
@@ -14,6 +15,8 @@ class NetworkError extends StatelessWidget {
 
   final bool withAppbar;
 
+  final String? buttonText;
+
   @override
   Widget build(BuildContext context) {
     var cfe = CloudflareException.fromString(message);
@@ -38,29 +41,35 @@ class NetworkError extends StatelessWidget {
               ],
             ),
           ),
-          const SizedBox(
+          const SizedBox(height: 8),
-            height: 8,
-          ),
           Text(
             cfe == null ? message : "Cloudflare verification required".tl,
             textAlign: TextAlign.center,
             maxLines: 3,
           ),
-          if (retry != null)
+          TextButton(
-            const SizedBox(
+            onPressed: () {
-              height: 12,
+              saveFile(
+                data: utf8.encode(Log().toString()),
+                filename: 'log.txt',
+              );
+            },
+            child: Text("Export logs".tl),
           ),
+          const SizedBox(height: 8),
           if (retry != null)
             if (cfe != null)
               FilledButton(
                 onPressed: () => passCloudflare(
-                    CloudflareException.fromString(message)!, retry!),
+                  CloudflareException.fromString(message)!,
+                  retry!,
+                ),
                 child: Text('Verify'.tl),
               )
             else
               FilledButton(
                 onPressed: retry,
-                child: Text('Retry'.tl),
+                child: Text(buttonText ?? 'Retry'.tl),
               ),
         ],
       ),
@@ -69,15 +78,11 @@ class NetworkError extends StatelessWidget {
       body = Column(
         children: [
           const Appbar(title: Text("")),
-          Expanded(
+          Expanded(child: body),
-            child: body,
-          )
         ],
       );
     }
-    return Material(
+    return Material(child: body);
-      child: body,
-    );
   }
 }
 
@@ -89,9 +94,7 @@ class ListLoadingIndicator extends StatelessWidget {
     return const SizedBox(
       width: double.infinity,
       height: 80,
-      child: Center(
+      child: Center(child: FiveDotLoadingAnimation()),
-        child: FiveDotLoadingAnimation(),
-      ),
     );
   }
 }
@@ -103,10 +106,9 @@ class SliverListLoadingIndicator extends StatelessWidget {
   Widget build(BuildContext context) {
     // SliverToBoxAdapter can not been lazy loaded.
     // Use SliverList to make sure the animation can be lazy loaded.
-    return SliverList.list(children: const [
+    return SliverList.list(
-      SizedBox(),
+      children: const [SizedBox(), ListLoadingIndicator()],
-      ListLoadingIndicator(),
+    );
-    ]);
   }
 }
 
@@ -127,7 +129,7 @@ abstract class LoadingState<T extends StatefulWidget, S extends Object>
       if (res.success) {
         return res;
       } else {
-        if(!mounted) return res;
+        if (!mounted) return res;
         if (retry >= 3) {
           return res;
         }
@@ -173,10 +175,7 @@ abstract class LoadingState<T extends StatefulWidget, S extends Object>
   }
 
   Widget buildError() {
-    return NetworkError(
+    return NetworkError(message: error!, retry: retry);
-      message: error!,
-      retry: retry,
-    );
   }
 
   @override
@@ -185,7 +184,7 @@ abstract class LoadingState<T extends StatefulWidget, S extends Object>
     isLoading = true;
     Future.microtask(() {
       loadDataWithRetry().then((value) async {
-        if(!mounted) return;
+        if (!mounted) return;
         if (value.success) {
           data = value.data;
           await onDataLoaded();
@@ -318,21 +317,7 @@ abstract class MultiPageLoadingState<T extends StatefulWidget, S extends Object>
   }
 
   Widget buildError(BuildContext context, String error) {
-    return Center(
+    return NetworkError(withAppbar: false, message: error, retry: reset);
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
-        children: [
-          Text(error, maxLines: 3),
-          const SizedBox(height: 12),
-          Button.outlined(
-            onPressed: () {
-              reset();
-            },
-            child: const Text("Retry"),
-          )
-        ],
-      ),
-    ).paddingHorizontal(16);
   }
 
   @override
@@ -393,7 +378,7 @@ class _FiveDotLoadingAnimationState extends State<FiveDotLoadingAnimation>
     Colors.green,
     Colors.blue,
     Colors.yellow,
-    Colors.purple
+    Colors.purple,
   ];
 
   static const _padding = 12.0;
@@ -410,11 +395,10 @@ class _FiveDotLoadingAnimationState extends State<FiveDotLoadingAnimation>
         return SizedBox(
           width: _dotSize * 5 + _padding * 6,
           height: _height,
-            child: Stack(
+          child: Stack(children: List.generate(5, (index) => buildDot(index))),
-              children: List.generate(5, (index) => buildDot(index)),
+        );
-            ),
+      },
     );
-        });
   }
 
   Widget buildDot(int index) {
@@ -422,7 +406,8 @@ class _FiveDotLoadingAnimationState extends State<FiveDotLoadingAnimation>
     var startValue = index * 0.8;
     return Positioned(
       left: index * _dotSize + (index + 1) * _padding,
-      bottom: (math.sin(math.pi / 2 * (value - startValue).clamp(0, 2))) *
+      bottom:
+          (math.sin(math.pi / 2 * (value - startValue).clamp(0, 2))) *
           (_height - _dotSize),
       child: Container(
         width: _dotSize,

lib/components/menu.dart

@@ -61,7 +61,7 @@ class _MenuRoute<T> extends PopupRoute<T> {
             child: BlurEffect(
               borderRadius: BorderRadius.circular(4),
               child: Material(
-                color: context.colorScheme.surface.toOpacity(0.78),
+                color: context.colorScheme.surface.toOpacity(0.92),
                 borderRadius: BorderRadius.circular(4),
                 child: Container(
                   width: width,

lib/components/message.dart

@@ -125,11 +125,11 @@ class OverlayWidgetState extends State<OverlayWidget> {
 void showDialogMessage(BuildContext context, String title, String message) {
   showDialog(
     context: context,
-    builder: (context) => AlertDialog(
+    builder: (context) => ContentDialog(
-      title: Text(title),
+      title: title,
-      content: Text(message),
+      content: Text(message).paddingHorizontal(16),
       actions: [
-        TextButton(
+        FilledButton(
           onPressed: context.pop,
           child: Text("OK".tl),
         )
@@ -168,7 +168,15 @@ Future<void> showConfirmDialog({
 }
 
 class LoadingDialogController {
-  void Function()? closeDialog;
+  double? _progress;
+
+  String? _message;
+
+  void Function()? _closeDialog;
+
+  void Function(double? value)? _serProgress;
+
+  void Function(String message)? _setMessage;
 
   bool closed = false;
 
@@ -177,63 +185,86 @@ class LoadingDialogController {
       return;
     }
     closed = true;
-    if (closeDialog == null) {
+    if (_closeDialog == null) {
-      Future.microtask(closeDialog!);
+      Future.microtask(_closeDialog!);
     } else {
-      closeDialog!();
+      _closeDialog!();
     }
   }
+
+  void setProgress(double? value) {
+    if (closed) {
+      return;
+    }
+    _serProgress?.call(value);
+  }
+
+  void setMessage(String message) {
+    if (closed) {
+      return;
+    }
+    _setMessage?.call(message);
+  }
 }
 
-LoadingDialogController showLoadingDialog(BuildContext context,
+LoadingDialogController showLoadingDialog(
-    {void Function()? onCancel,
+  BuildContext context, {
+  void Function()? onCancel,
   bool barrierDismissible = true,
   bool allowCancel = true,
   String? message,
-    String cancelButtonText = "Cancel"}) {
+  String cancelButtonText = "Cancel",
+  bool withProgress = false,
+}) {
   var controller = LoadingDialogController();
+  controller._message = message;
+
+  if (withProgress) {
+    controller._progress = 0;
+  }
 
   var loadingDialogRoute = DialogRoute(
     context: context,
     barrierDismissible: barrierDismissible,
     builder: (BuildContext context) {
-        return Dialog(
+      return StatefulBuilder(builder: (context, setState) {
-          child: Container(
+        controller._serProgress = (value) {
-            width: 100,
+          setState(() {
-            padding: const EdgeInsets.all(16.0),
+            controller._progress = value;
-            child: Row(
+          });
-              children: [
+        };
-                const SizedBox(
+        controller._setMessage = (message) {
-                  width: 30,
+          setState(() {
-                  height: 30,
+            controller._message = message;
-                  child: CircularProgressIndicator(),
+          });
-                ),
+        };
-                const SizedBox(
+        return ContentDialog(
-                  width: 16,
+          title: controller._message ?? 'Loading',
-                ),
+          content: LinearProgressIndicator(
-                Text(
+            value: controller._progress,
-                  message ?? 'Loading',
+            backgroundColor: context.colorScheme.surfaceContainer,
-                  style: const TextStyle(fontSize: 16),
+          ).paddingHorizontal(16).paddingVertical(16),
-                ),
+          actions: [
-                const Spacer(),
+            FilledButton(
-                if (allowCancel)
+              onPressed: allowCancel
-                  TextButton(
+                  ? () {
-                      onPressed: () {
                       controller.close();
                       onCancel?.call();
-                      },
+                    }
-                      child: Text(cancelButtonText.tl))
+                  : null,
+              child: Text(cancelButtonText.tl),
+            )
           ],
-            ),
-          ),
         );
       });
+    },
+  );
 
   var navigator = Navigator.of(context, rootNavigator: true);
 
   navigator.push(loadingDialogRoute).then((value) => controller.closed = true);
 
-  controller.closeDialog = () {
+  controller._closeDialog = () {
     navigator.removeRoute(loadingDialogRoute);
   };
 
@@ -259,7 +290,8 @@ class ContentDialog extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    var content = Column(
+    var content = SingleChildScrollView(
+      child: Column(
         mainAxisSize: MainAxisSize.min,
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
@@ -281,6 +313,7 @@ class ContentDialog extends StatelessWidget {
           ).paddingRight(12),
           const SizedBox(height: 16),
         ],
+      ),
     );
     return Dialog(
       shape: RoundedRectangleBorder(
@@ -326,6 +359,7 @@ Future<void> showInputDialog({
   String confirmText = "Confirm",
   String cancelText = "Cancel",
   RegExp? inputValidator,
+  String? image,
 }) {
   var controller = TextEditingController(text: initialValue);
   bool isLoading = false;
@@ -338,7 +372,14 @@ Future<void> showInputDialog({
         builder: (context, setState) {
           return ContentDialog(
             title: title,
-            content: TextField(
+            content: Column(
+              children: [
+                if (image != null)
+                  SizedBox(
+                    height: 108,
+                    child: Image.network(image, fit: BoxFit.none),
+                  ).paddingBottom(8),
+                TextField(
                   controller: controller,
                   decoration: InputDecoration(
                     hintText: hintText,
@@ -346,6 +387,8 @@ Future<void> showInputDialog({
                     errorText: error,
                   ),
                 ).paddingHorizontal(12),
+              ],
+            ),
             actions: [
               Button.filled(
                 isLoading: isLoading,
@@ -402,3 +445,57 @@ void showInfoDialog({
     },
   );
 }
+
+Future<int?> showSelectDialog({
+  required String title,
+  required List<String> options,
+  int? initialIndex,
+}) async {
+  int? current = initialIndex;
+
+  await showDialog(
+    context: App.rootContext,
+    builder: (context) {
+      return StatefulBuilder(
+        builder: (context, setState) {
+          return ContentDialog(
+            title: title,
+            content: Padding(
+              padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
+              child: Row(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Select(
+                    current: current == null ? "" : options[current!],
+                    values: options,
+                    minWidth: 156,
+                    onTap: (i) {
+                      setState(() {
+                        current = i;
+                      });
+                    },
+                  )
+                ],
+              ),
+            ),
+            actions: [
+              TextButton(
+                onPressed: () {
+                  current = null;
+                  context.pop();
+                },
+                child: Text('Cancel'.tl),
+              ),
+              FilledButton(
+                onPressed: current == null ? null : context.pop,
+                child: Text('Confirm'.tl),
+              ),
+            ],
+          );
+        },
+      );
+    },
+  );
+
+  return current;
+}

lib/components/scroll.dart

@@ -51,10 +51,32 @@ class _SmoothScrollProviderState extends State<SmoothScrollProvider> {
 
   static bool _isMouseScroll = App.isDesktop;
 
+  late int id;
+
+  static int _id = 0;
+
+  var activeChildren = <int>{};
+
+  ScrollState? parent;
+
   @override
   void initState() {
     _controller = widget.controller ?? ScrollController();
     super.initState();
+    id = _id;
+    _id++;
+  }
+
+  @override
+  void didChangeDependencies() {
+    parent = ScrollState.maybeOf(context);
+    super.didChangeDependencies();
+  }
+
+  @override
+  void dispose() {
+    parent?.onChildInactive(id);
+    super.dispose();
   }
 
   @override
@@ -66,8 +88,7 @@ class _SmoothScrollProviderState extends State<SmoothScrollProvider> {
         const BouncingScrollPhysics(),
       );
     }
-    return Listener(
+    var child = Listener(
-      behavior: HitTestBehavior.translucent,
       onPointerDown: (event) {
         _futurePosition = null;
         if (_isMouseScroll) {
@@ -77,6 +98,9 @@ class _SmoothScrollProviderState extends State<SmoothScrollProvider> {
         }
       },
       onPointerSignal: (pointerSignal) {
+        if (activeChildren.isNotEmpty) {
+          return;
+        }
         if (pointerSignal is PointerScrollEvent) {
           if (HardwareKeyboard.instance.isShiftPressed) {
             return;
@@ -93,17 +117,43 @@ class _SmoothScrollProviderState extends State<SmoothScrollProvider> {
           _futurePosition ??= currentLocation;
           double k = (_futurePosition! - currentLocation).abs() / 1600 + 1;
           _futurePosition = _futurePosition! + pointerSignal.scrollDelta.dy * k;
+          var beforeOffset = (_futurePosition! - currentLocation).abs();
           _futurePosition = _futurePosition!.clamp(
             _controller.position.minScrollExtent,
             _controller.position.maxScrollExtent,
           );
+          var afterOffset = (_futurePosition! - currentLocation).abs();
           if (_futurePosition == old) return;
-          _controller.animateTo(_futurePosition!,
+          var target = _futurePosition!;
-              duration: _fastAnimationDuration, curve: Curves.linear);
+          var duration = _fastAnimationDuration;
+          if (afterOffset < beforeOffset) {
+            duration = duration * (afterOffset / beforeOffset);
+            if (duration < Duration(milliseconds: 10)) {
+              duration = Duration(milliseconds: 10);
+            }
+          }
+          _controller
+              .animateTo(
+            _futurePosition!,
+            duration: duration,
+            curve: Curves.linear,
+          )
+              .then((_) {
+            var current = _controller.position.pixels;
+            if (current == target && current == _futurePosition) {
+              _futurePosition = null;
+            }
+          });
         }
       },
-      child: ScrollControllerProvider._(
+      child: ScrollState._(
         controller: _controller,
+        onChildActive: (id) {
+          activeChildren.add(id);
+        },
+        onChildInactive: (id) {
+          activeChildren.remove(id);
+        },
         child: widget.builder(
           context,
           _controller,
@@ -113,25 +163,215 @@ class _SmoothScrollProviderState extends State<SmoothScrollProvider> {
         ),
       ),
     );
+
+    if (parent != null) {
+      return MouseRegion(
+        onEnter: (_) {
+          parent!.onChildActive(id);
+        },
+        onExit: (_) {
+          parent!.onChildInactive(id);
+        },
+        child: child,
+      );
+    }
+
+    return child;
   }
 }
 
-class ScrollControllerProvider extends InheritedWidget {
+class ScrollState extends InheritedWidget {
-  const ScrollControllerProvider._({
+  const ScrollState._({
     required this.controller,
     required super.child,
+    required this.onChildActive,
+    required this.onChildInactive,
   });
 
   final ScrollController controller;
 
-  static ScrollController of(BuildContext context) {
+  final void Function(int id) onChildActive;
-    final ScrollControllerProvider? provider =
+
-        context.dependOnInheritedWidgetOfExactType<ScrollControllerProvider>();
+  final void Function(int id) onChildInactive;
-    return provider!.controller;
+
+  static ScrollState of(BuildContext context) {
+    final ScrollState? provider =
+        context.dependOnInheritedWidgetOfExactType<ScrollState>();
+    return provider!;
+  }
+
+  static ScrollState? maybeOf(BuildContext context) {
+    return context.dependOnInheritedWidgetOfExactType<ScrollState>();
   }
 
   @override
-  bool updateShouldNotify(ScrollControllerProvider oldWidget) {
+  bool updateShouldNotify(ScrollState oldWidget) {
     return oldWidget.controller != controller;
   }
 }
+
+class AppScrollBar extends StatefulWidget {
+  const AppScrollBar({
+    super.key,
+    required this.controller,
+    required this.child,
+    this.topPadding = 0,
+  });
+
+  final ScrollController controller;
+
+  final Widget child;
+
+  final double topPadding;
+
+  @override
+  State<AppScrollBar> createState() => _AppScrollBarState();
+}
+
+class _AppScrollBarState extends State<AppScrollBar> {
+  late final ScrollController _scrollController;
+
+  double minExtent = 0;
+  double maxExtent = 0;
+  double position = 0;
+
+  double viewHeight = 0;
+
+  final _scrollIndicatorSize = App.isDesktop ? 42.0 : 64.0;
+
+  late final VerticalDragGestureRecognizer _dragGestureRecognizer;
+
+  @override
+  void initState() {
+    super.initState();
+    _scrollController = widget.controller;
+    _scrollController.addListener(onChanged);
+    Future.microtask(onChanged);
+    _dragGestureRecognizer = VerticalDragGestureRecognizer()
+      ..onUpdate = onUpdate;
+  }
+
+  void onUpdate(DragUpdateDetails details) {
+    if (maxExtent - minExtent <= 0 ||
+        viewHeight == 0 ||
+        details.primaryDelta == null) {
+      return;
+    }
+    var offset = details.primaryDelta!;
+    var positionOffset =
+        offset / (viewHeight - _scrollIndicatorSize) * (maxExtent - minExtent);
+    _scrollController.jumpTo((position + positionOffset).clamp(
+      minExtent,
+      maxExtent,
+    ));
+  }
+
+  void onChanged() {
+    if (_scrollController.positions.isEmpty) return;
+    var position = _scrollController.position;
+    if (position.minScrollExtent != minExtent ||
+        position.maxScrollExtent != maxExtent ||
+        position.pixels != this.position) {
+      setState(() {
+        minExtent = position.minScrollExtent;
+        maxExtent = position.maxScrollExtent;
+        this.position = position.pixels;
+      });
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constrains) {
+        var scrollHeight = (maxExtent - minExtent);
+        var height = constrains.maxHeight - widget.topPadding;
+        viewHeight = height;
+        var top = scrollHeight == 0
+            ? 0.0
+            : (position - minExtent) /
+                scrollHeight *
+                (height - _scrollIndicatorSize);
+        return Stack(
+          children: [
+            Positioned.fill(
+              child: widget.child,
+            ),
+            Positioned(
+              top: top + widget.topPadding,
+              right: 0,
+              child: MouseRegion(
+                cursor: SystemMouseCursors.click,
+                child: Listener(
+                  behavior: HitTestBehavior.translucent,
+                  onPointerDown: (event) {
+                    _dragGestureRecognizer.addPointer(event);
+                  },
+                  child: SizedBox(
+                    width: _scrollIndicatorSize/2,
+                    height: _scrollIndicatorSize,
+                    child: CustomPaint(
+                      painter: _ScrollIndicatorPainter(
+                        backgroundColor: context.colorScheme.surface,
+                        shadowColor: context.colorScheme.shadow,
+                      ),
+                      child: Column(
+                        children: [
+                          const Spacer(),
+                          Icon(Icons.arrow_drop_up, size: 18),
+                          Icon(Icons.arrow_drop_down, size: 18),
+                          const Spacer(),
+                        ],
+                      ).paddingLeft(4),
+                    ),
+                  ),
+                ),
+              ),
+            ),
+          ],
+        );
+      },
+    );
+  }
+}
+
+class _ScrollIndicatorPainter extends CustomPainter {
+  final Color backgroundColor;
+
+  final Color shadowColor;
+
+  const _ScrollIndicatorPainter({
+    required this.backgroundColor,
+    required this.shadowColor,
+  });
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    var path = Path()
+      ..moveTo(size.width, 0)
+      ..lineTo(size.width, size.height)
+      ..arcToPoint(
+        Offset(size.width, 0),
+        radius: Radius.circular(size.width),
+      );
+    canvas.drawShadow(path, shadowColor, 4, true);
+    var backgroundPaint = Paint()
+      ..color = backgroundColor
+      ..style = PaintingStyle.fill;
+    path = Path()
+      ..moveTo(size.width, 0)
+      ..lineTo(size.width, size.height)
+      ..arcToPoint(
+        Offset(size.width, 0),
+        radius: Radius.circular(size.width),
+      );
+    canvas.drawPath(path, backgroundPaint);
+  }
+
+  @override
+  bool shouldRepaint(covariant CustomPainter oldDelegate) {
+    return oldDelegate is! _ScrollIndicatorPainter ||
+        oldDelegate.backgroundColor != backgroundColor ||
+        oldDelegate.shadowColor != shadowColor;
+  }
+}

lib/components/side_bar.dart

@@ -1,15 +1,13 @@
 part of 'components.dart';
 
 class SideBarRoute<T> extends PopupRoute<T> {
-  SideBarRoute(this.title, this.widget,
+  SideBarRoute(this.widget,
       {this.showBarrier = true,
       this.useSurfaceTintColor = false,
       required this.width,
       this.addBottomPadding = true,
       this.addTopPadding = true});
 
-  final String? title;
-
   final Widget widget;
 
   final bool showBarrier;
@@ -36,11 +34,7 @@ class SideBarRoute<T> extends PopupRoute<T> {
       Animation<double> secondaryAnimation) {
     bool showSideBar = MediaQuery.of(context).size.width > width;
 
-    Widget body = SidebarBody(
+    Widget body = widget;
-      title: title,
-      widget: widget,
-      autoChangeTitleBarColor: !useSurfaceTintColor,
-    );
 
     if (addTopPadding) {
       body = Padding(
@@ -129,97 +123,13 @@ class SideBarRoute<T> extends PopupRoute<T> {
   }
 }
 
-class SidebarBody extends StatefulWidget {
-  const SidebarBody(
-      {required this.title,
-      required this.widget,
-      required this.autoChangeTitleBarColor,
-      super.key});
-
-  final String? title;
-  final Widget widget;
-  final bool autoChangeTitleBarColor;
-
-  @override
-  State<SidebarBody> createState() => _SidebarBodyState();
-}
-
-class _SidebarBodyState extends State<SidebarBody> {
-  bool top = true;
-
-  @override
-  Widget build(BuildContext context) {
-    Widget body = Expanded(child: widget.widget);
-
-    if (widget.autoChangeTitleBarColor) {
-      body = NotificationListener<ScrollNotification>(
-        onNotification: (notifications) {
-          if (notifications.metrics.pixels ==
-                  notifications.metrics.minScrollExtent &&
-              !top) {
-            setState(() {
-              top = true;
-            });
-          } else if (notifications.metrics.pixels !=
-                  notifications.metrics.minScrollExtent &&
-              top) {
-            setState(() {
-              top = false;
-            });
-          }
-          return false;
-        },
-        child: body,
-      );
-    }
-
-    return Column(
-      children: [
-        if (widget.title != null)
-          Container(
-            height: 60 + MediaQuery.of(context).padding.top,
-            color: top
-                ? null
-                : Theme.of(context).colorScheme.surfaceTint.withAlpha(20),
-            padding: EdgeInsets.only(top: MediaQuery.of(context).padding.top),
-            child: Row(
-              children: [
-                const SizedBox(
-                  width: 8,
-                ),
-                Tooltip(
-                  message: "Back".tl,
-                  child: IconButton(
-                    iconSize: 25,
-                    icon: const Icon(Icons.arrow_back),
-                    onPressed: () => Navigator.of(context).pop(),
-                  ),
-                ),
-                const SizedBox(
-                  width: 10,
-                ),
-                Text(
-                  widget.title!,
-                  style: const TextStyle(fontSize: 22),
-                )
-              ],
-            ),
-          ),
-        body
-      ],
-    );
-  }
-}
-
 Future<void> showSideBar(BuildContext context, Widget widget,
-    {String? title,
+    {bool showBarrier = true,
-    bool showBarrier = true,
     bool useSurfaceTintColor = false,
     double width = 500,
     bool addTopPadding = false}) {
   return Navigator.of(context).push(
     SideBarRoute(
-      title,
       widget,
       showBarrier: showBarrier,
       useSurfaceTintColor: useSurfaceTintColor,

lib/components/window_frame.dart

@@ -6,61 +6,102 @@ import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
-import 'package:venera/foundation/state_controller.dart';
 import 'package:window_manager/window_manager.dart';
 
 const _kTitleBarHeight = 36.0;
 
-class WindowFrameController extends StateController {
+class WindowFrameController extends InheritedWidget {
-  bool useDarkTheme = false;
+  /// Whether the window frame is hidden.
+  final bool isWindowFrameHidden;
 
-  bool isHideWindowFrame = false;
+  /// Sets the visibility of the window frame.
+  final void Function(bool) setWindowFrame;
 
-  void setDarkTheme() {
+  /// Adds a listener that will be called when close button is clicked.
-    useDarkTheme = true;
+  /// The listener should return `true` to allow the window to be closed.
-    update();
+  final void Function(WindowCloseListener listener) addCloseListener;
-  }
 
-  void resetTheme() {
+  /// Removes a close listener.
-    useDarkTheme = false;
+  final void Function(WindowCloseListener listener) removeCloseListener;
-    update();
-  }
 
-  VoidCallback openSideBar = () {};
+  const WindowFrameController._create({
+    required this.isWindowFrameHidden,
+    required this.setWindowFrame,
+    required this.addCloseListener,
+    required this.removeCloseListener,
+    required super.child,
+  });
 
-  void hideWindowFrame() {
+  @override
-    isHideWindowFrame = true;
+  bool updateShouldNotify(covariant InheritedWidget oldWidget) {
-    update();
+    return false;
-  }
-
-  void showWindowFrame() {
-    isHideWindowFrame = false;
-    update();
   }
 }
 
-class WindowFrame extends StatelessWidget {
+class WindowFrame extends StatefulWidget {
   const WindowFrame(this.child, {super.key});
 
   final Widget child;
 
   @override
-  Widget build(BuildContext context) {
+  State<WindowFrame> createState() => _WindowFrameState();
-    StateController.putIfNotExists<WindowFrameController>(
-        WindowFrameController());
-    if (App.isMobile) return child;
-    return StateBuilder<WindowFrameController>(builder: (controller) {
-      if (controller.isHideWindowFrame) return child;
 
-      var body = Stack(
+  static WindowFrameController of(BuildContext context) {
+    return context.dependOnInheritedWidgetOfExactType<WindowFrameController>()!;
+  }
+}
+
+typedef WindowCloseListener = bool Function();
+
+class _WindowFrameState extends State<WindowFrame> {
+  bool isWindowFrameHidden = false;
+  bool useDarkTheme = false;
+  var closeListeners = <WindowCloseListener>[];
+
+  /// Sets the visibility of the window frame.
+  void setWindowFrame(bool show) {
+    setState(() {
+      isWindowFrameHidden = !show;
+    });
+  }
+
+  /// Adds a listener that will be called when close button is clicked.
+  /// The listener should return `true` to allow the window to be closed.
+  void addCloseListener(WindowCloseListener listener) {
+    closeListeners.add(listener);
+  }
+
+  /// Removes a close listener.
+  void removeCloseListener(WindowCloseListener listener) {
+    closeListeners.remove(listener);
+  }
+
+  void _onClose() {
+    for (var listener in closeListeners) {
+      if (!listener()) {
+        return;
+      }
+    }
+    exit(0);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    if (App.isMobile) return widget.child;
+
+    Widget body = Stack(
       children: [
         Positioned.fill(
           child: MediaQuery(
             data: MediaQuery.of(context).copyWith(
-                  padding: const EdgeInsets.only(top: _kTitleBarHeight)),
+              padding: isWindowFrameHidden
-              child: child,
+                  ? null
+                  : const EdgeInsets.only(top: _kTitleBarHeight),
+            ),
+            child: widget.child,
           ),
         ),
+        if (!isWindowFrameHidden)
           Positioned(
             top: 0,
             left: 0,
@@ -69,7 +110,7 @@ class WindowFrame extends StatelessWidget {
               color: Colors.transparent,
               child: Theme(
                 data: Theme.of(context).copyWith(
-                  brightness: controller.useDarkTheme ? Brightness.dark : null,
+                  brightness: useDarkTheme ? Brightness.dark : null,
                 ),
                 child: Builder(builder: (context) {
                   return SizedBox(
@@ -91,12 +132,14 @@ class WindowFrame extends StatelessWidget {
                               'Venera',
                               style: TextStyle(
                                 fontSize: 13,
-                                color: (controller.useDarkTheme ||
+                                color: (useDarkTheme ||
                                         context.brightness == Brightness.dark)
                                     ? Colors.white
                                     : Colors.black,
                               ),
-                            ).toAlign(Alignment.centerLeft).paddingLeft(4+(App.isMacOS?25:0)),
+                            )
+                                .toAlign(Alignment.centerLeft)
+                                .paddingLeft(4 + (App.isMacOS ? 25 : 0)),
                           ),
                         ),
                         if (kDebugMode)
@@ -104,7 +147,10 @@ class WindowFrame extends StatelessWidget {
                             onPressed: debug,
                             child: Text('Debug'),
                           ),
-                        if (!App.isMacOS) const WindowButtons()
+                        if (!App.isMacOS)
+                          _WindowButtons(
+                            onClose: _onClose,
+                          )
                       ],
                     ),
                   );
@@ -116,66 +162,29 @@ class WindowFrame extends StatelessWidget {
     );
 
     if (App.isLinux) {
-        return VirtualWindowFrame(child: body);
+      body = VirtualWindowFrame(child: body);
-      } else {
-        return body;
-      }
-    });
     }
 
-  Widget buildMenuButton(
+    return WindowFrameController._create(
-      WindowFrameController controller, BuildContext context) {
+      isWindowFrameHidden: isWindowFrameHidden,
-    return InkWell(
+      setWindowFrame: setWindowFrame,
-        onTap: () {
+      addCloseListener: addCloseListener,
-          controller.openSideBar();
+      removeCloseListener: removeCloseListener,
-        },
+      child: body,
-        child: SizedBox(
+    );
-          width: 42,
-          height: double.infinity,
-          child: Center(
-            child: CustomPaint(
-              size: const Size(18, 20),
-              painter: _MenuPainter(
-                  color: (controller.useDarkTheme ||
-                          Theme.of(context).brightness == Brightness.dark)
-                      ? Colors.white
-                      : Colors.black),
-            ),
-          ),
-        ));
   }
 }
 
-class _MenuPainter extends CustomPainter {
+class _WindowButtons extends StatefulWidget {
-  final Color color;
+  const _WindowButtons({required this.onClose});
 
-  _MenuPainter({this.color = Colors.black});
+  final void Function() onClose;
 
   @override
-  void paint(Canvas canvas, Size size) {
+  State<_WindowButtons> createState() => _WindowButtonsState();
-    final paint = getPaint(color);
-    final path = Path()
-      ..moveTo(0, size.height / 4)
-      ..lineTo(size.width, size.height / 4)
-      ..moveTo(0, size.height / 4 * 2)
-      ..lineTo(size.width, size.height / 4 * 2)
-      ..moveTo(0, size.height / 4 * 3)
-      ..lineTo(size.width, size.height / 4 * 3);
-    canvas.drawPath(path, paint);
-  }
-
-  @override
-  bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
 }
 
-class WindowButtons extends StatefulWidget {
+class _WindowButtonsState extends State<_WindowButtons> with WindowListener {
-  const WindowButtons({super.key});
-
-  @override
-  State<WindowButtons> createState() => _WindowButtonsState();
-}
-
-class _WindowButtonsState extends State<WindowButtons> with WindowListener {
   bool isMaximized = false;
 
   @override
@@ -264,9 +273,7 @@ class _WindowButtonsState extends State<WindowButtons> with WindowListener {
               color: !dark ? Colors.white : Colors.black,
             ),
             hoverColor: Colors.red,
-            onPressed: () {
+            onPressed: widget.onClose,
-              windowManager.close();
-            },
           )
         ],
       ),
@@ -489,7 +496,7 @@ class WindowPlacement {
 
   static Future<WindowPlacement> get current async {
     var rect = await windowManager.getBounds();
-    if(validate(rect)) {
+    if (validate(rect)) {
       lastValidRect = rect;
     } else {
       rect = lastValidRect ?? defaultPlacement.rect;
@@ -553,22 +560,18 @@ class _VirtualWindowFrameState extends State<VirtualWindowFrame>
   }
 
   Widget _buildVirtualWindowFrame(BuildContext context) {
-    return DecoratedBox(
+    return Container(
       decoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(_isMaximized ? 0 : 8),
         color: Colors.transparent,
-        border: Border.all(
-          color: Theme.of(context).dividerColor,
-          width: (_isMaximized || _isFullScreen) ? 0 : 1,
-        ),
         boxShadow: <BoxShadow>[
-          if (!_isMaximized && !_isFullScreen)
           BoxShadow(
-              color: Colors.black.toOpacity(0.1),
+            color: Colors.black.toOpacity(_isFocused ? 0.4 : 0.2),
-              offset: Offset(0.0, _isFocused ? 4 : 2),
+            blurRadius: 4,
-              blurRadius: 6,
           )
         ],
       ),
+      clipBehavior: Clip.antiAlias,
       child: widget.child,
     );
   }
@@ -577,7 +580,10 @@ class _VirtualWindowFrameState extends State<VirtualWindowFrame>
   Widget build(BuildContext context) {
     return DragToResizeArea(
       enableResizeEdges: (_isMaximized || _isFullScreen) ? [] : null,
+      child: Padding(
+        padding: EdgeInsets.all(_isMaximized ? 0 : 4),
         child: _buildVirtualWindowFrame(context),
+      ),
     );
   }
 
@@ -634,5 +640,5 @@ TransitionBuilder VirtualWindowFrameInit() {
 }
 
 void debug() {
-  ComicSource.reload();
+  ComicSourceManager().reload();
 }

lib/foundation/app.dart

@@ -3,14 +3,17 @@ import 'dart:ui';
 
 import 'package:flutter/material.dart';
 import 'package:path_provider/path_provider.dart';
+import 'package:venera/foundation/history.dart';
 
 import 'appdata.dart';
+import 'favorites.dart';
+import 'local.dart';
 
 export "widget_utils.dart";
 export "context.dart";
 
 class _App {
-  final version = "1.2.0";
+  final version = "1.4.6";
 
   bool get isAndroid => Platform.isAndroid;
 
@@ -44,6 +47,7 @@ class _App {
 
   late String dataPath;
   late String cachePath;
+  String? externalStoragePath;
 
   final rootNavigatorKey = GlobalKey<NavigatorState>();
 
@@ -51,8 +55,16 @@ class _App {
 
   BuildContext get rootContext => rootNavigatorKey.currentContext!;
 
+  final Appdata data = appdata;
+
+  final HistoryManager history = HistoryManager();
+
+  final LocalFavoritesManager favorites = LocalFavoritesManager();
+
+  final LocalManager local = LocalManager();
+
   void rootPop() {
-    rootNavigatorKey.currentState?.pop();
+    rootNavigatorKey.currentState?.maybePop();
   }
 
   void pop() {
@@ -66,6 +78,18 @@ class _App {
   Future<void> init() async {
     cachePath = (await getApplicationCacheDirectory()).path;
     dataPath = (await getApplicationSupportDirectory()).path;
+    if (isAndroid) {
+      externalStoragePath = (await getExternalStorageDirectory())!.path;
+    }
+  }
+
+  Future<void> initComponents() async {
+    await Future.wait([
+      data.init(),
+      history.init(),
+      favorites.init(),
+      local.init(),
+    ]);
   }
 
   Function? _forceRebuildHandler;

lib/foundation/appdata.dart

@@ -3,28 +3,32 @@ import 'dart:convert';
 import 'package:flutter/foundation.dart';
 import 'package:path_provider/path_provider.dart';
 import 'package:venera/foundation/app.dart';
+import 'package:venera/foundation/log.dart';
 import 'package:venera/utils/data_sync.dart';
+import 'package:venera/utils/init.dart';
 import 'package:venera/utils/io.dart';
 
-class _Appdata {
+class Appdata with Init {
-  final _Settings settings = _Settings();
+  Appdata._create();
+
+  final Settings settings = Settings._create();
 
   var searchHistory = <String>[];
 
   bool _isSavingData = false;
 
   Future<void> saveData([bool sync = true]) async {
-    if (_isSavingData) {
+    while (_isSavingData) {
-      await Future.doWhile(() async {
       await Future.delayed(const Duration(milliseconds: 20));
-        return _isSavingData;
-      });
     }
     _isSavingData = true;
+    try {
       var data = jsonEncode(toJson());
       var file = File(FilePath.join(App.dataPath, 'appdata.json'));
       await file.writeAsString(data);
+    } finally {
       _isSavingData = false;
+    }
     if (sync) {
       DataSync().uploadData();
     }
@@ -51,33 +55,8 @@ class _Appdata {
     saveData();
   }
 
-  Future<void> init() async {
-    var dataPath = (await getApplicationSupportDirectory()).path;
-    var file = File(FilePath.join(
-      dataPath,
-      'appdata.json',
-    ));
-    if (!await file.exists()) {
-      return;
-    }
-    var json = jsonDecode(await file.readAsString());
-    for (var key in (json['settings'] as Map<String, dynamic>).keys) {
-      if (json['settings'][key] != null) {
-        settings[key] = json['settings'][key];
-      }
-    }
-    searchHistory = List.from(json['searchHistory']);
-    var implicitDataFile = File(FilePath.join(dataPath, 'implicitData.json'));
-    if (await implicitDataFile.exists()) {
-      implicitData = jsonDecode(await implicitDataFile.readAsString());
-    }
-  }
-
   Map<String, dynamic> toJson() {
-    return {
+    return {'settings': settings._data, 'searchHistory': searchHistory};
-      'settings': settings._data,
-      'searchHistory': searchHistory,
-    };
   }
 
   /// Following fields are related to device-specific data and should not be synced.
@@ -90,28 +69,71 @@ class _Appdata {
 
   /// Sync data from another device
   void syncData(Map<String, dynamic> data) {
-    for (var key in data.keys) {
+    if (data['settings'] is Map) {
-      if (_disableSync.contains(key)) {
+      var settings = data['settings'] as Map<String, dynamic>;
-        continue;
+      for (var key in settings.keys) {
+        if (!_disableSync.contains(key)) {
+          this.settings[key] = settings[key];
         }
-      settings[key] = data[key];
       }
-    searchHistory = List.from(data['searchHistory']);
+    }
+    searchHistory = List.from(data['searchHistory'] ?? []);
     saveData();
   }
 
   var implicitData = <String, dynamic>{};
 
-  void writeImplicitData() {
+  void writeImplicitData() async {
+    while (_isSavingData) {
+      await Future.delayed(const Duration(milliseconds: 20));
+    }
+    _isSavingData = true;
+    try {
       var file = File(FilePath.join(App.dataPath, 'implicitData.json'));
-    file.writeAsString(jsonEncode(implicitData));
+      await file.writeAsString(jsonEncode(implicitData));
+    } finally {
+      _isSavingData = false;
+    }
+  }
+
+  @override
+  Future<void> doInit() async {
+    var dataPath = (await getApplicationSupportDirectory()).path;
+    var file = File(FilePath.join(dataPath, 'appdata.json'));
+    if (!await file.exists()) {
+      return;
+    }
+    try {
+      var json = jsonDecode(await file.readAsString());
+      for (var key in (json['settings'] as Map<String, dynamic>).keys) {
+        if (json['settings'][key] != null) {
+          settings[key] = json['settings'][key];
+        }
+      }
+      searchHistory = List.from(json['searchHistory']);
+    } catch (e) {
+      Log.error("Appdata", "Failed to load appdata", e);
+      Log.info("Appdata", "Resetting appdata");
+      file.deleteIgnoreError();
+    }
+    try {
+      var implicitDataFile = File(FilePath.join(dataPath, 'implicitData.json'));
+      if (await implicitDataFile.exists()) {
+        implicitData = jsonDecode(await implicitDataFile.readAsString());
+      }
+    } catch (e) {
+      Log.error("Appdata", "Failed to load implicit data", e);
+      Log.info("Appdata", "Resetting implicit data");
+      var implicitDataFile = File(FilePath.join(dataPath, 'implicitData.json'));
+      implicitDataFile.deleteIgnoreError();
+    }
   }
 }
 
-final appdata = _Appdata();
+final appdata = Appdata._create();
 
-class _Settings with ChangeNotifier {
+class Settings with ChangeNotifier {
-  _Settings();
+  Settings._create();
 
   final _data = <String, dynamic>{
     'comicDisplayMode': 'detailed', // detailed, brief
@@ -124,19 +146,24 @@ class _Settings with ChangeNotifier {
     'explore_pages': [],
     'categories': [],
     'favorites': [],
+    'searchSources': null,
     'showFavoriteStatusOnTile': true,
     'showHistoryStatusOnTile': false,
     'blockedWords': [],
     'defaultSearchTarget': null,
     'autoPageTurningInterval': 5, // in seconds
+    'enableComicSpecificSettings': false,
     'readerMode': 'galleryLeftToRight', // values of [ReaderMode]
-    'readerScreenPicNumber': 1, // 1 - 5
+    'readerScreenPicNumberForLandscape': 1, // 1 - 5
+    'readerScreenPicNumberForPortrait': 1, // 1 - 5
     'enableTapToTurnPages': true,
+    'reverseTapToTurnPages': false,
     'enablePageAnimation': true,
     'language': 'system', // system, zh-CN, zh-TW, en-US
     'cacheSize': 2048, // in MB
     'downloadThreads': 5,
     'enableLongPressToZoom': true,
+    'longPressZoomPosition': "press", // press, center
     'checkUpdateOnStart': false,
     'limitImageWidth': true,
     'webdav': [], // empty means not configured
@@ -153,6 +180,17 @@ class _Settings with ChangeNotifier {
     'customImageProcessing': defaultCustomImageProcessing,
     'sni': true,
     'autoAddLanguageFilter': 'none', // none, chinese, english, japanese
+    'comicSourceListUrl': _defaultSourceListUrl,
+    'preloadImageCount': 4,
+    'followUpdatesFolder': null,
+    'initialPage': '0',
+    'comicListDisplayMode': 'paging', // paging, continuous
+    'showPageNumberInReader': true,
+    'showSingleImageOnFirstPage': false,
+    'enableDoubleTapToZoom': true,
+    'reverseChapterOrder': false,
+    'showSystemStatusBar': false,
+    'comicSpecificSettings': <String, Map<String, dynamic>>{},
   };
 
   operator [](String key) {
@@ -161,6 +199,62 @@ class _Settings with ChangeNotifier {
 
   operator []=(String key, dynamic value) {
     _data[key] = value;
+    if (key != "dataVersion") {
+      notifyListeners();
+    }
+  }
+
+  bool haveComicSpecificSettings(String comicId, String sourceKey, String key) {
+    return _data['comicSpecificSettings']?["$comicId@$sourceKey"]?.containsKey(
+          key,
+        ) ??
+        false;
+  }
+
+  dynamic getReaderSetting(String comicId, String sourceKey, String key) {
+    if (key == 'enableComicSpecificSettings') {
+      return _data['enableComicSpecificSettings'];
+    }
+    if (_data['enableComicSpecificSettings'] == false) {
+      return _data[key];
+    }
+    return _data['comicSpecificSettings']["$comicId@$sourceKey"]?[key] ??
+        _data[key];
+  }
+
+  void setReaderSetting(
+    String comicId,
+    String sourceKey,
+    String key,
+    dynamic value,
+  ) {
+    if (key == 'enableComicSpecificSettings') {
+      _data['enableComicSpecificSettings'] = value;
+      notifyListeners();
+      return;
+    }
+    if (_data['enableComicSpecificSettings'] == false) {
+      _data[key] = value;
+      notifyListeners();
+      return;
+    }
+    (_data['comicSpecificSettings'] as Map<String, dynamic>).putIfAbsent(
+      "$comicId@$sourceKey",
+      () => <String, dynamic>{},
+    )[key] = value;
+    notifyListeners();
+  }
+
+  void resetComicReaderSettings(String comicId, String sourceKey) {
+    final allComicSettings = _data['comicSpecificSettings'] as Map;
+    if (allComicSettings.containsKey("$comicId@$sourceKey")) {
+      allComicSettings.remove("$comicId@$sourceKey");
+    }
+    notifyListeners();
+  }
+
+  void resetAllComicReaderSettings() {
+    _data['comicSpecificSettings'] = <String, Map<String, dynamic>>{};
     notifyListeners();
   }
 
@@ -181,9 +275,12 @@ const defaultCustomImageProcessing = '''
  * @returns {Promise<ArrayBuffer> | {image: Promise<ArrayBuffer>, onCancel: () => void}} - The processed image
  */
 function processImage(image, cid, eid, page, sourceKey) {
-    let image = new Promise((resolve, reject) => {
+    let futureImage = new Promise((resolve, reject) => {
         resolve(image);
     });
-    return image;
+    return futureImage;
 }
 ''';
+
+const _defaultSourceListUrl =
+    "https://git.nyne.dev/nyne/venera-configs/raw/branch/main/index.json";

lib/foundation/cache_manager.dart

@@ -1,5 +1,7 @@
+import 'dart:ffi';
+import 'dart:isolate';
+
 import 'package:crypto/crypto.dart';
-import 'package:flutter/foundation.dart';
 import 'package:sqlite3/sqlite3.dart';
 import 'package:venera/utils/io.dart';
 
@@ -21,7 +23,52 @@ class CacheManager {
 
   int _limitSize = 2 * 1024 * 1024 * 1024;
 
-  CacheManager._create(){
+  static Future<int> _scanDir(Pointer<void> dbP, String dir) async {
+    var res = await Isolate.run(() async {
+      int totalSize = 0;
+      List<String> unmanagedFiles = [];
+      var db = sqlite3.fromPointer(dbP);
+      await for (var file in Directory(dir).list(recursive: true)) {
+        if (file is File) {
+          var size = await file.length();
+          var segments = file.uri.pathSegments;
+          var name = segments.last;
+          var dir = segments.elementAtOrNull(segments.length - 2) ?? "*";
+          var res = db.select('''
+            SELECT * FROM cache
+            WHERE dir = ? AND name = ?
+          ''', [dir, name]);
+          if (res.isEmpty) {
+            unmanagedFiles.add(file.path);
+          } else {
+            totalSize += size;
+          }
+        }
+      }
+      return {
+        'totalSize': totalSize,
+        'unmanagedFiles': unmanagedFiles,
+      };
+    });
+    // delete unmanaged files
+    // Only modify the database in the main isolate to avoid deadlock
+    for (var filePath in res['unmanagedFiles'] as List<String>) {
+      var file = File(filePath);
+      if (await file.exists()) {
+        await file.delete();
+      }
+      var segments = file.uri.pathSegments;
+      var name = segments.last;
+      var dir = segments.elementAtOrNull(segments.length - 2) ?? "*";
+      CacheManager()._db.execute('''
+        DELETE FROM cache
+        WHERE dir = ? AND name = ?
+      ''', [dir, name]);
+    }
+    return res['totalSize'] as int;
+  }
+
+  CacheManager._create() {
     Directory(cachePath).createSync(recursive: true);
     _db = sqlite3.open('${App.dataPath}/cache.db');
     _db.execute('''
@@ -33,100 +80,103 @@ class CacheManager {
         type TEXT
       )
     ''');
-    compute((path) => Directory(path).size, cachePath)
+    _scanDir(_db.handle, cachePath).then((value) {
-        .then((value) => _currentSize = value);
+      _currentSize = value;
+      checkCache();
+    });
   }
 
+  /// Get the singleton instance of CacheManager.
   factory CacheManager() => instance ??= CacheManager._create();
 
   /// set cache size limit in MB
-  void setLimitSize(int size){
+  void setLimitSize(int size) {
     _limitSize = size * 1024 * 1024;
   }
 
-  void setType(String key, String? type){
+  /// Write cache to disk.
-    _db.execute('''
+  Future<void> writeCache(String key, List<int> data,
-      UPDATE cache
+      [int duration = 7 * 24 * 60 * 60 * 1000]) async {
-      SET type = ?
+    await delete(key);
-      WHERE key = ?
-    ''', [type, key]);
-  }
-
-  String? getType(String key){
-    var res = _db.select('''
-      SELECT type FROM cache
-      WHERE key = ?
-    ''', [key]);
-    if(res.isEmpty){
-      return null;
-    }
-    return res.first[0];
-  }
-
-  Future<void> writeCache(String key, List<int> data, [int duration = 7 * 24 * 60 * 60 * 1000]) async{
     this.dir++;
     this.dir %= 100;
     var dir = this.dir;
-    var name = md5.convert(Uint8List.fromList(key.codeUnits)).toString();
+    var name = md5.convert(key.codeUnits).toString();
     var file = File('$cachePath/$dir/$name');
-    while(await file.exists()){
-      name = md5.convert(Uint8List.fromList(name.codeUnits)).toString();
-      file = File('$cachePath/$dir/$name');
-    }
     await file.create(recursive: true);
     await file.writeAsBytes(data);
     var expires = DateTime.now().millisecondsSinceEpoch + duration;
     _db.execute('''
       INSERT OR REPLACE INTO cache (key, dir, name, expires) VALUES (?, ?, ?, ?)
     ''', [key, dir.toString(), name, expires]);
-    if(_currentSize != null) {
+    if (_currentSize != null) {
       _currentSize = _currentSize! + data.length;
     }
     checkCacheIfRequired();
   }
 
-  Future<CachingFile> openWrite(String key) async{
+  /// Find cache by key.
-    this.dir++;
+  /// If cache is expired, it will be deleted and return null.
-    this.dir %= 100;
+  /// If cache is not found, it will return null.
-    var dir = this.dir;
+  /// If cache is found, it will return the file, and update the expires time.
-    var name = md5.convert(Uint8List.fromList(key.codeUnits)).toString();
+  Future<File?> findCache(String key) async {
-    var file = File('$cachePath/$dir/$name');
-    while(await file.exists()){
-      name = md5.convert(Uint8List.fromList(name.codeUnits)).toString();
-      file = File('$cachePath/$dir/$name');
-    }
-    await file.create(recursive: true);
-    return CachingFile._(key, dir.toString(), name, file);
-  }
-
-  Future<File?> findCache(String key) async{
     var res = _db.select('''
       SELECT * FROM cache
       WHERE key = ?
     ''', [key]);
-    if(res.isEmpty){
+    if (res.isEmpty) {
       return null;
     }
     var row = res.first;
     var dir = row[1] as String;
     var name = row[2] as String;
+    var expires = row[3] as int;
     var file = File('$cachePath/$dir/$name');
-    if(await file.exists()){
+    var now = DateTime.now().millisecondsSinceEpoch;
+    if (expires < now) {
+      // expired
+      _db.execute('''
+        DELETE FROM cache
+        WHERE key = ?
+      ''', [key]);
+      if (await file.exists()) {
+        await file.delete();
+      }
+      return null;
+    }
+    if (await file.exists()) {
+      // update time
+      var expires = now + 7 * 24 * 60 * 60 * 1000;
+      _db.execute('''
+        UPDATE cache
+        SET expires = ?
+        WHERE key = ?
+      ''', [expires, key]);
       return file;
+    } else {
+      _db.execute('''
+        DELETE FROM cache
+        WHERE key = ?
+      ''', [key]);
     }
     return null;
   }
 
   bool _isChecking = false;
 
+  /// Check cache size and delete expired cache.
+  /// Only check cache if current size is greater than limit size.
   void checkCacheIfRequired() {
-    if(_currentSize != null && _currentSize! > _limitSize){
+    if (_currentSize != null && _currentSize! > _limitSize) {
       checkCache();
     }
   }
 
-  Future<void> checkCache() async{
+  /// Check cache size and delete expired cache.
-    if(_isChecking){
+  /// If current size is greater than limit size,
+  /// delete cache until current size is less than limit size.
+  Future<void> checkCache() async {
+    if (_isChecking) {
       return;
     }
     _isChecking = true;
@@ -134,39 +184,42 @@ class CacheManager {
       SELECT * FROM cache
       WHERE expires < ?
     ''', [DateTime.now().millisecondsSinceEpoch]);
-    for(var row in res){
+    for (var row in res) {
       var dir = row[1] as String;
       var name = row[2] as String;
       var file = File('$cachePath/$dir/$name');
-      if(await file.exists()){
+      if (await file.exists()) {
+        var size = await file.length();
+        _currentSize = _currentSize! - size;
         await file.delete();
       }
     }
+    if (res.isNotEmpty) {
       _db.execute('''
       DELETE FROM cache
       WHERE expires < ?
     ''', [DateTime.now().millisecondsSinceEpoch]);
-
-    int count = 0;
-    var res2 = _db.select('''
-      SELECT COUNT(*) FROM cache
-    ''');
-    if(res2.isNotEmpty){
-      count = res2.first[0] as int;
     }
 
-    while((_currentSize != null && _currentSize! > _limitSize) ||  count > 2000){
+    while (_currentSize != null && _currentSize! > _limitSize) {
       var res = _db.select('''
         SELECT * FROM cache
         ORDER BY expires ASC
         limit 10
       ''');
-      for(var row in res){
+      if (res.isEmpty) {
+        // There are many files unmanaged by the cache manager.
+        // Clear all cache.
+        await Directory(cachePath).delete(recursive: true);
+        Directory(cachePath).createSync(recursive: true);
+        break;
+      }
+      for (var row in res) {
         var key = row[0] as String;
         var dir = row[1] as String;
         var name = row[2] as String;
         var file = File('$cachePath/$dir/$name');
-        if(await file.exists()){
+        if (await file.exists()) {
           var size = await file.length();
           await file.delete();
           _db.execute('''
@@ -174,7 +227,7 @@ class CacheManager {
             WHERE key = ?
           ''', [key]);
           _currentSize = _currentSize! - size;
-          if(_currentSize! <= _limitSize){
+          if (_currentSize! <= _limitSize) {
             break;
           }
         } else {
@@ -183,18 +236,18 @@ class CacheManager {
             WHERE key = ?
           ''', [key]);
         }
-        count--;
       }
     }
     _isChecking = false;
   }
 
-  Future<void> delete(String key) async{
+  /// Delete cache by key.
+  Future<void> delete(String key) async {
     var res = _db.select('''
       SELECT * FROM cache
       WHERE key = ?
     ''', [key]);
-    if(res.isEmpty){
+    if (res.isEmpty) {
       return;
     }
     var row = res.first;
@@ -202,7 +255,7 @@ class CacheManager {
     var name = row[2] as String;
     var file = File('$cachePath/$dir/$name');
     var fileSize = 0;
-    if(await file.exists()){
+    if (await file.exists()) {
       fileSize = await file.length();
       await file.delete();
     }
@@ -210,11 +263,12 @@ class CacheManager {
       DELETE FROM cache
       WHERE key = ?
     ''', [key]);
-    if(_currentSize != null) {
+    if (_currentSize != null) {
       _currentSize = _currentSize! - fileSize;
     }
   }
 
+  /// Delete all cache.
   Future<void> clear() async {
     await Directory(cachePath).delete(recursive: true);
     Directory(cachePath).createSync(recursive: true);
@@ -223,75 +277,4 @@ class CacheManager {
     ''');
     _currentSize = 0;
   }
-
-  Future<void> deleteKeyword(String keyword) async{
-    var res = _db.select('''
-      SELECT * FROM cache
-      WHERE key LIKE ?
-    ''', ['%$keyword%']);
-    for(var row in res){
-      var key = row[0] as String;
-      var dir = row[1] as String;
-      var name = row[2] as String;
-      var file = File('$cachePath/$dir/$name');
-      var fileSize = 0;
-      if(await file.exists()){
-        fileSize = await file.length();
-        try {
-          await file.delete();
-        }
-        finally {}
-      }
-      _db.execute('''
-        DELETE FROM cache
-        WHERE key = ?
-      ''', [key]);
-      if(_currentSize != null) {
-        _currentSize = _currentSize! - fileSize;
-      }
-    }
-  }
-}
-
-class CachingFile{
-  CachingFile._(this.key, this.dir, this.name, this.file);
-
-  final String key;
-
-  final String dir;
-
-  final String name;
-
-  final File file;
-
-  final List<int> _buffer = [];
-
-  Future<void> writeBytes(List<int> data) async{
-    _buffer.addAll(data);
-    if(_buffer.length > 1024 * 1024){
-      await file.writeAsBytes(_buffer, mode: FileMode.append);
-      _buffer.clear();
-    }
-  }
-
-  Future<void> close() async{
-    if(_buffer.isNotEmpty){
-      await file.writeAsBytes(_buffer, mode: FileMode.append);
-    }
-    CacheManager()._db.execute('''
-      INSERT OR REPLACE INTO cache (key, dir, name, expires) VALUES (?, ?, ?, ?)
-    ''', [key, dir, name, DateTime.now().millisecondsSinceEpoch + 7 * 24 * 60 * 60 * 1000]);
-    CacheManager().checkCacheIfRequired();
-  }
-
-  Future<void> cancel() async{
-    await file.deleteIgnoreError();
-  }
-
-  void reset() {
-    _buffer.clear();
-    if(file.existsSync()) {
-      file.deleteSync();
-    }
-  }
 }

lib/foundation/comic_source/category.dart

@@ -34,24 +34,28 @@ class CategoryButtonData {
   });
 }
 
+class CategoryItem {
+  final String label;
+
+  final PageJumpTarget target;
+
+  const CategoryItem(this.label, this.target);
+}
+
 abstract class BaseCategoryPart {
   String get title;
 
-  List<String> get categories;
+  List<CategoryItem> get categories;
-
-  List<String>? get categoryParams => null;
 
   bool get enableRandom;
 
-  String get categoryType;
-
   /// Data class for building a part of category page.
   const BaseCategoryPart();
 }
 
 class FixedCategoryPart extends BaseCategoryPart {
   @override
-  final List<String> categories;
+  final List<CategoryItem> categories;
 
   @override
   bool get enableRandom => false;
@@ -59,19 +63,12 @@ class FixedCategoryPart extends BaseCategoryPart {
   @override
   final String title;
 
-  @override
-  final String categoryType;
-
-  @override
-  final List<String>? categoryParams;
-
   /// A [BaseCategoryPart] that show fixed tags on category page.
-  const FixedCategoryPart(this.title, this.categories, this.categoryType,
+  const FixedCategoryPart(this.title, this.categories);
-      [this.categoryParams]);
 }
 
 class RandomCategoryPart extends BaseCategoryPart {
-  final List<String> tags;
+  final List<CategoryItem> all;
 
   final int randomNumber;
 
@@ -81,71 +78,63 @@ class RandomCategoryPart extends BaseCategoryPart {
   @override
   bool get enableRandom => true;
 
-  @override
+  List<CategoryItem> _categories() {
-  final String categoryType;
+    if (randomNumber >= all.length) {
-
+      return all;
-  List<String> _categories() {
-    if (randomNumber >= tags.length) {
-      return tags;
     }
-    var start = math.Random().nextInt(tags.length - randomNumber);
+    var start = math.Random().nextInt(all.length - randomNumber);
-    return tags.sublist(start, start + randomNumber);
+    return all.sublist(start, start + randomNumber);
   }
 
   @override
-  List<String> get categories => _categories();
+  List<CategoryItem> get categories => _categories();
 
-  /// A [BaseCategoryPart] that show random tags on category page.
+  /// A [BaseCategoryPart] that show a part of random tags on category page.
   const RandomCategoryPart(
-      this.title, this.tags, this.randomNumber, this.categoryType);
+    this.title,
+    this.all,
+    this.randomNumber,
+  );
 }
 
-class RandomCategoryPartWithRuntimeData extends BaseCategoryPart {
+class DynamicCategoryPart extends BaseCategoryPart {
-  final Iterable<String> Function() loadTags;
+  final JSAutoFreeFunction loader;
 
-  final int randomNumber;
+  final String sourceKey;
 
   @override
-  final String title;
+  List<CategoryItem> get categories {
-
+    var data = loader([]);
-  @override
+    if (data is! List) {
-  bool get enableRandom => true;
+      throw "DynamicCategoryPart loader must return a List";
-
-  @override
-  final String categoryType;
-
-  static final random = math.Random();
-
-  List<String> _categories() {
-    var tags = loadTags();
-    if (randomNumber >= tags.length) {
-      return tags.toList();
     }
-    final start = random.nextInt(tags.length - randomNumber);
+    var res = <CategoryItem>[];
-    var res = List.filled(randomNumber, '');
+    for (var item in data) {
-    int index = -1;
+      if (item is! Map) {
-    for (var s in tags) {
+        throw "DynamicCategoryPart loader must return a List of Map";
-      index++;
-      if (start > index) {
-        continue;
-      } else if (index == start + randomNumber) {
-        break;
       }
-      res[index - start] = s;
+      var label = item['label'];
+      var target = PageJumpTarget.parse(sourceKey, item['target']);
+      if (label is! String) {
+        throw "Category label must be a String";
+      }
+      res.add(CategoryItem(label, target));
     }
     return res;
   }
 
   @override
-  List<String> get categories => _categories();
+  bool get enableRandom => false;
 
-  /// A [BaseCategoryPart] that show random tags on category page.
+  @override
-  RandomCategoryPartWithRuntimeData(
+  final String title;
-      this.title, this.loadTags, this.randomNumber, this.categoryType);
+
+  /// A [BaseCategoryPart] that show dynamic tags on category page.
+  const DynamicCategoryPart(this.title, this.loader, this.sourceKey);
 }
 
 CategoryData getCategoryDataWithKey(String key) {
-  for (var source in ComicSource._sources) {
+  for (var source in ComicSource.all()) {
     if (source.categoryData?.key == key) {
       return source.categoryData!;
     }

lib/foundation/comic_source/comic_source.dart

@@ -11,8 +11,11 @@ import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/comic_type.dart';
 import 'package:venera/foundation/history.dart';
 import 'package:venera/foundation/res.dart';
+import 'package:venera/pages/category_comics_page.dart';
+import 'package:venera/pages/search_result_page.dart';
 import 'package:venera/utils/data_sync.dart';
 import 'package:venera/utils/ext.dart';
+import 'package:venera/utils/init.dart';
 import 'package:venera/utils/io.dart';
 import 'package:venera/utils/translations.dart';
 
@@ -27,81 +30,29 @@ part 'parser.dart';
 
 part 'models.dart';
 
-/// build comic list, [Res.subData] should be maxPage or null if there is no limit.
+part 'types.dart';
-typedef ComicListBuilder = Future<Res<List<Comic>>> Function(int page);
 
-/// build comic list with next param, [Res.subData] should be next page param or null if there is no next page.
+class ComicSourceManager with ChangeNotifier, Init {
-typedef ComicListBuilderWithNext = Future<Res<List<Comic>>> Function(
+  final List<ComicSource> _sources = [];
-    String? next);
 
-typedef LoginFunction = Future<Res<bool>> Function(String, String);
+  static ComicSourceManager? _instance;
 
-typedef LoadComicFunc = Future<Res<ComicDetails>> Function(String id);
+  ComicSourceManager._create();
 
-typedef LoadComicPagesFunc = Future<Res<List<String>>> Function(
+  factory ComicSourceManager() => _instance ??= ComicSourceManager._create();
-    String id, String? ep);
 
-typedef CommentsLoader = Future<Res<List<Comment>>> Function(
+  List<ComicSource> all() => List.from(_sources);
-    String id, String? subId, int page, String? replyTo);
 
-typedef SendCommentFunc = Future<Res<bool>> Function(
+  ComicSource? find(String key) =>
-    String id, String? subId, String content, String? replyTo);
-
-typedef GetImageLoadingConfigFunc = Future<Map<String, dynamic>> Function(
-    String imageKey, String comicId, String epId)?;
-typedef GetThumbnailLoadingConfigFunc = Map<String, dynamic> Function(
-    String imageKey)?;
-
-typedef ComicThumbnailLoader = Future<Res<List<String>>> Function(
-    String comicId, String? next);
-
-typedef LikeOrUnlikeComicFunc = Future<Res<bool>> Function(
-    String comicId, bool isLiking);
-
-/// [isLiking] is true if the user is liking the comment, false if unliking.
-/// return the new likes count or null.
-typedef LikeCommentFunc = Future<Res<int?>> Function(
-    String comicId, String? subId, String commentId, bool isLiking);
-
-/// [isUp] is true if the user is upvoting the comment, false if downvoting.
-/// return the new vote count or null.
-typedef VoteCommentFunc = Future<Res<int?>> Function(
-    String comicId, String? subId, String commentId, bool isUp, bool isCancel);
-
-typedef HandleClickTagEvent = Map<String, String> Function(
-    String namespace, String tag);
-
-/// [rating] is the rating value, 0-10. 1 represents 0.5 star.
-typedef StarRatingFunc = Future<Res<bool>> Function(String comicId, int rating);
-
-class ComicSource {
-  static final List<ComicSource> _sources = [];
-
-  static final List<Function> _listeners = [];
-
-  static void addListener(Function listener) {
-    _listeners.add(listener);
-  }
-
-  static void removeListener(Function listener) {
-    _listeners.remove(listener);
-  }
-
-  static void notifyListeners() {
-    for (var listener in _listeners) {
-      listener();
-    }
-  }
-
-  static List<ComicSource> all() => List.from(_sources);
-
-  static ComicSource? find(String key) =>
       _sources.firstWhereOrNull((element) => element.key == key);
 
-  static ComicSource? fromIntKey(int key) =>
+  ComicSource? fromIntKey(int key) =>
       _sources.firstWhereOrNull((element) => element.key.hashCode == key);
 
-  static Future<void> init() async {
+  @override
+  @protected
+  Future<void> doInit() async {
+    await JsEngine().ensureInit();
     final path = "${App.dataPath}/comic_source";
     if (!(await Directory(path).exists())) {
       Directory(path).create();
@@ -120,26 +71,49 @@ class ComicSource {
     }
   }
 
-  static Future reload() async {
+  Future reload() async {
     _sources.clear();
     JsEngine().runCode("ComicSource.sources = {};");
-    await init();
+    await doInit();
     notifyListeners();
   }
 
-  static void add(ComicSource source) {
+  void add(ComicSource source) {
     _sources.add(source);
     notifyListeners();
   }
 
-  static void remove(String key) {
+  void remove(String key) {
     _sources.removeWhere((element) => element.key == key);
     notifyListeners();
   }
 
-  static final availableUpdates = <String, String>{};
+  bool get isEmpty => _sources.isEmpty;
 
-  static bool get isEmpty => _sources.isEmpty;
+  /// Key is the source key, value is the version.
+  final _availableUpdates = <String, String>{};
+
+  void updateAvailableUpdates(Map<String, String> updates) {
+    _availableUpdates.addAll(updates);
+    notifyListeners();
+  }
+
+  Map<String, String> get availableUpdates => Map.from(_availableUpdates);
+
+  void notifyStateChange() {
+    notifyListeners();
+  }
+}
+
+class ComicSource {
+  static List<ComicSource> all() => ComicSourceManager().all();
+
+  static ComicSource? find(String key) => ComicSourceManager().find(key);
+
+  static ComicSource? fromIntKey(int key) =>
+      ComicSourceManager().fromIntKey(key);
+
+  static bool get isEmpty => ComicSourceManager().isEmpty;
 
   /// Name of this source.
   final String name;
@@ -210,6 +184,9 @@ class ComicSource {
 
   final HandleClickTagEvent? handleClickTagEvent;
 
+  /// Callback when a tag suggestion is selected in search.
+  final TagSuggestionSelectFunc? onTagSuggestionSelected;
+
   final LinkHandler? linkHandler;
 
   final bool enableTagsSuggestions;
@@ -285,6 +262,7 @@ class ComicSource {
     this.idMatcher,
     this.translations,
     this.handleClickTagEvent,
+    this.onTagSuggestionSelected,
     this.linkHandler,
     this.enableTagsSuggestions,
     this.enableTagsTranslate,
@@ -377,7 +355,7 @@ class ExplorePagePart {
   ///   - category:categoryName
   ///
   /// End with `@`+`param` if the category has a parameter.
-  final String? viewMore;
+  final PageJumpTarget? viewMore;
 
   const ExplorePagePart(this.title, this.comics, this.viewMore);
 }
@@ -417,7 +395,7 @@ class SearchOptions {
 
   const SearchOptions(this.options, this.label, this.type, this.defaultVal);
 
-  String get defaultValue => defaultVal ?? options.keys.first;
+  String get defaultValue => defaultVal ?? options.keys.firstOrNull ?? "";
 }
 
 typedef CategoryComicsLoader = Future<Res<List<Comic>>> Function(

lib/foundation/comic_source/favorites.dart

@@ -37,6 +37,8 @@ class FavoriteData {
 
   final AddOrDelFavFunc? addOrDelFavorite;
 
+  final bool singleFolderForSingleComic;
+
   const FavoriteData({
     required this.key,
     required this.title,
@@ -49,6 +51,7 @@ class FavoriteData {
     this.allFavoritesId,
     this.addOrDelFavorite,
     this.isOldToNewSort,
+    this.singleFolderForSingleComic = false,
   });
 }
 

lib/foundation/comic_source/models.dart

@@ -111,6 +111,29 @@ class Comic {
 
   @override
   int get hashCode => id.hashCode ^ sourceKey.hashCode;
+
+  @override
+  toString() => "$sourceKey@$id";
+}
+
+class ComicID {
+  final ComicType type;
+
+  final String id;
+
+  const ComicID(this.type, this.id);
+
+  @override
+  bool operator ==(Object other) {
+    if (other is! ComicID) return false;
+    return other.type == type && other.id == id;
+  }
+
+  @override
+  int get hashCode => type.hashCode ^ id.hashCode;
+
+  @override
+  String toString() => "$type@$id";
 }
 
 class ComicDetails with HistoryMixin {
@@ -128,7 +151,7 @@ class ComicDetails with HistoryMixin {
   final Map<String, List<String>> tags;
 
   /// id-name
-  final Map<String, String>? chapters;
+  final ComicChapters? chapters;
 
   final List<String>? thumbnails;
 
@@ -166,7 +189,9 @@ class ComicDetails with HistoryMixin {
   static Map<String, List<String>> _generateMap(Map<dynamic, dynamic> map) {
     var res = <String, List<String>>{};
     map.forEach((key, value) {
+      if (value is List) {
         res[key] = List<String>.from(value);
+      }
     });
     return res;
   }
@@ -177,9 +202,7 @@ class ComicDetails with HistoryMixin {
         cover = json["cover"],
         description = json["description"],
         tags = _generateMap(json["tags"]),
-        chapters = json["chapters"] == null
+        chapters = ComicChapters.fromJsonOrNull(json["chapters"]),
-            ? null
-            : Map<String, String>.from(json["chapters"]),
         sourceKey = json["sourceKey"],
         comicId = json["comicId"],
         thumbnails = ListOrNull.from(json["thumbnails"]),
@@ -260,6 +283,41 @@ class ComicDetails with HistoryMixin {
     }
     return null;
   }
+
+  String? _validateUpdateTime(String time) {
+    time = time.split(" ").first;
+    var segments = time.split("-");
+    if (segments.length != 3) return null;
+    var year = int.tryParse(segments[0]);
+    var month = int.tryParse(segments[1]);
+    var day = int.tryParse(segments[2]);
+    if (year == null || month == null || day == null) return null;
+    if (year < 2000 || year > 3000) return null;
+    if (month < 1 || month > 12) return null;
+    if (day < 1 || day > 31) return null;
+    return "$year-$month-$day";
+  }
+
+  String? findUpdateTime() {
+    if (updateTime != null) {
+      return _validateUpdateTime(updateTime!);
+    }
+    const acceptedNamespaces = [
+      "更新",
+      "最後更新",
+      "最后更新",
+      "update",
+      "last update",
+    ];
+    for (var entry in tags.entries) {
+      if (acceptedNamespaces.contains(entry.key.toLowerCase()) &&
+          entry.value.isNotEmpty) {
+        var value = entry.value.first;
+        return _validateUpdateTime(value);
+      }
+    }
+    return null;
+  }
 }
 
 class ArchiveInfo {
@@ -272,3 +330,232 @@ class ArchiveInfo {
         description = json["description"],
         id = json["id"];
 }
+
+class ComicChapters {
+  final Map<String, String>? _chapters;
+
+  final Map<String, Map<String, String>>? _groupedChapters;
+
+  /// Create a ComicChapters object with a flat map
+  const ComicChapters(Map<String, String> this._chapters)
+      : _groupedChapters = null;
+
+  /// Create a ComicChapters object with a grouped map
+  const ComicChapters.grouped(
+      Map<String, Map<String, String>> this._groupedChapters)
+      : _chapters = null;
+
+  factory ComicChapters.fromJson(dynamic json) {
+    if (json is! Map) throw ArgumentError("Invalid json type");
+    var chapters = <String, String>{};
+    var groupedChapters = <String, Map<String, String>>{};
+    for (var entry in json.entries) {
+      var key = entry.key;
+      var value = entry.value;
+      if (key is! String) throw ArgumentError("Invalid key type");
+      if (value is Map) {
+        groupedChapters[key] = Map.from(value);
+      } else {
+        chapters[key] = value.toString();
+      }
+    }
+    if (chapters.isNotEmpty) {
+      return ComicChapters(chapters);
+    } else if (groupedChapters.isNotEmpty) {
+      return ComicChapters.grouped(groupedChapters);
+    } else {
+      // return a empty list.
+      return ComicChapters(chapters);
+    }
+  }
+
+  static fromJsonOrNull(dynamic json) {
+    if (json == null) return null;
+    return ComicChapters.fromJson(json);
+  }
+
+  Map<String, dynamic> toJson() {
+    if (_chapters != null) {
+      return _chapters;
+    } else {
+      return _groupedChapters!;
+    }
+  }
+
+  /// Whether the chapters are grouped
+  bool get isGrouped => _groupedChapters != null;
+
+  /// All group names
+  Iterable<String> get groups => _groupedChapters?.keys ?? [];
+
+  /// All chapters.
+  /// If the chapters are grouped, all groups will be merged.
+  Map<String, String> get allChapters {
+    if (_chapters != null) return _chapters;
+    var res = <String, String>{};
+    for (var entry in _groupedChapters!.values) {
+      res.addAll(entry);
+    }
+    return res;
+  }
+
+  /// Get a group of chapters by name
+  Map<String, String> getGroup(String group) {
+    return _groupedChapters![group] ?? {};
+  }
+
+  /// Get a group of chapters by index(0-based)
+  Map<String, String> getGroupByIndex(int index) {
+    return _groupedChapters!.values.elementAt(index);
+  }
+
+  /// Get total number of chapters
+  int get length {
+    return isGrouped
+        ? _groupedChapters!.values.map((e) => e.length).reduce((a, b) => a + b)
+        : _chapters!.length;
+  }
+
+  /// Get the number of groups
+  int get groupCount => _groupedChapters?.length ?? 0;
+
+  /// Iterate all chapter ids
+  Iterable<String> get ids sync* {
+    if (isGrouped) {
+      for (var entry in _groupedChapters!.values) {
+        yield* entry.keys;
+      }
+    } else {
+      yield* _chapters!.keys;
+    }
+  }
+
+  /// Iterate all chapter titles
+  Iterable<String> get titles sync* {
+    if (isGrouped) {
+      for (var entry in _groupedChapters!.values) {
+        yield* entry.values;
+      }
+    } else {
+      yield* _chapters!.values;
+    }
+  }
+
+  String? operator [](String key) {
+    if (isGrouped) {
+      for (var entry in _groupedChapters!.values) {
+        if (entry.containsKey(key)) return entry[key];
+      }
+      return null;
+    } else {
+      return _chapters![key];
+    }
+  }
+}
+
+class PageJumpTarget {
+  final String sourceKey;
+
+  final String page;
+
+  final Map<String, dynamic>? attributes;
+
+  const PageJumpTarget(this.sourceKey, this.page, this.attributes);
+
+  static PageJumpTarget parse(String sourceKey, dynamic value) {
+    if (value is Map) {
+      if (value['page'] != null) {
+        return PageJumpTarget(
+          sourceKey,
+          value["page"] ?? "search",
+          value["attributes"],
+        );
+      } else if (value["action"] != null) {
+        // old version `onClickTag`
+        var page = value["action"];
+        if (page == "search") {
+          return PageJumpTarget(
+            sourceKey,
+            "search",
+            {
+              "text": value["keyword"],
+            },
+          );
+        } else if (page == "category") {
+          return PageJumpTarget(
+            sourceKey,
+            "category",
+            {
+              "category": value["keyword"],
+              "param": value["param"],
+            },
+          );
+        } else {
+          return PageJumpTarget(sourceKey, page, null);
+        }
+      }
+    } else if (value is String) {
+      // old version string encoding. search: `search:keyword`, category: `category:keyword` or `category:keyword@param`
+      var segments = value.split(":");
+      var page = segments[0];
+      if (page == "search") {
+        return PageJumpTarget(
+          sourceKey,
+          "search",
+          {
+            "text": segments[1],
+          },
+        );
+      } else if (page == "category") {
+        var c = segments[1];
+        if (c.contains('@')) {
+          var parts = c.split('@');
+          return PageJumpTarget(
+            sourceKey,
+            "category",
+            {
+              "category": parts[0],
+              "param": parts[1],
+            },
+          );
+        } else {
+          return PageJumpTarget(
+            sourceKey,
+            "category",
+            {
+              "category": c,
+            },
+          );
+        }
+      } else {
+        return PageJumpTarget(sourceKey, page, null);
+      }
+    }
+    return PageJumpTarget(sourceKey, "Invalid Data", null);
+  }
+
+  void jump(BuildContext context) {
+    if (page == "search") {
+      context.to(
+        () => SearchResultPage(
+          text: attributes?["text"] ?? attributes?["keyword"] ?? "",
+          sourceKey: sourceKey,
+          options: List.from(attributes?["options"] ?? []),
+        ),
+      );
+    } else if (page == "category") {
+      var key = ComicSource.find(sourceKey)!.categoryData!.key;
+      context.to(
+        () => CategoryComicsPage(
+          categoryKey: key,
+          category: attributes?["category"] ??
+              (throw ArgumentError("Category name is required")),
+          options: List.from(attributes?["options"] ?? []),
+          param: attributes?["param"],
+        ),
+      );
+    } else {
+      Log.error("Page Jump", "Unknown page: $page");
+    }
+  }
+}

lib/foundation/comic_source/parser.dart

@@ -80,9 +80,8 @@ class ComicSourceParser {
 
   Future<ComicSource> parse(String js, String filePath) async {
     js = js.replaceAll("\r\n", "\n");
-    var line1 = js
+    var line1 =
-        .split('\n')
+        js.split('\n').firstWhereOrNull((e) => e.trim().startsWith("class "));
-        .firstWhereOrNull((element) => element.removeAllBlank.isNotEmpty);
     if (line1 == null ||
         !line1.startsWith("class ") ||
         !line1.contains("extends ComicSource")) {
@@ -149,6 +148,7 @@ class ComicSourceParser {
       _parseIdMatch(),
       _parseTranslation(),
       _parseClickTagEvent(),
+      _parseTagSuggestionSelectFunc(),
       _parseLinkHandler(),
       _getValue("search.enableTagsSuggestions") ?? false,
       _getValue("comic.enableTagsTranslate") ?? false,
@@ -336,7 +336,7 @@ class ComicSourceParser {
                     (e['comics'] as List).map((e) {
                       return Comic.fromJson(e, _key!);
                     }).toList(),
-                    e['viewMore'],
+                    PageJumpTarget.parse(_key!, e['viewMore']),
                   );
                 }),
               ),
@@ -404,6 +404,43 @@ class ComicSourceParser {
     var categoryParts = <BaseCategoryPart>[];
 
     for (var c in doc["parts"]) {
+      if (c["categories"] != null && c["categories"] is! List) {
+        continue;
+      }
+      List? categories = c["categories"];
+      if (categories == null || categories[0] is Map) {
+        // new format
+        final String name = c["name"];
+        final String type = c["type"];
+        final cs = categories
+            ?.map(
+              (e) => CategoryItem(
+                e['label'],
+                PageJumpTarget.parse(_key!, e['target']),
+              ),
+            )
+            .toList();
+        if (type != "dynamic" && (cs == null || cs.isEmpty)) {
+          continue;
+        }
+        if (type == "fixed") {
+          categoryParts.add(FixedCategoryPart(name, cs!));
+        } else if (type == "random") {
+          categoryParts
+              .add(RandomCategoryPart(name, cs!, c["randomNumber"] ?? 1));
+        } else if (type == "dynamic" && categories == null) {
+          var loader = c["loader"];
+          if (loader is! JSInvokable) {
+            throw "DynamicCategoryPart loader must be a function";
+          }
+          categoryParts.add(DynamicCategoryPart(
+            name,
+            JSAutoFreeFunction(loader),
+            _key!,
+          ));
+        }
+      } else {
+        // old format
         final String name = c["name"];
         final String type = c["type"];
         final List<String> tags = List.from(c["categories"]);
@@ -413,12 +450,45 @@ class ComicSourceParser {
         if (groupParam != null) {
           categoryParams = List.filled(tags.length, groupParam);
         }
+        var cs = <CategoryItem>[];
+        for (int i = 0; i < tags.length; i++) {
+          PageJumpTarget target;
+          if (itemType == 'category') {
+            target = PageJumpTarget(
+              _key!,
+              'category',
+              {
+                "category": tags[i],
+                "param": categoryParams?.elementAtOrNull(i),
+              },
+            );
+          } else if (itemType == 'search') {
+            target = PageJumpTarget(
+              _key!,
+              'search',
+              {
+                "keyword": tags[i],
+              },
+            );
+          } else if (itemType == 'search_with_namespace') {
+            target = PageJumpTarget(
+              _key!,
+              'search',
+              {
+                "keyword": "$name:$tags[i]",
+              },
+            );
+          } else {
+            target = PageJumpTarget(_key!, itemType, null);
+          }
+          cs.add(CategoryItem(tags[i], target));
+        }
         if (type == "fixed") {
-        categoryParts
+          categoryParts.add(FixedCategoryPart(name, cs));
-            .add(FixedCategoryPart(name, tags, itemType, categoryParams));
         } else if (type == "random") {
-        categoryParts.add(
+          categoryParts
-            RandomCategoryPart(name, tags, c["randomNumber"] ?? 1, itemType));
+              .add(RandomCategoryPart(name, cs, c["randomNumber"] ?? 1));
+        }
       }
     }
 
@@ -620,6 +690,8 @@ class ComicSourceParser {
 
     final bool multiFolder = _getValue("favorites.multiFolder");
     final bool? isOldToNewSort = _getValue("favorites.isOldToNewSort");
+    final bool? singleFolderForSingleComic =
+        _getValue("favorites.singleFolderForSingleComic");
 
     Future<Res<T>> retryZone<T>(Future<Res<T>> Function() func) async {
       if (!ComicSource.find(_key!)!.isLogged) {
@@ -773,6 +845,7 @@ class ComicSourceParser {
       deleteFolder: deleteFolder,
       addOrDelFavorite: addOrDelFavFunc,
       isOldToNewSort: isOldToNewSort,
+      singleFolderForSingleComic: singleFolderForSingleComic ?? false,
     );
   }
 
@@ -976,9 +1049,25 @@ class ComicSourceParser {
       var res = JsEngine().runCode("""
           ComicSource.sources.$_key.comic.onClickTag(${jsonEncode(namespace)}, ${jsonEncode(tag)})
         """);
-      var r = Map<String, String?>.from(res);
+      if (res is! Map) {
+        return null;
+      }
+      var r = Map<String, dynamic>.from(res);
       r.removeWhere((key, value) => value == null);
-      return Map.from(r);
+      return PageJumpTarget.parse(_key!, r);
+    };
+  }
+
+  TagSuggestionSelectFunc? _parseTagSuggestionSelectFunc() {
+    if (!_checkExists("search.onTagSuggestionSelected")) {
+      return null;
+    }
+    return (namespace, tag) {
+      var res = JsEngine().runCode("""
+          ComicSource.sources.$_key.search.onTagSuggestionSelected(
+            ${jsonEncode(namespace)}, ${jsonEncode(tag)})
+        """);
+      return res is String ? res : "$namespace:$tag";
     };
   }
 

lib/foundation/comic_source/types.dart

@@ -0,0 +1,53 @@
+part of 'comic_source.dart';
+
+/// build comic list, [Res.subData] should be maxPage or null if there is no limit.
+typedef ComicListBuilder = Future<Res<List<Comic>>> Function(int page);
+
+/// build comic list with next param, [Res.subData] should be next page param or null if there is no next page.
+typedef ComicListBuilderWithNext = Future<Res<List<Comic>>> Function(
+    String? next);
+
+typedef LoginFunction = Future<Res<bool>> Function(String, String);
+
+typedef LoadComicFunc = Future<Res<ComicDetails>> Function(String id);
+
+typedef LoadComicPagesFunc = Future<Res<List<String>>> Function(
+    String id, String? ep);
+
+typedef CommentsLoader = Future<Res<List<Comment>>> Function(
+    String id, String? subId, int page, String? replyTo);
+
+typedef SendCommentFunc = Future<Res<bool>> Function(
+    String id, String? subId, String content, String? replyTo);
+
+typedef GetImageLoadingConfigFunc = Future<Map<String, dynamic>> Function(
+    String imageKey, String comicId, String epId)?;
+typedef GetThumbnailLoadingConfigFunc = Map<String, dynamic> Function(
+    String imageKey)?;
+
+typedef ComicThumbnailLoader = Future<Res<List<String>>> Function(
+    String comicId, String? next);
+
+typedef LikeOrUnlikeComicFunc = Future<Res<bool>> Function(
+    String comicId, bool isLiking);
+
+/// [isLiking] is true if the user is liking the comment, false if unliking.
+/// return the new likes count or null.
+typedef LikeCommentFunc = Future<Res<int?>> Function(
+    String comicId, String? subId, String commentId, bool isLiking);
+
+/// [isUp] is true if the user is upvoting the comment, false if downvoting.
+/// return the new vote count or null.
+typedef VoteCommentFunc = Future<Res<int?>> Function(
+    String comicId, String? subId, String commentId, bool isUp, bool isCancel);
+
+typedef HandleClickTagEvent = PageJumpTarget? Function(
+    String namespace, String tag);
+
+/// Handle tag suggestion selection event. Should return the text to insert
+/// into the search field.
+typedef TagSuggestionSelectFunc = String Function(
+    String namespace, String tag);
+
+/// [rating] is the rating value, 0-10. 1 represents 0.5 star.
+typedef StarRatingFunc = Future<Res<bool>> Function(String comicId, int rating);

lib/foundation/favorites.dart

@@ -1,4 +1,6 @@
 import 'dart:convert';
+import 'dart:ffi';
+import 'dart:isolate';
 
 import 'package:flutter/foundation.dart';
 import 'package:sqlite3/sqlite3.dart';
@@ -6,6 +8,7 @@ import 'package:venera/foundation/appdata.dart';
 import 'package:venera/foundation/image_provider/local_favorite_image.dart';
 import 'package:venera/foundation/local.dart';
 import 'package:venera/foundation/log.dart';
+import 'package:venera/pages/follow_updates_page.dart';
 import 'package:venera/utils/tags_translation.dart';
 import 'dart:io';
 
@@ -154,6 +157,50 @@ class FavoriteItemWithFolderInfo extends FavoriteItem {
         );
 }
 
+class FavoriteItemWithUpdateInfo extends FavoriteItem {
+  String? updateTime;
+
+  DateTime? lastCheckTime;
+
+  bool hasNewUpdate;
+
+  FavoriteItemWithUpdateInfo(
+    FavoriteItem item,
+    this.updateTime,
+    this.hasNewUpdate,
+    int? lastCheckTime,
+  )   : lastCheckTime = lastCheckTime == null
+            ? null
+            : DateTime.fromMillisecondsSinceEpoch(lastCheckTime),
+        super(
+          id: item.id,
+          name: item.name,
+          coverPath: item.coverPath,
+          author: item.author,
+          type: item.type,
+          tags: item.tags,
+        );
+
+  @override
+  String get description {
+    var updateTime = this.updateTime ?? "Unknown";
+    var sourceName = type.comicSource?.name ?? "Unknown";
+    return "$updateTime | $sourceName";
+  }
+
+  @override
+  operator ==(Object other) {
+    return other is FavoriteItemWithUpdateInfo &&
+        other.updateTime == updateTime &&
+        other.hasNewUpdate == hasNewUpdate &&
+        super == other;
+  }
+
+  @override
+  int get hashCode =>
+      super.hashCode ^ updateTime.hashCode ^ hasNewUpdate.hashCode;
+}
+
 class LocalFavoritesManager with ChangeNotifier {
   factory LocalFavoritesManager() =>
       cache ?? (cache = LocalFavoritesManager._create());
@@ -164,7 +211,22 @@ class LocalFavoritesManager with ChangeNotifier {
 
   late Database _db;
 
+  late Map<String, int> counts;
+
+  int get totalComics {
+    int total = 0;
+    for (var t in counts.values) {
+      total += t;
+    }
+    return total;
+  }
+
+  int folderComics(String folder) {
+    return counts[folder] ?? 0;
+  }
+
   Future<void> init() async {
+    counts = {};
     _db = sqlite3.open("${App.dataPath}/local_favorite.db");
     _db.execute("""
       create table if not exists folder_order (
@@ -179,7 +241,8 @@ class LocalFavoritesManager with ChangeNotifier {
         source_folder text
       );
     """);
-    for (var folder in _getFolderNamesWithDB()) {
+    var folderNames = _getFolderNamesWithDB();
+    for (var folder in folderNames) {
       var columns = _db.select("""
         pragma table_info("$folder");
       """);
@@ -188,7 +251,7 @@ class LocalFavoritesManager with ChangeNotifier {
           alter table "$folder"
           add column translated_tags TEXT;
         """);
-        var comics = getAllComics(folder);
+        var comics = getFolderComics(folder);
         for (var comic in comics) {
           var translatedTags = _translateTags(comic.tags);
           _db.execute("""
@@ -201,6 +264,22 @@ class LocalFavoritesManager with ChangeNotifier {
         break;
       }
     }
+    await appdata.ensureInit();
+    // Make sure the follow updates folder is ready
+    var followUpdateFolder = appdata.settings['followUpdatesFolder'];
+    if (followUpdateFolder is String &&
+        folderNames.contains(followUpdateFolder)) {
+      prepareTableForFollowUpdates(followUpdateFolder, false);
+    } else {
+      appdata.settings['followUpdatesFolder'] = null;
+    }
+    initCounts();
+  }
+
+  void initCounts() {
+    for (var folder in folderNames) {
+      counts[folder] = count(folder);
+    }
   }
 
   List<String> find(String id, ComicType type) {
@@ -294,7 +373,7 @@ class LocalFavoritesManager with ChangeNotifier {
       """).firstOrNull?["min_value"] ?? 0;
   }
 
-  List<FavoriteItem> getAllComics(String folder) {
+  List<FavoriteItem> getFolderComics(String folder) {
     var rows = _db.select("""
         select * from "$folder"
         ORDER BY display_order;
@@ -302,6 +381,54 @@ class LocalFavoritesManager with ChangeNotifier {
     return rows.map((element) => FavoriteItem.fromRow(element)).toList();
   }
 
+  static Future<List<FavoriteItem>> _getFolderComicsAsync(
+      String folder, Pointer<void> p) {
+    return Isolate.run(() {
+      var db = sqlite3.fromPointer(p);
+      var rows = db.select("""
+        select * from "$folder"
+        ORDER BY display_order;
+      """);
+      return rows.map((element) => FavoriteItem.fromRow(element)).toList();
+    });
+  }
+
+  /// Start a new isolate to get the comics in the folder
+  Future<List<FavoriteItem>> getFolderComicsAsync(String folder) {
+    return _getFolderComicsAsync(folder, _db.handle);
+  }
+
+  List<FavoriteItem> getAllComics() {
+    var res = <FavoriteItem>{};
+    for (final folder in folderNames) {
+      var comics = _db.select("""
+        select * from "$folder";
+      """);
+      res.addAll(comics.map((element) => FavoriteItem.fromRow(element)));
+    }
+    return res.toList();
+  }
+
+  static Future<List<FavoriteItem>> _getAllComicsAsync(
+      List<String> folders, Pointer<void> p) {
+    return Isolate.run(() {
+      var db = sqlite3.fromPointer(p);
+      var res = <FavoriteItem>{};
+      for (final folder in folders) {
+        var comics = db.select("""
+          select * from "$folder";
+        """);
+        res.addAll(comics.map((element) => FavoriteItem.fromRow(element)));
+      }
+      return res.toList();
+    });
+  }
+
+  /// Start a new isolate to get all the comics
+  Future<List<FavoriteItem>> getAllComicsAsync() {
+    return _getAllComicsAsync(folderNames, _db.handle);
+  }
+
   void addTagTo(String folder, String id, String tag) {
     _db.execute("""
       update "$folder"
@@ -367,6 +494,7 @@ class LocalFavoritesManager with ChangeNotifier {
       );
     """);
     notifyListeners();
+    counts[name] = 0;
     return name;
   }
 
@@ -429,7 +557,8 @@ class LocalFavoritesManager with ChangeNotifier {
 
   /// add comic to a folder.
   /// return true if success, false if already exists
-  bool addComic(String folder, FavoriteItem comic, [int? order]) {
+  bool addComic(String folder, FavoriteItem comic,
+      [int? order, String? updateTime]) {
     _modifiedAfterLastCache = true;
     if (!existsFolder(folder)) {
       throw Exception("Folder does not exists");
@@ -468,6 +597,23 @@ class LocalFavoritesManager with ChangeNotifier {
         values (?, ?, ?, ?, ?, ?, ?, ?, ?);
       """, [...params, minValue(folder) - 1]);
     }
+    if (updateTime != null) {
+      var columns = _db.select("""
+      pragma table_info("$folder");
+    """);
+      if (columns.any((element) => element["name"] == "last_update_time")) {
+        _db.execute("""
+          update "$folder"
+          set last_update_time = ?
+          where id == ? and type == ?;
+        """, [updateTime, comic.id, comic.type.value]);
+      }
+    }
+    if (counts[folder] == null) {
+      counts[folder] = count(folder);
+    } else {
+      counts[folder] = counts[folder]! + 1;
+    }
     notifyListeners();
     return true;
   }
@@ -507,6 +653,102 @@ class LocalFavoritesManager with ChangeNotifier {
     notifyListeners();
   }
 
+  void batchMoveFavorites(
+      String sourceFolder, String targetFolder, List<FavoriteItem> items) {
+    _modifiedAfterLastCache = true;
+
+    if (!existsFolder(sourceFolder)) {
+      throw Exception("Source folder does not exist");
+    }
+    if (!existsFolder(targetFolder)) {
+      throw Exception("Target folder does not exist");
+    }
+
+    _db.execute("BEGIN TRANSACTION");
+    var displayOrder = maxValue(targetFolder) + 1;
+    try {
+      for (var item in items) {
+        _db.execute("""
+          insert or ignore into "$targetFolder" (id, name, author, type, tags, cover_path, time, display_order)
+          select id, name, author, type, tags, cover_path, time, ?
+          from "$sourceFolder"
+          where id == ? and type == ?;
+        """, [displayOrder, item.id, item.type.value]);
+
+        _db.execute("""
+          delete from "$sourceFolder"
+          where id == ? and type == ?;
+        """, [item.id, item.type.value]);
+
+        displayOrder++;
+      }
+      notifyListeners();
+    } catch (e) {
+      Log.error("Batch Move Favorites", e.toString());
+      _db.execute("ROLLBACK");
+      return;
+    }
+    _db.execute("COMMIT");
+
+    // Update counts
+    if (counts[targetFolder] == null) {
+      counts[targetFolder] = count(targetFolder);
+    } else {
+      counts[targetFolder] = counts[targetFolder]! + items.length;
+    }
+
+    if (counts[sourceFolder] != null) {
+      counts[sourceFolder] = counts[sourceFolder]! - items.length;
+    } else {
+      counts[sourceFolder] = count(sourceFolder);
+    }
+
+    notifyListeners();
+  }
+
+  void batchCopyFavorites(
+      String sourceFolder, String targetFolder, List<FavoriteItem> items) {
+    _modifiedAfterLastCache = true;
+
+    if (!existsFolder(sourceFolder)) {
+      throw Exception("Source folder does not exist");
+    }
+    if (!existsFolder(targetFolder)) {
+      throw Exception("Target folder does not exist");
+    }
+
+    _db.execute("BEGIN TRANSACTION");
+    var displayOrder = maxValue(targetFolder) + 1;
+    try {
+      for (var item in items) {
+        _db.execute("""
+          insert or ignore into "$targetFolder" (id, name, author, type, tags, cover_path, time, display_order)
+          select id, name, author, type, tags, cover_path, time, ?
+          from "$sourceFolder"
+          where id == ? and type == ?;
+        """, [displayOrder, item.id, item.type.value]);
+
+        displayOrder++;
+      }
+      notifyListeners();
+    } catch (e) {
+      Log.error("Batch Copy Favorites", e.toString());
+      _db.execute("ROLLBACK");
+      return;
+    }
+
+    _db.execute("COMMIT");
+
+    // Update counts
+    if (counts[targetFolder] == null) {
+      counts[targetFolder] = count(targetFolder);
+    } else {
+      counts[targetFolder] = counts[targetFolder]! + items.length;
+    }
+
+    notifyListeners();
+  }
+
   /// delete a folder
   void deleteFolder(String name) {
     _modifiedAfterLastCache = true;
@@ -517,14 +759,10 @@ class LocalFavoritesManager with ChangeNotifier {
       delete from folder_order
       where folder_name == ?;
     """, [name]);
+    counts.remove(name);
     notifyListeners();
   }
 
-  void deleteComic(String folder, FavoriteItem comic) {
-    _modifiedAfterLastCache = true;
-    deleteComicWithId(folder, comic.id, comic.type);
-  }
-
   void deleteComicWithId(String folder, String id, ComicType type) {
     _modifiedAfterLastCache = true;
     LocalFavoriteImageProvider.delete(id, type.value);
@@ -532,6 +770,60 @@ class LocalFavoritesManager with ChangeNotifier {
       delete from "$folder"
       where id == ? and type == ?;
     """, [id, type.value]);
+    if (counts[folder] != null) {
+      counts[folder] = counts[folder]! - 1;
+    } else {
+      counts[folder] = count(folder);
+    }
+    notifyListeners();
+  }
+
+  void batchDeleteComics(String folder, List<FavoriteItem> comics) {
+    _modifiedAfterLastCache = true;
+    _db.execute("BEGIN TRANSACTION");
+    try {
+      for (var comic in comics) {
+        LocalFavoriteImageProvider.delete(comic.id, comic.type.value);
+        _db.execute("""
+          delete from "$folder"
+          where id == ? and type == ?;
+        """, [comic.id, comic.type.value]);
+      }
+      if (counts[folder] != null) {
+        counts[folder] = counts[folder]! - comics.length;
+      } else {
+        counts[folder] = count(folder);
+      }
+    } catch (e) {
+      Log.error("Batch Delete Comics", e.toString());
+      _db.execute("ROLLBACK");
+      return;
+    }
+    _db.execute("COMMIT");
+    notifyListeners();
+  }
+
+  void batchDeleteComicsInAllFolders(List<ComicID> comics) {
+    _modifiedAfterLastCache = true;
+    _db.execute("BEGIN TRANSACTION");
+    var folderNames = _getFolderNamesWithDB();
+    try {
+      for (var comic in comics) {
+        LocalFavoriteImageProvider.delete(comic.id, comic.type.value);
+        for (var folder in folderNames) {
+          _db.execute("""
+            delete from "$folder"
+            where id == ? and type == ?;
+          """, [comic.id, comic.type.value]);
+        }
+      }
+    } catch (e) {
+      Log.error("Batch Delete Comics in All Folders", e.toString());
+      _db.execute("ROLLBACK");
+      return;
+    }
+    initCounts();
+    _db.execute("COMMIT");
     notifyListeners();
   }
 
@@ -562,11 +854,26 @@ class LocalFavoritesManager with ChangeNotifier {
     if (!existsFolder(folder)) {
       throw Exception("Failed to reorder: folder not found");
     }
-    deleteFolder(folder);
+    _db.execute("BEGIN TRANSACTION");
-    createFolder(folder);
+    try {
       for (int i = 0; i < newFolder.length; i++) {
-      addComic(folder, newFolder[i], i);
+        _db.execute("""
+          update "$folder"
+          set display_order = ?
+          where id == ? and type == ?;
+        """, [
+          i,
+          newFolder[i].id,
+          newFolder[i].type.value
+        ]);
       }
+    }
+    catch (e) {
+      Log.error("Reorder", e.toString());
+      _db.execute("ROLLBACK");
+      return;
+    }
+    _db.execute("COMMIT");
     notifyListeners();
   }
 
@@ -591,14 +898,18 @@ class LocalFavoritesManager with ChangeNotifier {
       set folder_name = ?
       where folder_name == ?;
     """, [after, before]);
+    counts[after] = counts[before] ?? 0;
+    counts.remove(before);
     notifyListeners();
   }
 
   void onRead(String id, ComicType type) async {
     if (appdata.settings['moveFavoriteAfterRead'] == "none") {
+      markAsRead(id, type);
       return;
     }
     _modifiedAfterLastCache = true;
+    var followUpdatesFolder = appdata.settings['followUpdatesFolder'];
     for (final folder in folderNames) {
       var rows = _db.select("""
         select * from "$folder"
@@ -627,9 +938,13 @@ class LocalFavoritesManager with ChangeNotifier {
             UPDATE "$folder"
             SET 
               $updateLocationSql
+              ${followUpdatesFolder == folder ? "has_new_update = 0," : ""}
               time = ?
-            WHERE id == ?;
+            WHERE id == ? and type == ?;
-          """, [newTime, id]);
+          """, [newTime, id, type.value]);
+        if (followUpdatesFolder == folder) {
+          updateFollowUpdatesUI();
+        }
       }
     }
     notifyListeners();
@@ -662,10 +977,10 @@ class LocalFavoritesManager with ChangeNotifier {
     return comics;
   }
 
-  List<FavoriteItemWithFolderInfo> search(String keyword) {
+  List<FavoriteItem> search(String keyword) {
     var keywordList = keyword.split(" ");
     keyword = keywordList.first;
-    var comics = <FavoriteItemWithFolderInfo>[];
+    var comics = <FavoriteItem>{};
     for (var table in folderNames) {
       keyword = "%$keyword%";
       var res = _db.select("""
@@ -673,15 +988,18 @@ class LocalFavoritesManager with ChangeNotifier {
         WHERE name LIKE ? OR author LIKE ? OR tags LIKE ? OR translated_tags LIKE ?;
       """, [keyword, keyword, keyword, keyword]);
       for (var comic in res) {
-        comics.add(
+        comics.add(FavoriteItem.fromRow(comic));
-            FavoriteItemWithFolderInfo(FavoriteItem.fromRow(comic), table));
       }
       if (comics.length > 200) {
         break;
       }
     }
 
-    bool test(FavoriteItemWithFolderInfo comic, String keyword) {
+    bool test(FavoriteItem comic, String keyword) {
+      keyword = keyword.trim();
+      if (keyword.isEmpty) {
+        return true;
+      }
       if (comic.name.contains(keyword)) {
         return true;
       } else if (comic.author.contains(keyword)) {
@@ -692,12 +1010,14 @@ class LocalFavoritesManager with ChangeNotifier {
       return false;
     }
 
+    return comics.where((element) {
       for (var i = 1; i < keywordList.length; i++) {
-      comics =
+        if (!test(element, keywordList[i])) {
-          comics.where((element) => test(element, keywordList[i])).toList();
+          return false;
         }
-
+      }
-    return comics;
+      return true;
+    }).toList();
   }
 
   void editTags(String id, String folder, List<String> tags) {
@@ -733,7 +1053,7 @@ class LocalFavoritesManager with ChangeNotifier {
     }
   }
 
-  void updateInfo(String folder, FavoriteItem comic) {
+  void updateInfo(String folder, FavoriteItem comic, [bool notify = true]) {
     _db.execute("""
       update "$folder"
       set name = ?, author = ?, cover_path = ?, tags = ?
@@ -746,8 +1066,10 @@ class LocalFavoritesManager with ChangeNotifier {
       comic.id,
       comic.type.value
     ]);
+    if (notify) {
       notifyListeners();
     }
+  }
 
   String folderToJson(String folder) {
     var res = _db.select("""
@@ -783,7 +1105,136 @@ class LocalFavoritesManager with ChangeNotifier {
     }
   }
 
+  void prepareTableForFollowUpdates(String table, [bool clearData = true]) {
+    // check if the table has the column "last_update_time" "has_new_update" "last_check_time"
+    var columns = _db.select("""
+      pragma table_info("$table");
+    """);
+    if (!columns.any((element) => element["name"] == "last_update_time")) {
+      _db.execute("""
+        alter table "$table"
+        add column last_update_time TEXT;
+      """);
+    }
+    if (!columns.any((element) => element["name"] == "has_new_update")) {
+      _db.execute("""
+        alter table "$table"
+        add column has_new_update int;
+      """);
+    }
+    if (clearData) {
+      _db.execute("""
+        update "$table"
+        set has_new_update = 0;
+      """);
+    }
+    if (!columns.any((element) => element["name"] == "last_check_time")) {
+      _db.execute("""
+        alter table "$table"
+        add column last_check_time int;
+      """);
+    }
+  }
+
+  void updateUpdateTime(
+    String folder,
+    String id,
+    ComicType type,
+    String updateTime,
+  ) {
+    var oldTime = _db.select("""
+      select last_update_time from "$folder"
+      where id == ? and type == ?;
+    """, [id, type.value]).first['last_update_time'];
+    var hasNewUpdate = oldTime != updateTime;
+    _db.execute("""
+      update "$folder"
+      set last_update_time = ?, has_new_update = ?, last_check_time = ?
+      where id == ? and type == ?;
+    """, [
+      updateTime,
+      hasNewUpdate ? 1 : 0,
+      DateTime.now().millisecondsSinceEpoch,
+      id,
+      type.value,
+    ]);
+  }
+
+  void updateCheckTime(
+    String folder,
+    String id,
+    ComicType type,
+  ) {
+    _db.execute("""
+      update "$folder"
+      set last_check_time = ?
+      where id == ? and type == ?;
+    """, [DateTime.now().millisecondsSinceEpoch, id, type.value]);
+  }
+
+  int countUpdates(String folder) {
+    return _db.select("""
+      select count(*) as c from "$folder"
+      where has_new_update == 1;
+    """).first['c'];
+  }
+
+  List<FavoriteItemWithUpdateInfo> getUpdates(String folder) {
+    if (!existsFolder(folder)) {
+      return [];
+    }
+    var res = _db.select("""
+      select * from "$folder"
+      where has_new_update == 1;
+    """);
+    return res
+        .map(
+          (e) => FavoriteItemWithUpdateInfo(
+            FavoriteItem.fromRow(e),
+            e['last_update_time'],
+            e['has_new_update'] == 1,
+            e['last_check_time'],
+          ),
+        )
+        .toList();
+  }
+
+  List<FavoriteItemWithUpdateInfo> getComicsWithUpdatesInfo(String folder) {
+    if (!existsFolder(folder)) {
+      return [];
+    }
+    var res = _db.select("""
+      select * from "$folder";
+    """);
+    return res
+        .map(
+          (e) => FavoriteItemWithUpdateInfo(
+            FavoriteItem.fromRow(e),
+            e['last_update_time'],
+            e['has_new_update'] == 1,
+            e['last_check_time'],
+          ),
+        )
+        .toList();
+  }
+
+  void markAsRead(String id, ComicType type) {
+    var folder = appdata.settings['followUpdatesFolder'];
+    if (!existsFolder(folder)) {
+      return;
+    }
+    _db.execute("""
+      update "$folder"
+      set has_new_update = 0
+      where id == ? and type == ?;
+    """, [id, type.value]);
+  }
+
   void close() {
     _db.dispose();
   }
+
+  void notifyChanges() {
+    notifyListeners();
+  }
 }

lib/foundation/global_state.dart

@@ -0,0 +1,66 @@
+import 'package:flutter/widgets.dart';
+
+abstract class GlobalState {
+  static final _state = <Pair<Object?, State>>[];
+
+  static void register(State state, [Object? key]) {
+    _state.add(Pair(key, state));
+  }
+
+  static T find<T extends State>([Object? key]) {
+    for (var pair in _state) {
+      if ((key == null || pair.left == key) && pair.right is T) {
+        return pair.right as T;
+      }
+    }
+    throw Exception('State not found');
+  }
+
+  static T? findOrNull<T extends State>([Object? key]) {
+    for (var pair in _state) {
+      if ((key == null || pair.left == key) && pair.right is T) {
+        return pair.right as T;
+      }
+    }
+    return null;
+  }
+
+  static void unregister(State state, [Object? key]) {
+    _state.removeWhere(
+        (pair) => (key == null || pair.left == key) && pair.right == state);
+  }
+}
+
+class Pair<K, V> {
+  K left;
+  V right;
+
+  Pair(this.left, this.right);
+}
+
+abstract class AutomaticGlobalState<T extends StatefulWidget>
+    extends State<T> {
+  @override
+  @mustCallSuper
+  void initState() {
+    super.initState();
+    GlobalState.register(this, key);
+  }
+
+  @override
+  @mustCallSuper
+  void dispose() {
+    super.dispose();
+    GlobalState.unregister(this, key);
+  }
+
+  Object? get key;
+
+  void update() {
+    setState(() {});
+  }
+
+  void refresh() {
+    update();
+  }
+}

lib/foundation/history.dart

@@ -2,6 +2,7 @@ import 'dart:async';
 import 'dart:convert';
 import 'dart:isolate';
 import 'dart:math';
+import 'dart:ffi' as ffi;
 
 import 'package:flutter/foundation.dart';
 import 'package:flutter/services.dart';
@@ -9,6 +10,7 @@ import 'package:flutter/widgets.dart' show ChangeNotifier;
 import 'package:sqlite3/sqlite3.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
 import 'package:venera/foundation/comic_type.dart';
+import 'package:venera/foundation/favorites.dart';
 import 'package:venera/foundation/image_provider/image_favorites_provider.dart';
 import 'package:venera/foundation/log.dart';
 import 'package:venera/utils/ext.dart';
@@ -49,17 +51,24 @@ class History implements Comic {
   @override
   String cover;
 
+  /// index of chapters. 1-based.
   int ep;
 
+  /// index of pages. 1-based.
   int page;
 
+  /// index of chapter groups. 1-based.
+  /// If [group] is not null, [ep] is the index of chapter in the group.
+  int? group;
+
   @override
   String id;
 
   /// readEpisode is a set of episode numbers that have been read.
-  ///
+  /// For normal chapters, it is a set of chapter numbers.
-  /// The number of episodes is 1-based.
+  /// For grouped chapters, it is a set of strings in the format of "group_number-chapter_number".
-  Set<int> readEpisode;
+  /// 1-based.
+  Set<String> readEpisode;
 
   @override
   int? maxPage;
@@ -68,29 +77,17 @@ class History implements Comic {
       {required HistoryMixin model,
       required this.ep,
       required this.page,
-      Set<int>? readChapters,
+      this.group,
+      Set<String>? readChapters,
       DateTime? time})
       : type = model.historyType,
         title = model.title,
         subtitle = model.subTitle ?? '',
         cover = model.cover,
         id = model.id,
-        readEpisode = readChapters ?? <int>{},
+        readEpisode = readChapters ?? <String>{},
         time = time ?? DateTime.now();
 
-  Map<String, dynamic> toMap() => {
-        "type": type.value,
-        "time": time.millisecondsSinceEpoch,
-        "title": title,
-        "subtitle": subtitle,
-        "cover": cover,
-        "ep": ep,
-        "page": page,
-        "id": id,
-        "readEpisode": readEpisode.toList(),
-        "max_page": maxPage
-      };
-
   History.fromMap(Map<String, dynamic> map)
       : type = HistoryType(map["type"]),
         time = DateTime.fromMillisecondsSinceEpoch(map["time"]),
@@ -100,8 +97,9 @@ class History implements Comic {
         ep = map["ep"],
         page = map["page"],
         id = map["id"],
-        readEpisode = Set<int>.from(
+        readEpisode = Set<String>.from(
-            (map["readEpisode"] as List<dynamic>?)?.toSet() ?? const <int>{}),
+            (map["readEpisode"] as List<dynamic>?)?.toSet() ??
+                const <String>{}),
         maxPage = map["max_page"];
 
   @override
@@ -118,35 +116,11 @@ class History implements Comic {
         ep = row["ep"],
         page = row["page"],
         id = row["id"],
-        readEpisode = Set<int>.from((row["readEpisode"] as String)
+        readEpisode = Set<String>.from((row["readEpisode"] as String)
             .split(',')
-            .where((element) => element != "")
+            .where((element) => element != "")),
-            .map((e) => int.parse(e))),
+        maxPage = row["max_page"],
-        maxPage = row["max_page"];
+        group = row["chapter_group"];
-
-  static Future<History> findOrCreate(
-    HistoryMixin model, {
-    int ep = 0,
-    int page = 0,
-  }) async {
-    var history = await HistoryManager().find(model.id, model.historyType);
-    if (history != null) {
-      return history;
-    }
-    history = History.fromModel(model: model, ep: ep, page: page);
-    HistoryManager().addHistory(history);
-    return history;
-  }
-
-  static Future<History> createIfNull(
-      History? history, HistoryMixin model) async {
-    if (history != null) {
-      return history;
-    }
-    history = History.fromModel(model: model, ep: 0, page: 0);
-    HistoryManager().addHistory(history);
-    return history;
-  }
 
   @override
   bool operator ==(Object other) {
@@ -159,6 +133,11 @@ class History implements Comic {
   @override
   String get description {
     var res = "";
+    if (group != null){
+      res += "${"Group @group".tlParams({
+        "group": group!,
+      })} - ";
+    }
     if (ep >= 1) {
       res += "Chapter @ep".tlParams({
         "ep": ep,
@@ -210,7 +189,11 @@ class HistoryManager with ChangeNotifier {
 
   int get length => _db.select("select count(*) from history;").first[0] as int;
 
-  Map<String, bool>? _cachedHistory;
+  /// Cache of history ids. Improve the performance of find operation.
+  Map<String, bool>? _cachedHistoryIds;
+
+  /// Cache records recently modified by the app. Improve the performance of listeners.
+  final cachedHistories = <String, History>{};
 
   bool isInitialized = false;
 
@@ -231,23 +214,30 @@ class HistoryManager with ChangeNotifier {
           ep int,
           page int,
           readEpisode text,
-          max_page int
+          max_page int,
+          chapter_group int
         );
       """);
 
+    var columns = _db.select("PRAGMA table_info(history);");
+    if (!columns.any((element) => element["name"] == "chapter_group")) {
+      _db.execute("alter table history add column chapter_group int;");
+    }
+
     notifyListeners();
     ImageFavoriteManager().init();
     isInitialized = true;
   }
 
-  /// add history. if exists, update time.
+  static const _insertHistorySql = """
-  ///
+        insert or replace into history (id, title, subtitle, cover, time, type, ep, page, readEpisode, max_page, chapter_group)
-  /// This function would be called when user start reading.
+        values (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?);
-  Future<void> addHistory(History newItem) async {
+      """;
-    _db.execute("""
+
-        insert or replace into history (id, title, subtitle, cover, time, type, ep, page, readEpisode, max_page)
+  static Future<void> _addHistoryAsync(int dbAddr, History newItem) {
-        values (?, ?, ?, ?, ?, ?, ?, ?, ?, ?);
+    return Isolate.run(() {
-      """, [
+      var db = sqlite3.fromPointer(ffi.Pointer.fromAddress(dbAddr));
+      db.execute(_insertHistorySql, [
         newItem.id,
         newItem.title,
         newItem.subtitle,
@@ -257,9 +247,61 @@ class HistoryManager with ChangeNotifier {
         newItem.ep,
         newItem.page,
         newItem.readEpisode.join(','),
-      newItem.maxPage
+        newItem.maxPage,
+        newItem.group
       ]);
+    });
+  }
+
+  bool _haveAsyncTask = false;
+
+  /// Create a isolate to add history to prevent blocking the UI thread.
+  Future<void> addHistoryAsync(History newItem) async {
+    while (_haveAsyncTask) {
+      await Future.delayed(Duration(milliseconds: 20));
+    }
+
+    _haveAsyncTask = true;
+    await _addHistoryAsync(_db.handle.address, newItem);
+    _haveAsyncTask = false;
+    if (_cachedHistoryIds == null) {
       updateCache();
+    } else {
+      _cachedHistoryIds![newItem.id] = true;
+    }
+    cachedHistories[newItem.id] = newItem;
+    if (cachedHistories.length > 10) {
+      cachedHistories.remove(cachedHistories.keys.first);
+    }
+    notifyListeners();
+  }
+
+  /// add history. if exists, update time.
+  ///
+  /// This function would be called when user start reading.
+  void addHistory(History newItem) {
+    _db.execute(_insertHistorySql, [
+      newItem.id,
+      newItem.title,
+      newItem.subtitle,
+      newItem.cover,
+      newItem.time.millisecondsSinceEpoch,
+      newItem.type.value,
+      newItem.ep,
+      newItem.page,
+      newItem.readEpisode.join(','),
+      newItem.maxPage,
+      newItem.group
+    ]);
+    if (_cachedHistoryIds == null) {
+      updateCache();
+    } else {
+      _cachedHistoryIds![newItem.id] = true;
+    }
+    cachedHistories[newItem.id] = newItem;
+    if (cachedHistories.length > 10) {
+      cachedHistories.remove(cachedHistories.keys.first);
+    }
     notifyListeners();
   }
 
@@ -269,6 +311,31 @@ class HistoryManager with ChangeNotifier {
     notifyListeners();
   }
 
+void clearUnfavoritedHistory() {
+  _db.execute('BEGIN TRANSACTION;');
+  try {
+    final idAndTypes = _db.select("""
+      select id, type from history;
+    """);
+    for (var element in idAndTypes) {
+      final id = element["id"] as String;
+      final type = ComicType(element["type"] as int);
+      if (!LocalFavoritesManager().isExist(id, type)) {
+        _db.execute("""
+          delete from history
+          where id == ? and type == ?;
+        """, [id, type.value]);
+      }
+    }
+    _db.execute('COMMIT;');
+  } catch (e) {
+    _db.execute('ROLLBACK;');
+    rethrow;
+  }
+  updateCache();
+  notifyListeners();
+}
+
   void remove(String id, ComicType type) async {
     _db.execute("""
       delete from history
@@ -278,27 +345,31 @@ class HistoryManager with ChangeNotifier {
     notifyListeners();
   }
 
-  Future<History?> find(String id, ComicType type) async {
-    return findSync(id, type);
-  }
-
   void updateCache() {
-    _cachedHistory = {};
+    _cachedHistoryIds = {};
     var res = _db.select("""
-        select * from history;
+        select id from history;
       """);
     for (var element in res) {
-      _cachedHistory![element["id"] as String] = true;
+      _cachedHistoryIds![element["id"] as String] = true;
+    }
+    for (var key in cachedHistories.keys.toList()) {
+      if (!_cachedHistoryIds!.containsKey(key)) {
+        cachedHistories.remove(key);
+      }
     }
   }
 
-  History? findSync(String id, ComicType type) {
+  History? find(String id, ComicType type) {
-    if (_cachedHistory == null) {
+    if (_cachedHistoryIds == null) {
       updateCache();
     }
-    if (!_cachedHistory!.containsKey(id)) {
+    if (!_cachedHistoryIds!.containsKey(id)) {
       return null;
     }
+    if (cachedHistories.containsKey(id)) {
+      return cachedHistories[id];
+    }
 
     var res = _db.select("""
       select * from history
@@ -340,4 +411,23 @@ class HistoryManager with ChangeNotifier {
     isInitialized = false;
     _db.dispose();
   }
+
+  void batchDeleteHistories(List<ComicID> histories) {
+    if (histories.isEmpty) return;
+    _db.execute('BEGIN TRANSACTION;');
+    try {
+      for (var history in histories) {
+        _db.execute("""
+          delete from history
+          where id == ? and type == ?;
+        """, [history.id, history.type.value]);
+      }
+      _db.execute('COMMIT;');
+    } catch (e) {
+      _db.execute('ROLLBACK;');
+      rethrow;
+    }
+    updateCache();
+    notifyListeners();
+  }
 }

lib/foundation/image_favorites.dart

@@ -396,7 +396,7 @@ class ImageFavoriteManager with ChangeNotifier {
     var token = ServicesBinding.rootIsolateToken!;
     var count = ImageFavoriteManager().length;
     if (count == 0) {
-      return Future.value(ImageFavoritesComputed([], [], []));
+      return Future.value(ImageFavoritesComputed([], [], [], 0));
     } else if (count > 100) {
       return Isolate.run(() async {
         BackgroundIsolateBinaryMessenger.ensureInitialized(token);
@@ -436,8 +436,10 @@ class ImageFavoriteManager with ChangeNotifier {
     Map<String, int> authorCount = {};
     Map<ImageFavoritesComic, int> comicImageCount = {};
     Map<ImageFavoritesComic, int> comicMaxPages = {};
+    int count = 0;
 
     for (var comic in comics) {
+      count += comic.images.length;
       for (var tag in comic.tags) {
         String finalTag = tag;
         tagCount[finalTag] = (tagCount[finalTag] ?? 0) + 1;
@@ -492,6 +494,7 @@ class ImageFavoriteManager with ChangeNotifier {
           .map((comic) => TextWithCount(comic.key.title, comic.value))
           .take(maxLength)
           .toList(),
+      count,
     );
   }
 
@@ -524,11 +527,14 @@ class ImageFavoritesComputed {
   /// 基于喜欢的图片数排序
   final List<TextWithCount> comics;
 
+  final int count;
+
   /// 计算后的图片收藏数据
   const ImageFavoritesComputed(
     this.tags,
     this.authors,
     this.comics,
+    this.count,
   );
 
   bool get isEmpty => tags.isEmpty && authors.isEmpty && comics.isEmpty;

lib/foundation/image_provider/image_favorites_provider.dart

@@ -97,7 +97,7 @@ class ImageFavoritesProvider
     if (localComic == null) {
       return null;
     }
-    var epIndex = localComic.chapters?.keys.toList().indexOf(eid) ?? -1;
+    var epIndex = localComic.chapters?.ids.toList().indexOf(eid) ?? -1;
     if (epIndex == -1 && localComic.hasChapters) {
       return null;
     }

lib/foundation/image_provider/reader_image.dart

@@ -63,7 +63,8 @@ class ReaderImageProvider
         })()
       ''');
       if (func is JSInvokable) {
-        var result = func.invoke([imageBytes, cid, eid, page, sourceKey]);
+        var autoFreeFunc = JSAutoFreeFunction(func);
+        var result = autoFreeFunc([imageBytes, cid, eid, page, sourceKey]);
         if (result is Uint8List) {
           imageBytes = result;
         } else if (result is Future) {
@@ -76,9 +77,9 @@ class ReaderImageProvider
           if (image is Uint8List) {
             imageBytes = image;
           } else if (image is Future) {
-            JSInvokable? onCancel;
+            JSAutoFreeFunction? onCancel;
             if (result['onCancel'] is JSInvokable) {
-              onCancel = result['onCancel'];
+              onCancel = JSAutoFreeFunction(result['onCancel']);
             }
             if (onCancel == null) {
               var futureImage = await image;
@@ -96,9 +97,7 @@ class ReaderImageProvider
                   checkStop();
                 }
                 catch(e) {
-                  onCancel.invoke([]);
+                  onCancel([]);
-                  onCancel.free();
-                  func.free();
                   rethrow;
                 }
                 await Future.delayed(Duration(milliseconds: 50));
@@ -107,10 +106,8 @@ class ReaderImageProvider
                 imageBytes = futureImage;
               }
             }
-            onCancel?.free();
           }
         }
-        func.free();
       }
     }
     return imageBytes!;

lib/foundation/js_engine.dart

@@ -3,7 +3,8 @@ import 'dart:io';
 import 'dart:math' as math;
 import 'package:crypto/crypto.dart';
 import 'package:dio/io.dart';
-import 'package:flutter/material.dart';
+import 'package:enough_convert/enough_convert.dart';
+import 'package:flutter/foundation.dart' show protected;
 import 'package:flutter/services.dart';
 import 'package:html/parser.dart' as html;
 import 'package:html/dom.dart' as dom;
@@ -20,12 +21,13 @@ import 'package:pointycastle/block/modes/cbc.dart';
 import 'package:pointycastle/block/modes/cfb.dart';
 import 'package:pointycastle/block/modes/ecb.dart';
 import 'package:pointycastle/block/modes/ofb.dart';
-import 'package:url_launcher/url_launcher_string.dart';
 import 'package:uuid/uuid.dart';
-import 'package:venera/components/components.dart';
+import 'package:venera/components/js_ui.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/network/app_dio.dart';
 import 'package:venera/network/cookie_jar.dart';
+import 'package:venera/network/proxy.dart';
+import 'package:venera/utils/init.dart';
 
 import 'comic_source/comic_source.dart';
 import 'consts.dart';
@@ -42,7 +44,7 @@ class JavaScriptRuntimeException implements Exception {
   }
 }
 
-class JsEngine with _JSEngineApi, _JsUiApi {
+class JsEngine with _JSEngineApi, JsUiApi, Init {
   factory JsEngine() => _cache ?? (_cache = JsEngine._create());
 
   static JsEngine? _cache;
@@ -66,7 +68,9 @@ class JsEngine with _JSEngineApi, _JsUiApi {
         responseType: ResponseType.plain, validateStatus: (status) => true));
   }
 
-  Future<void> init() async {
+  @override
+  @protected
+  Future<void> doInit() async {
     if (!_closed) {
       return;
     }
@@ -156,7 +160,18 @@ class JsEngine with _JSEngineApi, _JsUiApi {
           case "delay":
             return Future.delayed(Duration(milliseconds: message["time"]));
           case "UI":
-            handleUIMessage(Map.from(message));
+            return handleUIMessage(Map.from(message));
+          case "getLocale":
+            return "${App.locale.languageCode}_${App.locale.countryCode}";
+          case "getPlatform":
+            return Platform.operatingSystem;
+          case "setClipboard":
+            return Clipboard.setData(ClipboardData(text: message["text"]));
+          case "getClipboard":
+            return Future.sync(() async {
+              var res = await Clipboard.getData(Clipboard.kTextPlain);
+              return res?.text;
+            });
         }
       }
       return null;
@@ -181,7 +196,7 @@ class JsEngine with _JSEngineApi, _JsUiApi {
           responseType: ResponseType.plain,
           validateStatus: (status) => true,
         ));
-        var proxy = await AppDio.getProxy();
+        var proxy = await getProxy();
         dio.httpClientAdapter = IOHttpClientAdapter(
           createHttpClient: () {
             return HttpClient()
@@ -358,6 +373,11 @@ mixin class _JSEngineApi {
       switch (type) {
         case "utf8":
           return isEncode ? utf8.encode(value) : utf8.decode(value);
+        case "gbk":
+          final codec = const GbkCodec();
+          return isEncode
+              ? Uint8List.fromList(codec.encode(value))
+              : codec.decode(value);
         case "base64":
           return isEncode ? base64Encode(value) : base64Decode(value);
         case "md5":
@@ -679,6 +699,7 @@ class JSAutoFreeFunction {
 
   /// Automatically free the function when it's not used anymore
   JSAutoFreeFunction(this.func) {
+    func.dup();
     finalizer.attach(this, func);
   }
 
@@ -687,48 +708,6 @@ class JSAutoFreeFunction {
   }
 
   static final finalizer = Finalizer<JSInvokable>((func) {
-    func.free();
+    func.destroy();
   });
 }
-
-mixin class _JsUiApi {
-  void handleUIMessage(Map<String, dynamic> message) {
-    switch (message['function']) {
-      case 'showMessage':
-        var m = message['message'];
-        if (m.toString().isNotEmpty) {
-          App.rootContext.showMessage(message: m.toString());
-        }
-      case 'showDialog':
-        _showDialog(message);
-      case 'launchUrl':
-        var url = message['url'];
-        if (url.toString().isNotEmpty) {
-          launchUrlString(url.toString());
-        }
-    }
-  }
-
-  void _showDialog(Map<String, dynamic> message) {
-    var title = message['title'];
-    var content = message['content'];
-    var actions = <String, JSAutoFreeFunction>{};
-    for (var action in message['actions']) {
-      actions[action['text']] = JSAutoFreeFunction(action['callback']);
-    }
-    showDialog(context: App.rootContext, builder: (context) {
-      return ContentDialog(
-        title: title,
-        content: Text(content).paddingHorizontal(16),
-        actions: actions.entries.map((entry) {
-          return TextButton(
-            onPressed: () {
-              entry.value.call([]);
-            },
-            child: Text(entry.key),
-          );
-        }).toList(),
-      );
-    });
-  }
-}

lib/foundation/local.dart

@@ -1,6 +1,8 @@
 import 'dart:convert';
+import 'dart:isolate';
 
 import 'package:flutter/widgets.dart' show ChangeNotifier;
+import 'package:flutter_saf/flutter_saf.dart';
 import 'package:path_provider/path_provider.dart';
 import 'package:sqlite3/sqlite3.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
@@ -9,7 +11,6 @@ import 'package:venera/foundation/favorites.dart';
 import 'package:venera/foundation/log.dart';
 import 'package:venera/network/download.dart';
 import 'package:venera/pages/reader/reader.dart';
-import 'package:venera/utils/ext.dart';
 import 'package:venera/utils/io.dart';
 
 import 'app.dart';
@@ -34,7 +35,7 @@ class LocalComic with HistoryMixin implements Comic {
   /// key: chapter id, value: chapter title
   ///
   /// chapter id is the name of the directory in `LocalManager.path/$directory`
-  final Map<String, String>? chapters;
+  final ComicChapters? chapters;
 
   bool get hasChapters => chapters != null;
 
@@ -67,7 +68,7 @@ class LocalComic with HistoryMixin implements Comic {
         subtitle = row[2] as String,
         tags = List.from(jsonDecode(row[3] as String)),
         directory = row[4] as String,
-        chapters = MapOrNull.from(jsonDecode(row[5] as String)),
+        chapters = ComicChapters.fromJsonOrNull(jsonDecode(row[5] as String)),
         cover = row[6] as String,
         comicType = ComicType(row[7] as int),
         downloadedChapters = List.from(jsonDecode(row[8] as String)),
@@ -99,22 +100,51 @@ class LocalComic with HistoryMixin implements Comic {
       "tags": tags,
       "description": description,
       "sourceKey": sourceKey,
+      "chapters": chapters?.toJson(),
     };
   }
 
   @override
   int? get maxPage => null;
 
-  void read() async {
+  void read() {
-    var history = await HistoryManager().find(id, comicType);
+    var history = HistoryManager().find(id, comicType);
+    int? firstDownloadedChapter;
+    int? firstDownloadedChapterGroup;
+    if (downloadedChapters.isNotEmpty && chapters != null) {
+      final chapters = this.chapters!;
+      if (chapters.isGrouped) {
+        for (int i=0; i<chapters.groupCount; i++) {
+          var group = chapters.getGroupByIndex(i);
+          var keys = group.keys.toList();
+          for (int j=0; j<keys.length; j++) {
+            var chapterId = keys[j];
+            if (downloadedChapters.contains(chapterId)) {
+              firstDownloadedChapter = j + 1;
+              firstDownloadedChapterGroup = i + 1;
+              break;
+            }
+          }
+        }
+      } else {
+        var keys = chapters.allChapters.keys;
+        for (int i = 0; i < keys.length; i++) {
+          if (downloadedChapters.contains(keys.elementAt(i))) {
+            firstDownloadedChapter = i + 1;
+            break;
+          }
+        }
+      }
+    }
     App.rootContext.to(
       () => Reader(
         type: comicType,
         cid: id,
         name: title,
         chapters: chapters,
-        initialChapter: history?.ep,
+        initialChapter: history?.ep ?? firstDownloadedChapter,
         initialPage: history?.page,
+        initialChapterGroup: history?.group ?? firstDownloadedChapterGroup,
         history: history ??
             History.fromModel(
               model: this,
@@ -264,6 +294,7 @@ class LocalManager with ChangeNotifier {
     }
     _checkPathValidation();
     _checkNoMedia();
+    await ComicSourceManager().ensureInit();
     restoreDownloadingTasks();
   }
 
@@ -391,7 +422,7 @@ class LocalManager with ChangeNotifier {
     var directory = Directory(comic.baseDir);
     if (comic.hasChapters) {
       var cid =
-          ep is int ? comic.chapters!.keys.elementAt(ep - 1) : (ep as String);
+          ep is int ? comic.chapters!.ids.elementAt(ep - 1) : (ep as String);
       directory = Directory(FilePath.join(directory.path, cid));
     }
     var files = <File>[];
@@ -420,12 +451,30 @@ class LocalManager with ChangeNotifier {
     return files.map((e) => "file://${e.path}").toList();
   }
 
-  bool isDownloaded(String id, ComicType type, [int? ep]) {
+  bool isDownloaded(String id, ComicType type,
+      [int? ep, ComicChapters? chapters]) {
     var comic = find(id, type);
     if (comic == null) return false;
     if (comic.chapters == null || ep == null) return true;
+    if (chapters != null) {
+      if (comic.chapters?.length != chapters.length) {
+        // update
+        add(LocalComic(
+          id: comic.id,
+          title: comic.title,
+          subtitle: comic.subtitle,
+          tags: comic.tags,
+          directory: comic.directory,
+          chapters: chapters,
+          cover: comic.cover,
+          comicType: comic.comicType,
+          downloadedChapters: comic.downloadedChapters,
+          createdAt: comic.createdAt,
+        ));
+      }
+    }
     return comic.downloadedChapters
-        .contains(comic.chapters!.keys.elementAt(ep - 1));
+        .contains((chapters ?? comic.chapters)!.ids.elementAtOrNull(ep - 1));
   }
 
   List<DownloadTask> downloadingTasks = [];
@@ -441,6 +490,10 @@ class LocalManager with ChangeNotifier {
     if (comic != null) {
       return Directory(FilePath.join(path, comic.directory));
     }
+    const comicDirectoryMaxLength = 80;
+    if (name.length > comicDirectoryMaxLength) {
+      name = name.substring(0, comicDirectoryMaxLength);
+    }
     var dir = findValidDirectoryName(path, name);
     return Directory(FilePath.join(path, dir)).create().then((value) => value);
   }
@@ -509,9 +562,9 @@ class LocalManager with ChangeNotifier {
       var dir = Directory(FilePath.join(path, c.directory));
       dir.deleteIgnoreError(recursive: true);
     }
-    // Deleting a local comic means that it's nolonger available, thus both favorite and history should be deleted.
+    // Deleting a local comic means that it's no longer available, thus both favorite and history should be deleted.
     if (c.comicType == ComicType.local) {
-      if (HistoryManager().findSync(c.id, c.comicType) != null) {
+      if (HistoryManager().find(c.id, c.comicType) != null) {
         HistoryManager().remove(c.id, c.comicType);
       }
       var folders = LocalFavoritesManager().find(c.id, c.comicType);
@@ -522,6 +575,99 @@ class LocalManager with ChangeNotifier {
     remove(c.id, c.comicType);
     notifyListeners();
   }
+
+  void deleteComicChapters(LocalComic c, List<String> chapters) {
+    if (chapters.isEmpty) {
+      return;
+    }
+    var newDownloadedChapters = c.downloadedChapters
+        .where((e) => !chapters.contains(e))
+        .toList();
+    if (newDownloadedChapters.isNotEmpty) {
+      _db.execute(
+        'UPDATE comics SET downloadedChapters = ? WHERE id = ? AND comic_type = ?;',
+        [
+          jsonEncode(newDownloadedChapters),
+          c.id,
+          c.comicType.value,
+        ],
+      );
+    } else {
+      _db.execute(
+        'DELETE FROM comics WHERE id = ? AND comic_type = ?;',
+        [c.id, c.comicType.value],
+      );
+    }
+    var shouldRemovedDirs = <Directory>[];
+    for (var chapter in chapters) {
+      var dir = Directory(FilePath.join(c.baseDir, chapter));
+      if (dir.existsSync()) {
+        shouldRemovedDirs.add(dir);
+      }
+    }
+    if (shouldRemovedDirs.isNotEmpty) {
+      _deleteDirectories(shouldRemovedDirs);
+    }
+    notifyListeners();
+  }
+
+  void batchDeleteComics(List<LocalComic> comics, [bool removeFileOnDisk = true, bool removeFavoriteAndHistory = true]) {
+    if (comics.isEmpty) {
+      return;
+    }
+
+    var shouldRemovedDirs = <Directory>[];
+    _db.execute('BEGIN TRANSACTION;');
+    try {
+      for (var c in comics) {
+        if (removeFileOnDisk) {
+          var dir = Directory(FilePath.join(path, c.directory));
+          if (dir.existsSync()) {
+            shouldRemovedDirs.add(dir);
+          }
+        }
+        _db.execute(
+          'DELETE FROM comics WHERE id = ? AND comic_type = ?;',
+          [c.id, c.comicType.value],
+        );
+      }
+    }
+    catch(e, s) {
+      Log.error("LocalManager", "Failed to batch delete comics: $e", s);
+      _db.execute('ROLLBACK;');
+      return;
+    }
+    _db.execute('COMMIT;');
+
+    var comicIDs = comics.map((e) => ComicID(e.comicType, e.id)).toList();
+
+    if (removeFavoriteAndHistory) {
+      LocalFavoritesManager().batchDeleteComicsInAllFolders(comicIDs);
+      HistoryManager().batchDeleteHistories(comicIDs);
+    }
+
+    notifyListeners();
+
+    if (removeFileOnDisk) {
+      _deleteDirectories(shouldRemovedDirs);
+    }
+  }
+
+  /// Deletes the directories in a separate isolate to avoid blocking the UI thread.
+  static void _deleteDirectories(List<Directory> directories) {
+    Isolate.run(() async {
+      await SAFTaskWorker().init();
+      for (var dir in directories) {
+        try {
+          if (dir.existsSync()) {
+            await dir.delete(recursive: true);
+          }
+        } catch (e) {
+          continue;
+        }
+      }
+    });
+  }
 }
 
 enum LocalSortType {

lib/foundation/log.dart

@@ -1,7 +1,7 @@
-import 'dart:io';
-
 import 'package:flutter/foundation.dart';
+import 'package:venera/foundation/app.dart';
 import 'package:venera/utils/ext.dart';
+import 'package:venera/utils/io.dart';
 
 class LogItem {
   final LogLevel level;
@@ -28,9 +28,6 @@ class Log {
 
   static bool ignoreLimitation = false;
 
-  /// only for debug
-  static const String? logFile = null;
-
   static void printWarning(String text) {
     debugPrint('\x1B[33m$text\x1B[0m');
   }
@@ -39,7 +36,20 @@ class Log {
     debugPrint('\x1B[31m$text\x1B[0m');
   }
 
+  static IOSink? _file;
+
   static void addLog(LogLevel level, String title, String content) {
+    if (_file == null) {
+      Directory dir;
+      if (App.isAndroid) {
+        dir = Directory(App.externalStoragePath!);
+      } else {
+        dir = Directory(App.dataPath);
+      }
+      var file = dir.joinFile("logs.txt");
+      _file = file.openWrite();
+    }
+
     if (!ignoreLimitation && content.length > maxLogLength) {
       content = "${content.substring(0, maxLogLength)}...";
     }
@@ -62,8 +72,8 @@ class Log {
     }
 
     _logs.add(newLog);
-    if(logFile != null) {
+    if(_file != null) {
-      File(logFile!).writeAsString(newLog.toString(), mode: FileMode.append);
+      _file!.write(newLog.toString());
     }
     if (_logs.length > maxLogNumber) {
       var res = _logs.remove(

lib/foundation/state_controller.dart

@@ -1,238 +0,0 @@
-import 'package:flutter/material.dart';
-
-class SimpleController extends StateController {
-  final void Function()? refreshFunction;
-
-  final Map<String, dynamic> Function()? control;
-
-  SimpleController({this.refreshFunction, this.control});
-
-  @override
-  void refresh() {
-    (refreshFunction ?? super.refresh)();
-  }
-
-  Map<String, dynamic> get controlMap => control?.call() ?? {};
-}
-
-abstract class StateController {
-  static final _controllers = <StateControllerWrapped>[];
-
-  static T put<T extends StateController>(T controller,
-      {Object? tag, bool autoRemove = false}) {
-    _controllers.add(StateControllerWrapped(controller, autoRemove, tag));
-    return controller;
-  }
-
-  static T putIfNotExists<T extends StateController>(T controller,
-      {Object? tag, bool autoRemove = false}) {
-    return findOrNull<T>(tag: tag) ??
-        put(controller, tag: tag, autoRemove: autoRemove);
-  }
-
-  static T find<T extends StateController>({Object? tag}) {
-    try {
-      return _controllers
-          .lastWhere((element) =>
-              element.controller is T && (tag == null || tag == element.tag))
-          .controller as T;
-    } catch (e) {
-      throw StateError("$T with tag $tag Not Found");
-    }
-  }
-
-  static List<T> findAll<T extends StateController>({Object? tag}) {
-    return _controllers
-        .where((element) =>
-            element.controller is T && (tag == null || tag == element.tag))
-        .map((e) => e.controller as T)
-        .toList();
-  }
-
-  static T? findOrNull<T extends StateController>({Object? tag}) {
-    try {
-      return _controllers
-          .lastWhere((element) =>
-              element.controller is T && (tag == null || tag == element.tag))
-          .controller as T;
-    } catch (e) {
-      return null;
-    }
-  }
-
-  static void remove<T>([Object? tag, bool check = false]) {
-    for (int i = _controllers.length - 1; i >= 0; i--) {
-      var element = _controllers[i];
-      if (element.controller is T && (tag == null || tag == element.tag)) {
-        if (check && !element.autoRemove) {
-          continue;
-        }
-        _controllers.removeAt(i);
-        return;
-      }
-    }
-  }
-
-  static SimpleController putSimpleController(
-      void Function() onUpdate, Object? tag,
-      {void Function()? refresh, Map<String, dynamic> Function()? control}) {
-    var controller = SimpleController(refreshFunction: refresh, control: control);
-    controller.stateUpdaters.add(Pair(null, onUpdate));
-    _controllers.add(StateControllerWrapped(controller, false, tag));
-    return controller;
-  }
-
-  List<Pair<Object?, void Function()>> stateUpdaters = [];
-
-  void update([List<Object>? ids]) {
-    if (ids == null) {
-      for (var element in stateUpdaters) {
-        element.right();
-      }
-    } else {
-      for (var element in stateUpdaters) {
-        if (ids.contains(element.left)) {
-          element.right();
-        }
-      }
-    }
-  }
-
-  void dispose() {
-    _controllers.removeWhere((element) => element.controller == this);
-  }
-
-  void refresh() {
-    update();
-  }
-}
-
-class StateControllerWrapped {
-  StateController controller;
-  bool autoRemove;
-  Object? tag;
-
-  StateControllerWrapped(this.controller, this.autoRemove, this.tag);
-}
-
-class StateBuilder<T extends StateController> extends StatefulWidget {
-  const StateBuilder({
-    super.key,
-    this.init,
-    this.dispose,
-    this.initState,
-    this.tag,
-    required this.builder,
-    this.id,
-  });
-
-  final T? init;
-
-  final void Function(T controller)? dispose;
-
-  final void Function(T controller)? initState;
-
-  final Object? tag;
-
-  final Widget Function(T controller) builder;
-
-  Widget builderWrapped(StateController controller) {
-    return builder(controller as T);
-  }
-
-  void initStateWrapped(StateController controller) {
-    return initState?.call(controller as T);
-  }
-
-  void disposeWrapped(StateController controller) {
-    return dispose?.call(controller as T);
-  }
-
-  final Object? id;
-
-  @override
-  State<StateBuilder> createState() => _StateBuilderState<T>();
-}
-
-class _StateBuilderState<T extends StateController>
-    extends State<StateBuilder> {
-  late T controller;
-
-  @override
-  void initState() {
-    if (widget.init != null) {
-      StateController.put(widget.init!, tag: widget.tag, autoRemove: true);
-    }
-    try {
-      controller = StateController.find<T>(tag: widget.tag);
-    } catch (e) {
-      throw "Controller Not Found";
-    }
-    controller.stateUpdaters.add(Pair(widget.id, () {
-      if (mounted) {
-        setState(() {});
-      }
-    }));
-    widget.initStateWrapped(controller);
-    super.initState();
-  }
-
-  @override
-  void dispose() {
-    widget.disposeWrapped(controller);
-    StateController.remove<T>(widget.tag, true);
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) => widget.builderWrapped(controller);
-}
-
-abstract class StateWithController<T extends StatefulWidget> extends State<T> {
-  late final SimpleController _controller;
-
-  void refresh() {
-    _controller.update();
-  }
-
-  @override
-  @mustCallSuper
-  void initState() {
-    _controller = StateController.putSimpleController(
-      () {
-        if (mounted) {
-          setState(() {});
-        }
-      },
-      tag,
-      refresh: refresh,
-      control: () => control,
-    );
-    super.initState();
-  }
-
-  @override
-  @mustCallSuper
-  void dispose() {
-    _controller.dispose();
-    super.dispose();
-  }
-
-  void update() {
-    _controller.update();
-  }
-
-  Object? get tag;
-
-  Map<String, dynamic> get control => {};
-}
-
-class Pair<M, V>{
-  M left;
-  V right;
-
-  Pair(this.left, this.right);
-
-  Pair.fromMap(Map<M, V> map, M key): left = key, right = map[key]
-      ?? (throw Exception("Pair not found"));
-}

lib/init.dart

@@ -1,19 +1,27 @@
+import 'dart:async';
+
+import 'package:display_mode/display_mode.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_saf/flutter_saf.dart';
+import 'package:rhttp/rhttp.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/cache_manager.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
-import 'package:venera/foundation/favorites.dart';
-import 'package:venera/foundation/history.dart';
 import 'package:venera/foundation/js_engine.dart';
-import 'package:venera/foundation/local.dart';
 import 'package:venera/foundation/log.dart';
 import 'package:venera/network/cookie_jar.dart';
+import 'package:venera/pages/comic_source_page.dart';
+import 'package:venera/pages/follow_updates_page.dart';
+import 'package:venera/pages/settings/settings_page.dart';
+import 'package:venera/utils/app_links.dart';
+import 'package:venera/utils/handle_text_share.dart';
+import 'package:venera/utils/opencc.dart';
 import 'package:venera/utils/tags_translation.dart';
 import 'package:venera/utils/translations.dart';
-
 import 'foundation/appdata.dart';
 
-extension FutureInit<T> on Future<T> {
+extension _FutureInit<T> on Future<T> {
   /// Prevent unhandled exception
   ///
   /// A unhandled exception occurred in init() will cause the app to crash.
@@ -27,16 +35,79 @@ extension FutureInit<T> on Future<T> {
 }
 
 Future<void> init() async {
-  await SAFTaskWorker().init().wait();
-  await AppTranslation.init().wait();
-  await appdata.init().wait();
   await App.init().wait();
-  await HistoryManager().init().wait();
+  await SingleInstanceCookieJar.createInstance();
-  await TagsTranslation.readData().wait();
+  var futures = [
-  await LocalFavoritesManager().init().wait();
+    Rhttp.init(),
-  SingleInstanceCookieJar("${App.dataPath}/cookie.db");
+    App.initComponents(),
-  await JsEngine().init().wait();
+    SAFTaskWorker().init().wait(),
-  await ComicSource.init().wait();
+    AppTranslation.init().wait(),
-  await LocalManager().init().wait();
+    TagsTranslation.readData().wait(),
+    JsEngine().init().wait(),
+    ComicSourceManager().init().wait(),
+    OpenCC.init(),
+  ];
+  await Future.wait(futures);
   CacheManager().setLimitSize(appdata.settings['cacheSize']);
+  _checkOldConfigs();
+  if (App.isAndroid) {
+    handleLinks();
+    handleTextShare();
+    try {
+      await FlutterDisplayMode.setHighRefreshRate();
+    } catch(e) {
+      Log.error("Display Mode", "Failed to set high refresh rate: $e");
+    }
+  }
+  FlutterError.onError = (details) {
+    Log.error("Unhandled Exception", "${details.exception}\n${details.stack}");
+  };
+  if (App.isWindows) {
+    // Report to the monitor thread that the app is running
+    // https://github.com/venera-app/venera/issues/343
+    Timer.periodic(const Duration(seconds: 1), (_) {
+      const methodChannel = MethodChannel('venera/method_channel');
+      methodChannel.invokeMethod("heartBeat");
+    });
+  }
+}
+
+void _checkOldConfigs() {
+  if (appdata.settings['searchSources'] == null) {
+    appdata.settings['searchSources'] = ComicSource.all()
+        .where((e) => e.searchPageData != null)
+        .map((e) => e.key)
+        .toList();
+  }
+
+  if (appdata.implicitData['webdavAutoSync'] == null) {
+    var webdavConfig = appdata.settings['webdav'];
+    if (webdavConfig is List &&
+        webdavConfig.length == 3 &&
+        webdavConfig.whereType<String>().length == 3) {
+      appdata.implicitData['webdavAutoSync'] = true;
+    } else {
+      appdata.implicitData['webdavAutoSync'] = false;
+    }
+    appdata.writeImplicitData();
+  }
+}
+
+Future<void> _checkAppUpdates() async {
+  var lastCheck = appdata.implicitData['lastCheckUpdate'] ?? 0;
+  var now = DateTime.now().millisecondsSinceEpoch;
+  if (now - lastCheck < 24 * 60 * 60 * 1000) {
+    return;
+  }
+  appdata.implicitData['lastCheckUpdate'] = now;
+  appdata.writeImplicitData();
+  ComicSourcePage.checkComicSourceUpdate();
+  if (appdata.settings['checkUpdateOnStart']) {
+    await checkUpdateUi(false, true);
+  }
+}
+
+void checkUpdates() {
+  _checkAppUpdates();
+  FollowUpdatesService.initChecker();
 }

lib/main.dart

@@ -1,14 +1,13 @@
 import 'dart:async';
 import 'package:desktop_webview_window/desktop_webview_window.dart';
 import 'package:dynamic_color/dynamic_color.dart';
+import 'package:flex_seed_scheme/flex_seed_scheme.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_localizations/flutter_localizations.dart';
-import 'package:rhttp/rhttp.dart';
 import 'package:venera/foundation/log.dart';
 import 'package:venera/pages/auth_page.dart';
 import 'package:venera/pages/main_page.dart';
-import 'package:venera/utils/app_links.dart';
 import 'package:venera/utils/io.dart';
 import 'package:window_manager/window_manager.dart';
 import 'components/components.dart';
@@ -18,21 +17,11 @@ import 'foundation/appdata.dart';
 import 'init.dart';
 
 void main(List<String> args) {
-  if (runWebViewTitleBarWidget(args)) {
+  if (runWebViewTitleBarWidget(args)) return;
-    return;
-  }
   overrideIO(() {
     runZonedGuarded(() async {
-      await Rhttp.init();
       WidgetsFlutterBinding.ensureInitialized();
       await init();
-      if (App.isAndroid) {
-        handleLinks();
-      }
-      FlutterError.onError = (details) {
-        Log.error(
-            "Unhandled Exception", "${details.exception}\n${details.stack}");
-      };
       runApp(const MyApp());
       if (App.isDesktop) {
         await windowManager.ensureInitialized();
@@ -45,17 +34,20 @@ void main(List<String> args) {
             await windowManager.setBackgroundColor(Colors.transparent);
           }
           await windowManager.setMinimumSize(const Size(500, 600));
-          if (!App.isLinux) {
-            // https://github.com/leanflutter/window_manager/issues/460
           var placement = await WindowPlacement.loadFromFile();
+          if (App.isLinux) {
+            await windowManager.show();
+            await placement.applyToWindow();
+          } else {
             await placement.applyToWindow();
             await windowManager.show();
-            WindowPlacement.loop();
           }
+
+          WindowPlacement.loop();
         });
       }
     }, (error, stack) {
-      Log.error("Unhandled Exception", "$error\n$stack");
+      Log.error("Unhandled Exception", error, stack);
     });
   });
 }
@@ -73,6 +65,7 @@ class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
     App.registerForceRebuild(forceRebuild);
     SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
     WidgetsBinding.instance.addObserver(this);
+    checkUpdates();
     super.initState();
   }
 
@@ -143,6 +136,40 @@ class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
     };
   }
 
+  ThemeData getTheme(
+    Color primary,
+    Color? secondary,
+    Color? tertiary,
+    Brightness brightness,
+  ) {
+    String? font;
+    List<String>? fallback;
+    if (App.isLinux || App.isWindows) {
+      font = 'Noto Sans CJK';
+      fallback = [
+        'Segoe UI',
+        'Noto Sans SC',
+        'Noto Sans TC',
+        'Noto Sans',
+        'Microsoft YaHei',
+        'PingFang SC',
+        'Arial',
+        'sans-serif'
+      ];
+    }
+    return ThemeData(
+      colorScheme: SeedColorScheme.fromSeeds(
+        primaryKey: primary,
+        secondaryKey: secondary,
+        tertiaryKey: tertiary,
+        brightness: brightness,
+        tones: FlexTones.vividBackground(brightness),
+      ),
+      fontFamily: font,
+      fontFamilyFallback: fallback,
+    );
+  }
+
   @override
   Widget build(BuildContext context) {
     Widget home;
@@ -156,50 +183,30 @@ class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
       home = const MainPage();
     }
     return DynamicColorBuilder(builder: (light, dark) {
+      Color? primary, secondary, tertiary;
       if (appdata.settings['color'] != 'system' ||
           light == null ||
           dark == null) {
-        var color = translateColorSetting();
+        primary = translateColorSetting();
-        light = ColorScheme.fromSeed(
-          seedColor: color,
-          surface: Colors.white,
-        );
-        dark = ColorScheme.fromSeed(
-          seedColor: color,
-          brightness: Brightness.dark,
-          surface: Colors.black,
-        );
       } else {
-        light = ColorScheme.fromSeed(
+        primary = light.primary;
-          seedColor: light.primary,
+        secondary = light.secondary;
-          surface: Colors.white,
+        tertiary = light.tertiary;
-        );
-        dark = ColorScheme.fromSeed(
-          seedColor: dark.primary,
-          brightness: Brightness.dark,
-          surface: Colors.black,
-        );
       }
       return MaterialApp(
         home: home,
         debugShowCheckedModeBanner: false,
-        theme: ThemeData(
+        theme: getTheme(primary, secondary, tertiary, Brightness.light),
-          colorScheme: light,
-          fontFamily: App.isWindows ? "Microsoft YaHei" : null,
-        ),
         navigatorKey: App.rootNavigatorKey,
-        darkTheme: ThemeData(
+        darkTheme: getTheme(primary, secondary, tertiary, Brightness.dark),
-          colorScheme: dark,
-          fontFamily: App.isWindows ? "Microsoft YaHei" : null,
-        ),
         themeMode: switch (appdata.settings['theme_mode']) {
           'light' => ThemeMode.light,
           'dark' => ThemeMode.dark,
           _ => ThemeMode.system
         },
-        localizationsDelegates: const [
+        color: Colors.transparent,
+        localizationsDelegates: [
           GlobalMaterialLocalizations.delegate,
-          GlobalWidgetsLocalizations.delegate,
           GlobalCupertinoLocalizations.delegate,
         ],
         locale: () {
@@ -215,9 +222,9 @@ class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
           };
         }(),
         supportedLocales: const [
-          Locale('en'),
           Locale('zh', 'CN'),
           Locale('zh', 'TW'),
+          Locale('en'),
         ],
         builder: (context, widget) {
           ErrorWidget.builder = (details) {
@@ -230,6 +237,27 @@ class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
             );
           };
           if (widget != null) {
+            /// 如果无法检测到状态栏高度设定指定高度
+            /// https://github.com/flutter/flutter/issues/161086
+            var isPaddingCheckError =
+                MediaQuery.of(context).viewPadding.top <= 0 ||
+                MediaQuery.of(context).viewPadding.top > 50;
+
+            if (isPaddingCheckError) {
+              widget = MediaQuery(
+                  data: MediaQuery.of(context).copyWith(
+                    viewPadding: const EdgeInsets.only(
+                      top: 15,
+                      bottom: 15,
+                    ),
+                    padding: const EdgeInsets.only(
+                      top: 15,
+                      bottom: 15,
+                    ),
+                  ),
+                  child: widget);
+            }
+
             widget = OverlayWidget(widget);
             if (App.isDesktop) {
               widget = Shortcuts(
@@ -245,6 +273,7 @@ class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
               );
             }
             return _SystemUiProvider(Material(
+              color: App.isLinux ? Colors.transparent : null,
               child: widget,
             ));
           }

lib/network/app_dio.dart

@@ -7,7 +7,7 @@ import 'package:rhttp/rhttp.dart' as rhttp;
 import 'package:venera/foundation/appdata.dart';
 import 'package:venera/foundation/log.dart';
 import 'package:venera/network/cache.dart';
-import 'package:venera/utils/ext.dart';
+import 'package:venera/network/proxy.dart';
 
 import '../foundation/app.dart';
 import 'cloudflare.dart';
@@ -96,7 +96,9 @@ class MyLogInterceptor implements Interceptor {
 
   @override
   void onRequest(RequestOptions options, RequestInterceptorHandler handler) {
-    Log.info("Network", "${options.method} ${options.uri}\n"
+    Log.info(
+        "Network",
+        "${options.method} ${options.uri}\n"
             "headers:\n${options.headers}\n"
             "data:\n${options.data}");
     options.connectTimeout = const Duration(seconds: 15);
@@ -107,64 +109,15 @@ class MyLogInterceptor implements Interceptor {
 }
 
 class AppDio with DioMixin {
-  String? _proxy = proxy;
-
   AppDio([BaseOptions? options]) {
     this.options = options ?? BaseOptions();
-    httpClientAdapter = RHttpAdapter(rhttp.ClientSettings(
+    httpClientAdapter = RHttpAdapter();
-      proxySettings: proxy == null
-          ? const rhttp.ProxySettings.noProxy()
-          : rhttp.ProxySettings.proxy(proxy!),
-    ));
     interceptors.add(CookieManagerSql(SingleInstanceCookieJar.instance!));
     interceptors.add(NetworkCacheManager());
     interceptors.add(CloudflareInterceptor());
     interceptors.add(MyLogInterceptor());
   }
 
-  static String? proxy;
-
-  static Future<String?> getProxy() async {
-    if ((appdata.settings['proxy'] as String).removeAllBlank == "direct") {
-      return null;
-    }
-    if (appdata.settings['proxy'] != "system") return appdata.settings['proxy'];
-
-    String res;
-    if (!App.isLinux) {
-      const channel = MethodChannel("venera/method_channel");
-      try {
-        res = await channel.invokeMethod("getProxy");
-      } catch (e) {
-        return null;
-      }
-    } else {
-      res = "No Proxy";
-    }
-    if (res == "No Proxy") return null;
-
-    if (res.contains(";")) {
-      var proxies = res.split(";");
-      for (String proxy in proxies) {
-        proxy = proxy.removeAllBlank;
-        if (proxy.startsWith('https=')) {
-          return proxy.substring(6);
-        }
-      }
-    }
-
-    final RegExp regex = RegExp(
-      r'^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}:\d+$',
-      caseSensitive: false,
-      multiLine: false,
-    );
-    if (!regex.hasMatch(res)) {
-      return null;
-    }
-
-    return res;
-  }
-
   static final Map<String, bool> _requests = {};
 
   @override
@@ -184,16 +137,6 @@ class AppDio with DioMixin {
       _requests[path] = true;
       options!.headers!.remove('prevent-parallel');
     }
-    proxy = await getProxy();
-    if (_proxy != proxy) {
-      Log.info("Network", "Proxy changed to $proxy");
-      _proxy = proxy;
-      httpClientAdapter = RHttpAdapter(rhttp.ClientSettings(
-        proxySettings: proxy == null
-            ? const rhttp.ProxySettings.noProxy()
-            : rhttp.ProxySettings.proxy(proxy!),
-      ));
-    }
     try {
       return super.request<T>(
         path,
@@ -213,7 +156,26 @@ class AppDio with DioMixin {
 }
 
 class RHttpAdapter implements HttpClientAdapter {
-  rhttp.ClientSettings settings;
+  Future<rhttp.ClientSettings> get settings async {
+    var proxy = await getProxy();
+
+    return rhttp.ClientSettings(
+      proxySettings: proxy == null
+          ? const rhttp.ProxySettings.noProxy()
+          : rhttp.ProxySettings.proxy(proxy),
+      redirectSettings: const rhttp.RedirectSettings.limited(5),
+      timeoutSettings: const rhttp.TimeoutSettings(
+        connectTimeout: Duration(seconds: 15),
+        keepAliveTimeout: Duration(seconds: 60),
+        keepAlivePing: Duration(seconds: 30),
+      ),
+      throwOnStatusCode: false,
+      dnsSettings: rhttp.DnsSettings.static(overrides: _getOverrides()),
+      tlsSettings: rhttp.TlsSettings(
+        sni: appdata.settings['sni'] != false,
+      ),
+    );
+  }
 
   static Map<String, List<String>> _getOverrides() {
     if (!appdata.settings['enableDnsOverrides'] == true) {
@@ -231,22 +193,6 @@ class RHttpAdapter implements HttpClientAdapter {
     return result;
   }
 
-  RHttpAdapter([this.settings = const rhttp.ClientSettings()]) {
-    settings = settings.copyWith(
-      redirectSettings: const rhttp.RedirectSettings.limited(5),
-      timeoutSettings: const rhttp.TimeoutSettings(
-        connectTimeout: Duration(seconds: 15),
-        keepAliveTimeout: Duration(seconds: 60),
-        keepAlivePing: Duration(seconds: 30),
-      ),
-      throwOnStatusCode: false,
-      dnsSettings: rhttp.DnsSettings.static(overrides: _getOverrides()),
-      tlsSettings: rhttp.TlsSettings(
-        sni: appdata.settings['sni'] != false,
-      ),
-    );
-  }
-
   @override
   void close({bool force = false}) {}
 
@@ -256,21 +202,15 @@ class RHttpAdapter implements HttpClientAdapter {
     Stream<Uint8List>? requestStream,
     Future<void>? cancelFuture,
   ) async {
+    if (options.headers['User-Agent'] == null &&
+        options.headers['user-agent'] == null) {
+      options.headers['User-Agent'] = "venera/v${App.version}";
+    }
+
     var res = await rhttp.Rhttp.request(
-      method: switch (options.method) {
+      method: rhttp.HttpMethod(options.method),
-        'GET' => rhttp.HttpMethod.get,
-        'POST' => rhttp.HttpMethod.post,
-        'PUT' => rhttp.HttpMethod.put,
-        'PATCH' => rhttp.HttpMethod.patch,
-        'DELETE' => rhttp.HttpMethod.delete,
-        'HEAD' => rhttp.HttpMethod.head,
-        'OPTIONS' => rhttp.HttpMethod.options,
-        'TRACE' => rhttp.HttpMethod.trace,
-        'CONNECT' => rhttp.HttpMethod.connect,
-        _ => throw ArgumentError('Unsupported method: ${options.method}'),
-      },
       url: options.uri.toString(),
-      settings: settings,
+      settings: await settings,
       expectBody: rhttp.HttpExpectBody.stream,
       body: requestStream == null ? null : rhttp.HttpBody.stream(requestStream),
       headers: rhttp.HttpHeaders.rawMap(
@@ -293,9 +233,29 @@ class RHttpAdapter implements HttpClientAdapter {
     return ResponseBody(
       res.body,
       res.statusCode,
-      statusMessage: null,
+      statusMessage: _getStatusMessage(res.statusCode),
       isRedirect: false,
       headers: headers,
     );
   }
+
+  static String _getStatusMessage(int statusCode) {
+    return switch (statusCode) {
+      200 => "OK",
+      201 => "Created",
+      202 => "Accepted",
+      204 => "No Content",
+      206 => "Partial Content",
+      301 => "Moved Permanently",
+      302 => "Found",
+      400 => "Invalid Status Code 400: The Request is invalid.",
+      401 => "Invalid Status Code 401: The Request is unauthorized.",
+      403 =>
+        "Invalid Status Code 403: No permission to access the resource. Check your account or network.",
+      404 => "Invalid Status Code 404: Not found.",
+      429 =>
+        "Invalid Status Code 429: Too many requests. Please try again later.",
+      _ => "Invalid Status Code $statusCode",
+    };
+  }
 }

lib/network/cache.dart

@@ -1,5 +1,5 @@
 import 'dart:typed_data';
-import 'package:dio/dio.dart';
+import 'package:venera/network/app_dio.dart';
 
 class NetworkCache {
   final Uri uri;
@@ -117,7 +117,7 @@ class NetworkCacheManager implements Interceptor {
       var o = options.copyWith(
         method: "HEAD",
       );
-      var dio = Dio();
+      var dio = AppDio();
       var response = await dio.fetch(o);
       if (response.statusCode == 200 &&
           compareHeaders(cache.responseHeaders, response.headers.map)) {
@@ -135,6 +135,8 @@ class NetworkCacheManager implements Interceptor {
   }
 
   static bool compareHeaders(Map<String, dynamic> a, Map<String, dynamic> b) {
+    a = Map.from(a);
+    b = Map.from(b);
     const shouldIgnore = [
       'cache-time',
       'prevent-parallel',

lib/network/cloudflare.dart

@@ -1,9 +1,11 @@
 import 'dart:io' as io;
 
 import 'package:dio/dio.dart';
+import 'package:flutter_inappwebview/flutter_inappwebview.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/appdata.dart';
 import 'package:venera/foundation/consts.dart';
+import 'package:venera/foundation/log.dart';
 import 'package:venera/pages/webview.dart';
 import 'package:venera/utils/ext.dart';
 
@@ -12,7 +14,7 @@ import 'cookie_jar.dart';
 class CloudflareException implements DioException {
   final String url;
 
-  const CloudflareException(this.url);
+  CloudflareException(this.url);
 
   @override
   String toString() {
@@ -53,12 +55,15 @@ class CloudflareException implements DioException {
 
   @override
   DioExceptionType get type => DioExceptionType.badResponse;
+
+  @override
+  DioExceptionReadableStringBuilder? stringBuilder;
 }
 
 class CloudflareInterceptor extends Interceptor {
   @override
   void onRequest(RequestOptions options, RequestInterceptorHandler handler) {
-    if(options.headers['cookie'].toString().contains('cf_clearance')) {
+    if (options.headers['cookie'].toString().contains('cf_clearance')) {
       options.headers['user-agent'] = appdata.implicitData['ua'] ?? webUA;
     }
     handler.next(options);
@@ -116,20 +121,29 @@ void passCloudflare(CloudflareException e, void Function() onFinished) async {
 
   // windows version of package `flutter_inappwebview` cannot get some cookies
   // Using DesktopWebview instead
-  if (App.isLinux || App.isWindows) {
+  if (App.isLinux) {
     var webview = DesktopWebview(
       initialUrl: url,
       onTitleChange: (title, controller) async {
-        var res = await controller.evaluateJavascript(
+        var head =
-            "document.head.innerHTML.includes('#challenge-success-text')");
+            await controller.evaluateJavascript("document.head.innerHTML") ??
-        if (res == 'false') {
+                "";
+        Log.info("Cloudflare", "Checking head: $head");
+        var isChallenging = head.contains('#challenge-success-text') ||
+            head.contains("#challenge-error-text") ||
+            head.contains("#challenge-form");
+        if (!isChallenging) {
+          Log.info(
+            "Cloudflare",
+            "Cloudflare is passed due to there is no challenge css",
+          );
           var ua = controller.userAgent;
           if (ua != null) {
             appdata.implicitData['ua'] = ua;
             appdata.writeImplicitData();
           }
           var cookiesMap = await controller.getCookies(url);
-          if(cookiesMap['cf_clearance'] == null) {
+          if (cookiesMap['cf_clearance'] == null) {
             return;
           }
           saveCookies(cookiesMap);
@@ -137,30 +151,51 @@ void passCloudflare(CloudflareException e, void Function() onFinished) async {
           onFinished();
         }
       },
+      onClose: onFinished,
     );
     webview.open();
   } else {
-    await App.rootContext.to(
+    bool success = false;
-      () => AppWebview(
+    void check(InAppWebViewController controller) async {
-        initialUrl: url,
+      var head = await controller.evaluateJavascript(
-        singlePage: true,
+          source: "document.head.innerHTML") as String;
-        onLoadStop: (controller) async {
+      Log.info("Cloudflare", "Checking head: $head");
-          var res = await controller.platform.evaluateJavascript(
+      var isChallenging = head.contains('#challenge-success-text') ||
-              source:
+          head.contains("#challenge-error-text") ||
-                  "document.head.innerHTML.includes('#challenge-success-text')");
+          head.contains("#challenge-form");
-          if (res == false) {
+      if (!isChallenging) {
+        Log.info(
+          "Cloudflare",
+          "Cloudflare is passed due to there is no challenge css",
+        );
         var ua = await controller.getUA();
         if (ua != null) {
           appdata.implicitData['ua'] = ua;
           appdata.writeImplicitData();
         }
         var cookies = await controller.getCookies(url) ?? [];
-            if(cookies.firstWhereOrNull((element) => element.name == 'cf_clearance') == null) {
+        if (cookies.firstWhereOrNull(
+                (element) => element.name == 'cf_clearance') ==
+            null) {
           return;
         }
         SingleInstanceCookieJar.instance?.saveFromResponse(uri, cookies);
+        if (!success) {
           App.rootPop();
+          success = true;
         }
+      }
+    }
+
+    await App.rootContext.to(
+      () => AppWebview(
+        initialUrl: url,
+        singlePage: true,
+        onTitleChange: (title, controller) async {
+          check(controller);
+        },
+        onLoadStop: (controller) async {
+          check(controller);
         },
         onStarted: (controller) async {
           var ua = await controller.getUA();

lib/network/cookie_jar.dart

@@ -1,6 +1,7 @@
 import 'dart:io';
 
 import 'package:dio/dio.dart';
+import 'package:path_provider/path_provider.dart';
 import 'package:sqlite3/sqlite3.dart';
 import 'package:venera/foundation/log.dart';
 import 'package:venera/utils/ext.dart';
@@ -200,6 +201,11 @@ class SingleInstanceCookieJar extends CookieJarSql {
   SingleInstanceCookieJar._create(super.path);
 
   static SingleInstanceCookieJar? instance;
+
+  static Future<void> createInstance() async {
+    var dataPath = (await getApplicationSupportDirectory()).path;
+    instance = SingleInstanceCookieJar("$dataPath/cookie.db");
+  }
 }
 
 class CookieManagerSql extends Interceptor {

lib/network/download.dart

@@ -2,6 +2,8 @@ import 'dart:async';
 import 'dart:isolate';
 
 import 'package:flutter/widgets.dart' show ChangeNotifier;
+import 'package:flutter_saf/flutter_saf.dart';
+import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/appdata.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
 import 'package:venera/foundation/comic_type.dart';
@@ -59,6 +61,16 @@ abstract class DownloadTask with ChangeNotifier {
         return null;
     }
   }
+
+  @override
+  bool operator ==(Object other) {
+    return other is DownloadTask &&
+        other.id == id &&
+        other.comicType == comicType;
+  }
+
+  @override
+  int get hashCode => Object.hash(id, comicType);
 }
 
 class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
@@ -220,7 +232,9 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
     runRecorder();
 
     if (comic == null) {
-      var res = await runWithRetry(() async {
+      _message = "Fetching comic info...";
+      notifyListeners();
+      var res = await _runWithRetry(() async {
         var r = await source.loadComicInfo!(comicId);
         if (r.error) {
           throw r.errorMessage!;
@@ -260,7 +274,9 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
     await LocalManager().saveCurrentDownloadingTasks();
 
     if (_cover == null) {
-      var res = await runWithRetry(() async {
+      _message = "Downloading cover...";
+      notifyListeners();
+      var res = await _runWithRetry(() async {
         Uint8List? data;
         await for (var progress
             in ImageDownloader.loadThumbnail(comic!.cover, source.key)) {
@@ -272,8 +288,7 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
           throw "Failed to download cover";
         }
         var fileType = detectFileType(data);
-        var file =
+        var file = File(FilePath.join(path!, "cover${fileType.ext}"));
-            File(FilePath.join(path!, "cover${fileType.ext}"));
         file.writeAsBytesSync(data);
         return "file://${file.path}";
       });
@@ -290,7 +305,9 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
 
     if (_images == null) {
       if (comic!.chapters == null) {
-        var res = await runWithRetry(() async {
+        _message = "Fetching image list...";
+        notifyListeners();
+        var res = await _runWithRetry(() async {
           var r = await source.loadComicPages!(comicId, null);
           if (r.error) {
             throw r.errorMessage!;
@@ -312,7 +329,10 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
       } else {
         _images = {};
         _totalCount = 0;
-        for (var i in comic!.chapters!.keys) {
+        int cpCount = 0;
+        int totalCpCount =
+            chapters?.length ?? comic!.chapters!.allChapters.length;
+        for (var i in comic!.chapters!.allChapters.keys) {
           if (chapters != null && !chapters!.contains(i)) {
             continue;
           }
@@ -320,7 +340,9 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
             _totalCount += _images![i]!.length;
             continue;
           }
-          var res = await runWithRetry(() async {
+          _message = "Fetching image list ($cpCount/$totalCpCount)...";
+          notifyListeners();
+          var res = await _runWithRetry(() async {
             var r = await source.loadComicPages!(comicId, i);
             if (r.error) {
               throw r.errorMessage!;
@@ -403,7 +425,7 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
       "comic": comic?.toJson(),
       "chapters": chapters,
       "path": path,
-      "cover": cover,
+      "cover": _cover,
       "images": _images,
       "downloadedCount": _downloadedCount,
       "totalCount": _totalCount,
@@ -458,10 +480,9 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
       }).toList(),
       directory: Directory(path!).name,
       chapters: comic!.chapters,
-      cover:
+      cover: File(_cover!.split("file://").last).name,
-          File(_cover!.split("file://").last).name,
       comicType: ComicType(source.key.hashCode),
-      downloadedChapters: chapters ?? [],
+      downloadedChapters: chapters ?? comic?.chapters?.ids.toList() ?? [],
       createdAt: DateTime.now(),
     );
   }
@@ -478,7 +499,7 @@ class ImagesDownloadTask extends DownloadTask with _TransferSpeedMixin {
   int get hashCode => Object.hash(comicId, source.key);
 }
 
-Future<Res<T>> runWithRetry<T>(Future<T> Function() task,
+Future<Res<T>> _runWithRetry<T>(Future<T> Function() task,
     {int retry = 3}) async {
   for (var i = 0; i < retry; i++) {
     try {
@@ -487,6 +508,7 @@ Future<Res<T>> runWithRetry<T>(Future<T> Function() task,
       if (i == retry - 1) {
         return Res.error(e.toString());
       }
+      await Future.delayed(Duration(seconds: i + 1));
     }
   }
   throw UnimplementedError();
@@ -530,7 +552,7 @@ class _ImageDownloadWrapper {
   void start() async {
     int lastBytes = 0;
     try {
-      await for (var p in ImageDownloader.loadComicImage(
+      await for (var p in ImageDownloader.loadComicImageUnwrapped(
           image, task.source.key, task.comicId, chapter)) {
         if (isCancelled) {
           return;
@@ -719,11 +741,12 @@ class ArchiveDownloadTask extends DownloadTask {
       path = dir.path;
     }
 
-    var resultFile = File(FilePath.join(path!, "archive.zip"));
+    var archiveFile =
+        File(FilePath.join(App.dataPath, "archive_downloading.zip"));
 
     Log.info("Download", "Downloading $archiveUrl");
 
-    _downloader = FileDownloader(archiveUrl, resultFile.path);
+    _downloader = FileDownloader(archiveUrl, archiveFile.path);
 
     bool isDownloaded = false;
 
@@ -752,22 +775,33 @@ class ArchiveDownloadTask extends DownloadTask {
     }
 
     try {
-      await extractArchive(path!);
+      await _extractArchive(archiveFile.path, path!);
     } catch (e) {
       _setError("Failed to extract archive: $e");
       return;
     }
 
-    await resultFile.deleteIgnoreError();
+    await archiveFile.deleteIgnoreError();
 
     LocalManager().completeTask(this);
   }
 
-  static Future<void> extractArchive(String path) async {
+  static Future<void> _extractArchive(String archive, String outDir) async {
-    var resultFile = FilePath.join(path, "archive.zip");
+    var out = Directory(outDir);
+    if (out is AndroidDirectory) {
+      // Saf directory can't be accessed by native code.
+      var cacheDir = FilePath.join(App.cachePath, "archive_downloading");
+      Directory(cacheDir).forceCreateSync();
       await Isolate.run(() {
-      ZipFile.openAndExtract(resultFile, path);
+        ZipFile.openAndExtract(archive, cacheDir);
       });
+      await copyDirectoryIsolate(Directory(cacheDir), Directory(outDir));
+      await Directory(cacheDir).deleteIgnoreError(recursive: true);
+    } else {
+      await Isolate.run(() {
+        ZipFile.openAndExtract(archive, outDir);
+      });
+    }
   }
 
   @override

lib/network/file_downloader.dart

@@ -3,6 +3,7 @@ import 'dart:io';
 
 import 'package:dio/io.dart';
 import 'package:venera/network/app_dio.dart';
+import 'package:venera/network/proxy.dart';
 import 'package:venera/utils/ext.dart';
 
 class FileDownloader {
@@ -105,7 +106,7 @@ class FileDownloader {
 
   void _download(StreamController<DownloadingStatus> resultStream) async {
     try {
-      var proxy = await AppDio.getProxy();
+      var proxy = await getProxy();
       _dio.httpClientAdapter = IOHttpClientAdapter(
         createHttpClient: () {
           return HttpClient()

lib/network/images.dart

@@ -1,3 +1,4 @@
+import 'dart:async';
 import 'dart:typed_data';
 
 import 'package:flutter_qjs/flutter_qjs.dart';
@@ -8,7 +9,7 @@ import 'package:venera/utils/image.dart';
 
 import 'app_dio.dart';
 
-class ImageDownloader {
+abstract class ImageDownloader {
   static Stream<ImageDownloadProgress> loadThumbnail(
       String url, String? sourceKey,
       [String? cid]) async* {
@@ -82,7 +83,40 @@ class ImageDownloader {
     );
   }
 
+  static final _loadingImages = <String, _StreamWrapper<ImageDownloadProgress>>{};
+
+  /// Cancel all loading images.
+  static void cancelAllLoadingImages() {
+    for (var wrapper in _loadingImages.values) {
+      wrapper.cancel();
+    }
+    _loadingImages.clear();
+  }
+
+  /// Load a comic image from the network or cache.
+  /// The function will prevent multiple requests for the same image.
   static Stream<ImageDownloadProgress> loadComicImage(
+      String imageKey, String? sourceKey, String cid, String eid) {
+    final cacheKey = "$imageKey@$sourceKey@$cid@$eid";
+    if (_loadingImages.containsKey(cacheKey)) {
+      return _loadingImages[cacheKey]!.stream;
+    }
+    final stream = _StreamWrapper<ImageDownloadProgress>(
+      _loadComicImage(imageKey, sourceKey, cid, eid),
+      (wrapper) {
+        _loadingImages.remove(cacheKey);
+      },
+    );
+    _loadingImages[cacheKey] = stream;
+    return stream.stream;
+  }
+
+  static Stream<ImageDownloadProgress> loadComicImageUnwrapped(
+      String imageKey, String? sourceKey, String cid, String eid) {
+    return _loadComicImage(imageKey, sourceKey, cid, eid);
+  }
+
+  static Stream<ImageDownloadProgress> _loadComicImage(
       String imageKey, String? sourceKey, String cid, String eid) async* {
     final cacheKey = "$imageKey@$sourceKey@$cid@$eid";
     final cache = await CacheManager().findCache(cacheKey);
@@ -139,13 +173,11 @@ class ImageDownloader {
         var buffer = <int>[];
         await for (var data in stream) {
           buffer.addAll(data);
-          if (expectedBytes != null) {
           yield ImageDownloadProgress(
             currentBytes: buffer.length,
             totalBytes: expectedBytes,
           );
         }
-        }
 
         if (configs['onResponse'] is JSInvokable) {
           buffer = (configs['onResponse'] as JSInvokable)([buffer]);
@@ -191,10 +223,78 @@ class ImageDownloader {
   }
 }
 
+/// A wrapper class for a stream that
+/// allows multiple listeners to listen to the same stream.
+class _StreamWrapper<T> {
+  final Stream<T> _stream;
+
+  final List<StreamController> controllers = [];
+
+  final void Function(_StreamWrapper<T> wrapper) onClosed;
+
+  bool isClosed = false;
+
+  _StreamWrapper(this._stream, this.onClosed) {
+    _listen();
+  }
+
+  void _listen() async {
+    try {
+      await for (var data in _stream) {
+        if (isClosed) {
+          break;
+        }
+        for (var controller in controllers) {
+          if (!controller.isClosed) {
+            controller.add(data);
+          }
+        }
+      }
+    }
+    catch (e) {
+      for (var controller in controllers) {
+        if (!controller.isClosed) {
+          controller.addError(e);
+        }
+      }
+    }
+    finally {
+      for (var controller in controllers) {
+        if (!controller.isClosed) {
+          controller.close();
+        }
+      }
+    }
+    controllers.clear();
+    isClosed = true;
+    onClosed(this);
+  }
+
+  Stream<T> get stream {
+    if (isClosed) {
+      throw Exception('Stream is closed');
+    }
+    var controller = StreamController<T>();
+    controllers.add(controller);
+    controller.onCancel = () {
+      controllers.remove(controller);
+    };
+    return controller.stream;
+  }
+
+  void cancel() {
+    for (var controller in controllers) {
+      controller.close();
+    }
+    controllers.clear();
+    isClosed = true;
+  }
+}
+
 class ImageDownloadProgress {
   final int currentBytes;
 
-  final int totalBytes;
+  final int? totalBytes;
 
   final Uint8List? imageBytes;
 

lib/network/proxy.dart

@@ -0,0 +1,60 @@
+import 'package:flutter/services.dart';
+import 'package:venera/foundation/app.dart';
+import 'package:venera/foundation/appdata.dart';
+import 'package:venera/utils/ext.dart';
+
+String? _cachedProxy;
+
+DateTime? _cachedProxyTime;
+
+Future<String?> getProxy() async {
+  if (_cachedProxyTime != null &&
+      DateTime.now().difference(_cachedProxyTime!).inSeconds < 1) {
+    return _cachedProxy;
+  }
+  String? proxy = await _getProxy();
+  _cachedProxy = proxy;
+  _cachedProxyTime = DateTime.now();
+  return proxy;
+}
+
+Future<String?> _getProxy() async {
+  if ((appdata.settings['proxy'] as String).removeAllBlank == "direct") {
+    return null;
+  }
+  if (appdata.settings['proxy'] != "system") return appdata.settings['proxy'];
+
+  String res;
+  if (!App.isLinux) {
+    const channel = MethodChannel("venera/method_channel");
+    try {
+      res = await channel.invokeMethod("getProxy");
+    } catch (e) {
+      return null;
+    }
+  } else {
+    res = "No Proxy";
+  }
+  if (res == "No Proxy") return null;
+
+  if (res.contains(";")) {
+    var proxies = res.split(";");
+    for (String proxy in proxies) {
+      proxy = proxy.removeAllBlank;
+      if (proxy.startsWith('https=')) {
+        return proxy.substring(6);
+      }
+    }
+  }
+
+  final RegExp regex = RegExp(
+    r'^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}:\d+$',
+    caseSensitive: false,
+    multiLine: false,
+  );
+  if (!regex.hasMatch(res)) {
+    return null;
+  }
+
+  return res;
+}

lib/pages/accounts_page.dart

@@ -1,349 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:flutter/services.dart';
-import 'package:flutter_inappwebview/flutter_inappwebview.dart';
-import 'package:url_launcher/url_launcher_string.dart';
-import 'package:venera/components/components.dart';
-import 'package:venera/foundation/app.dart';
-import 'package:venera/foundation/comic_source/comic_source.dart';
-import 'package:venera/foundation/state_controller.dart';
-import 'package:venera/network/cookie_jar.dart';
-import 'package:venera/pages/webview.dart';
-import 'package:venera/utils/translations.dart';
-
-class AccountsPageLogic extends StateController {
-  final _reLogin = <String, bool>{};
-}
-
-class AccountsPage extends StatelessWidget {
-  const AccountsPage({super.key});
-
-  AccountsPageLogic get logic => StateController.find<AccountsPageLogic>();
-
-  @override
-  Widget build(BuildContext context) {
-    var body = StateBuilder<AccountsPageLogic>(
-      init: AccountsPageLogic(),
-      builder: (logic) {
-        return CustomScrollView(
-          slivers: [
-            SliverAppbar(title: Text("Accounts".tl)),
-            SliverList(
-              delegate: SliverChildListDelegate(
-                buildContent(context).toList(),
-              ),
-            ),
-            SliverPadding(
-              padding: EdgeInsets.only(bottom: context.padding.bottom),
-            )
-          ],
-        );
-      },
-    );
-
-    return Scaffold(
-      body: body,
-    );
-  }
-
-  Iterable<Widget> buildContent(BuildContext context) sync* {
-    var sources = ComicSource.all().where((element) => element.account != null);
-    if (sources.isEmpty) return;
-
-    for (var element in sources) {
-      final bool logged = element.isLogged;
-      yield Padding(
-        padding: const EdgeInsets.fromLTRB(16, 8, 16, 8),
-        child: Text(
-          element.name,
-          style: const TextStyle(fontSize: 16),
-        ),
-      );
-      if (!logged) {
-        yield ListTile(
-          title: Text("Log in".tl),
-          trailing: const Icon(Icons.arrow_right),
-          onTap: () async {
-            await context.to(
-              () => _LoginPage(
-                config: element.account!,
-                source: element,
-              ),
-            );
-            element.saveData();
-            ComicSource.notifyListeners();
-            logic.update();
-          },
-        );
-      }
-      if (logged) {
-        for (var item in element.account!.infoItems) {
-          if (item.builder != null) {
-            yield item.builder!(context);
-          } else {
-            yield ListTile(
-              title: Text(item.title.tl),
-              subtitle: item.data == null ? null : Text(item.data!()),
-              onTap: item.onTap,
-            );
-          }
-        }
-        if (element.data["account"] is List) {
-          bool loading = logic._reLogin[element.key] == true;
-          yield ListTile(
-            title: Text("Re-login".tl),
-            subtitle: Text("Click if login expired".tl),
-            onTap: () async {
-              if (element.data["account"] == null) {
-                context.showMessage(message: "No data".tl);
-                return;
-              }
-              logic._reLogin[element.key] = true;
-              logic.update();
-              final List account = element.data["account"];
-              var res = await element.account!.login!(account[0], account[1]);
-              if (res.error) {
-                context.showMessage(message: res.errorMessage!);
-              } else {
-                context.showMessage(message: "Success".tl);
-              }
-              logic._reLogin[element.key] = false;
-              logic.update();
-            },
-            trailing: loading
-                ? const SizedBox.square(
-                    dimension: 24,
-                    child: CircularProgressIndicator(
-                      strokeWidth: 2,
-                    ),
-                  )
-                : const Icon(Icons.refresh),
-          );
-        }
-        yield ListTile(
-          title: Text("Log out".tl),
-          onTap: () {
-            element.data["account"] = null;
-            element.account?.logout();
-            element.saveData();
-            ComicSource.notifyListeners();
-            logic.update();
-          },
-          trailing: const Icon(Icons.logout),
-        );
-      }
-      yield const Divider(thickness: 0.6);
-    }
-  }
-
-  void setClipboard(String text) {
-    Clipboard.setData(ClipboardData(text: text));
-    showToast(
-      message: "Copied".tl,
-      icon: const Icon(Icons.check),
-      context: App.rootContext,
-    );
-  }
-}
-
-class _LoginPage extends StatefulWidget {
-  const _LoginPage({required this.config, required this.source});
-
-  final AccountConfig config;
-
-  final ComicSource source;
-
-  @override
-  State<_LoginPage> createState() => _LoginPageState();
-}
-
-class _LoginPageState extends State<_LoginPage> {
-  String username = "";
-  String password = "";
-  bool loading = false;
-
-  final Map<String, String> _cookies = {};
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      appBar: const Appbar(
-        title: Text(''),
-      ),
-      body: Center(
-        child: Container(
-          padding: const EdgeInsets.all(16),
-          constraints: const BoxConstraints(maxWidth: 400),
-          child: AutofillGroup(
-            child: Column(
-              mainAxisSize: MainAxisSize.min,
-              children: [
-                Text("Login".tl, style: const TextStyle(fontSize: 24)),
-                const SizedBox(height: 32),
-                if (widget.config.cookieFields == null)
-                  TextField(
-                    decoration: InputDecoration(
-                      labelText: "Username".tl,
-                      border: const OutlineInputBorder(),
-                    ),
-                    enabled: widget.config.login != null,
-                    onChanged: (s) {
-                      username = s;
-                    },
-                    autofillHints: const [AutofillHints.username],
-                  ).paddingBottom(16),
-                if (widget.config.cookieFields == null)
-                  TextField(
-                    decoration: InputDecoration(
-                      labelText: "Password".tl,
-                      border: const OutlineInputBorder(),
-                    ),
-                    obscureText: true,
-                    enabled: widget.config.login != null,
-                    onChanged: (s) {
-                      password = s;
-                    },
-                    onSubmitted: (s) => login(),
-                    autofillHints: const [AutofillHints.password],
-                  ).paddingBottom(16),
-                for (var field in widget.config.cookieFields ?? <String>[])
-                  TextField(
-                    decoration: InputDecoration(
-                      labelText: field,
-                      border: const OutlineInputBorder(),
-                    ),
-                    obscureText: true,
-                    enabled: widget.config.validateCookies != null,
-                    onChanged: (s) {
-                      _cookies[field] = s;
-                    },
-                  ).paddingBottom(16),
-                if (widget.config.login == null &&
-                    widget.config.cookieFields == null)
-                  Row(
-                    mainAxisSize: MainAxisSize.min,
-                    children: [
-                      const Icon(Icons.error_outline),
-                      const SizedBox(width: 8),
-                      Text("Login with password is disabled".tl),
-                    ],
-                  )
-                else
-                  Button.filled(
-                    isLoading: loading,
-                    onPressed: login,
-                    child: Text("Continue".tl),
-                  ),
-                const SizedBox(height: 24),
-                if (widget.config.loginWebsite != null)
-                  TextButton(
-                    onPressed: loginWithWebview,
-                    child: Text("Login with webview".tl),
-                  ),
-                const SizedBox(height: 8),
-                if (widget.config.registerWebsite != null)
-                  TextButton(
-                    onPressed: () =>
-                        launchUrlString(widget.config.registerWebsite!),
-                    child: Row(
-                      mainAxisSize: MainAxisSize.min,
-                      children: [
-                        const Icon(Icons.link),
-                        const SizedBox(width: 8),
-                        Text("Create Account".tl),
-                      ],
-                    ),
-                  ),
-              ],
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-
-  void login() {
-    if (widget.config.login != null) {
-      if (username.isEmpty || password.isEmpty) {
-        showToast(
-          message: "Cannot be empty".tl,
-          icon: const Icon(Icons.error_outline),
-          context: context,
-        );
-        return;
-      }
-      setState(() {
-        loading = true;
-      });
-      widget.config.login!(username, password).then((value) {
-        if (value.error) {
-          context.showMessage(message: value.errorMessage!);
-          setState(() {
-            loading = false;
-          });
-        } else {
-          if (mounted) {
-            context.pop();
-          }
-        }
-      });
-    } else if (widget.config.validateCookies != null) {
-      setState(() {
-        loading = true;
-      });
-      var cookies =
-          widget.config.cookieFields!.map((e) => _cookies[e] ?? '').toList();
-      widget.config.validateCookies!(cookies).then((value) {
-        if (value) {
-          widget.source.data['account'] = 'ok';
-          widget.source.saveData();
-          context.pop();
-        } else {
-          context.showMessage(message: "Invalid cookies".tl);
-          setState(() {
-            loading = false;
-          });
-        }
-      });
-    }
-  }
-
-  void loginWithWebview() async {
-    var url = widget.config.loginWebsite!;
-    var title = '';
-    bool success = false;
-
-    void validate(InAppWebViewController c) async {
-      if (widget.config.checkLoginStatus != null
-          && widget.config.checkLoginStatus!(url, title)) {
-        var cookies = (await c.getCookies(url)) ?? [];
-        SingleInstanceCookieJar.instance?.saveFromResponse(
-          Uri.parse(url),
-          cookies,
-        );
-        success = true;
-        widget.config.onLoginWithWebviewSuccess?.call();
-        App.mainNavigatorKey?.currentContext?.pop();
-      }
-    }
-
-    await context.to(
-      () => AppWebview(
-        initialUrl: widget.config.loginWebsite!,
-        onNavigation: (u, c) {
-          url = u;
-          validate(c);
-          return false;
-        },
-        onTitleChange: (t, c) {
-          title = t;
-          validate(c);
-        },
-      ),
-    );
-    if (success) {
-      widget.source.data['account'] = 'ok';
-      widget.source.saveData();
-      context.pop();
-    }
-  }
-}

lib/pages/aggregated_search_page.dart

@@ -2,6 +2,7 @@ import "package:flutter/material.dart";
 import 'package:shimmer_animation/shimmer_animation.dart';
 import "package:venera/components/components.dart";
 import "package:venera/foundation/app.dart";
+import "package:venera/foundation/appdata.dart";
 import "package:venera/foundation/comic_source/comic_source.dart";
 import "package:venera/pages/search_result_page.dart";
 import "package:venera/utils/translations.dart";
@@ -24,7 +25,18 @@ class _AggregatedSearchPageState extends State<AggregatedSearchPage> {
 
   @override
   void initState() {
-    sources = ComicSource.all().where((e) => e.searchPageData != null).toList();
+    var all = ComicSource.all()
+        .where((e) => e.searchPageData != null)
+        .map((e) => e.key)
+        .toList();
+    var settings = appdata.settings['searchSources'] as List;
+    var sources = <String>[];
+    for (var source in settings) {
+      if (all.contains(source)) {
+        sources.add(source);
+      }
+    }
+    this.sources = sources.map((e) => ComicSource.find(e)!).toList();
     _keyword = widget.keyword;
     controller = SearchBarController(
       currentText: widget.keyword,
@@ -46,7 +58,11 @@ class _AggregatedSearchPageState extends State<AggregatedSearchPage> {
         delegate: SliverChildBuilderDelegate(
           (context, index) {
             final source = sources[index];
-            return _SliverSearchResult(source: source, keyword: _keyword);
+            return _SliverSearchResult(
+              key: ValueKey(source.key),
+              source: source,
+              keyword: _keyword,
+            );
           },
           childCount: sources.length,
         ),
@@ -56,7 +72,11 @@ class _AggregatedSearchPageState extends State<AggregatedSearchPage> {
 }
 
 class _SliverSearchResult extends StatefulWidget {
-  const _SliverSearchResult({required this.source, required this.keyword});
+  const _SliverSearchResult({
+    required this.source,
+    required this.keyword,
+    super.key,
+  });
 
   final ComicSource source;
 
@@ -70,7 +90,7 @@ class _SliverSearchResultState extends State<_SliverSearchResult>
     with AutomaticKeepAliveClientMixin {
   bool isLoading = true;
 
-  static const _kComicHeight = 132.0;
+  static const _kComicHeight = 162.0;
 
   get _comicWidth => _kComicHeight * 0.7;
 
@@ -78,6 +98,8 @@ class _SliverSearchResultState extends State<_SliverSearchResult>
 
   List<Comic>? comics;
 
+  String? error;
+
   void load() async {
     final data = widget.source.searchPageData!;
     var options =
@@ -89,6 +111,11 @@ class _SliverSearchResultState extends State<_SliverSearchResult>
           comics = res.data;
           isLoading = false;
         });
+      } else {
+        setState(() {
+          error = res.errorMessage ?? "Unknown error".tl;
+          isLoading = false;
+        });
       }
     } else if (data.loadNext != null) {
       var res = await data.loadNext!(widget.keyword, null, options);
@@ -97,6 +124,11 @@ class _SliverSearchResultState extends State<_SliverSearchResult>
           comics = res.data;
           isLoading = false;
         });
+      } else {
+        setState(() {
+          error = res.errorMessage ?? "Unknown error".tl;
+          isLoading = false;
+        });
       }
     }
   }
@@ -120,13 +152,16 @@ class _SliverSearchResultState extends State<_SliverSearchResult>
   }
 
   Widget buildComic(Comic c) {
-    return SimpleComicTile(comic: c)
+    return SimpleComicTile(comic: c, withTitle: true)
         .paddingLeft(_kLeftPadding)
         .paddingBottom(2);
   }
 
   @override
   Widget build(BuildContext context) {
+    if (error != null && error!.startsWith("CloudflareException")) {
+      error = "Cloudflare verification required".tl;
+    }
     super.build(context);
     return InkWell(
       onTap: () {
@@ -169,7 +204,7 @@ class _SliverSearchResultState extends State<_SliverSearchResult>
                 }),
               ),
             )
-          else if (comics == null || comics!.isEmpty)
+          else if (error != null || comics == null || comics!.isEmpty)
             SizedBox(
               height: _kComicHeight,
               child: Column(
@@ -178,7 +213,13 @@ class _SliverSearchResultState extends State<_SliverSearchResult>
                     children: [
                       const Icon(Icons.error_outline),
                       const SizedBox(width: 8),
-                      Text("No search results found".tl),
+                      Expanded(
+                        child: Text(
+                          error ?? "No search results found".tl,
+                          maxLines: 1,
+                          overflow: TextOverflow.ellipsis,
+                        ),
+                      )
                     ],
                   ),
                   const Spacer(),

lib/pages/categories_page.dart

@@ -3,56 +3,99 @@ import 'package:venera/components/components.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/appdata.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
-import 'package:venera/foundation/state_controller.dart';
 import 'package:venera/pages/ranking_page.dart';
-import 'package:venera/pages/search_result_page.dart';
+import 'package:venera/pages/settings/settings_page.dart';
+import 'package:venera/utils/ext.dart';
 import 'package:venera/utils/translations.dart';
 
-import 'category_comics_page.dart';
+import 'comic_source_page.dart';
 
-class CategoriesPage extends StatelessWidget {
+class CategoriesPage extends StatefulWidget {
   const CategoriesPage({super.key});
 
   @override
-  Widget build(BuildContext context) {
+  State<CategoriesPage> createState() => _CategoriesPageState();
-    return StateBuilder<SimpleController>(
+}
-      tag: "category",
+
-      init: SimpleController(),
+class _CategoriesPageState extends State<CategoriesPage> {
-      builder: (controller) {
+  var categories = <String>[];
-        var categories = List.from(appdata.settings["categories"]);
+
+  void onSettingsChanged() {
+    var categories =
+        List.from(appdata.settings["categories"]).whereType<String>().toList();
     var allCategories = ComicSource.all()
         .map((e) => e.categoryData?.key)
         .where((element) => element != null)
         .map((e) => e!)
         .toList();
-        categories = categories
+    categories =
-            .where((element) => allCategories.contains(element))
+        categories.where((element) => allCategories.contains(element)).toList();
-            .toList();
+    if (!categories.isEqualTo(this.categories)) {
+      setState(() {
+        this.categories = categories;
+      });
+    }
+  }
 
-        if(categories.isEmpty) {
+  @override
+  void initState() {
+    super.initState();
+    var categories =
+        List.from(appdata.settings["categories"]).whereType<String>().toList();
+    var allCategories = ComicSource.all()
+        .map((e) => e.categoryData?.key)
+        .where((element) => element != null)
+        .map((e) => e!)
+        .toList();
+    this.categories =
+        categories.where((element) => allCategories.contains(element)).toList();
+    appdata.settings.addListener(onSettingsChanged);
+  }
+
+  void addPage() {
+    showPopUpWidget(App.rootContext, setCategoryPagesWidget());
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+    appdata.settings.removeListener(onSettingsChanged);
+  }
+
+  Widget buildEmpty() {
     var msg = "No Category Pages".tl;
     msg += '\n';
-          if(ComicSource.isEmpty) {
+    VoidCallback onTap;
-            msg += "Add a comic source in home page".tl;
+    if (ComicSource.isEmpty) {
+      msg += "Please add some sources".tl;
+      onTap = () {
+        context.to(() => ComicSourcePage());
+      };
     } else {
       msg += "Please check your settings".tl;
+      onTap = addPage;
     }
     return NetworkError(
       message: msg,
-            retry: () {
+      retry: onTap,
-              controller.update();
-            },
       withAppbar: false,
+      buttonText: "Manage".tl,
     );
   }
 
+  @override
+  Widget build(BuildContext context) {
+    if (categories.isEmpty) {
+      return buildEmpty();
+    }
+
     return Material(
       child: DefaultTabController(
         length: categories.length,
         key: Key(categories.toString()),
         child: Column(
           children: [
-                FilledTabBar(
+            AppTabBar(
               key: PageStorageKey(categories.toString()),
               tabs: categories.map((e) {
                 String title = e;
@@ -66,18 +109,21 @@ class CategoriesPage extends StatelessWidget {
                   key: Key(e),
                 );
               }).toList(),
+              actionButton: TabActionButton(
+                icon: const Icon(Icons.add),
+                text: "Add".tl,
+                onPressed: addPage,
+              ),
             ).paddingTop(context.padding.top),
             Expanded(
               child: TabBarView(
-                      children:
+                children: categories.map((e) => _CategoryPage(e)).toList(),
-                          categories.map((e) => _CategoryPage(e)).toList()),
+              ),
             )
           ],
         ),
       ),
     );
-      },
-    );
   }
 }
 
@@ -99,43 +145,6 @@ class _CategoryPage extends StatelessWidget {
     return "";
   }
 
-  void handleClick(
-    String tag,
-    String? param,
-    String type,
-    String namespace,
-    String categoryKey,
-  ) {
-    if (type == 'search') {
-      App.mainNavigatorKey?.currentContext?.to(
-        () => SearchResultPage(
-          text: tag,
-          options: const [],
-          sourceKey: findComicSourceKey(),
-        ),
-      );
-    } else if (type == "search_with_namespace") {
-      if (tag.contains(" ")) {
-        tag = '"$tag"';
-      }
-      App.mainNavigatorKey?.currentContext?.to(
-        () => SearchResultPage(
-          text: "$namespace:$tag",
-          options: const [],
-          sourceKey: findComicSourceKey(),
-        ),
-      );
-    } else if (type == "category") {
-      App.mainNavigatorKey!.currentContext!.to(
-        () => CategoryComicsPage(
-          category: tag,
-          categoryKey: categoryKey,
-          param: param,
-        ),
-      );
-    }
-  }
-
   @override
   Widget build(BuildContext context) {
     var children = <Widget>[];
@@ -146,11 +155,11 @@ class _CategoryPage extends StatelessWidget {
         child: Wrap(
           children: [
             if (data.enableRankingPage)
-              buildTag("Ranking".tl, (p0, p1) {
+              buildTag("Ranking".tl, () {
                 context.to(() => RankingPage(categoryKey: data.key));
               }),
             for (var buttonData in data.buttons)
-              buildTag(buttonData.label.tl, (p0, p1) => buttonData.onTap())
+              buildTag(buttonData.label.tl, buttonData.onTap)
           ],
         ),
       ));
@@ -164,36 +173,14 @@ class _CategoryPage extends StatelessWidget {
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
               buildTitleWithRefresh(part.title, () => updater(() {})),
-              buildTagsWithParams(
+              buildTags(part.categories)
-                part.categories,
-                part.categoryParams,
-                part.title,
-                (key, param) => handleClick(
-                  key,
-                  param,
-                  part.categoryType,
-                  part.title,
-                  category,
-                ),
-              )
             ],
           );
         }));
       } else {
         children.add(buildTitle(part.title));
         children.add(
-          buildTagsWithParams(
+          buildTags(part.categories),
-            part.categories,
-            part.categoryParams,
-            part.title,
-            (tag, param) => handleClick(
-              tag,
-              param,
-              part.categoryType,
-              part.title,
-              data.key,
-            ),
-          ),
         );
       }
     }
@@ -232,30 +219,28 @@ class _CategoryPage extends StatelessWidget {
     );
   }
 
-  Widget buildTagsWithParams(
+  Widget buildTags(
-    List<String> tags,
+    List<CategoryItem> categories,
-    List<String>? params,
-    String? namespace,
-    ClickTagCallback onClick,
   ) {
     return Padding(
       padding: const EdgeInsets.fromLTRB(10, 0, 10, 16),
       child: Wrap(
         children: List<Widget>.generate(
-          tags.length,
+          categories.length,
-          (index) => buildTag(
+          (index) => buildCategory(categories[index]),
-            tags[index],
-            onClick,
-            namespace,
-            params?.elementAtOrNull(index),
-          ),
         ),
       ),
     );
   }
 
-  Widget buildTag(String tag, ClickTagCallback onClick,
+  Widget buildCategory(CategoryItem c) {
-      [String? namespace, String? param]) {
+    return buildTag(c.label, () {
+      var context = App.mainNavigatorKey!.currentContext!;
+      c.target.jump(context);
+    });
+  }
+
+  Widget buildTag(String label, VoidCallback onClick) {
     return Padding(
       padding: const EdgeInsets.fromLTRB(8, 6, 8, 6),
       child: Builder(
@@ -265,10 +250,10 @@ class _CategoryPage extends StatelessWidget {
             color: context.colorScheme.primaryContainer.toOpacity(0.72),
             child: InkWell(
               borderRadius: const BorderRadius.all(Radius.circular(8)),
-              onTap: () => onClick(tag, param),
+              onTap: onClick,
               child: Padding(
                 padding: const EdgeInsets.fromLTRB(16, 8, 16, 8),
-                child: Text(tag),
+                child: Text(label),
               ),
             ),
           );

lib/pages/category_comics_page.dart

@@ -9,6 +9,7 @@ class CategoryComicsPage extends StatefulWidget {
     required this.category,
     this.param,
     required this.categoryKey,
+    this.options,
     super.key,
   });
 
@@ -18,6 +19,8 @@ class CategoryComicsPage extends StatefulWidget {
 
   final String categoryKey;
 
+  final List<String>? options;
+
   @override
   State<CategoryComicsPage> createState() => _CategoryComicsPageState();
 }
@@ -31,6 +34,9 @@ class _CategoryComicsPageState extends State<CategoryComicsPage> {
   void findData() {
     for (final source in ComicSource.all()) {
       if (source.categoryData?.key == widget.categoryKey) {
+        if (source.categoryComicsData == null) {
+          throw "The comic source ${source.name} does not support category comics";
+        }
         data = source.categoryComicsData!;
         options = data.options.where((element) {
           if (element.notShowWhen.contains(widget.category)) {
@@ -40,7 +46,16 @@ class _CategoryComicsPageState extends State<CategoryComicsPage> {
           }
           return true;
         }).toList();
-        optionsValue = options.map((e) => e.options.keys.first).toList();
+        var defaultOptionsValue =
+            options.map((e) => e.options.keys.first).toList();
+        if (optionsValue.length != options.length) {
+          var newOptionsValue = List<String>.filled(options.length, "");
+          for (var i = 0; i < options.length; i++) {
+            newOptionsValue[i] =
+                optionsValue.elementAtOrNull(i) ?? defaultOptionsValue[i];
+          }
+          optionsValue = newOptionsValue;
+        }
         sourceKey = source.key;
         return;
       }
@@ -50,6 +65,11 @@ class _CategoryComicsPageState extends State<CategoryComicsPage> {
 
   @override
   void initState() {
+    if (widget.options != null) {
+      optionsValue = widget.options!;
+    } else {
+      optionsValue = [];
+    }
     findData();
     super.initState();
   }

lib/pages/comic_details_page/actions.dart

@@ -0,0 +1,421 @@
+part of 'comic_page.dart';
+
+abstract mixin class _ComicPageActions {
+  void update();
+
+  ComicDetails get comic;
+
+  ComicSource get comicSource => ComicSource.find(comic.sourceKey)!;
+
+  History? get history;
+
+  bool isLiking = false;
+
+  bool isLiked = false;
+
+  void likeOrUnlike() async {
+    if (isLiking) return;
+    isLiking = true;
+    update();
+    var res = await comicSource.likeOrUnlikeComic!(comic.id, isLiked);
+    if (res.error) {
+      App.rootContext.showMessage(message: res.errorMessage!);
+    } else {
+      isLiked = !isLiked;
+    }
+    isLiking = false;
+    update();
+  }
+
+  /// whether the comic is added to local favorite
+  bool isAddToLocalFav = false;
+
+  /// whether the comic is favorite on the server
+  bool isFavorite = false;
+
+  FavoriteItem _toFavoriteItem() {
+    var tags = <String>[];
+    for (var e in comic.tags.entries) {
+      tags.addAll(e.value.map((tag) => '${e.key}:$tag'));
+    }
+    return FavoriteItem(
+      id: comic.id,
+      name: comic.title,
+      coverPath: comic.cover,
+      author: comic.subTitle ?? comic.uploader ?? '',
+      type: comic.comicType,
+      tags: tags,
+    );
+  }
+
+  void openFavPanel() {
+    showSideBar(
+      App.rootContext,
+      _FavoritePanel(
+        cid: comic.id,
+        type: comic.comicType,
+        isFavorite: isFavorite,
+        onFavorite: (local, network) {
+          isFavorite = network ?? isFavorite;
+          isAddToLocalFav = local ?? isAddToLocalFav;
+          update();
+        },
+        favoriteItem: _toFavoriteItem(),
+        updateTime: comic.findUpdateTime(),
+      ),
+    );
+  }
+
+  void quickFavorite() {
+    var folder = appdata.settings['quickFavorite'];
+    if (folder is! String) {
+      return;
+    }
+    LocalFavoritesManager().addComic(
+      folder,
+      _toFavoriteItem(),
+      null,
+      comic.findUpdateTime(),
+    );
+    isAddToLocalFav = true;
+    update();
+    App.rootContext.showMessage(message: "Added".tl);
+  }
+
+  void share() {
+    var text = comic.title;
+    if (comic.url != null) {
+      text += '\n${comic.url}';
+    }
+    Share.shareText(text);
+  }
+
+  /// read the comic
+  ///
+  /// [ep] the episode number, start from 1
+  ///
+  /// [page] the page number, start from 1
+  ///
+  /// [group] the chapter group number, start from 1
+  void read([int? ep, int? page, int? group]) {
+    App.rootContext
+        .to(
+      () => Reader(
+        type: comic.comicType,
+        cid: comic.id,
+        name: comic.title,
+        chapters: comic.chapters,
+        initialChapter: ep,
+        initialPage: page,
+        initialChapterGroup: group,
+        history: history ?? History.fromModel(model: comic, ep: 0, page: 0),
+        author: comic.findAuthor() ?? '',
+        tags: comic.plainTags,
+      ),
+    )
+        .then((_) {
+      onReadEnd();
+    });
+  }
+
+  void continueRead() {
+    var ep = history?.ep ?? 1;
+    var page = history?.page ?? 1;
+    var group = history?.group ?? 1;
+    read(ep, page, group);
+  }
+
+  void onReadEnd();
+
+  void download() async {
+    if (LocalManager().isDownloading(comic.id, comic.comicType)) {
+      App.rootContext.showMessage(message: "The comic is downloading".tl);
+      return;
+    }
+    if (comic.chapters == null &&
+        LocalManager().isDownloaded(comic.id, comic.comicType, 0)) {
+      App.rootContext.showMessage(message: "The comic is downloaded".tl);
+      return;
+    }
+
+    if (comicSource.archiveDownloader != null) {
+      bool useNormalDownload = false;
+      List<ArchiveInfo>? archives;
+      int selected = -1;
+      bool isLoading = false;
+      bool isGettingLink = false;
+      await showDialog(
+        context: App.rootContext,
+        builder: (context) {
+          return StatefulBuilder(
+            builder: (context, setState) {
+              return ContentDialog(
+                title: "Download".tl,
+                content: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    RadioListTile<int>(
+                      value: -1,
+                      groupValue: selected,
+                      title: Text("Normal".tl),
+                      onChanged: (v) {
+                        setState(() {
+                          selected = v!;
+                        });
+                      },
+                    ),
+                    ExpansionTile(
+                      title: Text("Archive".tl),
+                      shape: const RoundedRectangleBorder(
+                        borderRadius: BorderRadius.zero,
+                      ),
+                      collapsedShape: const RoundedRectangleBorder(
+                        borderRadius: BorderRadius.zero,
+                      ),
+                      onExpansionChanged: (b) {
+                        if (!isLoading && b && archives == null) {
+                          isLoading = true;
+                          comicSource.archiveDownloader!
+                              .getArchives(comic.id)
+                              .then((value) {
+                            if (value.success) {
+                              archives = value.data;
+                            } else {
+                              App.rootContext
+                                  .showMessage(message: value.errorMessage!);
+                            }
+                            setState(() {
+                              isLoading = false;
+                            });
+                          });
+                        }
+                      },
+                      children: [
+                        if (archives == null)
+                          const ListLoadingIndicator().toCenter()
+                        else
+                          for (int i = 0; i < archives!.length; i++)
+                            RadioListTile<int>(
+                              value: i,
+                              groupValue: selected,
+                              onChanged: (v) {
+                                setState(() {
+                                  selected = v!;
+                                });
+                              },
+                              title: Text(archives![i].title),
+                              subtitle: Text(archives![i].description),
+                            )
+                      ],
+                    )
+                  ],
+                ),
+                actions: [
+                  Button.filled(
+                    isLoading: isGettingLink,
+                    onPressed: () async {
+                      if (selected == -1) {
+                        useNormalDownload = true;
+                        context.pop();
+                        return;
+                      }
+                      setState(() {
+                        isGettingLink = true;
+                      });
+                      var res =
+                          await comicSource.archiveDownloader!.getDownloadUrl(
+                        comic.id,
+                        archives![selected].id,
+                      );
+                      if (res.error) {
+                        App.rootContext.showMessage(message: res.errorMessage!);
+                        setState(() {
+                          isGettingLink = false;
+                        });
+                      } else if (context.mounted) {
+                        LocalManager()
+                            .addTask(ArchiveDownloadTask(res.data, comic));
+                        App.rootContext
+                            .showMessage(message: "Download started".tl);
+                        context.pop();
+                      }
+                    },
+                    child: Text("Confirm".tl),
+                  ),
+                ],
+              );
+            },
+          );
+        },
+      );
+      if (!useNormalDownload) {
+        return;
+      }
+    }
+
+    if (comic.chapters == null) {
+      LocalManager().addTask(ImagesDownloadTask(
+        source: comicSource,
+        comicId: comic.id,
+        comic: comic,
+      ));
+    } else {
+      List<int>? selected;
+      var downloaded = <int>[];
+      var localComic = LocalManager().find(comic.id, comic.comicType);
+      if (localComic != null) {
+        for (int i = 0; i < comic.chapters!.length; i++) {
+          if (localComic.downloadedChapters
+              .contains(comic.chapters!.ids.elementAt(i))) {
+            downloaded.add(i);
+          }
+        }
+      }
+      await showSideBar(
+        App.rootContext,
+        _SelectDownloadChapter(
+          comic.chapters!.titles.toList(),
+          (v) => selected = v,
+          downloaded,
+        ),
+      );
+      if (selected == null) return;
+      LocalManager().addTask(ImagesDownloadTask(
+        source: comicSource,
+        comicId: comic.id,
+        comic: comic,
+        chapters: selected!.map((i) {
+          return comic.chapters!.ids.elementAt(i);
+        }).toList(),
+      ));
+    }
+    App.rootContext.showMessage(message: "Download started".tl);
+    update();
+  }
+
+  void onTapTag(String tag, String namespace) {
+    var target = comicSource.handleClickTagEvent?.call(namespace, tag);
+    var context = App.mainNavigatorKey!.currentContext!;
+    target?.jump(context);
+  }
+
+  void showMoreActions() {
+    var context = App.rootContext;
+    showMenuX(
+        context,
+        Offset(
+          context.width - 16,
+          context.padding.top,
+        ),
+        [
+          MenuEntry(
+            icon: Icons.copy,
+            text: "Copy Title".tl,
+            onClick: () {
+              Clipboard.setData(ClipboardData(text: comic.title));
+              context.showMessage(message: "Copied".tl);
+            },
+          ),
+          MenuEntry(
+            icon: Icons.copy_rounded,
+            text: "Copy ID".tl,
+            onClick: () {
+              Clipboard.setData(ClipboardData(text: comic.id));
+              context.showMessage(message: "Copied".tl);
+            },
+          ),
+          if (comic.url != null)
+            MenuEntry(
+              icon: Icons.link,
+              text: "Copy URL".tl,
+              onClick: () {
+                Clipboard.setData(ClipboardData(text: comic.url!));
+                context.showMessage(message: "Copied".tl);
+              },
+            ),
+          if (comic.url != null)
+            MenuEntry(
+              icon: Icons.open_in_browser,
+              text: "Open in Browser".tl,
+              onClick: () {
+                launchUrlString(comic.url!);
+              },
+            ),
+        ]);
+  }
+
+  void showComments() {
+    showSideBar(
+      App.rootContext,
+      CommentsPage(
+        data: comic,
+        source: comicSource,
+      ),
+    );
+  }
+
+  void starRating() {
+    if (!comicSource.isLogged) {
+      return;
+    }
+    var rating = 0.0;
+    var isLoading = false;
+    showDialog(
+      context: App.rootContext,
+      builder: (dialogContext) => StatefulBuilder(
+        builder: (context, setState) => SimpleDialog(
+          title: const Text("Rating"),
+          alignment: Alignment.center,
+          children: [
+            SizedBox(
+              height: 100,
+              child: Center(
+                child: SizedBox(
+                  width: 210,
+                  child: Column(
+                    children: [
+                      const SizedBox(
+                        height: 10,
+                      ),
+                      RatingWidget(
+                        padding: 2,
+                        onRatingUpdate: (value) => rating = value,
+                        value: 1,
+                        selectable: true,
+                        size: 40,
+                      ),
+                      const Spacer(),
+                      Button.filled(
+                        isLoading: isLoading,
+                        onPressed: () {
+                          setState(() {
+                            isLoading = true;
+                          });
+                          comicSource.starRatingFunc!(comic.id, rating.round())
+                              .then((value) {
+                            if (value.success) {
+                              App.rootContext
+                                  .showMessage(message: "Success".tl);
+                              Navigator.of(dialogContext).pop();
+                            } else {
+                              App.rootContext
+                                  .showMessage(message: value.errorMessage!);
+                              setState(() {
+                                isLoading = false;
+                              });
+                            }
+                          });
+                        },
+                        child: Text("Submit".tl),
+                      )
+                    ],
+                  ),
+                ),
+              ),
+            )
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/pages/comic_details_page/chapters.dart

@@ -0,0 +1,361 @@
+part of 'comic_page.dart';
+
+class _ComicChapters extends StatelessWidget {
+  const _ComicChapters({this.history, required this.groupedMode});
+
+  final History? history;
+
+  final bool groupedMode;
+
+  @override
+  Widget build(BuildContext context) {
+    return groupedMode
+        ? _GroupedComicChapters(history)
+        : _NormalComicChapters(history);
+  }
+}
+
+class _NormalComicChapters extends StatefulWidget {
+  const _NormalComicChapters(this.history);
+
+  final History? history;
+
+  @override
+  State<_NormalComicChapters> createState() => _NormalComicChaptersState();
+}
+
+class _NormalComicChaptersState extends State<_NormalComicChapters> {
+  late _ComicPageState state;
+
+  late bool reverse;
+
+  bool showAll = false;
+
+  late History? history;
+
+  late ComicChapters chapters;
+
+  @override
+  void initState() {
+    super.initState();
+    reverse = appdata.settings["reverseChapterOrder"] ?? false;
+    history = widget.history;
+  }
+
+  @override
+  void didChangeDependencies() {
+    state = context.findAncestorStateOfType<_ComicPageState>()!;
+    chapters = state.comic.chapters!;
+    super.didChangeDependencies();
+  }
+
+  @override
+  void didUpdateWidget(covariant _NormalComicChapters oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    setState(() {
+      history = widget.history;
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SliverLayoutBuilder(
+      builder: (context, constrains) {
+        int length = chapters.length;
+        bool canShowAll = showAll;
+        if (!showAll) {
+          var width = constrains.crossAxisExtent - 16;
+          var crossItems = width ~/ 200;
+          if (width % 200 != 0) {
+            crossItems += 1;
+          }
+          length = math.min(length, crossItems * 8);
+          if (length == chapters.length) {
+            canShowAll = true;
+          }
+        }
+
+        return SliverMainAxisGroup(
+          slivers: [
+            SliverToBoxAdapter(
+              child: ListTile(
+                title: Text("Chapters".tl),
+                trailing: Tooltip(
+                  message: "Order".tl,
+                  child: IconButton(
+                    icon: Icon(reverse
+                        ? Icons.vertical_align_top
+                        : Icons.vertical_align_bottom_outlined),
+                    onPressed: () {
+                      setState(() {
+                        reverse = !reverse;
+                      });
+                    },
+                  ),
+                ),
+              ),
+            ),
+            SliverGrid(
+              delegate: SliverChildBuilderDelegate(
+                childCount: length,
+                (context, i) {
+                  if (reverse) {
+                    i = chapters.length - i - 1;
+                  }
+                  var key = chapters.ids.elementAt(i);
+                  var value = chapters[key]!;
+                  bool visited = (history?.readEpisode ?? {}).contains(i + 1);
+                  return Padding(
+                    padding: const EdgeInsets.fromLTRB(4, 4, 4, 4),
+                    child: Material(
+                      color: context.colorScheme.surfaceContainer,
+                      borderRadius: BorderRadius.circular(16),
+                      child: InkWell(
+                        onTap: () => state.read(i + 1),
+                        borderRadius: BorderRadius.circular(16),
+                        child: Padding(
+                          padding: const EdgeInsets.symmetric(horizontal: 8),
+                          child: Center(
+                            child: Text(
+                              value,
+                              maxLines: 1,
+                              textAlign: TextAlign.center,
+                              overflow: TextOverflow.ellipsis,
+                              style: TextStyle(
+                                color: visited
+                                    ? context.colorScheme.outline
+                                    : null,
+                              ),
+                            ),
+                          ),
+                        ),
+                      ),
+                    ),
+                  );
+                },
+              ),
+              gridDelegate: const SliverGridDelegateWithFixedHeight(
+                maxCrossAxisExtent: 250,
+                itemHeight: 48,
+              ),
+            ).sliverPadding(const EdgeInsets.symmetric(horizontal: 8)),
+            if (!canShowAll)
+              SliverToBoxAdapter(
+                child: Align(
+                  alignment: Alignment.center,
+                  child: TextButton.icon(
+                    icon: const Icon(Icons.arrow_drop_down),
+                    onPressed: () {
+                      setState(() {
+                        showAll = true;
+                      });
+                    },
+                    label: Text("${"Show all".tl} (${chapters.length})"),
+                  ).paddingTop(12),
+                ),
+              ),
+            const SliverToBoxAdapter(
+              child: Divider(),
+            ),
+          ],
+        );
+      },
+    );
+  }
+}
+
+class _GroupedComicChapters extends StatefulWidget {
+  const _GroupedComicChapters(this.history);
+
+  final History? history;
+
+  @override
+  State<_GroupedComicChapters> createState() => _GroupedComicChaptersState();
+}
+
+class _GroupedComicChaptersState extends State<_GroupedComicChapters>
+    with SingleTickerProviderStateMixin {
+  late _ComicPageState state;
+
+  late bool reverse;
+
+  bool showAll = false;
+
+  late History? history;
+
+  late ComicChapters chapters;
+
+  late TabController tabController;
+
+  late int index;
+
+  @override
+  void initState() {
+    super.initState();
+    reverse = appdata.settings["reverseChapterOrder"] ?? false;
+    history = widget.history;
+    if (history?.group != null) {
+      index = history!.group! - 1;
+    } else {
+      index = 0;
+    }
+  }
+
+  @override
+  void didChangeDependencies() {
+    state = context.findAncestorStateOfType<_ComicPageState>()!;
+    chapters = state.comic.chapters!;
+    tabController = TabController(
+      initialIndex: index,
+      length: chapters.ids.length,
+      vsync: this,
+    );
+    tabController.addListener(onTabChange);
+    super.didChangeDependencies();
+  }
+
+  void onTabChange() {
+    if (index != tabController.index) {
+      setState(() {
+        index = tabController.index;
+      });
+    }
+  }
+
+  @override
+  void didUpdateWidget(covariant _GroupedComicChapters oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    setState(() {
+      history = widget.history;
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SliverLayoutBuilder(
+      builder: (context, constrains) {
+        var group = chapters.getGroupByIndex(index);
+        int length = group.length;
+        bool canShowAll = showAll;
+        if (!showAll) {
+          var width = constrains.crossAxisExtent - 16;
+          var crossItems = width ~/ 200;
+          if (width % 200 != 0) {
+            crossItems += 1;
+          }
+          length = math.min(length, crossItems * 8);
+          if (length == group.length) {
+            canShowAll = true;
+          }
+        }
+
+        return SliverMainAxisGroup(
+          slivers: [
+            SliverToBoxAdapter(
+              child: ListTile(
+                title: Text("Chapters".tl),
+                trailing: Tooltip(
+                  message: "Order".tl,
+                  child: IconButton(
+                    icon: Icon(reverse
+                        ? Icons.vertical_align_top
+                        : Icons.vertical_align_bottom_outlined),
+                    onPressed: () {
+                      setState(() {
+                        reverse = !reverse;
+                      });
+                    },
+                  ),
+                ),
+              ),
+            ),
+            SliverToBoxAdapter(
+              child: AppTabBar(
+                withUnderLine: false,
+                controller: tabController,
+                tabs: chapters.groups.map((e) => Tab(text: e)).toList(),
+              ),
+            ),
+            SliverPadding(padding: const EdgeInsets.only(top: 8)),
+            SliverGrid(
+              delegate: SliverChildBuilderDelegate(
+                childCount: length,
+                (context, i) {
+                  if (reverse) {
+                    i = group.length - i - 1;
+                  }
+                  var key = group.keys.elementAt(i);
+                  var value = group[key]!;
+                  var chapterIndex = 0;
+                  for (var j = 0; j < chapters.groupCount; j++) {
+                    if (j == index) {
+                      chapterIndex += i;
+                      break;
+                    }
+                    chapterIndex += chapters.getGroupByIndex(j).length;
+                  }
+                  String rawIndex = (chapterIndex + 1).toString();
+                  String groupedIndex = "${index + 1}-${i + 1}";
+                  bool visited = false;
+                  if (history != null) {
+                    visited = history!.readEpisode.contains(groupedIndex) ||
+                        history!.readEpisode.contains(rawIndex);
+                  }
+                  return Padding(
+                    padding: const EdgeInsets.fromLTRB(4, 4, 4, 4),
+                    child: Material(
+                      color: context.colorScheme.surfaceContainerLow,
+                      borderRadius: BorderRadius.circular(12),
+                      child: InkWell(
+                        onTap: () => state.read(chapterIndex + 1),
+                        borderRadius: BorderRadius.circular(12),
+                        child: Padding(
+                          padding: const EdgeInsets.symmetric(horizontal: 8),
+                          child: Center(
+                            child: Text(
+                              value,
+                              maxLines: 1,
+                              textAlign: TextAlign.center,
+                              overflow: TextOverflow.ellipsis,
+                              style: TextStyle(
+                                color: visited
+                                    ? context.colorScheme.outline
+                                    : null,
+                              ),
+                            ),
+                          ),
+                        ),
+                      ),
+                    ),
+                  );
+                },
+              ),
+              gridDelegate: const SliverGridDelegateWithFixedHeight(
+                maxCrossAxisExtent: 250,
+                itemHeight: 48,
+              ),
+            ).sliverPadding(const EdgeInsets.symmetric(horizontal: 8)),
+            if (!canShowAll)
+              SliverToBoxAdapter(
+                child: Align(
+                  alignment: Alignment.center,
+                  child: TextButton.icon(
+                    icon: const Icon(Icons.arrow_drop_down),
+                    onPressed: () {
+                      setState(() {
+                        showAll = true;
+                      });
+                    },
+                    label: Text("${"Show all".tl} (${group.length})"),
+                  ).paddingTop(12),
+                ),
+              ),
+            const SliverToBoxAdapter(
+              child: Divider(),
+            ),
+          ],
+        );
+      },
+    );
+  }
+}

lib/pages/comic_details_page/comic_page.dart

@@ -0,0 +1,985 @@
+import 'dart:collection';
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:shimmer_animation/shimmer_animation.dart';
+import 'package:sliver_tools/sliver_tools.dart';
+import 'package:url_launcher/url_launcher_string.dart';
+import 'package:venera/components/components.dart';
+import 'package:venera/foundation/app.dart';
+import 'package:venera/foundation/appdata.dart';
+import 'package:venera/foundation/comic_source/comic_source.dart';
+import 'package:venera/foundation/comic_type.dart';
+import 'package:venera/foundation/consts.dart';
+import 'package:venera/foundation/favorites.dart';
+import 'package:venera/foundation/history.dart';
+import 'package:venera/foundation/image_provider/cached_image.dart';
+import 'package:venera/foundation/local.dart';
+import 'package:venera/foundation/res.dart';
+import 'package:venera/network/download.dart';
+import 'package:venera/pages/favorites/favorites_page.dart';
+import 'package:venera/pages/reader/reader.dart';
+import 'package:venera/utils/app_links.dart';
+import 'package:venera/utils/ext.dart';
+import 'package:venera/utils/io.dart';
+import 'package:venera/utils/tags_translation.dart';
+import 'package:venera/utils/translations.dart';
+import 'dart:math' as math;
+
+part 'comments_page.dart';
+
+part 'chapters.dart';
+
+part 'thumbnails.dart';
+
+part 'favorite.dart';
+
+part 'comments_preview.dart';
+
+part 'actions.dart';
+
+class ComicPage extends StatefulWidget {
+  const ComicPage({
+    super.key,
+    required this.id,
+    required this.sourceKey,
+    this.cover,
+    this.title,
+    this.heroID,
+  });
+
+  final String id;
+
+  final String sourceKey;
+
+  final String? cover;
+
+  final String? title;
+
+  final int? heroID;
+
+  @override
+  State<ComicPage> createState() => _ComicPageState();
+}
+
+class _ComicPageState extends LoadingState<ComicPage, ComicDetails>
+    with _ComicPageActions {
+  @override
+  History? history;
+
+  bool showAppbarTitle = false;
+
+  var scrollController = ScrollController();
+
+  bool isDownloaded = false;
+
+  bool showFAB = false;
+
+  @override
+  void onReadEnd() {
+    history ??=
+        HistoryManager().find(widget.id, ComicType(widget.sourceKey.hashCode));
+    update();
+  }
+
+  @override
+  Widget buildLoading() {
+    return _ComicPageLoadingPlaceHolder(
+      cover: widget.cover,
+      title: widget.title,
+      sourceKey: widget.sourceKey,
+      cid: widget.id,
+      heroID: widget.heroID,
+    );
+  }
+
+  @override
+  void initState() {
+    scrollController.addListener(onScroll);
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    scrollController.removeListener(onScroll);
+    super.dispose();
+  }
+
+  @override
+  void update() {
+    setState(() {});
+  }
+
+  @override
+  ComicDetails get comic => data!;
+
+  void onScroll() {
+    var offset = scrollController.position.pixels -
+        scrollController.position.minScrollExtent;
+    var showFAB = offset > 0;
+    if (showFAB != this.showFAB) {
+      setState(() {
+        this.showFAB = showFAB;
+      });
+    }
+    if (offset > 100) {
+      if (!showAppbarTitle) {
+        setState(() {
+          showAppbarTitle = true;
+        });
+      }
+    } else {
+      if (showAppbarTitle) {
+        setState(() {
+          showAppbarTitle = false;
+        });
+      }
+    }
+  }
+
+  var isFirst = true;
+
+  @override
+  Widget buildContent(BuildContext context, ComicDetails data) {
+    return Scaffold(
+      floatingActionButton: showFAB
+          ? FloatingActionButton(
+              onPressed: () {
+                scrollController.animateTo(0,
+                    duration: const Duration(milliseconds: 200),
+                    curve: Curves.ease);
+              },
+              child: const Icon(Icons.arrow_upward),
+            )
+          : null,
+      body: SmoothCustomScrollView(
+        controller: scrollController,
+        slivers: [
+          ...buildTitle(),
+          buildActions(),
+          buildDescription(),
+          buildInfo(),
+          buildChapters(),
+          buildComments(),
+          buildThumbnails(),
+          buildRecommend(),
+          SliverPadding(
+            padding: EdgeInsets.only(bottom: context.padding.bottom + 80), // Add additional padding for FAB
+          ),
+        ],
+      ),
+    );
+  }
+
+  @override
+  Future<Res<ComicDetails>> loadData() async {
+    if (widget.sourceKey == 'local') {
+      var localComic = LocalManager().find(widget.id, ComicType.local);
+      if (localComic == null) {
+        return const Res.error('Local comic not found');
+      }
+      var history = HistoryManager().find(widget.id, ComicType.local);
+      if (isFirst) {
+        Future.microtask(() {
+          App.rootContext.to(() {
+            return Reader(
+              type: ComicType.local,
+              cid: widget.id,
+              name: localComic.title,
+              chapters: localComic.chapters,
+              initialPage: history?.page,
+              initialChapter: history?.ep,
+              initialChapterGroup: history?.group,
+              history: history ??
+                  History.fromModel(
+                    model: localComic,
+                    ep: 0,
+                    page: 0,
+                  ),
+              author: localComic.subTitle ?? '',
+              tags: localComic.tags,
+            );
+          });
+          App.mainNavigatorKey!.currentContext!.pop();
+        });
+        isFirst = false;
+      }
+      await Future.delayed(const Duration(milliseconds: 200));
+      return const Res.error('Local comic');
+    }
+    var comicSource = ComicSource.find(widget.sourceKey);
+    if (comicSource == null) {
+      return const Res.error('Comic source not found');
+    }
+    isAddToLocalFav = LocalFavoritesManager().isExist(
+      widget.id,
+      ComicType(widget.sourceKey.hashCode),
+    );
+    history =
+        HistoryManager().find(widget.id, ComicType(widget.sourceKey.hashCode));
+    return comicSource.loadComicInfo!(widget.id);
+  }
+
+  @override
+  Future<void> onDataLoaded() async {
+    isLiked = comic.isLiked ?? false;
+    isFavorite = comic.isFavorite ?? false;
+    if (comic.chapters == null) {
+      isDownloaded = LocalManager().isDownloaded(
+        comic.id,
+        comic.comicType,
+        0,
+      );
+    }
+  }
+
+  Iterable<Widget> buildTitle() sync* {
+    yield SliverAppbar(
+      title: AnimatedOpacity(
+        opacity: showAppbarTitle ? 1.0 : 0.0,
+        duration: const Duration(milliseconds: 200),
+        child: Text(comic.title),
+      ),
+      actions: [
+        IconButton(
+            onPressed: showMoreActions, icon: const Icon(Icons.more_horiz))
+      ],
+    );
+
+    yield const SliverPadding(padding: EdgeInsets.only(top: 8));
+
+    yield SliverLazyToBoxAdapter(
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          const SizedBox(width: 16),
+          Hero(
+            tag: "cover${widget.heroID}",
+            child: Container(
+              decoration: BoxDecoration(
+                color: context.colorScheme.primaryContainer,
+                borderRadius: BorderRadius.circular(8),
+                boxShadow: [
+                  BoxShadow(
+                    color: context.colorScheme.outlineVariant,
+                    blurRadius: 1,
+                    offset: const Offset(0, 1),
+                  ),
+                ],
+              ),
+              height: 144,
+              width: 144 * 0.72,
+              clipBehavior: Clip.antiAlias,
+              child: AnimatedImage(
+                image: CachedImageProvider(
+                  widget.cover ?? comic.cover,
+                  sourceKey: comic.sourceKey,
+                  cid: comic.id,
+                ),
+                width: double.infinity,
+                height: double.infinity,
+              ),
+            ),
+          ),
+          const SizedBox(width: 16),
+          Expanded(
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                SelectableText(comic.title, style: ts.s18),
+                if (comic.subTitle != null)
+                  SelectableText(comic.subTitle!, style: ts.s14)
+                      .paddingVertical(4),
+                Text(
+                  (ComicSource.find(comic.sourceKey)?.name) ?? '',
+                  style: ts.s12,
+                ),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget buildActions() {
+    bool isMobile = context.width < changePoint;
+    bool hasHistory = history != null && (history!.ep > 1 || history!.page > 1);
+    return SliverLazyToBoxAdapter(
+      child: Column(
+        children: [
+          ListView(
+            scrollDirection: Axis.horizontal,
+            padding: const EdgeInsets.symmetric(horizontal: 8),
+            children: [
+              if (hasHistory && !isMobile)
+                _ActionButton(
+                  icon: const Icon(Icons.menu_book),
+                  text: 'Continue'.tl,
+                  onPressed: continueRead,
+                  iconColor: context.useTextColor(Colors.yellow),
+                ),
+              if (!isMobile || hasHistory)
+                _ActionButton(
+                  icon: const Icon(Icons.play_circle_outline),
+                  text: 'Start'.tl,
+                  onPressed: read,
+                  iconColor: context.useTextColor(Colors.orange),
+                ),
+              if (!isMobile && !isDownloaded)
+                _ActionButton(
+                  icon: const Icon(Icons.download),
+                  text: 'Download'.tl,
+                  onPressed: download,
+                  iconColor: context.useTextColor(Colors.cyan),
+                ),
+              if (data!.isLiked != null)
+                _ActionButton(
+                  icon: const Icon(Icons.favorite_border),
+                  activeIcon: const Icon(Icons.favorite),
+                  isActive: isLiked,
+                  text: ((data!.likesCount != null)
+                          ? (data!.likesCount! + (isLiked ? 1 : 0))
+                          : (isLiked ? 'Liked'.tl : 'Like'.tl))
+                      .toString(),
+                  isLoading: isLiking,
+                  onPressed: likeOrUnlike,
+                  iconColor: context.useTextColor(Colors.red),
+                ),
+              _ActionButton(
+                icon: const Icon(Icons.bookmark_outline_outlined),
+                activeIcon: const Icon(Icons.bookmark),
+                isActive: isFavorite || isAddToLocalFav,
+                text: 'Favorite'.tl,
+                onPressed: openFavPanel,
+                onLongPressed: quickFavorite,
+                iconColor: context.useTextColor(Colors.purple),
+              ),
+              if (comicSource.commentsLoader != null)
+                _ActionButton(
+                  icon: const Icon(Icons.comment),
+                  text: (comic.commentCount ?? 'Comments'.tl).toString(),
+                  onPressed: showComments,
+                  iconColor: context.useTextColor(Colors.green),
+                ),
+              _ActionButton(
+                icon: const Icon(Icons.share),
+                text: 'Share'.tl,
+                onPressed: share,
+                iconColor: context.useTextColor(Colors.blue),
+              ),
+            ],
+          ).fixHeight(48),
+          if (isMobile)
+            Row(
+              children: [
+                Expanded(
+                  child: FilledButton.tonal(
+                    onPressed: download,
+                    child: Text("Download".tl),
+                  ),
+                ),
+                const SizedBox(width: 16),
+                Expanded(
+                  child: hasHistory
+                      ? FilledButton(
+                          onPressed: continueRead, child: Text("Continue".tl))
+                      : FilledButton(onPressed: read, child: Text("Read".tl)),
+                )
+              ],
+            ).paddingHorizontal(16).paddingVertical(8),
+          if (history != null)
+            Container(
+              margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+              padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+              decoration: BoxDecoration(
+                color: context.colorScheme.surfaceContainerLow,
+                borderRadius: BorderRadius.circular(24),
+              ),
+              child: Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  Icon(Icons.history, color: context.useTextColor(Colors.teal)),
+                  const SizedBox(width: 8),
+                  Builder(
+                    builder: (context) {
+                      bool haveChapter = comic.chapters != null;
+                      var page = history!.page;
+                      var ep = history!.ep;
+                      var group = history!.group;
+                      String text;
+                      if (haveChapter) {
+                        var epName = "E$ep";
+                        String? groupName;
+                        try {
+                          if (group == null){
+                            epName = comic.chapters!.titles.elementAt(
+                              math.min(ep - 1, comic.chapters!.length - 1),
+                            );
+                          } else {
+                            groupName = comic.chapters!.groups.elementAt(group - 1);
+                            epName = comic.chapters!
+                                .getGroupByIndex(group - 1)
+                                .values
+                                .elementAt(ep - 1);
+                          }
+                        }
+                        catch(e) {
+                          // ignore
+                        }
+                        text = groupName == null
+                            ? "${"Last Reading".tl}: $epName P$page"
+                            : "${"Last Reading".tl}: $groupName $epName P$page";
+                      } else {
+                        text = "${"Last Reading".tl}: P$page";
+                      }
+                      return Text(text);
+                    },
+                  ),
+                  const SizedBox(width: 4),
+                ],
+              ),
+            ).toAlign(Alignment.centerLeft),
+          const Divider(),
+        ],
+      ).paddingTop(16),
+    );
+  }
+
+  Widget buildDescription() {
+    if (comic.description == null || comic.description!.trim().isEmpty) {
+      return const SliverPadding(padding: EdgeInsets.zero);
+    }
+    return SliverLazyToBoxAdapter(
+      child: Column(
+        children: [
+          ListTile(
+            title: Text("Description".tl),
+          ),
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 16),
+            child: SelectableText(comic.description!).fixWidth(double.infinity),
+          ),
+          const SizedBox(height: 16),
+          const Divider(),
+        ],
+      ),
+    );
+  }
+
+  Widget buildInfo() {
+    if (comic.tags.isEmpty &&
+        comic.uploader == null &&
+        comic.uploadTime == null &&
+        comic.uploadTime == null &&
+        comic.maxPage == null) {
+      return const SliverPadding(padding: EdgeInsets.zero);
+    }
+
+    int i = 0;
+
+    Widget buildTag({
+      required String text,
+      VoidCallback? onTap,
+      bool isTitle = false,
+    }) {
+      Color color;
+      if (isTitle) {
+        const colors = [
+          Colors.blue,
+          Colors.cyan,
+          Colors.red,
+          Colors.pink,
+          Colors.purple,
+          Colors.indigo,
+          Colors.teal,
+          Colors.green,
+          Colors.lime,
+          Colors.yellow,
+        ];
+        color = context.useBackgroundColor(colors[(i++) % (colors.length)]);
+      } else {
+        color = context.colorScheme.surfaceContainerLow;
+      }
+
+      final borderRadius = BorderRadius.circular(12);
+
+      const padding = EdgeInsets.symmetric(horizontal: 16, vertical: 6);
+
+      if (onTap != null) {
+        return Material(
+          color: color,
+          borderRadius: borderRadius,
+          child: InkWell(
+            borderRadius: borderRadius,
+            onTap: onTap,
+            onLongPress: () {
+              Clipboard.setData(ClipboardData(text: text));
+              context.showMessage(message: "Copied".tl);
+            },
+            onSecondaryTapDown: (details) {
+              showMenuX(context, details.globalPosition, [
+                MenuEntry(
+                  icon: Icons.remove_red_eye,
+                  text: "View".tl,
+                  onClick: onTap,
+                ),
+                MenuEntry(
+                  icon: Icons.copy,
+                  text: "Copy".tl,
+                  onClick: () {
+                    Clipboard.setData(ClipboardData(text: text));
+                    context.showMessage(message: "Copied".tl);
+                  },
+                ),
+              ]);
+            },
+            child: Text(text).padding(padding),
+          ),
+        );
+      } else {
+        return Container(
+          decoration: BoxDecoration(
+            color: color,
+            borderRadius: borderRadius,
+          ),
+          child: Text(text).padding(padding),
+        );
+      }
+    }
+
+    String formatTime(String time) {
+      if (int.tryParse(time) != null) {
+        var t = int.tryParse(time);
+        if (t! > 1000000000000) {
+          return DateTime.fromMillisecondsSinceEpoch(t)
+              .toString()
+              .substring(0, 19);
+        } else {
+          return DateTime.fromMillisecondsSinceEpoch(t * 1000)
+              .toString()
+              .substring(0, 19);
+        }
+      }
+      if (time.contains('T') || time.contains('Z')) {
+        var t = DateTime.parse(time);
+        return t.toString().substring(0, 19);
+      }
+      return time;
+    }
+
+    Widget buildWrap({required List<Widget> children}) {
+      return Wrap(
+        runSpacing: 8,
+        spacing: 8,
+        children: children,
+      ).paddingHorizontal(16).paddingBottom(8);
+    }
+
+    bool enableTranslation =
+        App.locale.languageCode == 'zh' && comicSource.enableTagsTranslate;
+
+    return SliverLazyToBoxAdapter(
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          ListTile(
+            title: Text("Information".tl),
+          ),
+          if (comic.stars != null)
+            Row(
+              children: [
+                StarRating(
+                  value: comic.stars!,
+                  size: 24,
+                  onTap: starRating,
+                ),
+                const SizedBox(width: 8),
+                Text(comic.stars!.toStringAsFixed(2)),
+              ],
+            ).paddingLeft(16).paddingVertical(8),
+          for (var e in comic.tags.entries)
+            buildWrap(
+              children: [
+                if (e.value.isNotEmpty)
+                  buildTag(text: e.key.ts(comicSource.key), isTitle: true),
+                for (var tag in e.value)
+                  buildTag(
+                    text: enableTranslation
+                        ? TagsTranslation.translationTagWithNamespace(
+                            tag,
+                            e.key.toLowerCase(),
+                          )
+                        : tag,
+                    onTap: () => onTapTag(tag, e.key),
+                  ),
+              ],
+            ),
+          if (comic.uploader != null)
+            buildWrap(
+              children: [
+                buildTag(text: 'Uploader'.tl, isTitle: true),
+                buildTag(text: comic.uploader!),
+              ],
+            ),
+          if (comic.uploadTime != null)
+            buildWrap(
+              children: [
+                buildTag(text: 'Upload Time'.tl, isTitle: true),
+                buildTag(text: formatTime(comic.uploadTime!)),
+              ],
+            ),
+          if (comic.updateTime != null)
+            buildWrap(
+              children: [
+                buildTag(text: 'Update Time'.tl, isTitle: true),
+                buildTag(text: formatTime(comic.updateTime!)),
+              ],
+            ),
+          if (comic.maxPage != null)
+            buildWrap(
+              children: [
+                buildTag(text: 'Pages'.tl, isTitle: true),
+                buildTag(text: comic.maxPage.toString()),
+              ],
+            ),
+          const SizedBox(height: 12),
+          const Divider(),
+        ],
+      ),
+    );
+  }
+
+  Widget buildChapters() {
+    if (comic.chapters == null) {
+      return const SliverPadding(padding: EdgeInsets.zero);
+    }
+    return _ComicChapters(
+      history: history,
+      groupedMode: comic.chapters!.isGrouped,
+    );
+  }
+
+  Widget buildThumbnails() {
+    if (comic.thumbnails == null && comicSource.loadComicThumbnail == null) {
+      return const SliverPadding(padding: EdgeInsets.zero);
+    }
+    return const _ComicThumbnails();
+  }
+
+  Widget buildRecommend() {
+    if (comic.recommend == null || comic.recommend!.isEmpty) {
+      return const SliverPadding(padding: EdgeInsets.zero);
+    }
+    return SliverMainAxisGroup(slivers: [
+      SliverToBoxAdapter(
+        child: ListTile(
+          title: Text("Related".tl),
+        ),
+      ),
+      SliverGridComics(comics: comic.recommend!),
+    ]);
+  }
+
+  Widget buildComments() {
+    if (comic.comments == null || comic.comments!.isEmpty) {
+      return const SliverPadding(padding: EdgeInsets.zero);
+    }
+    return _CommentsPart(
+      comments: comic.comments!,
+      showMore: showComments,
+    );
+  }
+}
+
+class _ActionButton extends StatelessWidget {
+  const _ActionButton({
+    required this.icon,
+    required this.text,
+    required this.onPressed,
+    this.onLongPressed,
+    this.activeIcon,
+    this.isActive,
+    this.isLoading,
+    this.iconColor,
+  });
+
+  final Widget icon;
+
+  final Widget? activeIcon;
+
+  final bool? isActive;
+
+  final String text;
+
+  final void Function() onPressed;
+
+  final bool? isLoading;
+
+  final Color? iconColor;
+
+  final void Function()? onLongPressed;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      margin: const EdgeInsets.symmetric(horizontal: 4, vertical: 6),
+      decoration: BoxDecoration(
+        borderRadius: BorderRadius.circular(18),
+        border: Border.all(
+          color: context.colorScheme.outlineVariant,
+          width: 0.6,
+        ),
+      ),
+      child: InkWell(
+        onTap: () {
+          if (!(isLoading ?? false)) {
+            onPressed();
+          }
+        },
+        onLongPress: onLongPressed,
+        borderRadius: BorderRadius.circular(18),
+        child: IconTheme.merge(
+          data: IconThemeData(size: 20, color: iconColor),
+          child: Row(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              if (isLoading ?? false)
+                const SizedBox(
+                  width: 20,
+                  height: 20,
+                  child: CircularProgressIndicator(strokeWidth: 1.8),
+                )
+              else
+                (isActive ?? false) ? (activeIcon ?? icon) : icon,
+              const SizedBox(width: 8),
+              Text(text),
+            ],
+          ).paddingHorizontal(16),
+        ),
+      ),
+    );
+  }
+}
+
+class _SelectDownloadChapter extends StatefulWidget {
+  const _SelectDownloadChapter(this.eps, this.finishSelect, this.downloadedEps);
+
+  final List<String> eps;
+  final void Function(List<int>) finishSelect;
+  final List<int> downloadedEps;
+
+  @override
+  State<_SelectDownloadChapter> createState() => _SelectDownloadChapterState();
+}
+
+class _SelectDownloadChapterState extends State<_SelectDownloadChapter> {
+  List<int> selected = [];
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: Appbar(
+        title: Text("Download".tl),
+        backgroundColor: context.colorScheme.surfaceContainerLow,
+      ),
+      body: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Expanded(
+            child: ListView.builder(
+              padding: EdgeInsets.zero,
+              itemCount: widget.eps.length,
+              itemBuilder: (context, i) {
+                return CheckboxListTile(
+                    title: Text(widget.eps[i]),
+                    value: selected.contains(i) ||
+                        widget.downloadedEps.contains(i),
+                    onChanged: widget.downloadedEps.contains(i)
+                        ? null
+                        : (v) {
+                            setState(() {
+                              if (selected.contains(i)) {
+                                selected.remove(i);
+                              } else {
+                                selected.add(i);
+                              }
+                            });
+                          });
+              },
+            ),
+          ),
+          Container(
+            height: 50,
+            decoration: BoxDecoration(
+              border: Border(
+                top: BorderSide(
+                  color: context.colorScheme.outlineVariant,
+                ),
+              ),
+            ),
+            child: Row(
+              children: [
+                const SizedBox(width: 16),
+                Expanded(
+                  child: TextButton(
+                    onPressed: () {
+                      var res = <int>[];
+                      for (int i = 0; i < widget.eps.length; i++) {
+                        if (!widget.downloadedEps.contains(i)) {
+                          res.add(i);
+                        }
+                      }
+                      widget.finishSelect(res);
+                      context.pop();
+                    },
+                    child: Text("Download All".tl),
+                  ),
+                ),
+                const SizedBox(width: 16),
+                Expanded(
+                  child: FilledButton(
+                    onPressed: selected.isEmpty
+                        ? null
+                        : () {
+                            widget.finishSelect(selected);
+                            context.pop();
+                          },
+                    child: Text("Download Selected".tl),
+                  ),
+                ),
+                const SizedBox(width: 16),
+              ],
+            ),
+          ),
+          SizedBox(height: MediaQuery.of(context).padding.bottom),
+        ],
+      ),
+    );
+  }
+}
+
+class _ComicPageLoadingPlaceHolder extends StatelessWidget {
+  const _ComicPageLoadingPlaceHolder({
+    this.cover,
+    this.title,
+    required this.sourceKey,
+    required this.cid,
+    this.heroID,
+  });
+
+  final String? cover;
+
+  final String? title;
+
+  final String sourceKey;
+
+  final String cid;
+
+  final int? heroID;
+
+  @override
+  Widget build(BuildContext context) {
+    Widget buildContainer(double? width, double? height,
+        {Color? color, double? radius}) {
+      return Container(
+        height: height,
+        width: width,
+        decoration: BoxDecoration(
+          color: color ?? context.colorScheme.surfaceContainerLow,
+          borderRadius: BorderRadius.circular(radius ?? 4),
+        ),
+      );
+    }
+
+    return Shimmer(
+      color: context.isDarkMode ? Colors.grey.shade700 : Colors.white,
+      child: Column(
+        children: [
+          Appbar(title: Text(""), backgroundColor: context.colorScheme.surface),
+          const SizedBox(height: 8),
+          Row(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              const SizedBox(width: 16),
+              buildImage(context),
+              const SizedBox(width: 16),
+              Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    if (title != null)
+                      Text(title ?? "", style: ts.s18)
+                    else
+                      buildContainer(200, 25),
+                    const SizedBox(height: 8),
+                    buildContainer(80, 20),
+                  ],
+                ),
+              ),
+            ],
+          ),
+          const SizedBox(height: 8),
+          if (context.width < changePoint)
+            Row(
+              children: [
+                Expanded(
+                  child: buildContainer(null, 36, radius: 18),
+                ),
+                const SizedBox(width: 16),
+                Expanded(
+                  child: buildContainer(null, 36, radius: 18),
+                ),
+              ],
+            ).paddingHorizontal(16),
+          const Divider(),
+          const SizedBox(height: 8),
+          Center(
+            child: CircularProgressIndicator(
+              strokeWidth: 2.4,
+            ).fixHeight(24).fixWidth(24),
+          )
+        ],
+      ),
+    );
+  }
+
+  Widget buildImage(BuildContext context) {
+    Widget child;
+    if (cover != null) {
+      child = AnimatedImage(
+        image: CachedImageProvider(
+          cover!,
+          sourceKey: sourceKey,
+          cid: cid,
+        ),
+        width: double.infinity,
+        height: double.infinity,
+        fit: BoxFit.cover,
+      );
+    } else {
+      child = const SizedBox();
+    }
+
+    return Hero(
+      tag: "cover$heroID",
+      child: Container(
+        decoration: BoxDecoration(
+          color: context.colorScheme.primaryContainer,
+          borderRadius: BorderRadius.circular(8),
+          boxShadow: [
+            BoxShadow(
+              color: context.colorScheme.outlineVariant,
+              blurRadius: 1,
+              offset: const Offset(0, 1),
+            ),
+          ],
+        ),
+        height: 144,
+        width: 144 * 0.72,
+        clipBehavior: Clip.antiAlias,
+        child: child,
+      ),
+    );
+  }
+}

lib/pages/comic_details_page/comments_page.dart

@@ -1,25 +1,18 @@
-import 'dart:collection';
+part of 'comic_page.dart';
-
-import 'package:flutter/gestures.dart';
-import 'package:flutter/material.dart';
-import 'package:url_launcher/url_launcher_string.dart';
-import 'package:venera/components/components.dart';
-import 'package:venera/foundation/app.dart';
-import 'package:venera/foundation/comic_source/comic_source.dart';
-import 'package:venera/foundation/image_provider/cached_image.dart';
-import 'package:venera/utils/app_links.dart';
-import 'package:venera/utils/ext.dart';
-import 'package:venera/utils/translations.dart';
 
 class CommentsPage extends StatefulWidget {
-  const CommentsPage(
+  const CommentsPage({
-      {super.key, required this.data, required this.source, this.replyId});
+    super.key,
+    required this.data,
+    required this.source,
+    this.replyComment,
+  });
 
   final ComicDetails data;
 
   final ComicSource source;
 
-  final String? replyId;
+  final Comment? replyComment;
 
   @override
   State<CommentsPage> createState() => _CommentsPageState();
@@ -36,13 +29,13 @@ class _CommentsPageState extends State<CommentsPage> {
 
   void firstLoad() async {
     var res = await widget.source.commentsLoader!(
-        widget.data.comicId, widget.data.subId, 1, widget.replyId);
+        widget.data.comicId, widget.data.subId, 1, widget.replyComment?.id);
     if (res.error) {
       setState(() {
         _error = res.errorMessage;
         _loading = false;
       });
-    } else {
+    } else if (mounted) {
       setState(() {
         _comments = res.data;
         _loading = false;
@@ -53,7 +46,11 @@ class _CommentsPageState extends State<CommentsPage> {
 
   void loadMore() async {
     var res = await widget.source.commentsLoader!(
-        widget.data.comicId, widget.data.subId, _page + 1, widget.replyId);
+      widget.data.comicId,
+      widget.data.subId,
+      _page + 1,
+      widget.replyComment?.id,
+    );
     if (res.error) {
       context.showMessage(message: res.errorMessage ?? "Unknown Error");
     } else {
@@ -73,6 +70,7 @@ class _CommentsPageState extends State<CommentsPage> {
       resizeToAvoidBottomInset: false,
       appBar: Appbar(
         title: Text("Comments".tl),
+        style: AppbarStyle.shadow,
       ),
       body: buildBody(context),
     );
@@ -101,11 +99,51 @@ class _CommentsPageState extends State<CommentsPage> {
       return Column(
         children: [
           Expanded(
-            child: ListView.builder(
+            child: SmoothScrollProvider(
+              builder: (context, controller, physics) {
+                return ListView.builder(
+                  controller: controller,
+                  physics: physics,
                   primary: false,
                   padding: EdgeInsets.zero,
-              itemCount: _comments!.length + 1,
+                  itemCount: _comments!.length + 2,
                   itemBuilder: (context, index) {
+                    if (index == 0) {
+                      if (widget.replyComment != null) {
+                        return Column(
+                          children: [
+                            _CommentTile(
+                              comment: widget.replyComment!,
+                              source: widget.source,
+                              comic: widget.data,
+                              showAvatar: showAvatar,
+                              showActions: false,
+                            ),
+                            const SizedBox(height: 8),
+                            Container(
+                              alignment: Alignment.centerLeft,
+                              padding: const EdgeInsets.all(16),
+                              decoration: BoxDecoration(
+                                border: Border(
+                                  top: BorderSide(
+                                    color: context.colorScheme.outlineVariant,
+                                    width: 0.6,
+                                  ),
+                                ),
+                              ),
+                              child: Text(
+                                "Replies".tl,
+                                style: ts.s18,
+                              ),
+                            ),
+                          ],
+                        );
+                      } else {
+                        return const SizedBox();
+                      }
+                    }
+                    index--;
+
                     if (index == _comments!.length) {
                       if (_page < (maxPage ?? _page + 1)) {
                         loadMore();
@@ -122,6 +160,8 @@ class _CommentsPageState extends State<CommentsPage> {
                       showAvatar: showAvatar,
                     );
                   },
+                );
+              },
             ),
           ),
           buildBottom(context)
@@ -140,6 +180,12 @@ class _CommentsPageState extends State<CommentsPage> {
       padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 8),
       decoration: BoxDecoration(
         color: Theme.of(context).colorScheme.surface,
+        border: Border(
+          top: BorderSide(
+            color: context.colorScheme.outlineVariant,
+            width: 0.6,
+          ),
+        ),
       ),
       child: Material(
         color: context.colorScheme.surfaceContainer,
@@ -159,7 +205,7 @@ class _CommentsPageState extends State<CommentsPage> {
             ),
             if (sending)
               const Padding(
-                padding: EdgeInsets.all(8.5),
+                padding: EdgeInsets.all(8),
                 child: SizedBox(
                   width: 24,
                   height: 24,
@@ -181,7 +227,7 @@ class _CommentsPageState extends State<CommentsPage> {
                       widget.data.comicId,
                       widget.data.subId,
                       controller.text,
-                      widget.replyId);
+                      widget.replyComment?.id);
                   if (!b.error) {
                     controller.text = "";
                     setState(() {
@@ -204,7 +250,7 @@ class _CommentsPageState extends State<CommentsPage> {
                 ),
               )
           ],
-        ).paddingVertical(2).paddingLeft(16).paddingRight(4),
+        ).paddingLeft(16).paddingRight(4),
       ),
     );
   }
@@ -216,6 +262,7 @@ class _CommentTile extends StatefulWidget {
     required this.source,
     required this.comic,
     required this.showAvatar,
+    this.showActions = true,
   });
 
   final Comment comment;
@@ -226,6 +273,8 @@ class _CommentTile extends StatefulWidget {
 
   final bool showAvatar;
 
+  final bool showActions;
+
   @override
   State<_CommentTile> createState() => _CommentTileState();
 }
@@ -242,24 +291,17 @@ class _CommentTileState extends State<_CommentTile> {
   @override
   Widget build(BuildContext context) {
     return Container(
-      decoration: BoxDecoration(
+      padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16),
-        border: Border(
-          bottom: BorderSide(
-            color: Theme.of(context).colorScheme.outlineVariant,
-            width: 0.6,
-          ),
-        ),
-      ),
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           if (widget.showAvatar)
             Container(
-              width: 40,
+              width: 36,
-              height: 40,
+              height: 36,
               clipBehavior: Clip.antiAlias,
               decoration: BoxDecoration(
-                  borderRadius: BorderRadius.circular(20),
+                  borderRadius: BorderRadius.circular(18),
                   color: Theme.of(context).colorScheme.secondaryContainer),
               child: widget.comment.avatar == null
                   ? null
@@ -269,7 +311,7 @@ class _CommentTileState extends State<_CommentTile> {
                         sourceKey: widget.source.key,
                       ),
                     ),
-            ).paddingRight(12),
+            ).paddingRight(8),
           Expanded(
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
@@ -287,11 +329,14 @@ class _CommentTileState extends State<_CommentTile> {
             ),
           )
         ],
-      ).paddingAll(16),
+      ),
     );
   }
 
   Widget buildActions() {
+    if (!widget.showActions) {
+      return const SizedBox();
+    }
     if (widget.comment.score == null && widget.comment.replyCount == null) {
       return const SizedBox();
     }
@@ -330,7 +375,7 @@ class _CommentTileState extends State<_CommentTile> {
             CommentsPage(
               data: widget.comic,
               source: widget.source,
-              replyId: widget.comment.id,
+              replyComment: widget.comment,
             ),
             showBarrier: false,
           );
@@ -529,6 +574,7 @@ class _Tag {
       'u' => style.underline,
       's' => style.lineThrough,
       'a' => style.withColor(context.colorScheme.primary),
+      'strong' => style.bold,
       'span' => () {
           if (attributes.containsKey('style')) {
             var s = attributes['style']!;
@@ -611,10 +657,16 @@ class _CommentImage {
 }
 
 class RichCommentContent extends StatefulWidget {
-  const RichCommentContent({super.key, required this.text});
+  const RichCommentContent({
+    super.key,
+    required this.text,
+    this.showImages = true,
+  });
 
   final String text;
 
+  final bool showImages;
+
   @override
   State<RichCommentContent> createState() => _RichCommentContentState();
 }
@@ -622,10 +674,14 @@ class RichCommentContent extends StatefulWidget {
 class _RichCommentContentState extends State<RichCommentContent> {
   var textSpan = <InlineSpan>[];
   var images = <_CommentImage>[];
+  bool isRendered = false;
 
   @override
   void didChangeDependencies() {
+    if (!isRendered) {
       render();
+      isRendered = true;
+    }
     super.didChangeDependencies();
   }
 
@@ -670,7 +726,17 @@ class _RichCommentContentState extends State<RichCommentContent> {
                 attributes[attrSplits[0]] = attrSplits[1].replaceAll('"', '');
               }
             }
-            const acceptedTags = ['img', 'a', 'b', 'i', 'u', 's', 'br', 'span'];
+            const acceptedTags = [
+              'img',
+              'a',
+              'b',
+              'i',
+              'u',
+              's',
+              'br',
+              'span',
+              'strong'
+            ];
             if (acceptedTags.contains(tagName)) {
               writeBuffer();
               if (tagName == 'img') {
@@ -754,7 +820,7 @@ class _RichCommentContentState extends State<RichCommentContent> {
         children: textSpan,
       ),
     );
-    if (images.isNotEmpty) {
+    if (images.isNotEmpty && widget.showImages) {
       content = Column(
         mainAxisSize: MainAxisSize.min,
         children: [

lib/pages/comic_details_page/comments_preview.dart

@@ -0,0 +1,153 @@
+part of 'comic_page.dart';
+
+class _CommentsPart extends StatefulWidget {
+  const _CommentsPart({
+    required this.comments,
+    required this.showMore,
+  });
+
+  final List<Comment> comments;
+
+  final void Function() showMore;
+
+  @override
+  State<_CommentsPart> createState() => _CommentsPartState();
+}
+
+class _CommentsPartState extends State<_CommentsPart> {
+  final scrollController = ScrollController();
+
+  late List<Comment> comments;
+
+  @override
+  void initState() {
+    comments = widget.comments;
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return MultiSliver(
+      children: [
+        SliverLazyToBoxAdapter(
+          child: ListTile(
+            title: Text("Comments".tl),
+            trailing: Row(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                IconButton(
+                  icon: const Icon(Icons.chevron_left),
+                  onPressed: () {
+                    scrollController.animateTo(
+                      scrollController.position.pixels - 340,
+                      duration: const Duration(milliseconds: 200),
+                      curve: Curves.ease,
+                    );
+                  },
+                ),
+                IconButton(
+                  icon: const Icon(Icons.chevron_right),
+                  onPressed: () {
+                    scrollController.animateTo(
+                      scrollController.position.pixels + 340,
+                      duration: const Duration(milliseconds: 200),
+                      curve: Curves.ease,
+                    );
+                  },
+                ),
+              ],
+            ),
+          ),
+        ),
+        SliverToBoxAdapter(
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              SizedBox(
+                height: 184,
+                child: MediaQuery.removePadding(
+                  removeTop: true,
+                  context: context,
+                  child: ListView.builder(
+                    controller: scrollController,
+                    scrollDirection: Axis.horizontal,
+                    itemCount: comments.length,
+                    itemBuilder: (context, index) {
+                      return _CommentWidget(comment: comments[index]);
+                    },
+                  ),
+                ),
+              ),
+              const SizedBox(height: 8),
+              _ActionButton(
+                icon: const Icon(Icons.comment),
+                text: "View more".tl,
+                onPressed: widget.showMore,
+                iconColor: context.useTextColor(Colors.green),
+              ).fixHeight(48).paddingRight(8).toAlign(Alignment.centerRight),
+              const SizedBox(height: 8),
+            ],
+          ),
+        ),
+        const SliverToBoxAdapter(
+          child: Divider(),
+        ),
+      ],
+    );
+  }
+}
+
+class _CommentWidget extends StatelessWidget {
+  const _CommentWidget({required this.comment});
+
+  final Comment comment;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      height: double.infinity,
+      margin: const EdgeInsets.fromLTRB(16, 8, 0, 8),
+      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+      width: 324,
+      decoration: BoxDecoration(
+        color: context.colorScheme.surfaceContainerLow,
+        borderRadius: BorderRadius.circular(12),
+      ),
+      child: Column(
+        children: [
+          Row(
+            children: [
+              if (comment.avatar != null)
+                Container(
+                  width: 36,
+                  height: 36,
+                  decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(18),
+                    color: context.colorScheme.surfaceContainer,
+                  ),
+                  clipBehavior: Clip.antiAlias,
+                  child: Image(
+                    image: CachedImageProvider(comment.avatar!),
+                    width: 36,
+                    height: 36,
+                    fit: BoxFit.cover,
+                  ),
+                ).paddingRight(8),
+              Text(comment.userName, style: ts.bold),
+            ],
+          ),
+          const SizedBox(height: 4),
+          Expanded(
+            child: RichCommentContent(
+              text: comment.content,
+              showImages: false,
+            ).fixWidth(324),
+          ),
+          const SizedBox(height: 4),
+          if (comment.time != null)
+            Text(comment.time!, style: ts.s12).toAlign(Alignment.centerLeft),
+        ],
+      ),
+    );
+  }
+}

lib/pages/comic_details_page/favorite.dart

@@ -0,0 +1,432 @@
+part of 'comic_page.dart';
+
+class _FavoritePanel extends StatefulWidget {
+  const _FavoritePanel({
+    required this.cid,
+    required this.type,
+    required this.isFavorite,
+    required this.onFavorite,
+    required this.favoriteItem,
+    this.updateTime,
+  });
+
+  final String cid;
+
+  final ComicType type;
+
+  /// whether the comic is in the network favorite list
+  ///
+  /// if null, the comic source does not support favorite or support multiple favorite lists
+  final bool? isFavorite;
+
+  final void Function(bool?, bool?) onFavorite;
+
+  final FavoriteItem favoriteItem;
+
+  final String? updateTime;
+
+  @override
+  State<_FavoritePanel> createState() => _FavoritePanelState();
+}
+
+class _FavoritePanelState extends State<_FavoritePanel>
+    with SingleTickerProviderStateMixin {
+  late ComicSource comicSource;
+
+  late TabController tabController;
+
+  late bool hasNetwork;
+
+  @override
+  void initState() {
+    comicSource = widget.type.comicSource!;
+    localFolders = LocalFavoritesManager().folderNames;
+    added = LocalFavoritesManager().find(widget.cid, widget.type);
+    hasNetwork = comicSource.favoriteData != null && comicSource.isLogged;
+    var initIndex = 0;
+    if (appdata.implicitData['favoritePanelIndex'] is int) {
+      initIndex = appdata.implicitData['favoritePanelIndex'];
+    }
+    initIndex = initIndex.clamp(0, hasNetwork ? 1 : 0);
+    tabController = TabController(
+      initialIndex: initIndex,
+      length: hasNetwork ? 2 : 1,
+      vsync: this,
+    );
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    var currentIndex = tabController.index;
+    appdata.implicitData['favoritePanelIndex'] = currentIndex;
+    appdata.writeImplicitData();
+    tabController.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: Appbar(
+        title: Text("Favorite".tl),
+      ),
+      body: Column(
+        children: [
+          TabBar(
+            controller: tabController,
+            tabs: [
+              Tab(text: "Local".tl),
+              if (hasNetwork) Tab(text: "Network".tl),
+            ],
+          ),
+          Expanded(
+            child: TabBarView(
+              controller: tabController,
+              children: [
+                buildLocal(),
+                if (hasNetwork) buildNetwork(),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  late List<String> localFolders;
+
+  late List<String> added;
+
+  var selectedLocalFolders = <String>{};
+
+  Widget buildLocal() {
+    var isRemove = selectedLocalFolders.isNotEmpty &&
+        added.contains(selectedLocalFolders.first);
+    return Column(
+      children: [
+        Expanded(
+          child: ListView.builder(
+            itemCount: localFolders.length + 1,
+            itemBuilder: (context, index) {
+              if (index == localFolders.length) {
+                return SizedBox(
+                  height: 36,
+                  child: Center(
+                    child: TextButton(
+                      onPressed: () {
+                        newFolder().then((v) {
+                          setState(() {
+                            localFolders = LocalFavoritesManager().folderNames;
+                          });
+                        });
+                      },
+                      child: Row(
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          const Icon(Icons.add, size: 20),
+                          const SizedBox(width: 4),
+                          Text("New Folder".tl)
+                        ],
+                      ),
+                    ),
+                  ),
+                );
+              }
+              var folder = localFolders[index];
+              var disabled = false;
+              if (selectedLocalFolders.isNotEmpty) {
+                if (added.contains(folder) &&
+                    !added.contains(selectedLocalFolders.first)) {
+                  disabled = true;
+                } else if (!added.contains(folder) &&
+                    added.contains(selectedLocalFolders.first)) {
+                  disabled = true;
+                }
+              }
+              return CheckboxListTile(
+                title: Row(
+                  children: [
+                    Text(folder),
+                    const SizedBox(width: 8),
+                    if (added.contains(folder))
+                      Container(
+                        padding: const EdgeInsets.symmetric(
+                          horizontal: 8,
+                          vertical: 4,
+                        ),
+                        decoration: BoxDecoration(
+                          color: context.colorScheme.primaryContainer,
+                          borderRadius: BorderRadius.circular(12),
+                        ),
+                        child: Text("Added".tl, style: ts.s12),
+                      ),
+                  ],
+                ),
+                value: selectedLocalFolders.contains(folder),
+                onChanged: disabled
+                    ? null
+                    : (v) {
+                        setState(() {
+                          if (v!) {
+                            selectedLocalFolders.add(folder);
+                          } else {
+                            selectedLocalFolders.remove(folder);
+                          }
+                        });
+                      },
+              );
+            },
+          ),
+        ),
+        Center(
+          child: FilledButton(
+            onPressed: () {
+              if (selectedLocalFolders.isEmpty) {
+                return;
+              }
+              if (isRemove) {
+                for (var folder in selectedLocalFolders) {
+                  LocalFavoritesManager()
+                      .deleteComicWithId(folder, widget.cid, widget.type);
+                }
+                widget.onFavorite(false, null);
+              } else {
+                for (var folder in selectedLocalFolders) {
+                  LocalFavoritesManager().addComic(
+                    folder,
+                    widget.favoriteItem,
+                    null,
+                    widget.updateTime,
+                  );
+                }
+                widget.onFavorite(true, null);
+              }
+              context.pop();
+            },
+            child: isRemove ? Text("Remove".tl) : Text("Add".tl),
+          ).paddingVertical(8),
+        ),
+      ],
+    );
+  }
+
+  Widget buildNetwork() {
+    return _NetworkFavorites(
+      cid: widget.cid,
+      comicSource: comicSource,
+      isFavorite: widget.isFavorite,
+      onFavorite: (network) {
+        widget.onFavorite(null, network);
+      },
+    );
+  }
+}
+
+class _NetworkFavorites extends StatefulWidget {
+  const _NetworkFavorites({
+    required this.cid,
+    required this.comicSource,
+    required this.isFavorite,
+    required this.onFavorite,
+  });
+
+  final String cid;
+
+  final ComicSource comicSource;
+
+  final bool? isFavorite;
+
+  final void Function(bool) onFavorite;
+
+  @override
+  State<_NetworkFavorites> createState() => _NetworkFavoritesState();
+}
+
+class _NetworkFavoritesState extends State<_NetworkFavorites> {
+  @override
+  Widget build(BuildContext context) {
+    bool isMultiFolder = widget.comicSource.favoriteData!.loadFolders != null;
+
+    return isMultiFolder ? buildMultiFolder() : buildSingleFolder();
+  }
+
+  bool isLoading = false;
+
+  Widget buildSingleFolder() {
+    var isFavorite = widget.isFavorite ?? false;
+    return Column(
+      children: [
+        Expanded(
+          child: Center(
+            child: Text(isFavorite ? "Added to favorites".tl : "Not added".tl),
+          ),
+        ),
+        Center(
+          child: Button.filled(
+            isLoading: isLoading,
+            onPressed: () async {
+              setState(() {
+                isLoading = true;
+              });
+
+              var res = await widget.comicSource.favoriteData!
+                  .addOrDelFavorite!(widget.cid, '', !isFavorite, null);
+              if (res.success) {
+                widget.onFavorite(!isFavorite);
+                context.pop();
+                App.rootContext.showMessage(
+                    message: isFavorite ? "Removed".tl : "Added".tl);
+              } else {
+                setState(() {
+                  isLoading = false;
+                });
+                context.showMessage(message: res.errorMessage!);
+              }
+            },
+            child: isFavorite ? Text("Remove".tl) : Text("Add".tl),
+          ).paddingVertical(8),
+        ),
+      ],
+    );
+  }
+
+  Map<String, String>? folders;
+
+  var addedFolders = <String>{};
+
+  var isLoadingFolders = true;
+
+  // for network favorites, only one selection is allowed
+  String? selected;
+
+  void loadFolders() async {
+    var res = await widget.comicSource.favoriteData!.loadFolders!(widget.cid);
+    if (res.error) {
+      context.showMessage(message: res.errorMessage!);
+    } else {
+      folders = res.data;
+      if (res.subData is List) {
+        addedFolders = List<String>.from(res.subData).toSet();
+      }
+      setState(() {
+        isLoadingFolders = false;
+      });
+    }
+  }
+
+  Widget buildMultiFolder() {
+    if (widget.isFavorite == true &&
+        widget.comicSource.favoriteData!.singleFolderForSingleComic) {
+      return Column(
+        children: [
+          Expanded(
+            child: Center(
+              child: Text("Added to favorites".tl),
+            ),
+          ),
+          Center(
+            child: Button.filled(
+              isLoading: isLoading,
+              onPressed: () async {
+                setState(() {
+                  isLoading = true;
+                });
+
+                var res = await widget.comicSource.favoriteData!
+                    .addOrDelFavorite!(widget.cid, '', false, null);
+                if (res.success) {
+                  widget.onFavorite(false);
+                  context.pop();
+                  App.rootContext.showMessage(message: "Removed".tl);
+                } else {
+                  setState(() {
+                    isLoading = false;
+                  });
+                  context.showMessage(message: res.errorMessage!);
+                }
+              },
+              child: Text("Remove".tl),
+            ).paddingVertical(8),
+          ),
+        ],
+      );
+    }
+    if (isLoadingFolders) {
+      loadFolders();
+      return const Center(child: CircularProgressIndicator());
+    } else {
+      return Column(
+        children: [
+          Expanded(
+            child: ListView.builder(
+              itemCount: folders!.length,
+              itemBuilder: (context, index) {
+                var name = folders!.values.elementAt(index);
+                var id = folders!.keys.elementAt(index);
+                return CheckboxListTile(
+                  title: Row(
+                    children: [
+                      Text(name),
+                      const SizedBox(width: 8),
+                      if (addedFolders.contains(id))
+                        Container(
+                          padding: const EdgeInsets.symmetric(
+                            horizontal: 8,
+                            vertical: 4,
+                          ),
+                          decoration: BoxDecoration(
+                            color: context.colorScheme.primaryContainer,
+                            borderRadius: BorderRadius.circular(12),
+                          ),
+                          child: Text("Added".tl, style: ts.s12),
+                        ),
+                    ],
+                  ),
+                  value: selected == id,
+                  onChanged: (v) {
+                    setState(() {
+                      selected = id;
+                    });
+                  },
+                );
+              },
+            ),
+          ),
+          Center(
+            child: Button.filled(
+              isLoading: isLoading,
+              onPressed: () async {
+                if (selected == null) {
+                  return;
+                }
+                setState(() {
+                  isLoading = true;
+                });
+                var res =
+                    await widget.comicSource.favoriteData!.addOrDelFavorite!(
+                  widget.cid,
+                  selected!,
+                  !addedFolders.contains(selected!),
+                  null,
+                );
+                if (res.success) {
+                  context.showMessage(message: "Success".tl);
+                  context.pop();
+                } else {
+                  context.showMessage(message: res.errorMessage!);
+                  setState(() {
+                    isLoading = false;
+                  });
+                }
+              },
+              child: selected != null && addedFolders.contains(selected!)
+                  ? Text("Remove".tl)
+                  : Text("Add".tl),
+            ).paddingVertical(8),
+          ),
+        ],
+      );
+    }
+  }
+}

lib/pages/comic_details_page/thumbnails.dart

@@ -0,0 +1,169 @@
+part of 'comic_page.dart';
+
+class _ComicThumbnails extends StatefulWidget {
+  const _ComicThumbnails();
+
+  @override
+  State<_ComicThumbnails> createState() => _ComicThumbnailsState();
+}
+
+class _ComicThumbnailsState extends State<_ComicThumbnails> {
+  late _ComicPageState state;
+
+  late List<String> thumbnails;
+
+  bool isInitialLoading = true;
+
+  String? next;
+
+  String? error;
+
+  bool isLoading = false;
+
+  @override
+  void didChangeDependencies() {
+    state = context.findAncestorStateOfType<_ComicPageState>()!;
+    loadNext();
+    thumbnails = List.from(state.comic.thumbnails ?? []);
+    super.didChangeDependencies();
+  }
+
+  void loadNext() async {
+    if (state.comicSource.loadComicThumbnail == null) return;
+    if (!isInitialLoading && next == null) {
+      return;
+    }
+    if (isLoading) return;
+    Future.microtask(() {
+      setState(() {
+        isLoading = true;
+      });
+    });
+    var res = await state.comicSource.loadComicThumbnail!(state.comic.id, next);
+    if (res.success) {
+      thumbnails.addAll(res.data);
+      next = res.subData;
+      isInitialLoading = false;
+    } else {
+      error = res.errorMessage;
+    }
+    if (mounted) {
+      setState(() {
+        isLoading = false;
+      });
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return MultiSliver(
+      children: [
+        SliverToBoxAdapter(
+          child: ListTile(
+            title: Text("Preview".tl),
+          ),
+        ),
+        SliverGrid(
+          delegate: SliverChildBuilderDelegate(
+            childCount: thumbnails.length,
+                (context, index) {
+              if (index == thumbnails.length - 1 && error == null) {
+                loadNext();
+              }
+              var url = thumbnails[index];
+              ImagePart? part;
+              if (url.contains('@')) {
+                var params = url.split('@')[1].split('&');
+                url = url.split('@')[0];
+                double? x1, y1, x2, y2;
+                try {
+                  for (var p in params) {
+                    if (p.startsWith('x')) {
+                      var r = p.split('=')[1];
+                      x1 = double.parse(r.split('-')[0]);
+                      x2 = double.parse(r.split('-')[1]);
+                    }
+                    if (p.startsWith('y')) {
+                      var r = p.split('=')[1];
+                      y1 = double.parse(r.split('-')[0]);
+                      y2 = double.parse(r.split('-')[1]);
+                    }
+                  }
+                } catch (_) {
+                  // ignore
+                }
+                part = ImagePart(x1: x1, y1: y1, x2: x2, y2: y2);
+              }
+              return Padding(
+                padding: context.width < changePoint
+                    ? const EdgeInsets.all(4)
+                    : const EdgeInsets.all(8),
+                child: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Expanded(
+                      child: InkWell(
+                        onTap: () => state.read(null, index + 1),
+                        borderRadius:
+                        const BorderRadius.all(Radius.circular(8)),
+                        child: Container(
+                          foregroundDecoration: BoxDecoration(
+                            borderRadius: BorderRadius.circular(8),
+                            border: Border.all(
+                              color: Theme.of(context).colorScheme.outline,
+                            ),
+                          ),
+                          decoration: BoxDecoration(
+                            borderRadius: BorderRadius.circular(8),
+                          ),
+                          width: double.infinity,
+                          height: double.infinity,
+                          clipBehavior: Clip.antiAlias,
+                          child: AnimatedImage(
+                            image: CachedImageProvider(
+                              url,
+                              sourceKey: state.widget.sourceKey,
+                            ),
+                            fit: BoxFit.contain,
+                            width: double.infinity,
+                            height: double.infinity,
+                            part: part,
+                          ),
+                        ),
+                      ),
+                    ),
+                    const SizedBox(
+                      height: 4,
+                    ),
+                    Text((index + 1).toString()),
+                  ],
+                ),
+              );
+            },
+          ),
+          gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
+            maxCrossAxisExtent: 200,
+            childAspectRatio: 0.68,
+          ),
+        ),
+        if (error != null)
+          SliverToBoxAdapter(
+            child: Column(
+              children: [
+                Text(error!),
+                Button.outlined(
+                  onPressed: loadNext,
+                  child: Text("Retry".tl),
+                )
+              ],
+            ),
+          )
+        else if (isLoading)
+          const SliverListLoadingIndicator(),
+        const SliverToBoxAdapter(
+          child: Divider(),
+        ),
+      ],
+    );
+  }
+}

lib/pages/downloading_page.dart

@@ -15,6 +15,15 @@ class DownloadingPage extends StatefulWidget {
 }
 
 class _DownloadingPageState extends State<DownloadingPage> {
+  DownloadTask? firstTask;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    firstTask = LocalManager().downloadingTasks.firstOrNull;
+    firstTask?.addListener(update);
+  }
+
   @override
   void initState() {
     LocalManager().addListener(update);
@@ -24,10 +33,17 @@ class _DownloadingPageState extends State<DownloadingPage> {
   @override
   void dispose() {
     LocalManager().removeListener(update);
+    firstTask?.removeListener(update);
     super.dispose();
   }
 
   void update() {
+    var currentFirstTask = LocalManager().downloadingTasks.firstOrNull;
+    if (currentFirstTask != firstTask) {
+      firstTask?.removeListener(update);
+      firstTask = currentFirstTask;
+      firstTask?.addListener(update);
+    }
     if(mounted) {
       setState(() {});
     }
@@ -46,6 +62,7 @@ class _DownloadingPageState extends State<DownloadingPage> {
           i--;
 
           return _DownloadTaskTile(
+            key: ValueKey(LocalManager().downloadingTasks[i]),
             task: LocalManager().downloadingTasks[i],
           );
         },
@@ -120,7 +137,7 @@ class _DownloadingPageState extends State<DownloadingPage> {
 }
 
 class _DownloadTaskTile extends StatefulWidget {
-  const _DownloadTaskTile({required this.task});
+  const _DownloadTaskTile({required this.task, super.key});
 
   final DownloadTask task;
 
@@ -129,20 +146,33 @@ class _DownloadTaskTile extends StatefulWidget {
 }
 
 class _DownloadTaskTileState extends State<_DownloadTaskTile> {
+  late DownloadTask task;
+
   @override
   void initState() {
-    widget.task.addListener(update);
+    task = widget.task;
+    task.addListener(update);
     super.initState();
   }
 
   @override
   void dispose() {
-    widget.task.removeListener(update);
+    task.removeListener(update);
     super.dispose();
   }
 
+  @override
+  void didUpdateWidget(covariant _DownloadTaskTile oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (oldWidget.task != widget.task) {
+      task.removeListener(update);
+      task = widget.task;
+      task.addListener(update);
+    }
+  }
+
   void update() {
-    context.findAncestorStateOfType<_DownloadingPageState>()?.update();
+    setState(() {});
   }
 
   @override

lib/pages/explore_page.dart

@@ -3,14 +3,13 @@ import 'package:venera/components/components.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/appdata.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
+import 'package:venera/foundation/global_state.dart';
 import 'package:venera/foundation/res.dart';
-import 'package:venera/foundation/state_controller.dart';
+import 'package:venera/pages/comic_source_page.dart';
-import 'package:venera/pages/search_result_page.dart';
+import 'package:venera/pages/settings/settings_page.dart';
 import 'package:venera/utils/ext.dart';
 import 'package:venera/utils/translations.dart';
 
-import 'category_comics_page.dart';
-
 class ExplorePage extends StatefulWidget {
   const ExplorePage({super.key});
 
@@ -35,7 +34,7 @@ class _ExplorePageState extends State<ExplorePage>
         .expand((e) => e.map((e) => e.title))
         .toList();
     explorePages = explorePages.where((e) => all.contains(e)).toList();
-    if (!pages.isEqualsTo(explorePages)) {
+    if (!pages.isEqualTo(explorePages)) {
       setState(() {
         pages = explorePages;
         controller = TabController(
@@ -50,12 +49,14 @@ class _ExplorePageState extends State<ExplorePage>
     if (index == 2) {
       int page = controller.index;
       String currentPageId = pages[page];
-      StateController.find<SimpleController>(tag: currentPageId)
+      GlobalState.find<_SingleExplorePageState>(currentPageId).toTop();
-          .control!()['toTop']
-          ?.call();
     }
   }
 
+  void addPage() {
+    showPopUpWidget(App.rootContext, setExplorePagesWidget());
+  }
+
   NaviPaneState? naviPane;
 
   @override
@@ -92,7 +93,7 @@ class _ExplorePageState extends State<ExplorePage>
   void refresh() {
     int page = controller.index;
     String currentPageId = pages[page];
-    StateController.find<SimpleController>(tag: currentPageId).refresh();
+    GlobalState.find<_SingleExplorePageState>(currentPageId).refresh();
   }
 
   Widget buildFAB() => Material(
@@ -117,26 +118,21 @@ class _ExplorePageState extends State<ExplorePage>
   Widget buildEmpty() {
     var msg = "No Explore Pages".tl;
     msg += '\n';
+    VoidCallback onTap;
     if (ComicSource.isEmpty) {
-      msg += "Add a comic source in home page".tl;
+      msg += "Please add some sources".tl;
+      onTap = () {
+        context.to(() => ComicSourcePage());
+      };
     } else {
       msg += "Please check your settings".tl;
+      onTap = addPage;
     }
     return NetworkError(
       message: msg,
-      retry: () {
+      retry: onTap,
-        setState(() {
-          pages = ComicSource.all()
-              .map((e) => e.explorePages)
-              .expand((e) => e.map((e) => e.title))
-              .toList();
-          controller = TabController(
-            length: pages.length,
-            vsync: this,
-          );
-        });
-      },
       withAppbar: false,
+      buttonText: "Manage".tl,
     );
   }
 
@@ -148,10 +144,15 @@ class _ExplorePageState extends State<ExplorePage>
     }
 
     Widget tabBar = Material(
-      child: FilledTabBar(
+      child: AppTabBar(
         key: PageStorageKey(pages.toString()),
         tabs: pages.map((e) => buildTab(e)).toList(),
         controller: controller,
+        actionButton: TabActionButton(
+          icon: const Icon(Icons.add),
+          text: "Add".tl,
+          onPressed: addPage,
+        ),
       ),
     ).paddingTop(context.padding.top);
 
@@ -238,7 +239,7 @@ class _SingleExplorePage extends StatefulWidget {
   State<_SingleExplorePage> createState() => _SingleExplorePageState();
 }
 
-class _SingleExplorePageState extends StateWithController<_SingleExplorePage>
+class _SingleExplorePageState extends AutomaticGlobalState<_SingleExplorePage>
     with AutomaticKeepAliveClientMixin<_SingleExplorePage> {
   late final ExplorePageData data;
 
@@ -322,7 +323,7 @@ class _SingleExplorePageState extends StateWithController<_SingleExplorePage>
   }
 
   @override
-  Object? get tag => widget.title;
+  Object? get key => widget.title;
 
   @override
   void refresh() {
@@ -341,9 +342,6 @@ class _SingleExplorePageState extends StateWithController<_SingleExplorePage>
       );
     }
   }
-
-  @override
-  Map<String, dynamic> get control => {"toTop": toTop};
 }
 
 class _MixedExplorePage extends StatefulWidget {
@@ -444,30 +442,7 @@ Iterable<Widget> _buildExplorePagePart(
                 TextButton(
                   onPressed: () {
                     var context = App.mainNavigatorKey!.currentContext!;
-                    if (part.viewMore!.startsWith("search:")) {
+                    part.viewMore!.jump(context);
-                      context.to(
-                        () => SearchResultPage(
-                          text: part.viewMore!.replaceFirst("search:", ""),
-                          options: const [],
-                          sourceKey: sourceKey,
-                        ),
-                      );
-                    } else if (part.viewMore!.startsWith("category:")) {
-                      var cp = part.viewMore!.replaceFirst("category:", "");
-                      var c = cp.split('@').first;
-                      String? p = cp.split('@').last;
-                      if (p == c) {
-                        p = null;
-                      }
-                      context.to(
-                        () => CategoryComicsPage(
-                          category: c,
-                          categoryKey:
-                              ComicSource.find(sourceKey)!.categoryData!.key,
-                          param: p,
-                        ),
-                      );
-                    }
                   },
                   child: Text("View more".tl),
                 )

lib/pages/favorites/favorite_actions.dart

@@ -133,7 +133,7 @@ void addFavorite(List<Comic> comics) {
 }
 
 Future<List<FavoriteItem>> updateComicsInfo(String folder) async {
-  var comics = LocalFavoritesManager().getAllComics(folder);
+  var comics = LocalFavoritesManager().getFolderComics(folder);
 
   Future<void> updateSingleComic(int index) async {
     int retry = 3;

lib/pages/favorites/favorites_page.dart

@@ -2,6 +2,7 @@ import 'dart:convert';
 import 'dart:math';
 
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:flutter_reorderable_grid_view/widgets/reorderable_builder.dart';
 import 'package:venera/components/components.dart';
 import 'package:venera/foundation/app.dart';
@@ -14,16 +15,19 @@ import 'package:venera/foundation/local.dart';
 import 'package:venera/foundation/log.dart';
 import 'package:venera/foundation/res.dart';
 import 'package:venera/network/download.dart';
-import 'package:venera/pages/comic_page.dart';
+import 'package:venera/pages/comic_details_page/comic_page.dart';
 import 'package:venera/pages/reader/reader.dart';
+import 'package:venera/pages/settings/settings_page.dart';
+import 'package:venera/utils/ext.dart';
 import 'package:venera/utils/io.dart';
+import 'package:venera/utils/opencc.dart';
+import 'package:venera/utils/tags_translation.dart';
 import 'package:venera/utils/translations.dart';
 
 part 'favorite_actions.dart';
 part 'side_bar.dart';
 part 'local_favorites_page.dart';
 part 'network_favorites_page.dart';
-part 'local_search_page.dart';
 
 const _kLeftBarWidth = 256.0;
 
@@ -63,6 +67,11 @@ class _FavoritesPageState extends State<FavoritesPage> {
       folder = data['name'];
       isNetwork = data['isNetwork'] ?? false;
     }
+    if (folder != null
+        && !isNetwork
+        && !LocalFavoritesManager().existsFolder(folder!)) {
+      folder = null;
+    }
     super.initState();
   }
 

lib/pages/favorites/local_favorites_page.dart

@@ -1,5 +1,11 @@
 part of 'favorites_page.dart';
 
+const _localAllFolderLabel = '^_^[%local_all%]^_^';
+
+/// If the number of comics in a folder exceeds this limit, it will be
+/// fetched asynchronously.
+const _asyncDataFetchLimit = 500;
+
 class _LocalFavoritesPage extends StatefulWidget {
   const _LocalFavoritesPage({required this.folder, super.key});
 
@@ -31,25 +37,132 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
 
   int? lastSelectedIndex;
 
-  void updateComics() {
+  bool get isAllFolder => widget.folder == _localAllFolderLabel;
-    if (keyword.isEmpty) {
+
+  LocalFavoritesManager get manager => LocalFavoritesManager();
+
+  bool isLoading = false;
+
+  var searchResults = <FavoriteItem>[];
+
+  void updateSearchResult() {
     setState(() {
-        comics = LocalFavoritesManager().getAllComics(widget.folder);
+      if (keyword.trim().isEmpty) {
-      });
+        searchResults = comics;
       } else {
-      setState(() {
+        searchResults = [];
-        comics = LocalFavoritesManager().searchInFolder(widget.folder, keyword);
+        for (var comic in comics) {
+          if (matchKeyword(keyword, comic) ||
+              matchKeywordT(keyword, comic) ||
+              matchKeywordS(keyword, comic)) {
+            searchResults.add(comic);
+          }
+        }
+      }
     });
   }
+
+  void updateComics() {
+    if (isLoading) return;
+    if (isAllFolder) {
+      var totalComics = manager.totalComics;
+      if (totalComics < _asyncDataFetchLimit) {
+        comics = manager.getAllComics();
+      } else {
+        isLoading = true;
+        manager
+            .getAllComicsAsync()
+            .minTime(const Duration(milliseconds: 200))
+            .then((value) {
+          if (mounted) {
+            setState(() {
+              isLoading = false;
+              comics = value;
+            });
+          }
+        });
+      }
+    } else {
+      var folderComics = manager.folderComics(widget.folder);
+      if (folderComics < _asyncDataFetchLimit) {
+        comics = manager.getFolderComics(widget.folder);
+      } else {
+        isLoading = true;
+        manager
+            .getFolderComicsAsync(widget.folder)
+            .minTime(const Duration(milliseconds: 200))
+            .then((value) {
+          if (mounted) {
+            setState(() {
+              isLoading = false;
+              comics = value;
+            });
+          }
+        });
+      }
+    }
+    setState(() {});
+  }
+
+  bool matchKeyword(String keyword, FavoriteItem comic) {
+    var list = keyword.split(" ");
+    for (var k in list) {
+      if (k.isEmpty) continue;
+      if (comic.title.contains(k)) {
+        continue;
+      } else if (comic.subtitle != null && comic.subtitle!.contains(k)) {
+        continue;
+      } else if (comic.tags.any((tag) {
+        if (tag == k) {
+          return true;
+        } else if (tag.contains(':') && tag.split(':')[1] == k) {
+          return true;
+        } else if (App.locale.languageCode != 'en' &&
+            tag.translateTagsToCN == k) {
+          return true;
+        }
+        return false;
+      })) {
+        continue;
+      } else if (comic.author == k) {
+        continue;
+      }
+      return false;
+    }
+    return true;
+  }
+
+  // Convert keyword to traditional Chinese to match comics
+  bool matchKeywordT(String keyword, FavoriteItem comic) {
+    if (!OpenCC.hasChineseSimplified(keyword)) {
+      return false;
+    }
+    keyword = OpenCC.simplifiedToTraditional(keyword);
+    return matchKeyword(keyword, comic);
+  }
+
+  // Convert keyword to simplified Chinese to match comics
+  bool matchKeywordS(String keyword, FavoriteItem comic) {
+    if (!OpenCC.hasChineseTraditional(keyword)) {
+      return false;
+    }
+    keyword = OpenCC.traditionalToSimplified(keyword);
+    return matchKeyword(keyword, comic);
   }
 
   @override
   void initState() {
     favPage = context.findAncestorStateOfType<_FavoritesPageState>()!;
-    comics = LocalFavoritesManager().getAllComics(widget.folder);
+    if (!isAllFolder) {
       var (a, b) = LocalFavoritesManager().findLinked(widget.folder);
       networkSource = a;
       networkFolder = b;
+    } else {
+      networkSource = null;
+      networkFolder = null;
+    }
+    comics = [];
+    updateComics();
     LocalFavoritesManager().addListener(updateComics);
     super.initState();
   }
@@ -62,16 +175,33 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
 
   void selectAll() {
     setState(() {
+      if (searchMode) {
+        selectedComics = searchResults.asMap().map((k, v) => MapEntry(v, true));
+      } else {
         selectedComics = comics.asMap().map((k, v) => MapEntry(v, true));
+      }
     });
   }
 
   void invertSelection() {
     setState(() {
-      comics.asMap().forEach((k, v) {
+      if (searchMode) {
-        selectedComics[v] = !selectedComics.putIfAbsent(v, () => false);
+        for (var c in searchResults) {
-      });
+          if (selectedComics.containsKey(c)) {
-      selectedComics.removeWhere((k, v) => !v);
+            selectedComics.remove(c);
+          } else {
+            selectedComics[c] = true;
+          }
+        }
+      } else {
+        for (var c in comics) {
+          if (selectedComics.containsKey(c)) {
+            selectedComics.remove(c);
+          } else {
+            selectedComics[c] = true;
+          }
+        }
+      }
     });
   }
 
@@ -113,6 +243,11 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
 
   @override
   Widget build(BuildContext context) {
+    var title = favPage.folder ?? "Unselected".tl;
+    if (title == _localAllFolderLabel) {
+      title = "All".tl;
+    }
+
     Widget body = SmoothCustomScrollView(
       controller: scrollController,
       slivers: [
@@ -135,10 +270,10 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
               onTap: context.width < _kTwoPanelChangeWidth
                   ? favPage.showFolderSelector
                   : null,
-              child: Text(favPage.folder ?? "Unselected".tl),
+              child: Text(title),
             ),
             actions: [
-              if (networkSource != null)
+              if (networkSource != null && !isAllFolder)
                 Tooltip(
                   message: "Sync".tl,
                   child: Flyout(
@@ -191,11 +326,14 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                   icon: const Icon(Icons.search),
                   onPressed: () {
                     setState(() {
+                      keyword = "";
                       searchMode = true;
+                      updateSearchResult();
                     });
                   },
                 ),
               ),
+              if (!isAllFolder)
                 MenuButton(
                   entries: [
                     MenuEntry(
@@ -220,7 +358,8 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                             return null;
                           },
                         );
-                      }),
+                      },
+                    ),
                     MenuEntry(
                       icon: Icons.reorder,
                       text: "Reorder".tl,
@@ -241,7 +380,8 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                             }
                           },
                         );
-                      }),
+                      },
+                    ),
                     MenuEntry(
                       icon: Icons.upload_file,
                       text: "Export".tl,
@@ -253,7 +393,8 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                           data: utf8.encode(json),
                           filename: "${widget.folder}.json",
                         );
-                      }),
+                      },
+                    ),
                     MenuEntry(
                       icon: Icons.update,
                       text: "Update Comics Info".tl,
@@ -265,7 +406,8 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                             });
                           }
                         });
-                      }),
+                      },
+                    ),
                     MenuEntry(
                       icon: Icons.delete_outline,
                       text: "Delete Folder".tl,
@@ -284,7 +426,8 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                             favPage.folderList?.updateFolders();
                           },
                         );
-                      }),
+                      },
+                    ),
                   ],
                 ),
             ],
@@ -310,10 +453,12 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                 "Selected @c comics".tlParams({"c": selectedComics.length})),
             actions: [
               MenuButton(entries: [
+                if (!isAllFolder)
                 MenuEntry(
                     icon: Icons.drive_file_move,
                     text: "Move to folder".tl,
                     onClick: () => favoriteOption('move')),
+                if (!isAllFolder)
                 MenuEntry(
                     icon: Icons.copy,
                     text: "Copy to folder".tl,
@@ -330,6 +475,7 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                     icon: Icons.flip,
                     text: "Invert Selection".tl,
                     onClick: invertSelection),
+                if (!isAllFolder)
                   MenuEntry(
                       icon: Icons.delete_outline,
                       text: "Delete Comic".tl,
@@ -351,6 +497,21 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                   text: "Download".tl,
                   onClick: downloadSelected,
                 ),
+                if (selectedComics.length == 1)
+                  MenuEntry(
+                    icon: Icons.copy,
+                    text: "Copy Title".tl,
+                    onClick: () {
+                      Clipboard.setData(
+                        ClipboardData(
+                          text: selectedComics.keys.first.title,
+                        ),
+                      );
+                      context.showMessage(
+                        message: "Copied".tl,
+                      );
+                    },
+                  ),
               ]),
             ],
           )
@@ -364,10 +525,10 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
               child: IconButton(
                 icon: const Icon(Icons.close),
                 onPressed: () {
+                  setState(() {
                     setState(() {
                       searchMode = false;
-                    keyword = "";
+                    });
-                    updateComics();
                   });
                 },
               ),
@@ -376,19 +537,30 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
               autofocus: true,
               decoration: InputDecoration(
                 hintText: "Search".tl,
-                border: InputBorder.none,
+                border: UnderlineInputBorder(),
               ),
               onChanged: (v) {
                 keyword = v;
-                updateComics();
+                updateSearchResult();
               },
+            ).paddingBottom(8).paddingRight(8),
+          ),
+        if (isLoading)
+          SliverToBoxAdapter(
+            child: SizedBox(
+              height: 200,
+              child: const Center(
+                child: CircularProgressIndicator(),
               ),
             ),
+          )
+        else
           SliverGridComics(
-          comics: comics,
+            comics: searchMode ? searchResults : comics,
             selections: selectedComics,
             menuBuilder: (c) {
               return [
+                if (!isAllFolder)
                   MenuEntry(
                     icon: Icons.delete,
                     text: "Delete".tl,
@@ -503,11 +675,9 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
           ),
       ],
     );
-    body = Scrollbar(
+    body = AppScrollBar(
+      topPadding: 48,
       controller: scrollController,
-      thickness: App.isDesktop ? 8 : 12,
-      radius: const Radius.circular(8),
-      interactive: true,
       child: ScrollConfiguration(
         behavior: ScrollConfiguration.of(context).copyWith(scrollbars: false),
         child: body,
@@ -625,32 +795,26 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
                             return;
                           }
                           if (option == 'move') {
-                            for (var c in selectedComics.keys) {
+                            var comics = selectedComics.keys
-                              for (var s in selectedLocalFolders) {
+                                .map((e) => e as FavoriteItem)
-                                LocalFavoritesManager().moveFavorite(
+                                .toList();
+                            for (var f in selectedLocalFolders) {
+                              LocalFavoritesManager().batchMoveFavorites(
                                 favPage.folder as String,
-                                    s,
+                                f,
-                                    c.id,
+                                comics,
-                                    (c as FavoriteItem).type);
-                              }
-                            }
-                          } else {
-                            for (var c in selectedComics.keys) {
-                              for (var s in selectedLocalFolders) {
-                                LocalFavoritesManager().addComic(
-                                  s,
-                                  FavoriteItem(
-                                    id: c.id,
-                                    name: c.title,
-                                    coverPath: c.cover,
-                                    author: c.subtitle ?? '',
-                                    type: ComicType((c.sourceKey == 'local'
-                                        ? 0
-                                        : c.sourceKey.hashCode)),
-                                    tags: c.tags ?? [],
-                                  ),
                               );
                             }
+                          } else {
+                            var comics = selectedComics.keys
+                                .map((e) => e as FavoriteItem)
+                                .toList();
+                            for (var f in selectedLocalFolders) {
+                              LocalFavoritesManager().batchCopyFavorites(
+                                favPage.folder as String,
+                                f,
+                                comics,
+                              );
                             }
                           }
                           App.rootContext.pop();
@@ -686,13 +850,8 @@ class _LocalFavoritesPageState extends State<_LocalFavoritesPage> {
   }
 
   void _deleteComicWithId() {
-    for (var c in selectedComics.keys) {
+    var toBeDeleted = selectedComics.keys.map((e) => e as FavoriteItem).toList();
-      LocalFavoritesManager().deleteComicWithId(
+    LocalFavoritesManager().batchDeleteComics(widget.folder, toBeDeleted);
-        widget.folder,
-        c.id,
-        (c as FavoriteItem).type,
-      );
-    }
     _cancel();
   }
 }
@@ -712,7 +871,7 @@ class _ReorderComicsPageState extends State<_ReorderComicsPage> {
   final _key = GlobalKey();
   var reorderWidgetKey = UniqueKey();
   final _scrollController = ScrollController();
-  late var comics = LocalFavoritesManager().getAllComics(widget.name);
+  late var comics = LocalFavoritesManager().getFolderComics(widget.name);
   bool changed = false;
 
   static int _floatToInt8(double x) {
@@ -733,7 +892,10 @@ class _ReorderComicsPageState extends State<_ReorderComicsPage> {
   @override
   void dispose() {
     if (changed) {
+      // Delay to ensure navigation is completed
+      Future.delayed(const Duration(milliseconds: 200), () {
         LocalFavoritesManager().reorder(comics, widget.name);
+      });
     }
     super.dispose();
   }
@@ -768,7 +930,9 @@ class _ReorderComicsPageState extends State<_ReorderComicsPage> {
       appBar: Appbar(
         title: Text("Reorder".tl),
         actions: [
-          IconButton(
+          Tooltip(
+            message: "Information".tl,
+            child: IconButton(
               icon: const Icon(Icons.info_outline),
               onPressed: () {
                 showInfoDialog(
@@ -778,17 +942,19 @@ class _ReorderComicsPageState extends State<_ReorderComicsPage> {
                 );
               },
             ),
-          IconButton(
+          ),
+          Tooltip(
+            message: "Reverse".tl,
+            child: IconButton(
               icon: const Icon(Icons.swap_vert),
               onPressed: () {
                 setState(() {
                   comics = comics.reversed.toList();
                   changed = true;
-                showToast(
-                    message: "Reversed successfully".tl, context: context);
                 });
               },
             ),
+          )
         ],
       ),
       body: ReorderableBuilder<FavoriteItem>(

lib/pages/favorites/local_search_page.dart

@@ -1,41 +0,0 @@
-part of 'favorites_page.dart';
-
-class LocalSearchPage extends StatefulWidget {
-  const LocalSearchPage({super.key});
-
-  @override
-  State<LocalSearchPage> createState() => _LocalSearchPageState();
-}
-
-class _LocalSearchPageState extends State<LocalSearchPage> {
-  String keyword = '';
-
-  var comics = <FavoriteItemWithFolderInfo>[];
-
-  late final SearchBarController controller;
-
-  @override
-  void initState() {
-    super.initState();
-    controller = SearchBarController(onSearch: (text) {
-      keyword = text;
-      comics = LocalFavoritesManager().search(keyword);
-      setState(() {});
-    });
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Scaffold(
-      body: SmoothCustomScrollView(slivers: [
-        SliverSearchBar(controller: controller),
-        SliverGridComics(
-          comics: comics,
-          badgeBuilder: (c) {
-            return (c as FavoriteItemWithFolderInfo).folder;
-          },
-        ),
-      ]),
-    );
-  }
-}

lib/pages/favorites/network_favorites_page.dart

@@ -110,6 +110,15 @@ class _NormalFavoritePageState extends State<_NormalFavoritePage> {
           child: Text(widget.data.title),
         ),
         actions: [
+          Tooltip(
+            message: "Refresh".tl,
+            child: IconButton(
+              icon: const Icon(Icons.refresh),
+              onPressed: () {
+                comicListKey.currentState!.refresh();
+              },
+            ),
+          ),
           MenuButton(entries: [
             MenuEntry(
               icon: Icons.sync,
@@ -476,11 +485,12 @@ class _CreateFolderDialogState extends State<_CreateFolderDialog> {
 
   @override
   Widget build(BuildContext context) {
-    return SimpleDialog(
+    return ContentDialog(
-      title: Text("Create a folder".tl),
+      title: "Create a folder".tl,
+      content: Column(
         children: [
           Padding(
-          padding: const EdgeInsets.fromLTRB(20, 0, 20, 0),
+            padding: const EdgeInsets.fromLTRB(16, 0, 16, 0),
             child: TextField(
               controller: controller,
               decoration: InputDecoration(
@@ -490,20 +500,13 @@ class _CreateFolderDialogState extends State<_CreateFolderDialog> {
             ),
           ),
           const SizedBox(
-          width: 200,
+            height: 16
-          height: 10,
           ),
-        if (loading)
+        ],
-          Center(
+      ),
-            child: const CircularProgressIndicator(
+      actions: [
-              strokeWidth: 2,
+        Button.filled(
-            ).fixWidth(24).fixHeight(24),
+          isLoading: loading,
-          )
-        else
-          SizedBox(
-            height: 35,
-            child: Center(
-              child: TextButton(
           onPressed: () {
             setState(() {
               loading = true;
@@ -522,8 +525,6 @@ class _CreateFolderDialogState extends State<_CreateFolderDialog> {
             });
           },
           child: Text("Submit".tl),
-              ),
-            ),
         )
       ],
     );

lib/pages/favorites/side_bar.dart

@@ -20,22 +20,37 @@ class _LeftBarState extends State<_LeftBar> implements FolderList {
 
   var networkFolders = <String>[];
 
+  void findNetworkFolders() {
+    networkFolders.clear();
+    var all = ComicSource.all()
+        .where((e) => e.favoriteData != null)
+        .map((e) => e.favoriteData!.key)
+        .toList();
+    var settings = appdata.settings['favorites'] as List;
+    for (var p in settings) {
+      if (all.contains(p) && !networkFolders.contains(p)) {
+        networkFolders.add(p);
+      }
+    }
+  }
+
   @override
   void initState() {
     favPage = widget.favPage ??
         context.findAncestorStateOfType<_FavoritesPageState>()!;
     favPage.folderList = this;
     folders = LocalFavoritesManager().folderNames;
-    networkFolders = ComicSource.all()
+    findNetworkFolders();
-        .where((e) => e.favoriteData != null && e.isLogged)
+    appdata.settings.addListener(updateFolders);
-        .map((e) => e.favoriteData!.key)
+    LocalFavoritesManager().addListener(updateFolders);
-        .toList();
     super.initState();
   }
 
   @override
   void dispose() {
     super.dispose();
+    appdata.settings.removeListener(updateFolders);
+    LocalFavoritesManager().removeListener(updateFolders);
   }
 
   @override
@@ -73,9 +88,34 @@ class _LeftBarState extends State<_LeftBar> implements FolderList {
               padding: widget.withAppbar
                   ? EdgeInsets.zero
                   : EdgeInsets.only(top: context.padding.top),
-              itemCount: folders.length + networkFolders.length + 2,
+              itemCount: folders.length + networkFolders.length + 3,
               itemBuilder: (context, index) {
                 if (index == 0) {
+                  return buildLocalTitle();
+                }
+                index--;
+                if (index == 0) {
+                  return buildLocalFolder(_localAllFolderLabel);
+                }
+                index--;
+                if (index < folders.length) {
+                  return buildLocalFolder(folders[index]);
+                }
+                index -= folders.length;
+                if (index == 0) {
+                  return buildNetworkTitle();
+                }
+                index--;
+                return buildNetworkFolder(networkFolders[index]);
+              },
+            ),
+          )
+        ],
+      ),
+    );
+  }
+
+  Widget buildLocalTitle() {
     return Container(
       padding: const EdgeInsets.symmetric(vertical: 8),
       child: Row(
@@ -89,13 +129,6 @@ class _LeftBarState extends State<_LeftBar> implements FolderList {
           const Spacer(),
           MenuButton(
             entries: [
-                            MenuEntry(
-                              icon: Icons.search,
-                              text: 'Search'.tl,
-                              onClick: () {
-                                context.to(() => const LocalSearchPage());
-                              },
-                            ),
               MenuEntry(
                 icon: Icons.add,
                 text: 'Create Folder'.tl,
@@ -124,12 +157,8 @@ class _LeftBarState extends State<_LeftBar> implements FolderList {
       ).paddingHorizontal(16),
     );
   }
-                index--;
+
-                if (index < folders.length) {
+  Widget buildNetworkTitle() {
-                  return buildLocalFolder(folders[index]);
-                }
-                index -= folders.length;
-                if (index == 0) {
     return Container(
       padding: const EdgeInsets.symmetric(vertical: 12),
       margin: const EdgeInsets.only(top: 8),
@@ -143,29 +172,38 @@ class _LeftBarState extends State<_LeftBar> implements FolderList {
       ),
       child: Row(
         children: [
-                        const SizedBox(width: 16),
           Icon(
             Icons.cloud,
             color: context.colorScheme.secondary,
           ),
           const SizedBox(width: 12),
           Text("Network".tl),
-                      ],
+          const Spacer(),
-                    ),
+          IconButton(
+            icon: const Icon(Icons.settings),
+            onPressed: () {
+              showPopUpWidget(
+                App.rootContext,
+                setFavoritesPagesWidget(),
               );
-                }
-                index--;
-                return buildNetworkFolder(networkFolders[index]);
             },
           ),
-          )
         ],
-      ),
+      ).paddingHorizontal(16),
     );
   }
 
   Widget buildLocalFolder(String name) {
     bool isSelected = name == favPage.folder && !favPage.isNetwork;
+    int count = 0;
+    if (name == _localAllFolderLabel) {
+      count = LocalFavoritesManager().totalComics;
+    } else {
+      count = LocalFavoritesManager().folderComics(name);
+    }
+    var folderName = name == _localAllFolderLabel
+        ? "All".tl
+        : getFavoriteDataOrNull(name)?.title ?? name;
     return InkWell(
       onTap: () {
         if (isSelected) {
@@ -190,7 +228,25 @@ class _LeftBarState extends State<_LeftBar> implements FolderList {
           ),
         ),
         padding: const EdgeInsets.only(left: 16),
-        child: Text(name),
+        child: Row(
+          children: [
+            Expanded(
+              child: Text(folderName),
+            ),
+            Container(
+              margin: EdgeInsets.only(right: 8),
+              padding: EdgeInsets.symmetric(
+                horizontal: 8,
+                vertical: 2,
+              ),
+              decoration: BoxDecoration(
+                color: context.colorScheme.surfaceContainer,
+                borderRadius: BorderRadius.circular(8),
+              ),
+              child: Text(count.toString()),
+            ),
+          ],
+        ),
       ),
     );
   }
@@ -241,10 +297,7 @@ class _LeftBarState extends State<_LeftBar> implements FolderList {
     if (!mounted) return;
     setState(() {
       folders = LocalFavoritesManager().folderNames;
-      networkFolders = ComicSource.all()
+      findNetworkFolders();
-          .where((e) => e.favoriteData != null)
-          .map((e) => e.favoriteData!.key)
-          .toList();
     });
   }
 }

lib/pages/follow_updates_page.dart

@@ -0,0 +1,718 @@
+import 'dart:async';
+
+import 'package:flutter/material.dart';
+import 'package:venera/components/components.dart';
+import 'package:venera/foundation/app.dart';
+import 'package:venera/foundation/appdata.dart';
+import 'package:venera/foundation/favorites.dart';
+import 'package:venera/foundation/log.dart';
+import 'package:venera/utils/data_sync.dart';
+import 'package:venera/utils/translations.dart';
+import '../foundation/global_state.dart';
+
+class FollowUpdatesWidget extends StatefulWidget {
+  const FollowUpdatesWidget({super.key});
+
+  @override
+  State<FollowUpdatesWidget> createState() => _FollowUpdatesWidgetState();
+}
+
+class _FollowUpdatesWidgetState
+    extends AutomaticGlobalState<FollowUpdatesWidget> {
+  int _count = 0;
+
+  String? get folder => appdata.settings["followUpdatesFolder"];
+
+  void getCount() {
+    if (folder == null) {
+      _count = 0;
+      return;
+    }
+    if (!LocalFavoritesManager().folderNames.contains(folder)) {
+      _count = 0;
+      appdata.settings["followUpdatesFolder"] = null;
+      Future.microtask(() {
+        appdata.saveData();
+      });
+    } else {
+      _count = LocalFavoritesManager().countUpdates(folder!);
+    }
+  }
+
+  void updateCount() {
+    setState(() {
+      getCount();
+    });
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    getCount();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return SliverToBoxAdapter(
+      child: Container(
+        margin: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
+        decoration: BoxDecoration(
+          border: Border.all(
+            color: Theme.of(context).colorScheme.outlineVariant,
+            width: 0.6,
+          ),
+          borderRadius: BorderRadius.circular(8),
+        ),
+        child: InkWell(
+          borderRadius: BorderRadius.circular(8),
+          onTap: () {
+            context.to(() => FollowUpdatesPage());
+          },
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              SizedBox(
+                height: 56,
+                child: Row(
+                  children: [
+                    Center(
+                      child: Text('Follow Updates'.tl, style: ts.s18),
+                    ),
+                    const Spacer(),
+                    const Icon(Icons.arrow_right),
+                  ],
+                ),
+              ).paddingHorizontal(16),
+              if (_count > 0)
+                Container(
+                  padding:
+                      const EdgeInsets.symmetric(horizontal: 16, vertical: 2),
+                  margin: const EdgeInsets.only(bottom: 16, left: 16),
+                  decoration: BoxDecoration(
+                    borderRadius: BorderRadius.circular(8),
+                    color: Theme.of(context).colorScheme.primaryContainer,
+                  ),
+                  child: Text(
+                    '@c updates'.tlParams({
+                      'c': _count,
+                    }),
+                    style: ts.s16,
+                  ),
+                ),
+            ],
+          ),
+        ),
+      ),
+    );
+  }
+
+  @override
+  Object? get key => 'FollowUpdatesWidget';
+}
+
+class FollowUpdatesPage extends StatefulWidget {
+  const FollowUpdatesPage({super.key});
+
+  @override
+  State<FollowUpdatesPage> createState() => _FollowUpdatesPageState();
+}
+
+class _FollowUpdatesPageState extends AutomaticGlobalState<FollowUpdatesPage> {
+  String? get folder => appdata.settings["followUpdatesFolder"];
+
+  var updatedComics = <FavoriteItemWithUpdateInfo>[];
+  var allComics = <FavoriteItemWithUpdateInfo>[];
+
+  /// Sort comics by update time in descending order with nulls at the end.
+  void sortComics() {
+    allComics.sort((a, b) {
+      if (a.updateTime == null && b.updateTime == null) {
+        return 0;
+      } else if (a.updateTime == null) {
+        return -1;
+      } else if (b.updateTime == null) {
+        return 1;
+      }
+      try {
+        var aNums = a.updateTime!.split('-').map(int.parse).toList();
+        var bNums = b.updateTime!.split('-').map(int.parse).toList();
+        for (int i = 0; i < aNums.length; i++) {
+          if (aNums[i] != bNums[i]) {
+            return bNums[i] - aNums[i];
+          }
+        }
+        return 0;
+      } catch (_) {
+        return 0;
+      }
+    });
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    if (folder != null) {
+      allComics = LocalFavoritesManager().getComicsWithUpdatesInfo(folder!);
+      sortComics();
+      updatedComics = allComics.where((c) => c.hasNewUpdate).toList();
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: SmoothCustomScrollView(
+        slivers: [
+          SliverAppbar(title: Text('Follow Updates'.tl)),
+          if (folder == null)
+            buildNotConfigured(context)
+          else
+            buildConfigured(context),
+          SliverPadding(padding: const EdgeInsets.only(top: 8)),
+          buildUpdatedComics(),
+          buildAllComics(),
+        ],
+      ),
+    );
+  }
+
+  Widget buildNotConfigured(BuildContext context) {
+    return SliverToBoxAdapter(
+      child: Container(
+        margin: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
+        decoration: BoxDecoration(
+          border: Border.all(
+            color: Theme.of(context).colorScheme.outlineVariant,
+            width: 0.6,
+          ),
+          borderRadius: BorderRadius.circular(8),
+        ),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            ListTile(
+              leading: Icon(Icons.info_outline),
+              title: Text("Not Configured".tl),
+            ),
+            Text(
+              "Choose a folder to follow updates.".tl,
+              style: ts.s16,
+            ).paddingHorizontal(16),
+            const SizedBox(height: 8),
+            FilledButton.tonal(
+              onPressed: showSelector,
+              child: Text("Choose Folder".tl),
+            ).paddingHorizontal(16).toAlign(Alignment.centerRight),
+            const SizedBox(height: 16),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget buildConfigured(BuildContext context) {
+    return SliverToBoxAdapter(
+      child: Container(
+        margin: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
+        decoration: BoxDecoration(
+          border: Border.all(
+            color: Theme.of(context).colorScheme.outlineVariant,
+            width: 0.6,
+          ),
+          borderRadius: BorderRadius.circular(8),
+        ),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            ListTile(
+              leading: Icon(Icons.stars_outlined),
+              title: Text(folder!),
+            ),
+            Text(
+              "Automatic update checking enabled.".tl,
+              style: ts.s14,
+            ).paddingHorizontal(16),
+            Text(
+              "The app will check for updates at most once a day.".tl,
+              style: ts.s14,
+            ).paddingHorizontal(16),
+            const SizedBox(height: 8),
+            Row(
+              mainAxisAlignment: MainAxisAlignment.end,
+              children: [
+                TextButton(
+                  onPressed: showSelector,
+                  child: Text("Change Folder".tl),
+                ),
+                FilledButton.tonal(
+                  onPressed: checkNow,
+                  child: Text("Check Now".tl),
+                ),
+                const SizedBox(width: 16),
+              ],
+            ),
+            const SizedBox(height: 16),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget buildUpdatedComics() {
+    return SliverMainAxisGroup(
+      slivers: [
+        SliverToBoxAdapter(
+          child: Container(
+            margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+            padding: const EdgeInsets.symmetric(vertical: 4),
+            decoration: BoxDecoration(
+              border: Border(
+                bottom: BorderSide(
+                  color: Theme.of(context).colorScheme.outlineVariant,
+                  width: 0.6,
+                ),
+              ),
+            ),
+            child: Row(
+              children: [
+                Icon(Icons.update),
+                const SizedBox(width: 8),
+                Text(
+                  "Updates".tl,
+                  style: ts.s18,
+                ),
+                const Spacer(),
+                if (updatedComics.isNotEmpty)
+                  IconButton(
+                    icon: Icon(Icons.clear_all),
+                    onPressed: () {
+                      showConfirmDialog(
+                        context: App.rootContext,
+                        title: "Mark all as read".tl,
+                        content: "Do you want to mark all as read?".tl,
+                        onConfirm: () {
+                          for (var comic in updatedComics) {
+                            LocalFavoritesManager().markAsRead(
+                              comic.id,
+                              comic.type,
+                            );
+                          }
+                          updateFollowUpdatesUI();
+                        },
+                      );
+                    },
+                  ),
+              ],
+            ),
+          ),
+        ),
+        if (updatedComics.isNotEmpty)
+          SliverToBoxAdapter(
+            child: Text(
+                    "The comic will be marked as no updates as soon as you read it."
+                        .tl)
+                .paddingHorizontal(16)
+                .paddingVertical(4),
+          ),
+        if (updatedComics.isNotEmpty)
+          SliverGridComics(comics: updatedComics)
+        else
+          SliverToBoxAdapter(
+            child: Row(
+              children: [
+                Container(
+                  margin:
+                      const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+                  padding:
+                      const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
+                  decoration: BoxDecoration(
+                    color: Theme.of(context).colorScheme.surfaceContainerLow,
+                    borderRadius: BorderRadius.circular(16),
+                  ),
+                  child: Row(
+                    mainAxisSize: MainAxisSize.min,
+                    children: [
+                      Text(
+                        "No updates found".tl,
+                        style: ts.s16,
+                      ),
+                    ],
+                  ),
+                )
+              ],
+            ),
+          ),
+      ],
+    );
+  }
+
+  Widget buildAllComics() {
+    return SliverMainAxisGroup(
+      slivers: [
+        SliverToBoxAdapter(
+          child: Container(
+            margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+            padding: const EdgeInsets.symmetric(vertical: 4),
+            decoration: BoxDecoration(
+              border: Border(
+                bottom: BorderSide(
+                  color: Theme.of(context).colorScheme.outlineVariant,
+                  width: 0.6,
+                ),
+              ),
+            ),
+            child: Row(
+              children: [
+                Icon(Icons.list),
+                const SizedBox(width: 8),
+                Text(
+                  "All Comics".tl,
+                  style: ts.s18,
+                ),
+              ],
+            ),
+          ),
+        ),
+        SliverGridComics(comics: allComics),
+      ],
+    );
+  }
+
+  void showSelector() {
+    var folders = LocalFavoritesManager().folderNames;
+    if (folders.isEmpty) {
+      context.showMessage(message: "No folders available".tl);
+      return;
+    }
+    String? selectedFolder;
+    showDialog(
+      context: App.rootContext,
+      builder: (context) {
+        return StatefulBuilder(builder: (context, setState) {
+          return ContentDialog(
+            title: "Choose Folder".tl,
+            content: Column(
+              children: [
+                ListTile(
+                  title: Text("Folder".tl),
+                  trailing: Select(
+                    minWidth: 120,
+                    current: selectedFolder,
+                    values: folders,
+                    onTap: (i) {
+                      setState(() {
+                        selectedFolder = folders[i];
+                      });
+                    },
+                  ),
+                ),
+              ],
+            ),
+            actions: [
+              if (appdata.settings["followUpdatesFolder"] != null)
+                TextButton(
+                  onPressed: () {
+                    disable();
+                    context.pop();
+                  },
+                  child: Text("Disable".tl),
+                ),
+              FilledButton(
+                onPressed: selectedFolder == null
+                    ? null
+                    : () {
+                        context.pop();
+                        setFolder(selectedFolder!);
+                      },
+                child: Text("Confirm".tl),
+              ),
+            ],
+          );
+        });
+      },
+    );
+  }
+
+  void disable() {
+    appdata.settings["followUpdatesFolder"] = null;
+    appdata.saveData();
+    updateFollowUpdatesUI();
+  }
+
+  void setFolder(String folder) async {
+    FollowUpdatesService._cancelChecking?.call();
+    LocalFavoritesManager().prepareTableForFollowUpdates(folder);
+
+    var count = LocalFavoritesManager().count(folder);
+
+    if (count > 0) {
+      bool isCanceled = false;
+      void onCancel() {
+        isCanceled = true;
+      }
+
+      var loadingController = showLoadingDialog(
+        App.rootContext,
+        withProgress: true,
+        cancelButtonText: "Cancel".tl,
+        onCancel: onCancel,
+        message: "Updating comics...".tl,
+      );
+
+      await for (var progress in _updateFolder(folder, true)) {
+        if (isCanceled) {
+          return;
+        }
+        loadingController.setProgress(progress.current / progress.total);
+      }
+
+      loadingController.close();
+    }
+
+    setState(() {
+      appdata.settings["followUpdatesFolder"] = folder;
+      updatedComics = [];
+      allComics = LocalFavoritesManager().getComicsWithUpdatesInfo(folder);
+      sortComics();
+    });
+    appdata.saveData();
+  }
+
+  void checkNow() async {
+    FollowUpdatesService._cancelChecking?.call();
+
+    bool isCanceled = false;
+    void onCancel() {
+      isCanceled = true;
+    }
+
+    var loadingController = showLoadingDialog(
+      App.rootContext,
+      withProgress: true,
+      cancelButtonText: "Cancel".tl,
+      onCancel: onCancel,
+      message: "Updating comics...".tl,
+    );
+
+    int updated = 0;
+
+    await for (var progress in _updateFolder(folder!, true)) {
+      if (isCanceled) {
+        return;
+      }
+      loadingController.setProgress(progress.current / progress.total);
+      updated = progress.updated;
+    }
+
+    loadingController.close();
+
+    if (updated > 0) {
+      GlobalState.findOrNull<_FollowUpdatesWidgetState>()?.updateCount();
+      updateComics();
+    }
+  }
+
+  void updateComics() {
+    if (folder == null) {
+      setState(() {
+        allComics = [];
+        updatedComics = [];
+      });
+      return;
+    }
+    setState(() {
+      allComics = LocalFavoritesManager().getComicsWithUpdatesInfo(folder!);
+      sortComics();
+      updatedComics = allComics.where((c) => c.hasNewUpdate).toList();
+    });
+  }
+
+  @override
+  Object? get key => 'FollowUpdatesPage';
+}
+
+class _UpdateProgress {
+  final int total;
+  final int current;
+  final int errors;
+  final int updated;
+
+  _UpdateProgress(this.total, this.current, this.errors, this.updated);
+}
+
+void _updateFolderBase(
+  String folder,
+  StreamController<_UpdateProgress> stream,
+  bool ignoreCheckTime,
+) async {
+  var comics = LocalFavoritesManager().getComicsWithUpdatesInfo(folder);
+  int current = 0;
+  int errors = 0;
+  int updated = 0;
+  var futures = <Future>[];
+  const maxConcurrent = 5;
+
+  for (int i = 0; i < comics.length; i++) {
+    if (stream.isClosed) {
+      return;
+    }
+    if (!ignoreCheckTime) {
+      var lastCheckTime = comics[i].lastCheckTime;
+      if (lastCheckTime != null &&
+          DateTime.now().difference(lastCheckTime).inDays < 1) {
+        current++;
+        stream.add(_UpdateProgress(comics.length, current, errors, updated));
+        continue;
+      }
+    }
+
+    if (futures.length >= maxConcurrent) {
+      await Future.any(futures);
+    }
+
+    var future = () async {
+      int retries = 3;
+      while (true) {
+        try {
+          var c = comics[i];
+          var comicSource = c.type.comicSource;
+          if (comicSource == null) return;
+          var newInfo = (await comicSource.loadComicInfo!(c.id)).data;
+
+          var newTags = <String>[];
+          for (var entry in newInfo.tags.entries) {
+            const shouldIgnore = ['author', 'artist', 'time'];
+            var namespace = entry.key;
+            if (shouldIgnore.contains(namespace.toLowerCase())) {
+              continue;
+            }
+            for (var tag in entry.value) {
+              newTags.add("$namespace:$tag");
+            }
+          }
+
+          var item = FavoriteItem(
+            id: c.id,
+            name: newInfo.title,
+            coverPath: newInfo.cover,
+            author: newInfo.subTitle ??
+                newInfo.tags['author']?.firstOrNull ??
+                c.author,
+            type: c.type,
+            tags: newTags,
+          );
+
+          LocalFavoritesManager().updateInfo(folder, item, false);
+
+          var updateTime = newInfo.findUpdateTime();
+          if (updateTime != null && updateTime != c.updateTime) {
+            LocalFavoritesManager().updateUpdateTime(
+              folder,
+              c.id,
+              c.type,
+              updateTime,
+            );
+          } else {
+            LocalFavoritesManager().updateCheckTime(folder, c.id, c.type);
+          }
+          updated++;
+          return;
+        } catch (e, s) {
+          Log.error("Check Updates", e, s);
+          retries--;
+          if (retries == 0) {
+            errors++;
+            return;
+          }
+        } finally {
+          current++;
+          stream.add(_UpdateProgress(comics.length, current, errors, updated));
+        }
+      }
+    }();
+
+    future.then((_) {
+      futures.remove(future);
+    });
+
+    futures.add(future);
+  }
+
+  await Future.wait(futures);
+
+  if (updated > 0) {
+    LocalFavoritesManager().notifyChanges();
+  }
+
+  stream.close();
+}
+
+Stream<_UpdateProgress> _updateFolder(String folder, bool ignoreCheckTime) {
+  var stream = StreamController<_UpdateProgress>();
+  _updateFolderBase(folder, stream, ignoreCheckTime);
+  return stream.stream;
+}
+
+/// Background service for checking updates
+abstract class FollowUpdatesService {
+  static bool _isChecking = false;
+
+  static void Function()? _cancelChecking;
+
+  static bool _isInitialized = false;
+
+  static void _check() async {
+    if (_isChecking) {
+      return;
+    }
+    var folder = appdata.settings["followUpdatesFolder"];
+    if (folder == null) {
+      return;
+    }
+    bool isCanceled = false;
+    _cancelChecking = () {
+      isCanceled = true;
+    };
+
+    _isChecking = true;
+
+    while (DataSync().isDownloading) {
+      await Future.delayed(const Duration(milliseconds: 100));
+    }
+
+    int updated = 0;
+    try {
+      await for (var progress in _updateFolder(folder, false)) {
+        if (isCanceled) {
+          return;
+        }
+        updated = progress.updated;
+      }
+    } finally {
+      _cancelChecking = null;
+      _isChecking = false;
+      if (updated > 0) {
+        updateFollowUpdatesUI();
+      }
+    }
+  }
+
+  /// Initialize the checker.
+  static void initChecker() {
+    if (_isInitialized) return;
+    _isInitialized = true;
+    _check();
+    DataSync().addListener(updateFollowUpdatesUI);
+    // A short interval will not affect the performance since every comic has a check time.
+    Timer.periodic(const Duration(minutes: 10), (timer) {
+      _check();
+    });
+  }
+}
+
+/// Update the UI of follow updates.
+void updateFollowUpdatesUI() {
+  GlobalState.findOrNull<_FollowUpdatesWidgetState>()?.updateCount();
+  GlobalState.findOrNull<_FollowUpdatesPageState>()?.updateComics();
+}

lib/pages/history_page.dart

@@ -29,21 +29,108 @@ class _HistoryPageState extends State<HistoryPage> {
   void onUpdate() {
     setState(() {
       comics = HistoryManager().getAll();
+      if (multiSelectMode) {
+        selectedComics.removeWhere((comic, _) => !comics.contains(comic));
+        if (selectedComics.isEmpty) {
+          multiSelectMode = false;
+        }
+      }
     });
   }
 
   var comics = HistoryManager().getAll();
-
   var controller = FlyoutController();
 
+  bool multiSelectMode = false;
+  Map<History, bool> selectedComics = {};
+
+  void selectAll() {
+    setState(() {
+      selectedComics = comics.asMap().map((k, v) => MapEntry(v, true));
+    });
+  }
+
+  void deSelect() {
+    setState(() {
+      selectedComics.clear();
+    });
+  }
+
+  void invertSelection() {
+    setState(() {
+      comics.asMap().forEach((k, v) {
+        selectedComics[v] = !selectedComics.putIfAbsent(v, () => false);
+      });
+      selectedComics.removeWhere((k, v) => !v);
+    });
+  }
+
+  void _removeHistory(History comic) {
+    if (comic.sourceKey.startsWith("Unknown")) {
+      HistoryManager().remove(
+        comic.id,
+        ComicType(int.parse(comic.sourceKey.split(':')[1])),
+      );
+    } else if (comic.sourceKey == 'local') {
+      HistoryManager().remove(
+        comic.id,
+        ComicType.local,
+      );
+    } else {
+      HistoryManager().remove(
+        comic.id,
+        ComicType(comic.sourceKey.hashCode),
+      );
+    }
+  }
+
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
+    List<Widget> selectActions = [
-      body: SmoothCustomScrollView(
+      IconButton(
-        slivers: [
+          icon: const Icon(Icons.select_all),
-          SliverAppbar(
+          tooltip: "Select All".tl,
-            title: Text('History'.tl),
+          onPressed: selectAll
-            actions: [
+      ),
+      IconButton(
+          icon: const Icon(Icons.deselect),
+          tooltip: "Deselect".tl,
+          onPressed: deSelect
+      ),
+      IconButton(
+          icon: const Icon(Icons.flip),
+          tooltip: "Invert Selection".tl,
+          onPressed: invertSelection
+      ),
+      IconButton(
+        icon: const Icon(Icons.delete),
+        tooltip: "Delete".tl,
+        onPressed: selectedComics.isEmpty
+            ? null
+            : () {
+                final comicsToDelete = List<History>.from(selectedComics.keys);
+                setState(() {
+                  multiSelectMode = false;
+                  selectedComics.clear();
+                });
+
+                for (final comic in comicsToDelete) {
+                  _removeHistory(comic);
+                }
+              },
+      ),
+    ];
+
+    List<Widget> normalActions = [
+      IconButton(
+        icon: const Icon(Icons.checklist),
+        tooltip: multiSelectMode ? "Exit Multi-Select".tl : "Multi-Select".tl,
+        onPressed: () {
+          setState(() {
+            multiSelectMode = !multiSelectMode;
+          });
+        },
+      ),
       Tooltip(
         message: 'Clear History'.tl,
         child: Flyout(
@@ -51,9 +138,16 @@ class _HistoryPageState extends State<HistoryPage> {
           flyoutBuilder: (context) {
             return FlyoutContent(
               title: 'Clear History'.tl,
-                      content: Text(
+              content: Text('Are you sure you want to clear your history?'.tl),
-                          'Are you sure you want to clear your history?'.tl),
               actions: [
+                Button.outlined(
+                  onPressed: () {
+                    HistoryManager().clearUnfavoritedHistory();
+                    context.pop();
+                  },
+                  child: Text('Clear Unfavorited'.tl),
+                ),
+                const SizedBox(width: 4),
                 Button.filled(
                   color: context.colorScheme.error,
                   onPressed: () {
@@ -73,10 +167,63 @@ class _HistoryPageState extends State<HistoryPage> {
           ),
         ),
       )
-            ],
+    ];
+
+    return PopScope(
+      canPop: !multiSelectMode,
+      onPopInvokedWithResult: (didPop, result) {
+        if (multiSelectMode) {
+          setState(() {
+            multiSelectMode = false;
+            selectedComics.clear();
+          });
+        }
+      },
+      child: Scaffold(
+        body: SmoothCustomScrollView(
+          slivers: [
+            SliverAppbar(
+              leading: Tooltip(
+                message: multiSelectMode ? "Cancel".tl : "Back".tl,
+                child: IconButton(
+                  onPressed: () {
+                    if (multiSelectMode) {
+                      setState(() {
+                        multiSelectMode = false;
+                        selectedComics.clear();
+                      });
+                    } else {
+                      context.pop();
+                    }
+                  },
+                  icon: multiSelectMode
+                      ? const Icon(Icons.close)
+                      : const Icon(Icons.arrow_back),
+                ),
+              ),
+              title: multiSelectMode
+                  ? Text(selectedComics.length.toString())
+                  : Text('History'.tl),
+              actions: multiSelectMode ? selectActions : normalActions,
             ),
             SliverGridComics(
               comics: comics,
+              selections: selectedComics,
+              onLongPressed: null,
+              onTap: multiSelectMode
+                  ? (c) {
+                      setState(() {
+                        if (selectedComics.containsKey(c as History)) {
+                          selectedComics.remove(c);
+                        } else {
+                          selectedComics[c] = true;
+                        }
+                        if (selectedComics.isEmpty) {
+                          multiSelectMode = false;
+                        }
+                      });
+                    }
+                  : null,
               badgeBuilder: (c) {
                 return ComicSource.find(c.sourceKey)?.name;
               },
@@ -87,22 +234,7 @@ class _HistoryPageState extends State<HistoryPage> {
                     text: 'Remove'.tl,
                     color: context.colorScheme.error,
                     onClick: () {
-                    if (c.sourceKey.startsWith("Unknown")) {
+                      _removeHistory(c as History);
-                      HistoryManager().remove(
-                        c.id,
-                        ComicType(int.parse(c.sourceKey.split(':')[1])),
-                      );
-                    } else if (c.sourceKey == 'local') {
-                      HistoryManager().remove(
-                        c.id,
-                        ComicType.local,
-                      );
-                    } else {
-                      HistoryManager().remove(
-                        c.id,
-                        ComicType(c.sourceKey.hashCode),
-                      );
-                    }
                     },
                   ),
                 ];
@@ -110,6 +242,7 @@ class _HistoryPageState extends State<HistoryPage> {
             ),
           ],
         ),
+      ),
     );
   }
 

lib/pages/home_page.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:sliver_tools/sliver_tools.dart';
+import 'package:url_launcher/url_launcher_string.dart';
 import 'package:venera/components/components.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/comic_source/comic_source.dart';
@@ -8,10 +9,10 @@ import 'package:venera/foundation/favorites.dart';
 import 'package:venera/foundation/history.dart';
 import 'package:venera/foundation/local.dart';
 import 'package:venera/foundation/log.dart';
-import 'package:venera/pages/accounts_page.dart';
+import 'package:venera/pages/comic_details_page/comic_page.dart';
-import 'package:venera/pages/comic_page.dart';
 import 'package:venera/pages/comic_source_page.dart';
 import 'package:venera/pages/downloading_page.dart';
+import 'package:venera/pages/follow_updates_page.dart';
 import 'package:venera/pages/history_page.dart';
 import 'package:venera/pages/image_favorites_page/image_favorites_page.dart';
 import 'package:venera/pages/search_page.dart';
@@ -34,8 +35,8 @@ class HomePage extends StatelessWidget {
         const _SyncDataWidget(),
         const _History(),
         const _Local(),
+        const FollowUpdatesWidget(),
         const _ComicSourceWidget(),
-        const _AccountsWidget(),
         const ImageFavorites(),
         SliverPadding(padding: EdgeInsets.only(top: context.padding.bottom)),
       ],
@@ -51,7 +52,7 @@ class _SearchBar extends StatelessWidget {
   Widget build(BuildContext context) {
     return SliverToBoxAdapter(
       child: Container(
-        height: 52,
+        height: App.isMobile ? 52 : 46,
         width: double.infinity,
         margin: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
         child: Material(
@@ -161,16 +162,50 @@ class _SyncDataWidgetState extends State<_SyncDataWidget>
             trailing: Row(
               mainAxisSize: MainAxisSize.min,
               children: [
+                if (DataSync().lastError != null)
+                  InkWell(
+                    borderRadius: BorderRadius.circular(16),
+                    onTap: () {
+                      showDialogMessage(
+                        App.rootContext,
+                        "Error".tl,
+                        DataSync().lastError!,
+                      );
+                    },
+                    child: Container(
+                      padding: const EdgeInsets.symmetric(
+                        horizontal: 8,
+                        vertical: 4,
+                      ),
+                      decoration: BoxDecoration(
+                        color: context.colorScheme.errorContainer,
+                        borderRadius: BorderRadius.circular(16),
+                      ),
+                      child: Row(
+                        children: [
+                          Icon(
+                            Icons.error_outline,
+                            color: Colors.red,
+                            size: 18,
+                          ),
+                          const SizedBox(width: 4),
+                          Text('Error'.tl, style: ts.s12),
+                        ],
+                      ),
+                    ),
+                  ).paddingRight(4),
                 IconButton(
                   icon: const Icon(Icons.cloud_upload_outlined),
                   onPressed: () async {
                     DataSync().uploadData();
-                    }),
+                  },
+                ),
                 IconButton(
                   icon: const Icon(Icons.cloud_download_outlined),
                   onPressed: () async {
                     DataSync().downloadData();
-                    }),
+                  },
+                ),
               ],
             ),
           ),
@@ -196,11 +231,13 @@ class _HistoryState extends State<_History> {
   late int count;
 
   void onHistoryChange() {
+    if (mounted) {
       setState(() {
         history = HistoryManager().getRecent();
         count = HistoryManager().count();
       });
     }
+  }
 
   @override
   void initState() {
@@ -260,7 +297,7 @@ class _HistoryState extends State<_History> {
               ).paddingHorizontal(16),
               if (history.isNotEmpty)
                 SizedBox(
-                  height: 128,
+                  height: 136,
                   child: ListView.builder(
                     scrollDirection: Axis.horizontal,
                     itemCount: history.length,
@@ -363,13 +400,14 @@ class _LocalState extends State<_Local> {
               ).paddingHorizontal(16),
               if (local.isNotEmpty)
                 SizedBox(
-                  height: 128,
+                  height: 136,
                   child: ListView.builder(
                     scrollDirection: Axis.horizontal,
                     itemCount: local.length,
                     itemBuilder: (context, index) {
                       return SimpleComicTile(comic: local[index])
-                          .paddingHorizontal(8);
+                          .paddingHorizontal(8)
+                          .paddingVertical(2);
                     },
                   ),
                 ).paddingHorizontal(8),
@@ -535,38 +573,8 @@ class _ImportComicsWidgetState extends State<_ImportComicsWidget> {
             ],
           ),
           onPressed: () {
-            showDialog(
+            launchUrlString(
-              context: context,
+                "https://github.com/venera-app/venera/blob/master/doc/import_comic.md");
-              barrierColor: Colors.black.toOpacity(0.2),
-              builder: (context) {
-                var help = '';
-                help +=
-                    '${"A directory is considered as a comic only if it matches one of the following conditions:".tl}\n';
-                help += '${'1. The directory only contains image files.'.tl}\n';
-                help +=
-                    '${'2. The directory contains directories which contain image files. Each directory is considered as a chapter.'.tl}\n\n';
-                help +=
-                    '${"If the directory contains a file named 'cover.*', it will be used as the cover image. Otherwise the first image will be used.".tl}\n\n';
-                help +=
-                    "The directory name will be used as the comic title. And the name of chapter directories will be used as the chapter titles.\n"
-                        .tl;
-                help +=
-                    "If you import an EhViewer's database, program will automatically create folders according to the download label in that database."
-                        .tl;
-                return ContentDialog(
-                  title: "Help".tl,
-                  content: Text(help).paddingHorizontal(16),
-                  actions: [
-                    Button.filled(
-                      child: Text("OK".tl),
-                      onPressed: () {
-                        context.pop();
-                      },
-                    ),
-                  ],
-                );
-              },
-            );
           },
         ).fixWidth(90).paddingRight(8),
         Button.filled(
@@ -623,16 +631,29 @@ class _ComicSourceWidgetState extends State<_ComicSourceWidget> {
   @override
   void initState() {
     comicSources = ComicSource.all().map((e) => e.name).toList();
-    ComicSource.addListener(onComicSourceChange);
+    ComicSourceManager().addListener(onComicSourceChange);
     super.initState();
   }
 
   @override
   void dispose() {
-    ComicSource.removeListener(onComicSourceChange);
+    ComicSourceManager().removeListener(onComicSourceChange);
     super.dispose();
   }
 
+  int get _availableUpdates {
+    int c = 0;
+    ComicSourceManager().availableUpdates.forEach((key, version) {
+      var source = ComicSource.find(key);
+      if (source != null) {
+        if (compareSemVer(version, source.version)) {
+          c++;
+        }
+      }
+    });
+    return c;
+  }
+
   @override
   Widget build(BuildContext context) {
     return SliverToBoxAdapter(
@@ -696,7 +717,7 @@ class _ComicSourceWidgetState extends State<_ComicSourceWidget> {
                     }).toList(),
                   ).paddingHorizontal(16).paddingBottom(16),
                 ),
-              if (ComicSource.availableUpdates.isNotEmpty)
+              if (_availableUpdates > 0)
                 Container(
                   padding: const EdgeInsets.symmetric(
                     horizontal: 8,
@@ -712,123 +733,24 @@ class _ComicSourceWidgetState extends State<_ComicSourceWidget> {
                   child: Row(
                     mainAxisSize: MainAxisSize.min,
                     children: [
-                      Icon(Icons.update, color: context.colorScheme.primary, size: 20,),
+                      Icon(
+                        Icons.update,
+                        color: context.colorScheme.primary,
+                        size: 20,
+                      ),
                       const SizedBox(width: 8),
-                      Text("@c updates".tlParams({
+                      Text(
-                        'c': ComicSource.availableUpdates.length,
+                        "@c updates".tlParams({
-                      }), style: ts.withColor(context.colorScheme.primary),),
+                          'c': _availableUpdates,
+                        }),
+                        style: ts.withColor(context.colorScheme.primary),
+                      ),
                     ],
                   ),
-                ).toAlign(Alignment.centerLeft).paddingHorizontal(16).paddingBottom(8),
+                )
-            ],
+                    .toAlign(Alignment.centerLeft)
-          ),
+                    .paddingHorizontal(16)
-        ),
+                    .paddingBottom(8),
-      ),
-    );
-  }
-}
-
-class _AccountsWidget extends StatefulWidget {
-  const _AccountsWidget();
-
-  @override
-  State<_AccountsWidget> createState() => _AccountsWidgetState();
-}
-
-class _AccountsWidgetState extends State<_AccountsWidget> {
-  late List<String> accounts;
-
-  void onComicSourceChange() {
-    setState(() {
-      accounts.clear();
-      for (var c in ComicSource.all()) {
-        if (c.isLogged) {
-          accounts.add(c.name);
-        }
-      }
-    });
-  }
-
-  @override
-  void initState() {
-    accounts = [];
-    for (var c in ComicSource.all()) {
-      if (c.isLogged) {
-        accounts.add(c.name);
-      }
-    }
-    ComicSource.addListener(onComicSourceChange);
-    super.initState();
-  }
-
-  @override
-  void dispose() {
-    ComicSource.removeListener(onComicSourceChange);
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return SliverToBoxAdapter(
-      child: Container(
-        margin: const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
-        decoration: BoxDecoration(
-          border: Border.all(
-            color: Theme.of(context).colorScheme.outlineVariant,
-            width: 0.6,
-          ),
-          borderRadius: BorderRadius.circular(8),
-        ),
-        child: InkWell(
-          borderRadius: BorderRadius.circular(8),
-          onTap: () {
-            context.to(() => const AccountsPage());
-          },
-          child: Column(
-            mainAxisSize: MainAxisSize.min,
-            children: [
-              SizedBox(
-                height: 56,
-                child: Row(
-                  children: [
-                    Center(
-                      child: Text('Accounts'.tl, style: ts.s18),
-                    ),
-                    Container(
-                      margin: const EdgeInsets.symmetric(horizontal: 8),
-                      padding: const EdgeInsets.symmetric(
-                          horizontal: 8, vertical: 2),
-                      decoration: BoxDecoration(
-                        color: Theme.of(context).colorScheme.secondaryContainer,
-                        borderRadius: BorderRadius.circular(8),
-                      ),
-                      child: Text(accounts.length.toString(), style: ts.s12),
-                    ),
-                    const Spacer(),
-                    const Icon(Icons.arrow_right),
-                  ],
-                ),
-              ).paddingHorizontal(16),
-              SizedBox(
-                width: double.infinity,
-                child: Wrap(
-                  runSpacing: 8,
-                  spacing: 8,
-                  children: accounts.map((e) {
-                    return Container(
-                      padding: const EdgeInsets.symmetric(
-                        horizontal: 8,
-                        vertical: 2,
-                      ),
-                      decoration: BoxDecoration(
-                        color: Theme.of(context).colorScheme.secondaryContainer,
-                        borderRadius: BorderRadius.circular(8),
-                      ),
-                      child: Text(e),
-                    );
-                  }).toList(),
-                ).paddingHorizontal(16).paddingBottom(16),
-              ),
             ],
           ),
         ),
@@ -962,6 +884,21 @@ class _ImageFavoritesState extends State<ImageFavorites> {
                     Center(
                       child: Text('Image Favorites'.tl, style: ts.s18),
                     ),
+                    if (hasData)
+                      Container(
+                        margin: const EdgeInsets.symmetric(horizontal: 8),
+                        padding: const EdgeInsets.symmetric(
+                            horizontal: 8, vertical: 2),
+                        decoration: BoxDecoration(
+                          color:
+                              Theme.of(context).colorScheme.secondaryContainer,
+                          borderRadius: BorderRadius.circular(8),
+                        ),
+                        child: Text(
+                          imageFavoritesCompute!.count.toString(),
+                          style: ts.s12,
+                        ),
+                      ),
                     const Spacer(),
                     const Icon(Icons.arrow_right),
                   ],
@@ -1005,7 +942,7 @@ class _ImageFavoritesState extends State<ImageFavorites> {
           displayType = type;
         });
         await Future.delayed(const Duration(milliseconds: 20));
-        var scrollController = ScrollControllerProvider.of(context);
+        var scrollController = ScrollState.of(context).controller;
         scrollController.animateTo(
           scrollController.position.maxScrollExtent,
           duration: const Duration(milliseconds: 200),

lib/pages/image_favorites_page/image_favorites_page.dart

@@ -11,7 +11,7 @@ import 'package:venera/foundation/comic_source/comic_source.dart';
 import 'package:venera/foundation/consts.dart';
 import 'package:venera/foundation/history.dart';
 import 'package:venera/foundation/image_provider/image_favorites_provider.dart';
-import 'package:venera/pages/comic_page.dart';
+import 'package:venera/pages/comic_details_page/comic_page.dart';
 import 'package:venera/pages/image_favorites_page/type.dart';
 import 'package:venera/pages/reader/reader.dart';
 import 'package:venera/utils/ext.dart';
@@ -391,7 +391,7 @@ class _ImageFavoritesDialogState extends State<_ImageFavoritesDialog> {
   Widget build(BuildContext context) {
     Widget tabBar = Material(
       borderRadius: BorderRadius.circular(8),
-      child: FilledTabBar(
+      child: AppTabBar(
         key: PageStorageKey(optionTypes),
         tabs: optionTypes.map((e) => Tab(text: e.tl, key: Key(e))).toList(),
       ),

lib/pages/local_comics_page.dart

@@ -2,9 +2,10 @@ import 'package:flutter/material.dart';
 import 'package:venera/components/components.dart';
 import 'package:venera/foundation/app.dart';
 import 'package:venera/foundation/appdata.dart';
+import 'package:venera/foundation/comic_type.dart';
 import 'package:venera/foundation/local.dart';
 import 'package:venera/foundation/log.dart';
-import 'package:venera/pages/comic_page.dart';
+import 'package:venera/pages/comic_details_page/comic_page.dart';
 import 'package:venera/pages/downloading_page.dart';
 import 'package:venera/pages/favorites/favorites_page.dart';
 import 'package:venera/utils/cbz.dart';
@@ -12,6 +13,8 @@ import 'package:venera/utils/epub.dart';
 import 'package:venera/utils/io.dart';
 import 'package:venera/utils/pdf.dart';
 import 'package:venera/utils/translations.dart';
+import 'package:zip_flutter/zip_flutter.dart';
+import 'package:url_launcher/url_launcher_string.dart';
 
 class LocalComicsPage extends StatefulWidget {
   const LocalComicsPage({super.key});
@@ -141,6 +144,14 @@ class _LocalComicsPageState extends State<LocalComicsPage> {
           addFavorite(selectedComics.keys.toList());
         },
       ),
+      if (selectedComics.length == 1)
+        MenuEntry(
+          icon: Icons.folder_open,
+          text: "Open Folder".tl,
+          onClick: () {
+            openComicFolder(selectedComics.keys.first);
+          },
+        ),
       if (selectedComics.length == 1)
         MenuEntry(
           icon: Icons.chrome_reader_mode_outlined,
@@ -152,8 +163,8 @@ class _LocalComicsPageState extends State<LocalComicsPage> {
                 ));
           },
         ),
-      if (selectedComics.length == 1)
+      if (selectedComics.isNotEmpty)
-        ...exportActions(selectedComics.keys.first),
+        ...exportActions(selectedComics.keys.toList()),
     ]);
   }
 
@@ -303,11 +314,21 @@ class _LocalComicsPageState extends State<LocalComicsPage> {
                   }
                 });
               } else {
-                (c as LocalComic).read();
+                // prevent dirty data
+                var comic =
+                    LocalManager().find(c.id, ComicType.fromKey(c.sourceKey))!;
+                comic.read();
               }
             },
             menuBuilder: (c) {
               return [
+                MenuEntry(
+                  icon: Icons.folder_open,
+                  text: "Open Folder".tl,
+                  onClick: () {
+                    openComicFolder(c as LocalComic);
+                  },
+                ),
                 MenuEntry(
                   icon: Icons.delete,
                   text: "Delete".tl,
@@ -322,7 +343,7 @@ class _LocalComicsPageState extends State<LocalComicsPage> {
                     });
                   },
                 ),
-                ...exportActions(c as LocalComic),
+                ...exportActions([c as LocalComic]),
               ];
             },
           ),
@@ -356,10 +377,22 @@ class _LocalComicsPageState extends State<LocalComicsPage> {
       context: App.rootContext,
       builder: (context) {
         bool removeComicFile = true;
+        bool removeFavoriteAndHistory = true;
         return StatefulBuilder(builder: (context, state) {
           return ContentDialog(
             title: "Delete".tl,
-            content: CheckboxListTile(
+            content: Column(
+              children: [
+                CheckboxListTile(
+                  title: Text("Remove local favorite and history".tl),
+                  value: removeFavoriteAndHistory,
+                  onChanged: (v) {
+                    state(() {
+                      removeFavoriteAndHistory = !removeFavoriteAndHistory;
+                    });
+                  },
+                ),
+                CheckboxListTile(
                   title: Text("Also remove files on disk".tl),
                   value: removeComicFile,
                   onChanged: (v) {
@@ -367,17 +400,26 @@ class _LocalComicsPageState extends State<LocalComicsPage> {
                       removeComicFile = !removeComicFile;
                     });
                   },
+                )
+              ],
             ),
             actions: [
+              if (comics.length == 1 && comics.first.hasChapters)
+                TextButton(
+                  child: Text("Delete Chapters".tl),
+                  onPressed: () {
+                    context.pop();
+                    showDeleteChaptersPopWindow(context, comics.first);
+                  },
+                ),
               FilledButton(
                 onPressed: () {
                   context.pop();
-                  for (var comic in comics) {
+                  LocalManager().batchDeleteComics(
-                    LocalManager().deleteComic(
+                    comics,
-                      comic,
                     removeComicFile,
+                    removeFavoriteAndHistory,
                   );
-                  }
                   isDeleted = true;
                 },
                 child: Text("Confirm".tl),
@@ -390,79 +432,204 @@ class _LocalComicsPageState extends State<LocalComicsPage> {
     return isDeleted;
   }
 
-  List<MenuEntry> exportActions(LocalComic c) {
+  List<MenuEntry> exportActions(List<LocalComic> comics) {
     return [
       MenuEntry(
         icon: Icons.outbox_outlined,
         text: "Export as cbz".tl,
-          onClick: () async {
+        onClick: () {
-            var controller = showLoadingDialog(
+          exportComics(comics, CBZ.export, ".cbz");
-              context,
+        },
-              allowCancel: false,
+      ),
-            );
-            try {
-              var file = await CBZ.export(c);
-              await saveFile(filename: file.name, file: file);
-              await file.delete();
-            } catch (e, s) {
-              context.showMessage(message: e.toString());
-              Log.error("CBZ Export", e, s);
-            }
-            controller.close();
-          }),
       MenuEntry(
         icon: Icons.picture_as_pdf_outlined,
         text: "Export as pdf".tl,
         onClick: () async {
-          var cache = FilePath.join(App.cachePath, 'temp.pdf');
+          exportComics(comics, createPdfFromComicIsolate, ".pdf");
-          var controller = showLoadingDialog(
-            context,
-            allowCancel: false,
-          );
-          try {
-            await createPdfFromComicIsolate(
-              comic: c,
-              savePath: cache,
-            );
-            await saveFile(
-              file: File(cache),
-              filename: "${c.title}.pdf",
-            );
-          } catch (e, s) {
-            Log.error("PDF Export", e, s);
-            context.showMessage(message: e.toString());
-          } finally {
-            controller.close();
-            File(cache).deleteIgnoreError();
-          }
         },
       ),
       MenuEntry(
         icon: Icons.import_contacts_outlined,
         text: "Export as epub".tl,
         onClick: () async {
-          var controller = showLoadingDialog(
+          exportComics(comics, createEpubWithLocalComic, ".epub");
-            context,
-            allowCancel: false,
-          );
-          File? file;
-          try {
-            file = await createEpubWithLocalComic(
-              c,
-            );
-            await saveFile(
-              file: file,
-              filename: "${c.title}.epub",
-            );
-          } catch (e, s) {
-            Log.error("EPUB Export", e, s);
-            context.showMessage(message: e.toString());
-          } finally {
-            controller.close();
-            file?.deleteIgnoreError();
-          }
         },
       )
     ];
   }
+
+  /// Export given comics to a file
+  void exportComics(
+      List<LocalComic> comics, ExportComicFunc export, String ext) async {
+    var current = 0;
+    var cacheDir = FilePath.join(App.cachePath, 'comics_export');
+    var outFile = FilePath.join(App.cachePath, 'comics_export.zip');
+    bool canceled = false;
+    if (Directory(cacheDir).existsSync()) {
+      Directory(cacheDir).deleteSync(recursive: true);
+    }
+    Directory(cacheDir).createSync();
+    var loadingController = showLoadingDialog(
+      context,
+      allowCancel: true,
+      message: "${"Exporting".tl} $current/${comics.length}",
+      withProgress: comics.length > 1,
+      onCancel: () {
+        canceled = true;
+      },
+    );
+    try {
+      var fileName = "";
+      // For each comic, export it to a file
+      for (var comic in comics) {
+        fileName = FilePath.join(
+          cacheDir,
+          sanitizeFileName(comic.title, maxLength: 100) + ext,
+        );
+        await export(comic, fileName);
+        current++;
+        if (comics.length > 1) {
+          loadingController
+              .setMessage("${"Exporting".tl} $current/${comics.length}");
+          loadingController.setProgress(current / comics.length);
+        }
+        if (canceled) {
+          return;
+        }
+      }
+      // For single comic, just save the file
+      if (comics.length == 1) {
+        await saveFile(
+          file: File(fileName),
+          filename: File(fileName).name,
+        );
+        Directory(cacheDir).deleteSync(recursive: true);
+        loadingController.close();
+        return;
+      }
+      // For multiple comics, compress the folder
+      loadingController.setProgress(null);
+      loadingController.setMessage("Compressing".tl);
+      await ZipFile.compressFolderAsync(cacheDir, outFile);
+      if (canceled) {
+        File(outFile).deleteIgnoreError();
+        return;
+      }
+    } catch (e, s) {
+      Log.error("Export Comics", e, s);
+      context.showMessage(message: e.toString());
+      loadingController.close();
+      return;
+    } finally {
+      Directory(cacheDir).deleteIgnoreError(recursive: true);
+    }
+    await saveFile(
+      file: File(outFile),
+      filename: "comics_export.zip",
+    );
+    loadingController.close();
+    File(outFile).deleteIgnoreError();
+  }
+}
+
+typedef ExportComicFunc = Future<File> Function(
+    LocalComic comic, String outFilePath);
+
+/// Opens the folder containing the comic in the system file explorer
+Future<void> openComicFolder(LocalComic comic) async {
+  try {
+    final folderPath = comic.baseDir;
+
+    if (App.isWindows) {
+      await Process.run('explorer', [folderPath]);
+    } else if (App.isMacOS) {
+      await Process.run('open', [folderPath]);
+    } else if (App.isLinux) {
+      // Try different file managers commonly found on Linux
+      try {
+        await Process.run('xdg-open', [folderPath]);
+      } catch (e) {
+        // Fallback to other common file managers
+        try {
+          await Process.run('nautilus', [folderPath]);
+        } catch (e) {
+          try {
+            await Process.run('dolphin', [folderPath]);
+          } catch (e) {
+            try {
+              await Process.run('thunar', [folderPath]);
+            } catch (e) {
+              // Last resort: use the URL launcher with file:// protocol
+              await launchUrlString('file://$folderPath');
+            }
+          }
+        }
+      }
+    } else {
+      // For mobile platforms, use the URL launcher with file:// protocol
+      await launchUrlString('file://$folderPath');
+    }
+  } catch (e, s) {
+    Log.error("Open Folder", "Failed to open comic folder: $e", s);
+    // Show error message to user
+    if (App.rootContext.mounted) {
+      App.rootContext.showMessage(message: "Failed to open folder: $e");
+    }
+  }
+}
+
+void showDeleteChaptersPopWindow(BuildContext context, LocalComic comic) {
+  var chapters = <String>[];
+
+  showPopUpWidget(
+    context,
+    PopUpWidgetScaffold(
+      title: "Delete Chapters".tl,
+      body: StatefulBuilder(builder: (context, setState) {
+        return Column(
+          children: [
+            Expanded(
+              child: ListView.builder(
+                itemCount: comic.downloadedChapters.length,
+                itemBuilder: (context, index) {
+                  var id = comic.downloadedChapters[index];
+                  var chapter = comic.chapters![id] ?? "Unknown Chapter";
+                  return CheckboxListTile(
+                    title: Text(chapter),
+                    value: chapters.contains(id),
+                    onChanged: (v) {
+                      setState(() {
+                        if (v == true) {
+                          chapters.add(id);
+                        } else {
+                          chapters.remove(id);
+                        }
+                      });
+                    },
+                  );
+                },
+              ),
+            ),
+            Padding(
+              padding: const EdgeInsets.all(8.0),
+              child: Row(
+                mainAxisAlignment: MainAxisAlignment.end,
+                children: [
+                  FilledButton(
+                    onPressed: () {
+                      Future.delayed(const Duration(milliseconds: 200), () {
+                        LocalManager().deleteComicChapters(comic, chapters);
+                      });
+                      App.rootContext.pop();
+                    },
+                    child: Text("Submit".tl),
+                  )
+                ],
+              ),
+            )
+          ],
+        );
+      }),
+    ),
+  );
 }

lib/pages/main_page.dart

@@ -7,7 +7,6 @@ import 'package:venera/utils/translations.dart';
 
 import '../components/components.dart';
 import '../foundation/app.dart';
-import 'comic_source_page.dart';
 import 'explore_page.dart';
 import 'favorites/favorites_page.dart';
 import 'home_page.dart';
@@ -36,27 +35,12 @@ class _MainPageState extends State<MainPage> {
     _navigatorKey!.currentContext!.pop();
   }
 
-  void checkUpdates() async {
-    var lastCheck = appdata.implicitData['lastCheckUpdate'] ?? 0;
-    var now = DateTime.now().millisecondsSinceEpoch;
-    if (now - lastCheck < 24 * 60 * 60 * 1000) {
-      return;
-    }
-    appdata.implicitData['lastCheckUpdate'] = now;
-    appdata.writeImplicitData();
-    ComicSourcePage.checkComicSourceUpdate();
-    if (appdata.settings['checkUpdateOnStart']) {
-      await Future.delayed(const Duration(milliseconds: 300));
-      await checkUpdateUi(false);
-    }
-  }
-
   @override
   void initState() {
-    checkUpdates();
     _observer = NaviObserver();
     _navigatorKey = GlobalKey();
     App.mainNavigatorKey = _navigatorKey;
+    index = int.tryParse(appdata.settings['initialPage'].toString()) ?? 0;
     super.initState();
   }
 
@@ -78,6 +62,7 @@ class _MainPageState extends State<MainPage> {
   @override
   Widget build(BuildContext context) {
     return NaviPane(
+      initialPage: index,
       observer: _observer,
       navigatorKey: _navigatorKey!,
       paneItems: [