release 5.6.1

Mention Arch package

.github/FUNDING.yml

@@ -1,2 +1,5 @@
-github: [athou]
-custom: ['https://www.paypal.com/donate/?business=9CNQHMJG2ZJVY&no_recurring=0&item_name=CommaFeed&currency_code=EUR']
+github: [ athou ]
+custom: [
+  'https://github.com/sponsors/Athou',
+  'https://www.paypal.com/donate/?business=9CNQHMJG2ZJVY&no_recurring=0&item_name=CommaFeed&currency_code=EUR'
+]

.github/workflows/ci.yml

@@ -1,183 +1,272 @@
 name: ci
+permissions:
+  contents: read
 
-on: [ push ]
+on:
+  push:
+  pull_request:
 
 env:
   JAVA_VERSION: 21
   DOCKER_BUILD_SUMMARY: false
 
 jobs:
-  build-linux:
-    runs-on: ubuntu-latest
-    strategy:
-      matrix:
-        database: [ "h2", "postgresql", "mysql", "mariadb" ]
-
-    steps:
-      # Checkout
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      # Setup
-      - name: Set up QEMU
-        uses: docker/setup-qemu-action@v3
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Set up GraalVM
-        uses: graalvm/setup-graalvm@v1
-        with:
-          java-version: ${{ env.JAVA_VERSION }}
-          distribution: "graalvm"
-          cache: "maven"
-
-      # Build & Test
-      - name: Build with Maven
-        run: mvn --batch-mode --no-transfer-progress install -Pnative -P${{ matrix.database }}
-
-      # Upload artifacts
-      - name: Upload cross-platform app
-        uses: actions/upload-artifact@v4
-        with:
-          name: commafeed-${{ matrix.database }}-jvm
-          path: commafeed-server/target/commafeed-*.zip
-
-      - name: Upload native executable
-        uses: actions/upload-artifact@v4
-        with:
-          name: commafeed-${{ matrix.database }}-${{ runner.os }}-${{ runner.arch }}
-          path: commafeed-server/target/commafeed-*-runner
-
-      # Docker
-      - name: Login to Container Registry
-        uses: docker/login-action@v3
-        if: ${{ github.ref_type == 'tag' || github.ref_name == 'master' }}
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      ## tags
-      - name: Docker build and push tag - native
-        uses: docker/build-push-action@v6
-        if: ${{ github.ref_type == 'tag' }}
-        with:
-          context: .
-          file: commafeed-server/src/main/docker/Dockerfile.native
-          push: true
-          platforms: linux/amd64
-          tags: |
-            athou/commafeed:latest-${{ matrix.database }}
-            athou/commafeed:${{ github.ref_name }}-${{ matrix.database }}
-
-      - name: Docker build and push tag - jvm
-        uses: docker/build-push-action@v6
-        if: ${{ github.ref_type == 'tag' }}
-        with:
-          context: .
-          file: commafeed-server/src/main/docker/Dockerfile.jvm
-          push: true
-          platforms: linux/amd64,linux/arm64/v8
-          tags: |
-            athou/commafeed:latest-${{ matrix.database }}-jvm
-            athou/commafeed:${{ github.ref_name }}-${{ matrix.database }}-jvm
-
-      ## master
-      - name: Docker build and push master - native
-        uses: docker/build-push-action@v6
-        if: ${{ github.ref_name == 'master' }}
-        with:
-          context: .
-          file: commafeed-server/src/main/docker/Dockerfile.native
-          push: true
-          platforms: linux/amd64
-          tags: athou/commafeed:master-${{ matrix.database }}
-
-      - name: Docker build and push master - jvm
-        uses: docker/build-push-action@v6
-        if: ${{ github.ref_name == 'master' }}
-        with:
-          context: .
-          file: commafeed-server/src/main/docker/Dockerfile.jvm
-          push: true
-          platforms: linux/amd64,linux/arm64/v8
-          tags: athou/commafeed:master-${{ matrix.database }}-jvm
-
-  build-windows:
-    runs-on: windows-latest
+  build:
+    if: github.event_name != 'pull_request' || github.actor != 'renovate[bot]' # renovate already triggers the build on pushes
+
     strategy:
       matrix:
+        os: [ "ubuntu-latest", "ubuntu-22.04-arm", "windows-latest" ]
         database: [ "h2", "postgresql", "mysql", "mariadb" ]
 
+    runs-on: ${{ matrix.os }}
     steps:
       # Checkout
       - name: Configure git to checkout as-is
         run: git config --global core.autocrlf false
 
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
         with:
           fetch-depth: 0
 
       # Setup
       - name: Set up GraalVM
-        uses: graalvm/setup-graalvm@v1
+        uses: graalvm/setup-graalvm@b0cb26a8da53cb3e97cdc0c827d8e3071240e730 # v1
         with:
           java-version: ${{ env.JAVA_VERSION }}
           distribution: "graalvm"
           cache: "maven"
 
+      - name: Install Playwright dependencies
+        run: sudo apt-get install -y libgbm1
+        if: matrix.os != 'windows-latest'
+
       # Build & Test
       - name: Build with Maven
-        run: mvn --batch-mode --no-transfer-progress install -Pnative -P${{ matrix.database }} -DskipTests=${{ matrix.database != 'h2' }}
+        run: mvn --batch-mode --no-transfer-progress install -Pnative -P${{ matrix.database }} -DskipTests=${{ matrix.os == 'windows-latest' && matrix.database != 'h2' }}
 
+      # Build pages
+      - name: Copy generated markdown documentation to /documentation
+        run: mkdir documentation && cp ./commafeed-server/target/quarkus-generated-doc/config/commafeed-server.md ./documentation/README.md
+
+      - name: Generate pages
+        uses: wranders/markdown-to-pages-action@8d8a750832932ac785f5424c8c5543aa0b26bb9a # v1
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          out_path: target/pages
+          files: |-
+            README.md
+            documentation/README.md
+      
       # Upload artifacts
+      - name: Upload cross-platform app
+        uses: actions/upload-artifact@4cec3d8aa04e39d1a68397de0c4cd6fb9dce8ec1 # v4
+        if: matrix.os == 'ubuntu-latest' # we only need to upload the cross-platform artifact once per database
+        with:
+          name: commafeed-${{ matrix.database }}-jvm
+          path: commafeed-server/target/commafeed-*.zip
+
       - name: Upload native executable
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@4cec3d8aa04e39d1a68397de0c4cd6fb9dce8ec1 # v4
         with:
           name: commafeed-${{ matrix.database }}-${{ runner.os }}-${{ runner.arch }}
-          path: commafeed-server/target/commafeed-*-runner.exe
+          path: commafeed-server/target/commafeed-*-runner*
+
+      - name: Upload pages
+        uses: actions/upload-pages-artifact@56afc609e74202658d3ffba0e8f6dda462b719fa # v3
+        if: matrix.os == 'ubuntu-latest' && matrix.database == 'h2' # we only need to upload the pages once
+        with:
+          path: target/pages
+
+  docker:
+    runs-on: ubuntu-latest
+    needs: build
+    env:
+      DOCKERHUB_USERNAME: ${{ secrets.DOCKERHUB_USERNAME }}
+
+    strategy:
+      matrix:
+        database: [ "h2", "postgresql", "mysql", "mariadb" ]
+
+    steps:
+      # Checkout
+      - name: Checkout
+        uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
+        with:
+          fetch-depth: 0
+
+      # Setup
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@4574d27a4764455b42196d70a065bc6853246a25 # v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@f7ce87c1d6bead3e36075b2ce75da1f6cc28aaca # v3
+
+      - name: Install required packages
+        run: sudo apt-get install -y rename unzip
+
+      # Prepare artifacts
+      - name: Download artifacts
+        uses: actions/download-artifact@fa0a91b85d4f404e444e00e005971372dc801d16 # v4
+        with:
+          pattern: commafeed-${{ matrix.database }}-*
+          path: ./artifacts
+          merge-multiple: true
+
+      - name: Set the exec flag on the native executables
+        run: chmod +x artifacts/*-runner
+
+      - name: Rename native executables to match buildx TARGETARCH
+        run: |
+          rename 's/x86_64/amd64/g' artifacts/*
+          rename 's/aarch_64/arm64/g' artifacts/*
+
+      - name: Unzip jvm package
+        run: |
+          unzip artifacts/*-jvm.zip -d artifacts/extracted-jvm-package
+          rename 's/commafeed-.*/quarkus-app/g' artifacts/extracted-jvm-package/*
+
+      # Docker
+      - name: Login to Container Registry
+        uses: docker/login-action@9780b0c442fbb1117ed29e0efdff1e18412f7567 # v3
+        if: ${{ env.DOCKERHUB_USERNAME != '' }}
+        with:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+
+      ## build but don't push for PRs and renovate
+      - name: Docker build - native
+        uses: docker/build-push-action@0adf9959216b96bec444f325f1e493d4aa344497 # v6
+        with:
+          context: .
+          file: commafeed-server/src/main/docker/Dockerfile.native
+          push: false
+          platforms: linux/amd64,linux/arm64/v8
+
+      - name: Docker build - jvm
+        uses: docker/build-push-action@0adf9959216b96bec444f325f1e493d4aa344497 # v6
+        with:
+          context: .
+          file: commafeed-server/src/main/docker/Dockerfile.jvm
+          push: false
+          platforms: linux/amd64,linux/arm64/v8
+
+      ## build and push tag
+      - name: Docker build and push tag - native
+        uses: docker/build-push-action@0adf9959216b96bec444f325f1e493d4aa344497 # v6
+        if: ${{ github.ref_type == 'tag' }}
+        with:
+          context: .
+          file: commafeed-server/src/main/docker/Dockerfile.native
+          push: ${{ env.DOCKERHUB_USERNAME != '' }}
+          platforms: linux/amd64,linux/arm64/v8
+          tags: |
+            athou/commafeed:latest-${{ matrix.database }}
+            athou/commafeed:${{ github.ref_name }}-${{ matrix.database }}
+
+      - name: Docker build and push tag - jvm
+        uses: docker/build-push-action@0adf9959216b96bec444f325f1e493d4aa344497 # v6
+        if: ${{ github.ref_type == 'tag' }}
+        with:
+          context: .
+          file: commafeed-server/src/main/docker/Dockerfile.jvm
+          push: ${{ env.DOCKERHUB_USERNAME != '' }}
+          platforms: linux/amd64,linux/arm64/v8
+          tags: |
+            athou/commafeed:latest-${{ matrix.database }}-jvm
+            athou/commafeed:${{ github.ref_name }}-${{ matrix.database }}-jvm
+
+      ## build and push master
+      - name: Docker build and push master - native
+        uses: docker/build-push-action@0adf9959216b96bec444f325f1e493d4aa344497 # v6
+        if: ${{ github.ref_name == 'master' }}
+        with:
+          context: .
+          file: commafeed-server/src/main/docker/Dockerfile.native
+          push: ${{ env.DOCKERHUB_USERNAME != '' }}
+          platforms: linux/amd64,linux/arm64/v8
+          tags: athou/commafeed:master-${{ matrix.database }}
+
+      - name: Docker build and push master - jvm
+        uses: docker/build-push-action@0adf9959216b96bec444f325f1e493d4aa344497 # v6
+        if: ${{ github.ref_name == 'master' }}
+        with:
+          context: .
+          file: commafeed-server/src/main/docker/Dockerfile.jvm
+          push: ${{ env.DOCKERHUB_USERNAME != '' }}
+          platforms: linux/amd64,linux/arm64/v8
+          tags: athou/commafeed:master-${{ matrix.database }}-jvm
 
   release:
     runs-on: ubuntu-latest
     needs:
-      - build-linux
-      - build-windows
+      - build
+      - docker
+    permissions:
+      contents: write
     if: github.ref_type == 'tag'
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
         with:
           fetch-depth: 0
 
       - name: Download artifacts
-        uses: actions/download-artifact@v4
+        uses: actions/download-artifact@fa0a91b85d4f404e444e00e005971372dc801d16 # v4
         with:
           pattern: commafeed-*
           path: ./artifacts
           merge-multiple: true
 
+      - name: Set the exec flag on the native executables
+        run: chmod +x artifacts/*-runner
+
       - name: Extract Changelog Entry
-        uses: mindsers/changelog-reader-action@v2
+        uses: mindsers/changelog-reader-action@32aa5b4c155d76c94e4ec883a223c947b2f02656 # v2
         id: changelog_reader
         with:
           version: ${{ github.ref_name }}
 
       - name: Create GitHub release
-        uses: ncipollo/release-action@v1
+        uses: ncipollo/release-action@440c8c1cb0ed28b9f43e4d1d670870f059653174 # v1
         with:
           name: CommaFeed ${{ github.ref_name }}
           body: ${{ steps.changelog_reader.outputs.changes }}
           artifacts: ./artifacts/*
 
+
+  update-dockerhub-description:
+    runs-on: ubuntu-latest
+    needs: release
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4
+        with:
+          fetch-depth: 0
+
       - name: Update Docker Hub Description
-        uses: peter-evans/dockerhub-description@v4
+        uses: peter-evans/dockerhub-description@e98e4d1628a5f3be2be7c231e50981aee98723ae # v4
         with:
           username: ${{ secrets.DOCKERHUB_USERNAME }}
           password: ${{ secrets.DOCKERHUB_TOKEN }}
           repository: athou/commafeed
           short-description: ${{ github.event.repository.description }}
           readme-filepath: commafeed-server/src/main/docker/README.md
+
+
+  deploy-pages:
+    runs-on: ubuntu-latest
+    needs: release
+    permissions:
+      pages: write
+      id-token: write
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    steps:
+      - uses: actions/deploy-pages@d6db90164ac5ed86f2b6aed7e0febac5b3c0c03e # v4
+        id: deployment

CHANGELOG.md

@@ -1,5 +1,67 @@
 # Changelog
 
+## [5.6.1]
+
+- Restore support for iframes in feed entries (#1688)
+- There is now a package available for Arch Linux thanks to @dcelasun (#1691)
+
+## [5.6.0]
+
+- To better respect the bandwidth of feed owners, the default value of `commafeed.feed-refresh.interval-empirical` is now true. This means feeds no longer refresh exactly every 5 minutes (the default value of `commafeed.feed-refresh.interval`) but between 5 minutes and 4 hours (the default value of the new `commafeed.feed-refresh.max-interval` setting). The interval is calculated based on feed activity, so highly active feeds refresh more often (#1677)
+- Many previously hardcoded values used in feed refresh interval calculation are now exposed as settings (#1677)
+- Access to local addresses is now blocked to mitigate server-side request forgery (SSRF) attacks, which could potentially expose internal resources. You might want to disable the new `commafeed.http-client.block-local-addresses` setting if you subscribe to feeds only available on your local network and you trust all your users
+- If a feed responds with a "429 - Too many requests" response, a backoff mechanism is triggered when the response does not contain a "Retry-After" header
+
+## [5.5.0]
+
+- CommaFeed now honors the Retry-After response header and will not try to refresh a feed sooner than the value of this header
+- Audio enclosures (e.g. podcasts) now fill available entry width
+- Fix an issue with some labels not correctly internationalized
+
+## [5.4.0]
+
+- An arm64 native executable is now available for download on the releases page
+- The native executable Docker image now supports arm64
+- Fixed an issue with feeds that declared an invalid DOCTYPE (#1260)
+
+## [5.3.6]
+
+- Ignore invalid Cache-Control header values (#1619)
+
+## [5.3.5]
+
+- Fixed an issue with the aspect ratio of images of some feeds (#1595)
+- CommaFeed now honors the Cache-Control response header and will not try to refresh a feed sooner than its max-age property (#1615)
+- Added support for compilation with JDK 23+. If you're building CommaFeed from sources with a JDK 17 or 21, you may need to update it to the most recent patch version to support `-proc:full` (#1618)
+
+## [5.3.4]
+
+- Added support for Internationalized Domain Names (#1588)
+
+## [5.3.3]
+
+- Removed image bottom margins (#1587)
+
+## [5.3.2]
+
+- Fixed an issue that could cause some images from not being rendered correctly (#1587)
+
+## [5.3.1]
+
+- Fixed an issue that could cause some HTTP feeds to return a 400 error (#1572)
+
+## [5.3.0]
+
+- Added a setting to set a cooldown on the "fetch all my feeds" action, disabled by default (#1556)
+- Fixed an issue that could cause entries to not correctly load when using the "next" header button (#1557)
+
+## [5.2.0]
+
+- Added an option to keep a number of entries above the selected entry when scrolling
+- Added a cache to the HTTP client to reduce the number of requests made to feeds when subscribing (#1431)
+- Feeds are no longer refreshed between the moment its last user unsubscribes and the moment the feed is cleaned up (every hour)
+- Fixed an issue that could cause entries to not correctly load when using keyboard navigation (#1557)
+
 ## [5.1.1]
 
 - Fixed database migration issue when upgrading from 5.0.0 to 5.1.0 on MariaDB (#1544)

README.md

@@ -48,10 +48,10 @@ system and database of choice.
 
 There are two types of packages:
 
-- The `linux-x86_64` and `windows-x86_64` packages are compiled natively and contain an executable that can be run
+- The `linux-x86_64`, `linux-aarch_64` and `windows-x86_64` packages are compiled natively and contain an executable that can be run
   directly.
 - The `jvm` package is a zip file containing all `.jar` files required to run the application. This package works on all
-  platforms and is started with `java -jar quarkus-run.jar`.
+  platforms but requires a JRE and is started with `java -jar quarkus-run.jar`.
 
 If available for your operating system, the native package is recommended because it has a faster startup time and lower
 memory usage.
@@ -73,6 +73,10 @@ When the build is complete:
 - if you used the native profile, the executable is located at
   `commafeed-server/target/commafeed-<version>-<database>-<platform>-<arch>-runner[.exe]`
 
+### Distribution packages
+
+- Arch Linux users can use [the CommaFeed package on AUR](https://aur.archlinux.org/pkgbase/commafeed), which builds native binaries with GraalVM for all supported databases.
+
 ## Configuration
 
 CommaFeed doesn't require any configuration to run with its embedded database (H2). The database file will be stored in
@@ -94,13 +98,13 @@ There are multiple ways to configure CommaFeed:
 
 - a `config/application.properties` [properties](https://en.wikipedia.org/wiki/.properties) file relative to the working
   directory (keys in kebab-case)
-- Command line arguments prefixed with `-D` (keys in kebab-case)
+- Command line arguments each prefixed with `-D` (keys in kebab-case)
 - Environment variables (keys in UPPER_CASE)
 - a `.env` file in the working directory (keys in UPPER_CASE)
 
 The properties file is recommended because CommaFeed will be able to warn about invalid properties and typos.
 
-All [CommaFeed settings](commafeed-server/doc/commafeed.adoc) are optional and have sensible default values.
+All [CommaFeed settings](https://athou.github.io/commafeed/documentation) are optional and have sensible default values.
 
 When logging in, credentials are stored in an encrypted cookie. The encryption key is randomly generated at startup,
 meaning that you will have to log back in after each restart of the application. To prevent this, you can set the
@@ -114,18 +118,18 @@ The default user is `admin` and the default password is `admin`.
 
 When CommaFeed is up and running, you can subscribe to [this feed](https://github.com/Athou/commafeed/releases.atom) to be notified of new releases.
 
-### Memory management (`jvm` package only)
+### Memory management
 
 The Java Virtual Machine (JVM) is rather greedy by default and will not release unused memory to the
 operating system. This is because acquiring memory from the operating system is a relatively expensive operation.
 This can be problematic on systems with limited memory.
 
-#### Hard limit
+#### Hard limit (`native` and `jvm` packages)
 
 The JVM can be configured to use a maximum amount of memory with the `-Xmx` parameter.
 For example, to limit the JVM to 256MB of memory, use `-Xmx256m`.
 
-#### Dynamic sizing
+#### Dynamic sizing (`jvm` package)
 
 In addition to the previous setting, the JVM can be configured to release unused memory to the operating system with the
 following parameters:
@@ -137,7 +141,7 @@ and [here](https://docs.oracle.com/en/java/javase/17/gctuning/factors-affecting-
 more
 information.
 
-#### OpenJ9
+#### OpenJ9 (`jvm` package)
 
 The [OpenJ9](https://eclipse.dev/openj9/) JVM is a more memory-efficient alternative to the HotSpot JVM, at the cost of
 slightly slower throughput.

commafeed-client/biome.json

@@ -1,5 +1,5 @@
 {
-    "$schema": "https://biomejs.dev/schemas/1.8.3/schema.json",
+    "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
     "formatter": {
         "indentStyle": "space",
         "indentWidth": 4,

commafeed-client/index.html

@@ -1,11 +1,15 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8" />
-  <link rel="icon" type="image/x-icon" href="favicon.ico" />
-  <link rel="manifest" href="manifest.json" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-  <title>CommaFeed</title>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+    <link rel="manifest" href="manifest.json" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+
+    <link rel="stylesheet" type="text/css" href="custom_css.css" />
+    <script type="text/javascript" src="custom_js.js"></script>
+
+    <title>CommaFeed</title>
 </head>
 <body>
 <div id="root"></div>

commafeed-client/package.json

@@ -15,65 +15,71 @@
         "i18n:extract": "lingui extract --clean"
     },
     "dependencies": {
-        "@emotion/react": "^11.13.3",
-        "@fontsource/open-sans": "^5.0.29",
-        "@lingui/core": "^4.11.4",
-        "@lingui/macro": "^4.11.4",
-        "@lingui/react": "^4.11.4",
-        "@mantine/core": "^7.12.2",
-        "@mantine/form": "^7.12.2",
-        "@mantine/hooks": "^7.12.2",
-        "@mantine/modals": "^7.12.2",
-        "@mantine/notifications": "^7.12.2",
-        "@mantine/spotlight": "^7.12.2",
-        "@monaco-editor/react": "^4.6.0",
-        "@reduxjs/toolkit": "^2.2.7",
-        "axios": "^1.7.7",
+        "@emotion/react": "^11.14.0",
+        "@fontsource/open-sans": "^5.1.1",
+        "@lingui/core": "^5.2.0",
+        "@lingui/react": "^5.2.0",
+        "@mantine/core": "^7.17.0",
+        "@mantine/form": "^7.17.0",
+        "@mantine/hooks": "^7.17.0",
+        "@mantine/modals": "^7.17.0",
+        "@mantine/notifications": "^7.17.0",
+        "@mantine/spotlight": "^7.17.0",
+        "@monaco-editor/react": "^4.7.0",
+        "@reduxjs/toolkit": "^2.5.1",
+        "axios": "^1.7.9",
         "dayjs": "^1.11.13",
         "escape-string-regexp": "^5.0.0",
-        "interweave": "^13.1.0",
-        "monaco-editor": "^0.51.0",
+        "interweave": "^13.1.1",
+        "monaco-editor": "^0.52.2",
         "mousetrap": "^1.6.5",
-        "react": "^18.3.1",
+        "react": "^19.0.0",
         "react-async-hook": "^4.0.0",
         "react-contexify": "^6.0.0",
         "react-device-detect": "^2.2.3",
-        "react-dom": "^18.3.1",
+        "react-dom": "^19.0.0",
         "react-draggable": "^4.4.6",
         "react-ga4": "^2.1.0",
-        "react-helmet": "^6.1.0",
-        "react-icons": "^5.3.0",
+        "react-icons": "^5.5.0",
         "react-infinite-scroller": "^1.2.6",
-        "react-redux": "^9.1.2",
-        "react-router-dom": "^6.26.1",
-        "react-swipeable": "^7.0.1",
-        "redoc": "^2.1.5",
+        "react-redux": "^9.2.0",
+        "react-router-dom": "^7.2.0",
+        "react-swipeable": "^7.0.2",
+        "redoc": "^2.4.0",
+        "style-to-object": "^1.0.8",
         "throttle-debounce": "^5.0.2",
         "tinycon": "^0.6.8",
-        "tss-react": "^4.9.13",
-        "use-local-storage": "^3.0.0",
-        "vite-plugin-biome": "^1.0.12",
+        "tss-react": "^4.9.15",
         "websocket-heartbeat-js": "^1.1.3"
     },
     "devDependencies": {
-        "@biomejs/biome": "^1.8.3",
-        "@lingui/cli": "^4.11.4",
-        "@lingui/vite-plugin": "^4.11.4",
+        "@biomejs/biome": "^1.9.4",
+        "@lingui/babel-plugin-lingui-macro": "^5.2.0",
+        "@lingui/cli": "^5.2.0",
+        "@lingui/vite-plugin": "^5.2.0",
+        "@testing-library/jest-dom": "^6.6.3",
+        "@testing-library/react": "^16.2.0",
+        "@testing-library/user-event": "^14.6.1",
         "@types/mousetrap": "^1.6.15",
-        "@types/react": "^18.3.5",
-        "@types/react-dom": "^18.3.0",
-        "@types/react-helmet": "^6.1.11",
+        "@types/react": "^19.0.10",
+        "@types/react-dom": "^19.0.4",
         "@types/react-infinite-scroller": "^1.2.5",
-        "@types/swagger-ui-react": "^4.18.3",
         "@types/throttle-debounce": "^5.0.2",
-        "@types/tinycon": "^0.6.5",
-        "@vitejs/plugin-react": "^4.3.1",
+        "@types/tinycon": "^0.6.7",
+        "@vitejs/plugin-react": "^4.3.4",
         "babel-plugin-macros": "^3.1.0",
-        "rollup-plugin-visualizer": "^5.12.0",
-        "typescript": "^5.5.4",
-        "vite": "^5.4.3",
-        "vite-tsconfig-paths": "^5.0.1",
-        "vitest": "^2.0.5",
-        "vitest-mock-extended": "^2.0.2"
+        "jsdom": "^26.0.0",
+        "rollup-plugin-visualizer": "^5.14.0",
+        "typescript": "^5.7.3",
+        "vite": "^6.1.1",
+        "vite-plugin-checker": "^0.9.0",
+        "vite-tsconfig-paths": "^5.1.4",
+        "vitest": "^3.0.6",
+        "vitest-mock-extended": "^3.0.1"
+    },
+    "overrides": {
+        "react-infinite-scroller": {
+            "react": "^19.0.0"
+        }
     }
 }

commafeed-client/pom.xml

@@ -6,16 +6,16 @@
 	<parent>
 		<groupId>com.commafeed</groupId>
 		<artifactId>commafeed</artifactId>
-		<version>5.1.1</version>
+		<version>5.6.1</version>
 	</parent>
 	<artifactId>commafeed-client</artifactId>
 	<name>CommaFeed Client</name>
 
 	<properties>
 		<!-- renovate: datasource=node-version depName=node -->
-		<node.version>v20.17.0</node.version>
+		<node.version>v22.14.0</node.version>
 		<!-- renovate: datasource=npm depName=npm -->
-		<npm.version>10.8.3</npm.version>
+		<npm.version>11.1.0</npm.version>
 	</properties>
 
 	<build>
@@ -23,7 +23,7 @@
 			<plugin>
 				<groupId>com.github.eirslett</groupId>
 				<artifactId>frontend-maven-plugin</artifactId>
-				<version>1.15.0</version>
+				<version>1.15.1</version>
 				<?m2e ignore?>
 				<executions>
 					<execution>

commafeed-client/src/App.tsx

@@ -32,7 +32,6 @@ import { RegistrationPage } from "pages/auth/RegistrationPage"
 import React, { useEffect } from "react"
 import { isSafari } from "react-device-detect"
 import ReactGA from "react-ga4"
-import { Helmet } from "react-helmet"
 import { HashRouter, Navigate, Route, Routes, useLocation, useNavigate } from "react-router-dom"
 import Tinycon from "tinycon"
 
@@ -143,7 +142,7 @@ function GoogleAnalyticsHandler() {
 }
 
 function UnreadCountTitleHandler({ unreadCount, enabled }: { unreadCount: number; enabled?: boolean }) {
-    return <Helmet title={enabled && unreadCount > 0 ? `(${unreadCount}) CommaFeed` : "CommaFeed"} />
+    return <title>{enabled && unreadCount > 0 ? `(${unreadCount}) CommaFeed` : "CommaFeed"}</title>
 }
 
 function UnreadCountFaviconHandler({ unreadCount, enabled }: { unreadCount: number; enabled?: boolean }) {
@@ -170,15 +169,6 @@ function BrowserExtensionBadgeUnreadCountHandler() {
     return null
 }
 
-function CustomCode() {
-    return (
-        <Helmet>
-            <link rel="stylesheet" type="text/css" href="custom_css.css" />
-            <script type="text/javascript" src="custom_js.js" />
-        </Helmet>
-    )
-}
-
 export function App() {
     useI18n()
     const root = useAppSelector(state => state.tree.rootCategory)
@@ -202,7 +192,6 @@ export function App() {
                     <GoogleAnalyticsHandler />
                     <RedirectHandler />
                     <AppRoutes />
-                    <CustomCode />
                     {/* disable pull-to-refresh as it messes with vertical scrolling
                         safari behaves weirdly when overscroll-behavior is set to none so we disable it only for other browsers
                         https://github.com/Athou/commafeed/issues/1168

commafeed-client/src/app/constants.ts

@@ -1,13 +1,11 @@
-import { t } from "@lingui/macro"
 import type { IconType } from "react-icons"
 import { FaAt } from "react-icons/fa"
 import { SiBuffer, SiFacebook, SiGmail, SiInstapaper, SiPocket, SiTumblr, SiX } from "react-icons/si"
 import type { Category, Entry, SharingSettings } from "./types"
 
-const categories: Record<string, Category> = {
+const categories: Record<string, Omit<Category, "name">> = {
     all: {
         id: "all",
-        name: t`All`,
         expanded: false,
         children: [],
         feeds: [],
@@ -15,7 +13,6 @@ const categories: Record<string, Category> = {
     },
     starred: {
         id: "starred",
-        name: t`Starred`,
         expanded: false,
         children: [],
         feeds: [],

commafeed-client/src/app/entries/thunks.ts

@@ -11,6 +11,7 @@ import { flushSync } from "react-dom"
 
 const getEndpoint = (sourceType: EntrySourceType) =>
     sourceType === "category" || sourceType === "tag" ? client.category.getEntries : client.feed.getEntries
+
 export const loadEntries = createAppAsyncThunk(
     "entries/load",
     async (
@@ -28,6 +29,7 @@ export const loadEntries = createAppAsyncThunk(
         return result.data
     }
 )
+
 export const loadMoreEntries = createAppAsyncThunk("entries/loadMore", async (_, thunkApi) => {
     const state = thunkApi.getState()
     const { source } = state.entries
@@ -37,6 +39,7 @@ export const loadMoreEntries = createAppAsyncThunk("entries/loadMore", async (_,
     const result = await endpoint(buildGetEntriesPaginatedRequest(state, source, offset))
     return result.data
 })
+
 const buildGetEntriesPaginatedRequest = (state: RootState, source: EntrySource, offset: number) => ({
     id: source.type === "tag" ? Constants.categories.all.id : source.id,
     order: state.user.settings?.readingOrder,
@@ -46,15 +49,18 @@ const buildGetEntriesPaginatedRequest = (state: RootState, source: EntrySource,
     tag: source.type === "tag" ? source.id : undefined,
     keywords: state.entries.search,
 })
+
 export const reloadEntries = createAppAsyncThunk("entries/reload", (arg, thunkApi) => {
     const state = thunkApi.getState()
     thunkApi.dispatch(loadEntries({ source: state.entries.source, clearSearch: false }))
 })
+
 export const search = createAppAsyncThunk("entries/search", (arg: string, thunkApi) => {
     const state = thunkApi.getState()
     thunkApi.dispatch(setSearch(arg))
     thunkApi.dispatch(loadEntries({ source: state.entries.source, clearSearch: false }))
 })
+
 export const markEntry = createAppAsyncThunk(
     "entries/entry/mark",
     (arg: { entry: Entry; read: boolean }) => {
@@ -67,6 +73,7 @@ export const markEntry = createAppAsyncThunk(
         condition: arg => arg.entry.markable && arg.entry.read !== arg.read,
     }
 )
+
 export const markMultipleEntries = createAppAsyncThunk(
     "entries/entry/markMultiple",
     async (
@@ -84,6 +91,7 @@ export const markMultipleEntries = createAppAsyncThunk(
         thunkApi.dispatch(reloadTree())
     }
 )
+
 export const markEntriesUpToEntry = createAppAsyncThunk("entries/entry/upToEntry", (arg: Entry, thunkApi) => {
     const state = thunkApi.getState()
     const { entries } = state.entries
@@ -98,6 +106,7 @@ export const markEntriesUpToEntry = createAppAsyncThunk("entries/entry/upToEntry
         })
     )
 })
+
 export const markAllEntries = createAppAsyncThunk(
     "entries/entry/markAll",
     async (
@@ -113,6 +122,7 @@ export const markAllEntries = createAppAsyncThunk(
         thunkApi.dispatch(reloadTree())
     }
 )
+
 export const starEntry = createAppAsyncThunk(
     "entries/entry/star",
     (arg: { entry: Entry; starred: boolean }) => {
@@ -126,6 +136,7 @@ export const starEntry = createAppAsyncThunk(
         condition: arg => arg.entry.markable && arg.entry.starred !== arg.starred,
     }
 )
+
 export const selectEntry = createAppAsyncThunk(
     "entries/entry/select",
     (
@@ -166,22 +177,35 @@ export const selectEntry = createAppAsyncThunk(
         })
 
         if (arg.scrollToEntry) {
+            const viewMode = state.user.localSettings.viewMode
+
+            const entryIndex = state.entries.entries.indexOf(entry)
+            const entriesToKeepOnTopWhenScrolling =
+                viewMode === "expanded" ? 0 : Math.min(state.user.settings?.entriesToKeepOnTopWhenScrolling ?? 0, entryIndex)
+            const entryToScrollTo = state.entries.entries[entryIndex - entriesToKeepOnTopWhenScrolling]
+
             const entryElement = document.getElementById(Constants.dom.entryId(entry))
-            if (entryElement) {
+            const entryElementToScrollTo = document.getElementById(Constants.dom.entryId(entryToScrollTo))
+            if (entryElement && entryElementToScrollTo) {
                 const scrollMode = state.user.settings?.scrollMode
-                const entryEntirelyVisible = Constants.layout.isTopVisible(entryElement) && Constants.layout.isBottomVisible(entryElement)
+                const entryEntirelyVisible =
+                    Constants.layout.isTopVisible(entryElementToScrollTo) && Constants.layout.isBottomVisible(entryElement)
                 if (scrollMode === "always" || (scrollMode === "if_needed" && !entryEntirelyVisible)) {
                     const scrollSpeed = state.user.settings?.scrollSpeed
+                    const margin = viewMode === "detailed" ? 8 : 3
                     thunkApi.dispatch(entriesSlice.actions.setScrollingToEntry(true))
-                    scrollToEntry(entryElement, scrollSpeed, () => thunkApi.dispatch(entriesSlice.actions.setScrollingToEntry(false)))
+                    scrollToEntry(entryElementToScrollTo, margin, scrollSpeed, () =>
+                        thunkApi.dispatch(entriesSlice.actions.setScrollingToEntry(false))
+                    )
                 }
             }
         }
     }
 )
-const scrollToEntry = (entryElement: HTMLElement, scrollSpeed: number | undefined, onScrollEnded: () => void) => {
+
+const scrollToEntry = (entryElement: HTMLElement, margin: number, scrollSpeed: number | undefined, onScrollEnded: () => void) => {
     const header = document.getElementById(Constants.dom.headerId)?.getBoundingClientRect()
-    const offset = (header?.bottom ?? 0) + 3
+    const offset = (header?.bottom ?? 0) + margin
     scrollToWithCallback({
         options: {
             top: entryElement.offsetTop - offset,
@@ -216,9 +240,10 @@ export const selectPreviousEntry = createAppAsyncThunk(
         }
     }
 )
+
 export const selectNextEntry = createAppAsyncThunk(
     "entries/entry/selectNext",
-    (
+    async (
         arg: {
             expand: boolean
             markAsRead: boolean
@@ -227,12 +252,20 @@ export const selectNextEntry = createAppAsyncThunk(
         thunkApi
     ) => {
         const state = thunkApi.getState()
-        const { entries } = state.entries
+        const { entries, hasMore, loading } = state.entries
         const nextIndex = entries.findIndex(e => e.id === state.entries.selectedEntryId) + 1
-        if (nextIndex < entries.length) {
+
+        // load more entries if needed
+        // this can happen if the last entry is too large to fit on the screen and the infinite loader doesn't trigger
+        if (nextIndex >= entries.length && hasMore && !loading) {
+            await thunkApi.dispatch(loadMoreEntries())
+        }
+
+        const entriesAfterLoading = thunkApi.getState().entries.entries
+        if (nextIndex < entriesAfterLoading.length) {
             thunkApi.dispatch(
                 selectEntry({
-                    entry: entries[nextIndex],
+                    entry: entriesAfterLoading[nextIndex],
                     expand: arg.expand,
                     markAsRead: arg.markAsRead,
                     scrollToEntry: arg.scrollToEntry,
@@ -241,6 +274,7 @@ export const selectNextEntry = createAppAsyncThunk(
         }
     }
 )
+
 export const tagEntry = createAppAsyncThunk("entries/entry/tag", async (arg: TagRequest, thunkApi) => {
     await client.entry.tag(arg)
     thunkApi.dispatch(reloadTags())

commafeed-client/src/app/redirect/thunks.ts

@@ -3,43 +3,55 @@ import { Constants } from "app/constants"
 import { redirectTo } from "app/redirect/slice"
 
 export const redirectToLogin = createAppAsyncThunk("redirect/login", (_, thunkApi) => thunkApi.dispatch(redirectTo("/login")))
+
 export const redirectToRegistration = createAppAsyncThunk("redirect/register", (_, thunkApi) => thunkApi.dispatch(redirectTo("/register")))
-export const redirectToPasswordRecovery = createAppAsyncThunk("redirect/passwordRecovery", (_, thunkApi) =>
-    thunkApi.dispatch(redirectTo("/passwordRecovery"))
-)
+
 export const redirectToApiDocumentation = createAppAsyncThunk("redirect/api", (_, thunkApi) => thunkApi.dispatch(redirectTo("/api")))
 
 export const redirectToSelectedSource = createAppAsyncThunk("redirect/selectedSource", (_, thunkApi) => {
     const { source } = thunkApi.getState().entries
     thunkApi.dispatch(redirectTo(`/app/${source.type}/${source.id}`))
 })
+
 export const redirectToCategory = createAppAsyncThunk("redirect/category", (id: string, thunkApi) =>
     thunkApi.dispatch(redirectTo(`/app/category/${id}`))
 )
+
 export const redirectToRootCategory = createAppAsyncThunk(
     "redirect/category/root",
     async (_, thunkApi) => await thunkApi.dispatch(redirectToCategory(Constants.categories.all.id))
 )
+
 export const redirectToCategoryDetails = createAppAsyncThunk("redirect/category/details", (id: string, thunkApi) =>
     thunkApi.dispatch(redirectTo(`/app/category/${id}/details`))
 )
+
 export const redirectToFeed = createAppAsyncThunk("redirect/feed", (id: string | number, thunkApi) =>
     thunkApi.dispatch(redirectTo(`/app/feed/${id}`))
 )
+
 export const redirectToFeedDetails = createAppAsyncThunk("redirect/feed/details", (id: string, thunkApi) =>
     thunkApi.dispatch(redirectTo(`/app/feed/${id}/details`))
 )
+
 export const redirectToTag = createAppAsyncThunk("redirect/tag", (id: string, thunkApi) => thunkApi.dispatch(redirectTo(`/app/tag/${id}`)))
+
 export const redirectToTagDetails = createAppAsyncThunk("redirect/tag/details", (id: string, thunkApi) =>
     thunkApi.dispatch(redirectTo(`/app/tag/${id}/details`))
 )
+
 export const redirectToAdd = createAppAsyncThunk("redirect/add", (_, thunkApi) => thunkApi.dispatch(redirectTo("/app/add")))
+
 export const redirectToSettings = createAppAsyncThunk("redirect/settings", (_, thunkApi) => thunkApi.dispatch(redirectTo("/app/settings")))
+
 export const redirectToAdminUsers = createAppAsyncThunk("redirect/admin/users", (_, thunkApi) =>
     thunkApi.dispatch(redirectTo("/app/admin/users"))
 )
+
 export const redirectToMetrics = createAppAsyncThunk("redirect/admin/metrics", (_, thunkApi) =>
     thunkApi.dispatch(redirectTo("/app/admin/metrics"))
 )
+
 export const redirectToDonate = createAppAsyncThunk("redirect/donate", (_, thunkApi) => thunkApi.dispatch(redirectTo("/app/donate")))
+
 export const redirectToAbout = createAppAsyncThunk("redirect/about", (_, thunkApi) => thunkApi.dispatch(redirectTo("/app/about")))

commafeed-client/src/app/store.ts

@@ -3,7 +3,8 @@ import { entriesSlice } from "app/entries/slice"
 import { redirectSlice } from "app/redirect/slice"
 import { serverSlice } from "app/server/slice"
 import { treeSlice } from "app/tree/slice"
-import { userSlice } from "app/user/slice"
+import type { LocalSettings } from "app/types"
+import { initialLocalSettings, userSlice } from "app/user/slice"
 import { type TypedUseSelectorHook, useDispatch, useSelector } from "react-redux"
 
 export const reducers = {
@@ -14,7 +15,36 @@ export const reducers = {
     user: userSlice.reducer,
 }
 
-export const store = configureStore({ reducer: reducers })
+const loadLocalSettings = (): LocalSettings => {
+    const json = localStorage.getItem("commafeed-local-settings")
+    if (json) {
+        return JSON.parse(json)
+    }
+
+    // load old settings
+    const viewMode = localStorage.getItem("view-mode")
+    const sidebarWidth = localStorage.getItem("sidebar-width")
+    const announcementHash = localStorage.getItem("announcement-hash")
+    return {
+        ...initialLocalSettings,
+        viewMode: viewMode ? JSON.parse(viewMode) : initialLocalSettings.viewMode,
+        sidebarWidth: sidebarWidth ? JSON.parse(sidebarWidth) : initialLocalSettings.sidebarWidth,
+        announcementHash: announcementHash ? JSON.parse(announcementHash) : initialLocalSettings.announcementHash,
+    }
+}
+
+export const store = configureStore({
+    reducer: reducers,
+    preloadedState: {
+        user: {
+            localSettings: loadLocalSettings(),
+        },
+    },
+})
+store.subscribe(() => {
+    const localSettings = store.getState().user.localSettings
+    localStorage.setItem("commafeed-local-settings", JSON.stringify(localSettings))
+})
 
 export type RootState = ReturnType<typeof store.getState>
 export type AppDispatch = typeof store.dispatch

commafeed-client/src/app/tree/thunks.ts

@@ -1,9 +1,35 @@
 import { createAppAsyncThunk } from "app/async-thunk"
 import { client } from "app/client"
+import { incrementUnreadCount } from "app/tree/slice"
 import type { CollapseRequest } from "app/types"
+import { flattenCategoryTree } from "app/utils"
 
 export const reloadTree = createAppAsyncThunk("tree/reload", async () => await client.category.getRoot().then(r => r.data))
+
 export const collapseTreeCategory = createAppAsyncThunk(
     "tree/category/collapse",
     async (req: CollapseRequest) => await client.category.collapse(req)
 )
+
+export const newFeedEntriesDiscovered = createAppAsyncThunk(
+    "tree/new-feed-entries-discovered",
+    async ({ feedId, amount }: { feedId: number; amount: number }, thunkApi) => {
+        const root = thunkApi.getState().tree.rootCategory
+        if (!root) return
+
+        const feed = flattenCategoryTree(root)
+            .flatMap(c => c.feeds)
+            .some(f => f.id === feedId)
+        if (!feed) {
+            // feed not found in the tree, reload the tree completely
+            thunkApi.dispatch(reloadTree())
+        } else {
+            thunkApi.dispatch(
+                incrementUnreadCount({
+                    feedId,
+                    amount,
+                })
+            )
+        }
+    }
+)

commafeed-client/src/app/types.ts

@@ -220,6 +220,7 @@ export interface ServerInfo {
     websocketEnabled: boolean
     websocketPingInterval: number
     treeReloadInterval: number
+    forceRefreshCooldownDuration: number
 }
 
 export interface SharingSettings {
@@ -243,6 +244,7 @@ export interface Settings {
     customJs?: string
     scrollSpeed: number
     scrollMode: ScrollMode
+    entriesToKeepOnTopWhenScrolling: number
     starIconDisplayMode: IconDisplayMode
     externalLinkIconDisplayMode: IconDisplayMode
     markAllAsReadConfirmation: boolean
@@ -253,6 +255,12 @@ export interface Settings {
     sharingSettings: SharingSettings
 }
 
+export interface LocalSettings {
+    viewMode: ViewMode
+    sidebarWidth: number
+    announcementHash: string
+}
+
 export interface StarRequest {
     id: string
     feedId: number
@@ -280,6 +288,7 @@ export interface UserModel {
     created: number
     lastLogin?: number
     admin: boolean
+    lastForceRefresh?: number
 }
 
 export interface AdminSaveUserRequest {

commafeed-client/src/app/user/slice.ts

@@ -1,9 +1,10 @@
-import { t } from "@lingui/macro"
+import { t } from "@lingui/core/macro"
 import { showNotification } from "@mantine/notifications"
-import { createSlice, isAnyOf } from "@reduxjs/toolkit"
-import type { Settings, UserModel } from "app/types"
+import { type PayloadAction, createSlice, isAnyOf } from "@reduxjs/toolkit"
+import type { LocalSettings, Settings, UserModel, ViewMode } from "app/types"
 import {
     changeCustomContextMenu,
+    changeEntriesToKeepOnTopWhenScrolling,
     changeExternalLinkIconDisplayMode,
     changeLanguage,
     changeMarkAllAsReadConfirmation,
@@ -25,16 +26,35 @@ import {
 
 interface UserState {
     settings?: Settings
+    localSettings: LocalSettings
     profile?: UserModel
     tags?: string[]
 }
 
-const initialState: UserState = {}
+export const initialLocalSettings: LocalSettings = {
+    viewMode: "detailed",
+    sidebarWidth: 360,
+    announcementHash: "no-hash",
+}
+
+const initialState: UserState = {
+    localSettings: initialLocalSettings,
+}
 
 export const userSlice = createSlice({
     name: "user",
     initialState,
-    reducers: {},
+    reducers: {
+        setViewMode: (state, action: PayloadAction<ViewMode>) => {
+            state.localSettings.viewMode = action.payload
+        },
+        setSidebarWidth: (state, action: PayloadAction<number>) => {
+            state.localSettings.sidebarWidth = action.payload
+        },
+        setAnnouncementHash: (state, action: PayloadAction<string>) => {
+            state.localSettings.announcementHash = action.payload
+        },
+    },
     extraReducers: builder => {
         builder.addCase(reloadSettings.fulfilled, (state, action) => {
             state.settings = action.payload
@@ -73,6 +93,10 @@ export const userSlice = createSlice({
             if (!state.settings) return
             state.settings.scrollMode = action.meta.arg
         })
+        builder.addCase(changeEntriesToKeepOnTopWhenScrolling.pending, (state, action) => {
+            if (!state.settings) return
+            state.settings.entriesToKeepOnTopWhenScrolling = action.meta.arg
+        })
         builder.addCase(changeStarIconDisplayMode.pending, (state, action) => {
             if (!state.settings) return
             state.settings.starIconDisplayMode = action.meta.arg
@@ -112,6 +136,7 @@ export const userSlice = createSlice({
                 changeShowRead.fulfilled,
                 changeScrollMarks.fulfilled,
                 changeScrollMode.fulfilled,
+                changeEntriesToKeepOnTopWhenScrolling.fulfilled,
                 changeStarIconDisplayMode.fulfilled,
                 changeExternalLinkIconDisplayMode.fulfilled,
                 changeMarkAllAsReadConfirmation.fulfilled,
@@ -130,3 +155,5 @@ export const userSlice = createSlice({
         )
     },
 })
+
+export const { setViewMode, setSidebarWidth, setAnnouncementHash } = userSlice.actions

commafeed-client/src/app/user/thunks.ts

@@ -4,45 +4,64 @@ import { reloadEntries } from "app/entries/thunks"
 import type { IconDisplayMode, ReadingMode, ReadingOrder, ScrollMode, SharingSettings } from "app/types"
 
 export const reloadSettings = createAppAsyncThunk("settings/reload", async () => await client.user.getSettings().then(r => r.data))
+
 export const reloadProfile = createAppAsyncThunk("profile/reload", async () => await client.user.getProfile().then(r => r.data))
+
 export const reloadTags = createAppAsyncThunk("entries/tags", async () => await client.entry.getTags().then(r => r.data))
+
 export const changeReadingMode = createAppAsyncThunk("settings/readingMode", (readingMode: ReadingMode, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, readingMode })
     thunkApi.dispatch(reloadEntries())
 })
+
 export const changeReadingOrder = createAppAsyncThunk("settings/readingOrder", (readingOrder: ReadingOrder, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, readingOrder })
     thunkApi.dispatch(reloadEntries())
 })
+
 export const changeLanguage = createAppAsyncThunk("settings/language", (language: string, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, language })
 })
+
 export const changeScrollSpeed = createAppAsyncThunk("settings/scrollSpeed", (speed: boolean, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, scrollSpeed: speed ? 400 : 0 })
 })
+
 export const changeShowRead = createAppAsyncThunk("settings/showRead", (showRead: boolean, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, showRead })
 })
+
 export const changeScrollMarks = createAppAsyncThunk("settings/scrollMarks", (scrollMarks: boolean, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, scrollMarks })
 })
+
 export const changeScrollMode = createAppAsyncThunk("settings/scrollMode", (scrollMode: ScrollMode, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, scrollMode })
 })
+
+export const changeEntriesToKeepOnTopWhenScrolling = createAppAsyncThunk(
+    "settings/entriesToKeepOnTopWhenScrolling",
+    (entriesToKeepOnTopWhenScrolling: number, thunkApi) => {
+        const { settings } = thunkApi.getState().user
+        if (!settings) return
+        client.user.saveSettings({ ...settings, entriesToKeepOnTopWhenScrolling })
+    }
+)
+
 export const changeStarIconDisplayMode = createAppAsyncThunk(
     "settings/starIconDisplayMode",
     (starIconDisplayMode: IconDisplayMode, thunkApi) => {
@@ -51,6 +70,7 @@ export const changeStarIconDisplayMode = createAppAsyncThunk(
         client.user.saveSettings({ ...settings, starIconDisplayMode })
     }
 )
+
 export const changeExternalLinkIconDisplayMode = createAppAsyncThunk(
     "settings/externalLinkIconDisplayMode",
     (externalLinkIconDisplayMode: IconDisplayMode, thunkApi) => {
@@ -59,6 +79,7 @@ export const changeExternalLinkIconDisplayMode = createAppAsyncThunk(
         client.user.saveSettings({ ...settings, externalLinkIconDisplayMode })
     }
 )
+
 export const changeMarkAllAsReadConfirmation = createAppAsyncThunk(
     "settings/markAllAsReadConfirmation",
     (markAllAsReadConfirmation: boolean, thunkApi) => {
@@ -67,26 +88,31 @@ export const changeMarkAllAsReadConfirmation = createAppAsyncThunk(
         client.user.saveSettings({ ...settings, markAllAsReadConfirmation })
     }
 )
+
 export const changeCustomContextMenu = createAppAsyncThunk("settings/customContextMenu", (customContextMenu: boolean, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, customContextMenu })
 })
+
 export const changeMobileFooter = createAppAsyncThunk("settings/mobileFooter", (mobileFooter: boolean, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, mobileFooter })
 })
+
 export const changeUnreadCountTitle = createAppAsyncThunk("settings/unreadCountTitle", (unreadCountTitle: boolean, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, unreadCountTitle })
 })
+
 export const changeUnreadCountFavicon = createAppAsyncThunk("settings/unreadCountFavicon", (unreadCountFavicon: boolean, thunkApi) => {
     const { settings } = thunkApi.getState().user
     if (!settings) return
     client.user.saveSettings({ ...settings, unreadCountFavicon })
 })
+
 export const changeSharingSetting = createAppAsyncThunk(
     "settings/sharingSetting",
     (

commafeed-client/src/components/Alert.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box, Alert as MantineAlert } from "@mantine/core"
 import { Fragment } from "react"
 import { TbAlertCircle, TbAlertTriangle, TbCircleCheck } from "react-icons/tb"

commafeed-client/src/components/AnnouncementDialog.tsx

@@ -1,9 +1,9 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box, Dialog, Text } from "@mantine/core"
-import { useAppSelector } from "app/store"
+import { useAppDispatch, useAppSelector } from "app/store"
+import { setAnnouncementHash } from "app/user/slice"
 import { Content } from "components/content/Content"
 import { useAsync } from "react-async-hook"
-import useLocalStorage from "use-local-storage"
 
 const sha256Hex = async (input: string | undefined) => {
     const data = new TextEncoder().encode(input)
@@ -15,10 +15,11 @@ const sha256Hex = async (input: string | undefined) => {
 export function AnnouncementDialog() {
     const announcement = useAppSelector(state => state.server.serverInfos?.announcement)
     const announcementHash = useAsync(sha256Hex, [announcement]).result
-    const [localStorageHash, setLocalStorageHash] = useLocalStorage("announcement-hash", "no-hash")
+    const existingAnnouncementHash = useAppSelector(state => state.user.localSettings.announcementHash)
+    const dispatch = useAppDispatch()
 
-    const opened = !!announcementHash && announcementHash !== localStorageHash
-    const onClosed = () => setLocalStorageHash(announcementHash)
+    const opened = !!announcementHash && announcementHash !== existingAnnouncementHash
+    const onClosed = () => announcementHash && dispatch(setAnnouncementHash(announcementHash))
 
     if (!announcement) return null
     return (

commafeed-client/src/components/DisablePullToRefresh.css

@@ -0,0 +1,4 @@
+html,
+body {
+    overscroll-behavior: none;
+}

commafeed-client/src/components/DisablePullToRefresh.tsx

@@ -1,15 +1,4 @@
-import { Helmet } from "react-helmet"
-
 export const DisablePullToRefresh = () => {
-    return (
-        <Helmet>
-            <style type="text/css">
-                {`
-                    html, body {
-                        overscroll-behavior: none;
-                    }
-                `}
-            </style>
-        </Helmet>
-    )
+    import("./DisablePullToRefresh.css")
+    return <></>
 }

commafeed-client/src/components/ImageWithPlaceholderWhileLoading.tsx

@@ -9,6 +9,7 @@ interface ImageWithPlaceholderWhileLoadingProps {
     title?: string
     width?: number
     height?: number | "auto"
+    style?: React.CSSProperties
     placeholderWidth?: number
     placeholderHeight?: number
     placeholderBackgroundColor?: string
@@ -42,6 +43,7 @@ export function ImageWithPlaceholderWhileLoading({
     src,
     title,
     width,
+    style,
 }: ImageWithPlaceholderWhileLoadingProps) {
     const { classes } = useStyles({
         placeholderWidth,
@@ -68,7 +70,11 @@ export function ImageWithPlaceholderWhileLoading({
                 width={width}
                 height={height}
                 onLoad={() => setLoading(false)}
-                style={{ display: loading ? "none" : "block" }}
+                style={{
+                    ...style,
+                    display: loading ? "none" : (style?.display ?? "initial"),
+                    height: style?.width ? "auto" : style?.height,
+                }}
             />
         </>
     )

commafeed-client/src/components/KeyboardShortcutsHelp.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Kbd, Stack, Table } from "@mantine/core"
 import { useOs } from "@mantine/hooks"
 import { Constants } from "app/constants"

commafeed-client/src/components/RelativeDate.tsx

@@ -1,15 +1,11 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Tooltip } from "@mantine/core"
 import { Constants } from "app/constants"
 import dayjs from "dayjs"
-import { useEffect, useState } from "react"
+import { useNow } from "hooks/useNow"
 
 export function RelativeDate(props: { date: Date | number | undefined }) {
-    const [now, setNow] = useState(new Date())
-    useEffect(() => {
-        const interval = setInterval(() => setNow(new Date()), 60 * 1000)
-        return () => clearInterval(interval)
-    }, [])
+    const now = useNow(60 * 1000)
 
     if (!props.date) return <Trans>N/A</Trans>
     const date = dayjs(props.date)

commafeed-client/src/components/admin/UserEdit.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box, Button, Checkbox, Group, PasswordInput, Stack, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/components/content/BasicHtmlStyles.tsx

@@ -1,11 +1,24 @@
 import { TypographyStylesProvider } from "@mantine/core"
 import type { ReactNode } from "react"
+import { tss } from "tss"
 
 /**
  * This component is used to provide basic styles to html typography elements.
  *
  * see https://mantine.dev/core/typography-styles-provider/
  */
+
+const useStyles = tss.create(() => ({
+    // override mantine default typography styles
+    content: {
+        paddingLeft: 0,
+        "& img": {
+            marginBottom: 0,
+        },
+    },
+}))
+
 export const BasicHtmlStyles = (props: { children: ReactNode }) => {
-    return <TypographyStylesProvider pl={0}>{props.children}</TypographyStylesProvider>
+    const { classes } = useStyles()
+    return <TypographyStylesProvider className={classes.content}>{props.children}</TypographyStylesProvider>
 }

commafeed-client/src/components/content/Content.test.tsx

@@ -0,0 +1,27 @@
+import { MantineProvider } from "@mantine/core"
+import { render } from "@testing-library/react"
+import { Content } from "components/content/Content"
+import React from "react"
+import { describe, expect, it } from "vitest"
+
+describe("Content component", () => {
+    it("renders basic content", () => {
+        const { container } = render(<Content content="<p>Hello World</p>" />, { wrapper: MantineProvider })
+        expect(container.querySelector("p")).toHaveTextContent("Hello World")
+    })
+
+    it("renders highlighted text when highlight prop is provided", () => {
+        const { container } = render(<Content content="Hello World" highlight="World" />, { wrapper: MantineProvider })
+        expect(container.querySelector("mark")).toHaveTextContent("World")
+    })
+
+    it("renders iframe tag when included in content", () => {
+        const { container } = render(<Content content='<iframe src="https://example.com"></iframe>' />, { wrapper: MantineProvider })
+        expect(container.querySelector("iframe")).toHaveAttribute("src", "https://example.com")
+    })
+
+    it("does not render unsupported tags", () => {
+        const { container } = render(<Content content='<script>alert("test")</script>' />, { wrapper: MantineProvider })
+        expect(container.querySelector("script")).toBeNull()
+    })
+})

commafeed-client/src/components/content/Content.tsx

@@ -4,8 +4,9 @@ import { calculatePlaceholderSize } from "app/utils"
 import { ImageWithPlaceholderWhileLoading } from "components/ImageWithPlaceholderWhileLoading"
 import { BasicHtmlStyles } from "components/content/BasicHtmlStyles"
 import escapeStringRegexp from "escape-string-regexp"
-import { type ChildrenNode, Interweave, type MatchResponse, Matcher, type Node, type TransformCallback } from "interweave"
+import { ALLOWED_TAG_LIST, type ChildrenNode, Interweave, type MatchResponse, Matcher, type Node, type TransformCallback } from "interweave"
 import React from "react"
+import styleToObject from "style-to-object"
 import { tss } from "tss"
 
 export interface ContentProps {
@@ -42,6 +43,7 @@ const transform: TransformCallback = node => {
         const nodeHeight = node.getAttribute("height")
         const width = nodeWidth ? Number.parseInt(nodeWidth, 10) : undefined
         const height = nodeHeight ? Number.parseInt(nodeHeight, 10) : undefined
+        const style = styleToObject(node.getAttribute("style") ?? "") ?? undefined
         const placeholderSize = calculatePlaceholderSize({
             width,
             height,
@@ -55,6 +57,7 @@ const transform: TransformCallback = node => {
                 title={title}
                 width={width}
                 height="auto"
+                style={style}
                 placeholderWidth={placeholderSize.width}
                 placeholderHeight={placeholderSize.height}
             />
@@ -85,6 +88,9 @@ class HighlightMatcher extends Matcher {
     }
 }
 
+// allow iframe tag
+const allowList = [...ALLOWED_TAG_LIST, "iframe"]
+
 // memoize component because Interweave is costly
 const Content = React.memo((props: ContentProps) => {
     const { classes } = useStyles()
@@ -93,7 +99,7 @@ const Content = React.memo((props: ContentProps) => {
     return (
         <BasicHtmlStyles>
             <Box className={classes.content}>
-                <Interweave content={props.content} transform={transform} matchers={matchers} />
+                <Interweave content={props.content} transform={transform} matchers={matchers} allowList={allowList} />
             </Box>
         </BasicHtmlStyles>
     )

commafeed-client/src/components/content/Enclosure.tsx

@@ -19,7 +19,7 @@ export function Enclosure(props: {
             )}
             {hasAudio && (
                 // biome-ignore lint/a11y/useMediaCaption: we don't have any captions for audio
-                <audio controls>
+                <audio controls style={{ width: "100%" }}>
                     <source src={props.enclosureUrl} type={props.enclosureType} />
                 </audio>
             )}

commafeed-client/src/components/content/FeedEntries.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box } from "@mantine/core"
 import { openModal } from "@mantine/modals"
 import { Constants } from "app/constants"
@@ -20,7 +20,6 @@ import { KeyboardShortcutsHelp } from "components/KeyboardShortcutsHelp"
 import { Loader } from "components/Loader"
 import { useBrowserExtension } from "hooks/useBrowserExtension"
 import { useMousetrap } from "hooks/useMousetrap"
-import { useViewMode } from "hooks/useViewMode"
 import { useEffect } from "react"
 import { useContextMenu } from "react-contexify"
 import InfiniteScroll from "react-infinite-scroller"
@@ -38,7 +37,7 @@ export function FeedEntries() {
     const scrollingToEntry = useAppSelector(state => state.entries.scrollingToEntry)
     const sidebarVisible = useAppSelector(state => state.tree.sidebarVisible)
     const customContextMenu = useAppSelector(state => state.user.settings?.customContextMenu)
-    const { viewMode } = useViewMode()
+    const viewMode = useAppSelector(state => state.user.localSettings.viewMode)
     const dispatch = useAppDispatch()
     const { openLinkInBackgroundTab } = useBrowserExtension()
 

commafeed-client/src/components/content/FeedEntry.tsx

@@ -5,7 +5,6 @@ import type { Entry, ViewMode } from "app/types"
 import { FeedEntryCompactHeader } from "components/content/header/FeedEntryCompactHeader"
 import { FeedEntryHeader } from "components/content/header/FeedEntryHeader"
 import { useMobile } from "hooks/useMobile"
-import { useViewMode } from "hooks/useViewMode"
 import type React from "react"
 import { useSwipeable } from "react-swipeable"
 import { tss } from "tss"
@@ -95,7 +94,7 @@ const useStyles = tss
     })
 
 export function FeedEntry(props: FeedEntryProps) {
-    const { viewMode } = useViewMode()
+    const viewMode = useAppSelector(state => state.user.localSettings.viewMode)
     const { classes, cx } = useStyles({
         read: props.entry.read,
         expanded: props.expanded,

commafeed-client/src/components/content/FeedEntryContextMenu.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Group } from "@mantine/core"
 import { Constants } from "app/constants"
 import { markEntriesUpToEntry, markEntry, starEntry } from "app/entries/thunks"

commafeed-client/src/components/content/FeedEntryFooter.tsx

@@ -1,4 +1,4 @@
-import { msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
 import { Group, Indicator, Popover, TagsInput } from "@mantine/core"
 import { markEntriesUpToEntry, markEntry, starEntry, tagEntry } from "app/entries/thunks"

commafeed-client/src/components/content/ShareButtons.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { ActionIcon, Box, CopyButton, Divider, SimpleGrid } from "@mantine/core"
 import { Constants } from "app/constants"
 import { useAppSelector } from "app/store"

commafeed-client/src/components/content/add/AddCategory.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Box, Button, Group, Stack, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/components/content/add/CategorySelect.tsx

@@ -1,4 +1,4 @@
-import { msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
 import { Select, type SelectProps } from "@mantine/core"
 import type { ComboboxItem } from "@mantine/core/lib/components/Combobox/Combobox.types"

commafeed-client/src/components/content/add/ImportOpml.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Box, Button, FileInput, Group, Stack } from "@mantine/core"
 import { isNotEmpty, useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/components/content/add/Subscribe.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box, Button, Group, Stack, Stepper, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"
@@ -39,8 +39,8 @@ export function Subscribe() {
         },
     })
     const subscribe = useAsyncCallback(client.feed.subscribe, {
-        onSuccess: sub => {
-            dispatch(reloadTree())
+        onSuccess: async sub => {
+            await dispatch(reloadTree())
             dispatch(redirectToFeed(sub.data))
         },
     })

commafeed-client/src/components/content/header/OpenExternalLink.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { ActionIcon, Anchor, Tooltip } from "@mantine/core"
 import { Constants } from "app/constants"
 import { markEntry } from "app/entries/thunks"

commafeed-client/src/components/content/header/Star.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { ActionIcon, Tooltip } from "@mantine/core"
 import { Constants } from "app/constants"
 import { starEntry } from "app/entries/thunks"

commafeed-client/src/components/header/Header.tsx

@@ -1,4 +1,4 @@
-import { msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
 import { Box, Center, CloseButton, Divider, Group, Indicator, Popover, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"

commafeed-client/src/components/header/MarkAllAsReadButton.tsx

@@ -1,4 +1,5 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
+import { Trans } from "@lingui/react/macro"
 
 import { Button, Code, Group, Modal, Slider, Stack, Text } from "@mantine/core"
 import { markAllEntries } from "app/entries/thunks"

commafeed-client/src/components/header/ProfileMenu.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import {
     Box,
     Divider,
@@ -14,7 +14,10 @@ import { client } from "app/client"
 import { redirectToAbout, redirectToAdminUsers, redirectToDonate, redirectToMetrics, redirectToSettings } from "app/redirect/thunks"
 import { useAppDispatch, useAppSelector } from "app/store"
 import type { ViewMode } from "app/types"
-import { useViewMode } from "hooks/useViewMode"
+import { setViewMode } from "app/user/slice"
+import { reloadProfile } from "app/user/thunks"
+import dayjs from "dayjs"
+import { useNow } from "hooks/useNow"
 import { type ReactNode, useState } from "react"
 import {
     TbChartLine,
@@ -92,12 +95,19 @@ const viewModeData: ViewModeControlItem[] = [
 
 export function ProfileMenu(props: ProfileMenuProps) {
     const [opened, setOpened] = useState(false)
-    const { viewMode, setViewMode } = useViewMode()
+    const now = useNow()
     const profile = useAppSelector(state => state.user.profile)
     const admin = useAppSelector(state => state.user.profile?.admin)
+    const viewMode = useAppSelector(state => state.user.localSettings.viewMode)
+    const forceRefreshCooldownDuration = useAppSelector(state => state.server.serverInfos?.forceRefreshCooldownDuration)
     const dispatch = useAppDispatch()
     const { colorScheme, setColorScheme } = useMantineColorScheme()
 
+    const nextAvailableForceRefresh = profile?.lastForceRefresh
+        ? profile.lastForceRefresh + (forceRefreshCooldownDuration ?? 0)
+        : now.getTime()
+    const forceRefreshEnabled = nextAvailableForceRefresh <= now.getTime()
+
     const logout = () => {
         window.location.href = "logout"
     }
@@ -118,18 +128,32 @@ export function ProfileMenu(props: ProfileMenuProps) {
                 </Menu.Item>
                 <Menu.Item
                     leftSection={<TbWorldDownload size={iconSize} />}
-                    onClick={async () =>
-                        await client.feed.refreshAll().then(() => {
+                    disabled={!forceRefreshEnabled}
+                    onClick={async () => {
+                        setOpened(false)
+
+                        try {
+                            await client.feed.refreshAll()
+
+                            // reload profile to update last force refresh timestamp
+                            await dispatch(reloadProfile())
+
                             showNotification({
                                 message: <Trans>Your feeds have been queued for refresh.</Trans>,
                                 color: "green",
                                 autoClose: 1000,
                             })
-                            setOpened(false)
-                        })
-                    }
+                        } catch (error) {
+                            showNotification({
+                                message: <Trans>Force fetching feeds is not yet available.</Trans>,
+                                color: "red",
+                                autoClose: 2000,
+                            })
+                        }
+                    }}
                 >
                     <Trans>Fetch all my feeds now</Trans>
+                    {!forceRefreshEnabled && <span> ({dayjs.duration(nextAvailableForceRefresh - now.getTime()).format("HH:mm:ss")})</span>}
                 </Menu.Item>
 
                 <Divider />
@@ -156,7 +180,7 @@ export function ProfileMenu(props: ProfileMenuProps) {
                     orientation="vertical"
                     data={viewModeData}
                     value={viewMode}
-                    onChange={e => setViewMode(e as ViewMode)}
+                    onChange={e => dispatch(setViewMode(e as ViewMode))}
                     mb="xs"
                 />
 

commafeed-client/src/components/metrics/Gauge.tsx

@@ -1,3 +1,4 @@
+import { NumberFormatter } from "@mantine/core"
 import type { MetricGauge } from "app/types"
 
 interface MeterProps {
@@ -5,5 +6,5 @@ interface MeterProps {
 }
 
 export function Gauge(props: MeterProps) {
-    return <span>{props.gauge.value}</span>
+    return <NumberFormatter value={props.gauge.value} thousandSeparator />
 }

commafeed-client/src/components/settings/CustomCodeSettings.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box, Button, Group, Stack } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/components/settings/DisplaySettings.tsx

@@ -1,12 +1,14 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
-import { Divider, Group, Radio, Select, SimpleGrid, Stack, Switch } from "@mantine/core"
+import { Trans } from "@lingui/react/macro"
+import { Divider, Group, NumberInput, Radio, Select, SimpleGrid, Stack, Switch } from "@mantine/core"
 import type { ComboboxData } from "@mantine/core/lib/components/Combobox/Combobox.types"
 import { Constants } from "app/constants"
 import { useAppDispatch, useAppSelector } from "app/store"
 import type { IconDisplayMode, ScrollMode, SharingSettings } from "app/types"
 import {
     changeCustomContextMenu,
+    changeEntriesToKeepOnTopWhenScrolling,
     changeExternalLinkIconDisplayMode,
     changeLanguage,
     changeMarkAllAsReadConfirmation,
@@ -29,6 +31,7 @@ export function DisplaySettings() {
     const showRead = useAppSelector(state => state.user.settings?.showRead)
     const scrollMarks = useAppSelector(state => state.user.settings?.scrollMarks)
     const scrollMode = useAppSelector(state => state.user.settings?.scrollMode)
+    const entriesToKeepOnTop = useAppSelector(state => state.user.settings?.entriesToKeepOnTopWhenScrolling)
     const starIconDisplayMode = useAppSelector(state => state.user.settings?.starIconDisplayMode)
     const externalLinkIconDisplayMode = useAppSelector(state => state.user.settings?.externalLinkIconDisplayMode)
     const markAllAsReadConfirmation = useAppSelector(state => state.user.settings?.markAllAsReadConfirmation)
@@ -145,6 +148,14 @@ export function DisplaySettings() {
                 </Group>
             </Radio.Group>
 
+            <NumberInput
+                label={<Trans>Entries to keep above the selected entry when scrolling</Trans>}
+                description={<Trans>Only applies to compact, cozy and detailed modes</Trans>}
+                min={0}
+                value={entriesToKeepOnTop}
+                onChange={async value => await dispatch(changeEntriesToKeepOnTopWhenScrolling(+value))}
+            />
+
             <Switch
                 label={<Trans>Scroll smoothly when navigating between entries</Trans>}
                 checked={scrollSpeed ? scrollSpeed > 0 : false}

commafeed-client/src/components/settings/ProfileSettings.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Button, Checkbox, Divider, Group, Input, PasswordInput, Stack, Text, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { openConfirmModal } from "@mantine/modals"

commafeed-client/src/components/sidebar/Tree.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box, Stack } from "@mantine/core"
 import { Constants } from "app/constants"
 import {

commafeed-client/src/components/sidebar/TreeSearch.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { TextInput } from "@mantine/core"
 import { Spotlight, type SpotlightActionData, spotlight } from "@mantine/spotlight"
 import { redirectToFeed } from "app/redirect/thunks"

commafeed-client/src/hooks/useAppLoading.ts

@@ -1,4 +1,4 @@
-import { msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
 import { useAppSelector } from "app/store"
 

commafeed-client/src/hooks/useNow.ts

@@ -0,0 +1,10 @@
+import { useEffect, useState } from "react"
+
+export const useNow = (interval = 1000): Date => {
+    const [time, setTime] = useState(new Date())
+    useEffect(() => {
+        const t = setInterval(() => setTime(new Date()), interval)
+        return () => clearInterval(t)
+    }, [interval])
+    return time
+}

commafeed-client/src/hooks/useViewMode.ts

@@ -1,7 +0,0 @@
-import type { ViewMode } from "app/types"
-import useLocalStorage from "use-local-storage"
-
-export function useViewMode() {
-    const [viewMode, setViewMode] = useLocalStorage<ViewMode>("view-mode", "detailed")
-    return { viewMode, setViewMode }
-}

commafeed-client/src/hooks/useWebSocket.ts

@@ -1,6 +1,6 @@
 import { setWebSocketConnected } from "app/server/slice"
 import { type AppDispatch, useAppDispatch, useAppSelector } from "app/store"
-import { incrementUnreadCount } from "app/tree/slice"
+import { newFeedEntriesDiscovered } from "app/tree/thunks"
 import { useEffect } from "react"
 import WebsocketHeartbeatJs from "websocket-heartbeat-js"
 
@@ -9,7 +9,7 @@ const handleMessage = (dispatch: AppDispatch, message: string) => {
     const type = parts[0]
     if (type === "new-feed-entries") {
         dispatch(
-            incrementUnreadCount({
+            newFeedEntriesDiscovered({
                 feedId: +parts[1],
                 amount: +parts[2],
             })

commafeed-client/src/locales/ar/messages.po

@@ -321,6 +321,10 @@ msgstr "دخول"
 msgid "Enter your current password to change profile settings"
 msgstr "أدخل كلمة المرور الحالية لتغيير إعدادات ملف التعريف"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "تصفية التعبير"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "هل نسيت كلمة المرور؟"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "اوووه!"

commafeed-client/src/locales/ca/messages.po

@@ -321,6 +321,10 @@ msgstr "Entra"
 msgid "Enter your current password to change profile settings"
 msgstr "introduïu la vostra contrasenya actual per canviar la configuració del perfil"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Expressió de filtratge"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Heu oblidat la contrasenya?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr "Al mòbil, mostra els botons d'acció a la part inferior de la pantalla"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Vaja!"

commafeed-client/src/locales/cs/messages.po

@@ -321,6 +321,10 @@ msgstr "Vstupte"
 msgid "Enter your current password to change profile settings"
 msgstr "Zadejte své aktuální heslo pro změnu nastavení profilu"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtrování výrazu"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Zapomněli jste heslo?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Jejda!"

commafeed-client/src/locales/cy/messages.po

@@ -321,6 +321,10 @@ msgstr "Ewch i mewn"
 msgid "Enter your current password to change profile settings"
 msgstr "Rhowch eich cyfrinair presennol i newid gosodiadau proffil"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Hidlo mynegiant"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Wedi anghofio cyfrinair?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Wps!"

commafeed-client/src/locales/da/messages.po

@@ -321,6 +321,10 @@ msgstr ""
 msgid "Enter your current password to change profile settings"
 msgstr "Indtast din nuværende adgangskode for at ændre profilindstillinger"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtrerende udtryk"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Glemt adgangskode?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Hovsa!"

commafeed-client/src/locales/de/messages.po

@@ -321,6 +321,10 @@ msgstr "Eintreten"
 msgid "Enter your current password to change profile settings"
 msgstr "Geben Sie Ihr aktuelles Passwort ein, um die Profileinstellungen zu ändern"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filterausdruck"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Passwort vergessen?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr "Auf mobilen Geräten die Aktion-Buttons am unteren Ende des Bildschirms anzeigen"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Ups!"

commafeed-client/src/locales/en/messages.po

@@ -321,6 +321,10 @@ msgstr "Enter"
 msgid "Enter your current password to change profile settings"
 msgstr "Enter your current password to change profile settings"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr "Entries to keep above the selected entry when scrolling"
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr "Entry headers"
@@ -372,6 +376,10 @@ msgstr "Fever API URL"
 msgid "Filtering expression"
 msgstr "Filtering expression"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr "Force fetching feeds is not yet available."
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Forgot password?"
@@ -608,6 +616,10 @@ msgstr "On mobile"
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr "On mobile, show action buttons at the bottom of the screen"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr "Only applies to compact, cozy and detailed modes"
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Oops!"

commafeed-client/src/locales/es/messages.po

@@ -1,25 +1,26 @@
+# SPDX-FileCopyrightText: 2024 victorhck <victorhck@mailbox.org>
 msgid ""
 msgstr ""
 "POT-Creation-Date: 2022-10-28 13:47+0200\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=utf-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"X-Generator: @lingui/cli\n"
+"X-Generator: Lokalize 24.08.0\n"
 "Language: es\n"
 "Project-Id-Version: \n"
 "Report-Msgid-Bugs-To: \n"
-"PO-Revision-Date: \n"
-"Last-Translator: \n"
-"Language-Team: \n"
+"PO-Revision-Date: 2024-09-13 17:17+0200\n"
+"Last-Translator: victorhck <victorhck@mailbox.org>\n"
+"Language-Team: Spanish <kde-i18n-doc@kde.org>\n"
 "Plural-Forms: \n"
 
 #: src/pages/app/AboutPage.tsx
 msgid "<0>CommaFeed is an open-source project. Sources are hosted on </0><1>GitHub</1>."
-msgstr ""
+msgstr "<0>CommaFeed es un proyecto de código abierto. El código fuente está hospedado en </0><1>GitHub</1>."
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "<0>Complete syntax is available </0><1>here</1>."
-msgstr ""
+msgstr "<0>La sintaxis completa está disponible </0><1>aquí</1>."
 
 #: src/pages/auth/RegistrationPage.tsx
 msgid "<0>Have an account?</0><1>Log in!</1>"
@@ -27,7 +28,7 @@ msgstr "<0>¿Tienes una cuenta?</0><1>¡Inicia sesión!</1>"
 
 #: src/pages/app/DonatePage.tsx
 msgid "<0>Hey,</0><1>I'm Jérémie from Belgium and I've been working on CommaFeed in my free time for over 10 years now. Thanks for taking an interest in helping me continue supporting CommaFeed.</1>"
-msgstr ""
+msgstr "<0>Hola,</0><1>Soy Jérémie de Bélgica y he estado trabajando en CommaFeed en mi tiempo libre desde hace 10 años. Gracias por interesarte en ayudarme a seguir apoyando a CommaFeed.</1>"
 
 #: src/pages/auth/LoginPage.tsx
 msgid "<0>Need an account?</0><1>Sign up!</1>"
@@ -36,7 +37,7 @@ msgstr "<0>¿Necesitas una cuenta?</0><1>¡Regístrate!</1>"
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/app/AboutPage.tsx
 msgid "About"
-msgstr "Sobre"
+msgstr "Acerca de"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Actions"
@@ -44,7 +45,7 @@ msgstr "Acciones"
 
 #: src/components/content/add/AddCategory.tsx
 msgid "Add"
-msgstr "Agregar"
+msgstr "Añadir"
 
 #: src/pages/app/AddPage.tsx
 msgid "Add category"
@@ -70,55 +71,55 @@ msgstr "Todo"
 #: src/components/settings/DisplaySettings.tsx
 #: src/components/settings/DisplaySettings.tsx
 msgid "Always"
-msgstr ""
+msgstr "Siempre"
 
 #: src/pages/auth/PasswordRecoveryPage.tsx
 msgid "An email has been sent if this address was registered. Check your inbox."
-msgstr "Se ha enviado un correo electrónico si se registró esta dirección. "
+msgstr "Se ha enviado un correo electrónico si esta dirección estaba registrada. Revisa tu bandeja de entrada."
 
 #: src/components/content/add/ImportOpml.tsx
 msgid "An opml file is an XML file containing feed URLs and categories. You can get an OPML file by exporting your data from other feed reading services."
-msgstr "Un archivo opml es un archivo XML que contiene categorías y direcciones URL de fuentes. "
+msgstr "Un archivo opml es un archivo XML que contiene categorías y las URL de los feeds. Puedes obtener un archivo OPML exportando tus datos desde otros servicios de lectura de feeds."
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Analyze feed"
-msgstr "Analizar alimentación"
+msgstr "Analizar feed"
 
 #: src/components/AnnouncementDialog.tsx
 msgid "Announcement"
-msgstr ""
+msgstr "Anuncio"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "API key"
-msgstr "clave API"
+msgstr "Clave API"
 
 #: src/pages/app/CategoryDetailsPage.tsx
 msgid "Are you sure you want to delete category <0>{categoryName}</0>?"
-msgstr "¿Está seguro de que desea eliminar la categoría <0>{categoryName}</0>?"
+msgstr "¿Estás seguro de que deseas eliminar la categoría <0>{categoryName}</0>?"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Are you sure you want to delete user <0>{userName}</0> ?"
-msgstr "¿Está seguro de que desea eliminar el usuario <0>{userName}</0> ?"
+msgstr "¿Estás seguro de que deseas eliminar el usuario <0>{userName}</0> ?"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Are you sure you want to delete your account? There's no turning back!"
-msgstr "¿Está seguro de que desea eliminar su cuenta? "
+msgstr "¿Estás seguro de que quieres eliminar tu cuenta? ¡No hay vuelta atrás!"
 
 #: src/components/header/MarkAllAsReadButton.tsx
 msgid "Are you sure you want to mark all entries of <0>{sourceLabel}</0> as read?"
-msgstr "¿Está seguro de que desea marcar todas las entradas de <0>{sourceLabel}</0> como leídas?"
+msgstr "¿Estás seguro de que deseas marcar todas las entradas de <0>{sourceLabel}</0> como leídas?"
 
 #: src/components/header/MarkAllAsReadButton.tsx
 msgid "Are you sure you want to mark entries older than {threshold} days of <0>{sourceLabel}</0> as read?"
-msgstr "¿Está seguro de que desea marcar las entradas anteriores a {threshold} días de <0>{sourceLabel}</0> como leídas?"
+msgstr "¿Estás seguro de que deseas marcar las entradas anteriores a {threshold} días de <0>{sourceLabel}</0> como leídas?"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Are you sure you want to unsubscribe from <0>{feedName}</0>?"
-msgstr "¿Está seguro de que desea darse de baja de <0>{feedName}</0>?"
+msgstr "¿Estás seguro de que deseas darte de baja de <0>{feedName}</0>?"
 
 #: src/components/header/Header.tsx
 msgid "Asc"
-msgstr "ASC"
+msgstr "Asc"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Available variables are 'title', 'content', 'url' 'author' and 'categories' and their content is converted to lower case to ease string comparison."
@@ -134,15 +135,15 @@ msgstr "Volver a iniciar sesión"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Browser extension required for Chrome"
-msgstr ""
+msgstr "Se requiere extensión de navegador para Chrome"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Browser extention"
-msgstr ""
+msgstr "Extensión del navegador"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Browser tab"
-msgstr ""
+msgstr "Pestaña del navegador"
 
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
@@ -174,23 +175,23 @@ msgstr "Cambiar la contraseña generará una nueva clave API"
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Check that the feed is working"
-msgstr "Compruebe que el feed funciona"
+msgstr "Comprueba que el feed funciona"
 
 #: src/pages/app/Layout.tsx
 msgid "Close menu"
-msgstr ""
+msgstr "Cerrar menú"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Cmd"
-msgstr ""
+msgstr "Cmd"
 
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
-msgstr ""
+msgstr "Versión de la extensión del navegador CommaFeed {browserExtensionVersion}."
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "CommaFeed is compatible with the Fever API. Use the following URL in your Fever-compatible mobile client. Login with your username and your <0>API key</0>."
-msgstr ""
+msgstr "CommaFeed es compatible con Fever API. Utilice la siguiente URL en su cliente móvil compatible con Fever. Inicie sesión con su nombre de usuario y su <0>clave API</0>."
 
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed next unread item"
@@ -198,7 +199,7 @@ msgstr "CommaFeed siguiente elemento no leído"
 
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed version {version} ({revision})."
-msgstr ""
+msgstr "Versión de CommaFeed {version} ({revision})."
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Compact"
@@ -222,7 +223,7 @@ msgstr "Acogedor"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Ctrl"
-msgstr ""
+msgstr "Ctrl"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Current password"
@@ -230,19 +231,19 @@ msgstr "Contraseña actual"
 
 #: src/pages/app/SettingsPage.tsx
 msgid "Custom code"
-msgstr ""
+msgstr "Código personalizado"
 
 #: src/components/settings/CustomCodeSettings.tsx
 msgid "Custom CSS rules that will be applied"
-msgstr ""
+msgstr "Reglas CSS personalizadas que se aplicarán"
 
 #: src/components/settings/CustomCodeSettings.tsx
 msgid "Custom JS code that will be executed on page load"
-msgstr ""
+msgstr "Código JS personalizado que se ejecutará al cargar la página"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Dark"
-msgstr ""
+msgstr "Oscuro"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Date created"
@@ -267,25 +268,25 @@ msgstr "Borrar usuario"
 
 #: src/components/header/Header.tsx
 msgid "Desc"
-msgstr ""
+msgstr "Desc"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Detailed"
-msgstr ""
+msgstr "Detallado"
 
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/app/SettingsPage.tsx
 msgid "Display"
-msgstr "Pantalla"
+msgstr "Mostrar"
 
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/app/DonatePage.tsx
 msgid "Donate"
-msgstr ""
+msgstr "Donar"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Download"
-msgstr "descargar"
+msgstr "Descargar"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Drag link to bookmark bar"
@@ -302,7 +303,7 @@ msgstr "Correo electrónico"
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 msgid "E-mail address"
-msgstr "dirección de correo electrónico"
+msgstr "Dirección de correo electrónico"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Edit user"
@@ -319,15 +320,19 @@ msgstr "Entrar"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Enter your current password to change profile settings"
-msgstr "Ingrese su contraseña actual para cambiar la configuración del perfil"
+msgstr "Ingresa tu contraseña actual para cambiar la configuración del perfil"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr "Entradas para mantener encima de la entrada seleccionada al desplazarse"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
-msgstr ""
+msgstr "Encabezados de las entradas"
 
 #: src/components/Alert.tsx
 msgid "Error"
-msgstr ""
+msgstr "Error"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Example: {example}."
@@ -339,39 +344,43 @@ msgstr "Expandido"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Export your subscriptions and categories as an OPML file that can be imported in other feed reading services"
-msgstr "Exporte sus suscripciones y categorías como un archivo OPML que se puede importar en otros servicios de lectura de feeds"
+msgstr "Exporta tus suscripciones y categorías como un archivo OPML que se puede importar en otros servicios de lectura de feeds"
 
 #: src/components/header/Header.tsx
 #: src/pages/WelcomePage.tsx
 msgid "Extension options"
-msgstr ""
+msgstr "Opciones de la extensión"
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Feed name"
-msgstr "Nombre de alimentación"
+msgstr "Nombre del feed"
 
 #: src/components/content/add/Subscribe.tsx
 #: src/components/content/add/Subscribe.tsx
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Feed URL"
-msgstr "URL de fuente"
+msgstr "URL del feed"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Fetch all my feeds now"
-msgstr ""
+msgstr "Obtener todos mis feeds ahora"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Fever API"
-msgstr ""
+msgstr "API de Fever"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Fever API URL"
-msgstr ""
+msgstr "URL de la API de Fever"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Filtering expression"
 msgstr "Expresión de filtrado"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "¿Olvidaste la contraseña?"
@@ -394,7 +403,7 @@ msgstr "URL del feed generado"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 msgid "Go to {0}"
-msgstr ""
+msgstr "Ir a {0}"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Go to the All view"
@@ -406,7 +415,7 @@ msgstr "Ir a la documentación de la API."
 
 #: src/pages/app/AboutPage.tsx
 msgid "Goodies"
-msgstr "golosinas"
+msgstr "Golosinas"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Id"
@@ -414,15 +423,15 @@ msgstr "Identificación"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "If not empty, an expression evaluating to 'true' or 'false'. If false, new entries for this feed will be marked as read automatically."
-msgstr "Si no está vacío, una expresión que se evalúa como 'verdadero' o 'falso'. "
+msgstr "Si no está vacía, una expresión que se evalúa como \"verdadera\" o \"falso\". Si es falso, las nuevas entradas de este feed se marcarán como leídas automáticamente."
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "If the entry doesn't entirely fit on the screen"
-msgstr ""
+msgstr "Si la entrada no cabe completamente en la pantalla"
 
 #: src/pages/app/AboutPage.tsx
 msgid "If you encounter an issue, please report it on the issues page of the GitHub project."
-msgstr "Si encuentra un problema, infórmelo en la página de problemas del proyecto GitHub."
+msgstr "Si encuentras un problema, informa sobre ello en la página de problemas del proyecto en GitHub."
 
 #: src/components/content/add/ImportOpml.tsx
 msgid "Import"
@@ -430,7 +439,7 @@ msgstr "Importar"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "In expanded view, scrolling through entries mark them as read"
-msgstr "En la vista ampliada, al desplazarse por las entradas, márquelas como leídas"
+msgstr "En la vista ampliada, al desplazarse por las entradas marcarlas como leídas"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 #: src/components/content/FeedEntryFooter.tsx
@@ -440,7 +449,7 @@ msgstr "Mantener sin leer"
 #: src/components/content/FeedEntries.tsx
 #: src/pages/app/AboutPage.tsx
 msgid "Keyboard shortcuts"
-msgstr "atajos de teclado"
+msgstr "Atajos de teclado"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Language"
@@ -448,7 +457,7 @@ msgstr "Idioma"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Last login date"
-msgstr "fecha del último inicio de sesión"
+msgstr "Fecha del último inicio de sesión"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Last refresh"
@@ -460,7 +469,7 @@ msgstr "Último mensaje de actualización"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Light"
-msgstr ""
+msgstr "Claro"
 
 #: src/pages/app/CategoryDetailsPage.tsx
 #: src/pages/app/FeedDetailsPage.tsx
@@ -492,11 +501,11 @@ msgstr "Iniciar sesión"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Logout"
-msgstr "Salir"
+msgstr "Cerrar sesión"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Long press"
-msgstr ""
+msgstr "Pulsación larga"
 
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/admin/AdminUsersPage.tsx
@@ -528,7 +537,7 @@ msgstr "Métricas"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Middle click"
-msgstr ""
+msgstr "Clic central"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Move the page down"
@@ -552,12 +561,12 @@ msgstr "Nombre"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Navigate to a subscription by entering its name"
-msgstr "Navegar a una suscripción ingresando su nombre"
+msgstr "Navegar a una suscripción introduciendo su nombre"
 
 #: src/components/settings/DisplaySettings.tsx
 #: src/components/settings/DisplaySettings.tsx
 msgid "Never"
-msgstr ""
+msgstr "Nunca"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "New password"
@@ -565,7 +574,7 @@ msgstr "Nueva contraseña"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Newest first"
-msgstr "más reciente primero"
+msgstr "Las más recientes primero"
 
 #: src/components/content/add/Subscribe.tsx
 #: src/components/header/Header.tsx
@@ -578,7 +587,7 @@ msgstr "Próxima actualización"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Next unread item bookmarklet"
-msgstr "Bookmarklet del siguiente elemento no leído"
+msgstr "Siguiente elemento no leído de los marcadores"
 
 #: src/pages/app/FeedEntriesPage.tsx
 msgid "No more entries"
@@ -586,7 +595,7 @@ msgstr "No más entradas"
 
 #: src/components/content/ShareButtons.tsx
 msgid "No sharing options available."
-msgstr ""
+msgstr "No hay opciones para compartir disponibles."
 
 #: src/components/sidebar/TreeSearch.tsx
 msgid "Nothing found"
@@ -594,19 +603,23 @@ msgstr "Nada encontrado"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Oldest first"
-msgstr "más antigua primero"
+msgstr "Las más antiguas primero"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On desktop"
-msgstr ""
+msgstr "En el escritorio"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On mobile"
-msgstr ""
+msgstr "En dispositivos móviles"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On mobile, show action buttons at the bottom of the screen"
-msgstr ""
+msgstr "En dispositivos móviles, mostrar los botones de acción en la parte inferior de la pantalla"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr "Sólo se aplica a los modos compacto, acogedor y detallado"
 
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
@@ -614,7 +627,7 @@ msgstr "¡Ups!"
 
 #: src/components/header/Header.tsx
 msgid "Open CommaFeed"
-msgstr ""
+msgstr "Abrir Commafeed"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Open current entry in a new tab"
@@ -631,15 +644,15 @@ msgstr "Abrir enlace"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 msgid "Open link in new background tab"
-msgstr ""
+msgstr "Abrir enlace en una nueva pestaña en segundo plano"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 msgid "Open link in new tab"
-msgstr ""
+msgstr "Abrir el enlace en una nueva pestaña"
 
 #: src/pages/app/Layout.tsx
 msgid "Open menu"
-msgstr ""
+msgstr "Abrir menú"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Open next entry"
@@ -655,20 +668,20 @@ msgstr "Abrir/cerrar entrada actual"
 
 #: src/pages/app/AddPage.tsx
 msgid "OPML"
-msgstr ""
+msgstr "OPML"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "OPML export"
-msgstr "Exportación OPML"
+msgstr "Exportar OPML"
 
 #: src/components/content/add/ImportOpml.tsx
 #: src/components/content/add/ImportOpml.tsx
 msgid "OPML file"
-msgstr "archivo OPML"
+msgstr "Archivo OPML"
 
 #: src/components/content/add/ImportOpml.tsx
 msgid "OPML file is required"
-msgstr ""
+msgstr "Es necesario un archivo OPML"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Order"
@@ -705,7 +718,7 @@ msgstr "Posición"
 
 #: src/components/header/Header.tsx
 msgid "Previous"
-msgstr ""
+msgstr "Previo"
 
 #: src/pages/app/SettingsPage.tsx
 msgid "Profile"
@@ -731,7 +744,7 @@ msgstr "API REST"
 #: src/components/KeyboardShortcutsHelp.tsx
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Right click"
-msgstr ""
+msgstr "Clic derecho"
 
 #: src/components/admin/UserEdit.tsx
 #: src/components/settings/CustomCodeSettings.tsx
@@ -743,7 +756,7 @@ msgstr "Guardar"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Scroll selected entry to the top of the page"
-msgstr ""
+msgstr "Desplazar la entrada seleccionada hasta la parte superior de la página"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Scroll smoothly when navigating between entries"
@@ -751,7 +764,7 @@ msgstr "Desplazarse suavemente al navegar entre entradas"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Scrolling"
-msgstr ""
+msgstr "Desplazarse"
 
 #: src/components/header/Header.tsx
 #: src/components/header/Header.tsx
@@ -766,15 +779,15 @@ msgstr "La búsqueda requiere al menos 3 caracteres"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Set focus on next entry without opening it"
-msgstr "Establezca el foco en la siguiente entrada sin abrirla"
+msgstr "Establecer el foco en la siguiente entrada sin abrirla"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Set focus on previous entry without opening it"
-msgstr "Poner el foco en la entrada anterior sin abrirla"
+msgstr "Establecer el foco en la entrada anterior sin abrirla"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Settings"
-msgstr "Configuraciones"
+msgstr "Ajustes"
 
 #: src/app/user/slice.ts
 msgid "Settings saved."
@@ -792,27 +805,27 @@ msgstr "Compartir sitios"
 #: src/components/KeyboardShortcutsHelp.tsx
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Shift"
-msgstr "Cambio"
+msgstr "Shift"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show CommaFeed's own context menu on right click"
-msgstr ""
+msgstr "Mostrar el menú contextual propio de CommaFeed al hacer clic derecho"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show confirmation when marking all entries as read"
-msgstr ""
+msgstr "Mostrar confirmación al marcar todas las entradas como leídas"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show entry menu (desktop)"
-msgstr ""
+msgstr "Mostrar menú de entrada (escritorio)"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show entry menu (mobile)"
-msgstr ""
+msgstr "Mostrar menú de entrada (móvil)"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show external link icon"
-msgstr ""
+msgstr "Mostrar icono de enlace externo"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show feeds and categories with no unread entries"
@@ -820,23 +833,23 @@ msgstr "Mostrar feeds y categorías sin entradas no leídas"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show keyboard shortcut help"
-msgstr "Mostrar ayuda de atajo de teclado"
+msgstr "Mostrar la ayuda de los atajos de teclado"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show native menu (desktop)"
-msgstr ""
+msgstr "Mostrar menú nativo (escritorio)"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show star icon"
-msgstr ""
+msgstr "Mostrar el icono de la estrella"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show unread count in tab favicon"
-msgstr ""
+msgstr "Mostrar recuento de no leídos en la pestaña favicon"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show unread count in tab title"
-msgstr ""
+msgstr "Mostrar recuento de no leídos en el título de la pestaña"
 
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
@@ -857,7 +870,7 @@ msgstr "Espacio"
 #: src/components/content/FeedEntryFooter.tsx
 #: src/components/content/header/Star.tsx
 msgid "Star"
-msgstr "estrella"
+msgstr "Estrella"
 
 #: src/app/constants.ts
 #: src/components/sidebar/Tree.tsx
@@ -872,7 +885,7 @@ msgstr "Suscribirse"
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Subscribe to the feed"
-msgstr "Suscríbete a la fuente"
+msgstr "Suscríbete al feed"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Subscribe URL"
@@ -884,7 +897,7 @@ msgstr "Éxito"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Swipe header to the left"
-msgstr ""
+msgstr "Desliza el encabezado hacia la izquierda"
 
 #: src/pages/WelcomePage.tsx
 msgid "Switch to dark theme"
@@ -896,7 +909,7 @@ msgstr "Cambiar a tema claro"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "System"
-msgstr ""
+msgstr "Sistema"
 
 #: src/components/content/FeedEntryFooter.tsx
 #: src/components/content/FeedEntryFooter.tsx
@@ -905,7 +918,7 @@ msgstr "Etiquetas"
 
 #: src/components/content/add/Subscribe.tsx
 msgid "The URL for the feed you want to subscribe to. You can also use the website's url directly and CommaFeed will try to find the feed in the page."
-msgstr "La URL de la fuente a la que desea suscribirse. "
+msgstr "La URL del feed al que desea suscribirse. También puede utilizar la URL del sitio web directamente y CommaFeed intentará encontrar el feed en la página."
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Theme"
@@ -913,7 +926,7 @@ msgstr "Tema"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "This is your API key. It can be used for some read-only API operations and grants access to the Fever API. Use the form at the bottom of the page to generate a new API key"
-msgstr ""
+msgstr "Esta es su clave API. Se puede utilizar para algunas operaciones API de solo lectura y otorga acceso a Fever API. Utilice el formulario en la parte inferior de la página para generar una nueva clave API"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Toggle read status of current entry"
@@ -921,19 +934,19 @@ msgstr "Alternar estado de lectura de la entrada actual"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Toggle sidebar"
-msgstr ""
+msgstr "Alternar barra lateral"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Toggle starred status of current entry"
-msgstr ""
+msgstr "Alternar estado destacado de la entrada actual"
 
 #: src/pages/auth/LoginPage.tsx
 msgid "Try out CommaFeed with the demo account: demo/demo"
-msgstr "Pruebe CommaFeed con la cuenta demo: demo/demo"
+msgstr "Prueba CommaFeed con la cuenta de demostración: demo/demo"
 
 #: src/pages/WelcomePage.tsx
 msgid "Try the demo!"
-msgstr ""
+msgstr "¡Prueba la demostración!"
 
 #: src/components/header/Header.tsx
 msgid "Unread"
@@ -969,8 +982,8 @@ msgstr "Sitio web"
 
 #: src/pages/app/FeedEntriesPage.tsx
 msgid "You don't have any subscriptions yet. Why not try adding one by clicking on the + sign at the top of the page?"
-msgstr "Todavía no tienes ninguna suscripción. "
+msgstr "Aún no tienes ninguna suscripción. ¿Por qué no intentas agregar una haciendo clic en el signo + en la parte superior de la página?"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Your feeds have been queued for refresh."
-msgstr ""
+msgstr "Tus feeds se han puesto en cola para actualizarse."

commafeed-client/src/locales/fa/messages.po

@@ -321,6 +321,10 @@ msgstr "وارد شوید"
 msgid "Enter your current password to change profile settings"
 msgstr "رمز عبور فعلی خود را برای تغییر تنظیمات نمایه وارد کنید"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "بیان فیلتر"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "رمز عبور را فراموش کرده اید؟"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "اوه!"

commafeed-client/src/locales/fi/messages.po

@@ -321,6 +321,10 @@ msgstr ""
 msgid "Enter your current password to change profile settings"
 msgstr "Anna nykyinen salasanasi muuttaaksesi profiiliasetuksia"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Suodattava lauseke"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Unohditko salasanan?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Hups!"

commafeed-client/src/locales/fr/messages.po

@@ -321,6 +321,10 @@ msgstr "Entrer"
 msgid "Enter your current password to change profile settings"
 msgstr "Entrez votre mot de passe actuel pour changer les paramètres du profil"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr "Nombre d'entrées à conserver au-dessus de l'entrée sélectionnée lors d'un défilement"
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr "En-têtes de l'entrée"
@@ -372,6 +376,10 @@ msgstr "URL API Fever"
 msgid "Filtering expression"
 msgstr "Expression de filtrage"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr "La récupération forcée des flux n'est pas encore disponible."
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Mot de passe oublié ?"
@@ -608,6 +616,10 @@ msgstr "Version mobile"
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr "Sur mobile, afficher les boutons d'action en bas de l'écran"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr "Ne fonctionne que dans les modes Compact, Cozy, et Vue détaillée"
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Oups !"

commafeed-client/src/locales/gl/messages.po

@@ -321,6 +321,10 @@ msgstr "Entra"
 msgid "Enter your current password to change profile settings"
 msgstr "Introduce o teu contrasinal actual para cambiar a configuración do perfil"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Expresión de filtrado"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Esqueceches o contrasinal?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Vaia!"

commafeed-client/src/locales/hu/messages.po

@@ -321,6 +321,10 @@ msgstr ""
 msgid "Enter your current password to change profile settings"
 msgstr "Adja meg jelenlegi jelszavát a profilbeállítások módosításához"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Szűrő kifejezés"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Elfelejtette a jelszavát?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Hoppá!"

commafeed-client/src/locales/id/messages.po

@@ -321,6 +321,10 @@ msgstr "Masuk"
 msgid "Enter your current password to change profile settings"
 msgstr "Masukkan kata sandi Anda saat ini untuk mengubah pengaturan profil"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Memfilter ekspresi"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Lupa kata sandi?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Ups!"

commafeed-client/src/locales/it/messages.po

@@ -321,6 +321,10 @@ msgstr "Invio"
 msgid "Enter your current password to change profile settings"
 msgstr "Inserisci la tua password attuale per modificare le impostazioni del profilo"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Espressione filtrante"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Password dimenticata?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Ops!"

commafeed-client/src/locales/ja/messages.po

@@ -9,7 +9,7 @@ msgstr ""
 "Project-Id-Version: \n"
 "Report-Msgid-Bugs-To: \n"
 "PO-Revision-Date: \n"
-"Last-Translator: https://github.com/dai \n"
+"Last-Translator: https://github.com/dai\n"
 "Language-Team: \n"
 "Plural-Forms: \n"
 
@@ -29,7 +29,6 @@ msgstr "<0>アカウントをお持ちですか?</0><1>ログインしてくだ
 msgid "<0>Hey,</0><1>I'm Jérémie from Belgium and I've been working on CommaFeed in my free time for over 10 years now. Thanks for taking an interest in helping me continue supporting CommaFeed.</1>"
 msgstr "<0>こんにちは、</0><1>私はベルギーのジェレミーです。私はこれまで 10 年以上、CommaFeed のオープンソースプロジェクトを無料で開発してきました。あなたの関心に感謝します。</1>"
 
-
 #: src/pages/auth/LoginPage.tsx
 msgid "<0>Need an account?</0><1>Sign up!</1>"
 msgstr "<0>アカウントが必要ですか?</0><1>サインアップ!</1>"
@@ -59,7 +58,7 @@ msgstr "ユーザー追加"
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Admin"
-msgstr "管理人"
+msgstr "管理者"
 
 #: src/app/constants.ts
 #: src/components/content/add/CategorySelect.tsx
@@ -322,6 +321,10 @@ msgstr "入力"
 msgid "Enter your current password to change profile settings"
 msgstr "プロファイル設定を変更するには、現在のパスワードを入力してください"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr "エントリーを選択したとき、読みやすさに応じたスクロール調整を行います。"
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr "エントリーヘッダー"
@@ -373,6 +376,10 @@ msgstr "Fever API URL"
 msgid "Filtering expression"
 msgstr "フィルタリング式"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr "フィードの強制フェッチはまだ利用できません。"
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "パスワードをお忘れですか？"
@@ -395,7 +402,7 @@ msgstr "生成されたフィードURL"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 msgid "Go to {0}"
-msgstr "Go to {0}"
+msgstr "{0} に移動"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Go to the All view"
@@ -415,11 +422,11 @@ msgstr "ID"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "If not empty, an expression evaluating to 'true' or 'false'. If false, new entries for this feed will be marked as read automatically."
-msgstr "空でない場合は、'true' または 'false' に評価される式。 'false' の場合、このフィードの新しいエントリは自動的に既読としてマークされます。"
+msgstr "空でない場合は、'true' または 'false' に評価される式。 'false' の場合、このフィードの新しいエントリーは自動的に既読としてマークされます。"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "If the entry doesn't entirely fit on the screen"
-msgstr "エントリが画面に完全に収まらない場合"
+msgstr "エントリーが画面に完全に収まらない場合"
 
 #: src/pages/app/AboutPage.tsx
 msgid "If you encounter an issue, please report it on the issues page of the GitHub project."
@@ -609,6 +616,10 @@ msgstr "モバイル"
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr "モバイルでは、画面の下部にアクションボタンを表示します"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr "これはコンパクト/cozy/詳細モードでのみ適用されます"
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "おっと！"
@@ -744,7 +755,7 @@ msgstr "保存"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Scroll selected entry to the top of the page"
-msgstr "選択されたエントリーをページの上部にスクロールする"
+msgstr "エントリーを選択したときのスクロール調整"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Scroll smoothly when navigating between entries"
@@ -767,11 +778,11 @@ msgstr "検索には少なくとも3文字が必要です"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Set focus on next entry without opening it"
-msgstr "次のエントリーを開かずにフォーカスを設定する"
+msgstr "次のエントリーを開かずにフォーカスする"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Set focus on previous entry without opening it"
-msgstr "前のエントリーを開かずにフォーカスを設定する"
+msgstr "前のエントリーを開かずにフォーカスする"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Settings"
@@ -799,7 +810,6 @@ msgstr "Shift"
 msgid "Show CommaFeed's own context menu on right click"
 msgstr "右クリックでCommaFeedのコンテキストメニューを表示する"
 
-
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show confirmation when marking all entries as read"
 msgstr "すべてのエントリーを既読にするときに確認を表示する"

commafeed-client/src/locales/ko/messages.po

@@ -321,6 +321,10 @@ msgstr "입력"
 msgid "Enter your current password to change profile settings"
 msgstr "프로필 설정을 변경하려면 현재 비밀번호를 입력하세요."
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "필터링 표현식"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "비밀번호를 잊으셨나요?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "앗!"

commafeed-client/src/locales/ms/messages.po

@@ -321,6 +321,10 @@ msgstr "Masuk"
 msgid "Enter your current password to change profile settings"
 msgstr "Masukkan kata laluan semasa anda untuk menukar tetapan profil"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Ungkapan penapisan"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Lupa kata laluan?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Aduh!"

commafeed-client/src/locales/nb/messages.po

@@ -321,6 +321,10 @@ msgstr ""
 msgid "Enter your current password to change profile settings"
 msgstr "Skriv inn ditt nåværende passord for å endre profilinnstillinger"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtrerende uttrykk"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Glemt passord?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Beklager!"

commafeed-client/src/locales/nl/messages.po

@@ -321,6 +321,10 @@ msgstr ""
 msgid "Enter your current password to change profile settings"
 msgstr "Voer uw huidige wachtwoord in om de profielinstellingen te wijzigen"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Uitdrukking filteren"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Wachtwoord vergeten?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Oeps!"

commafeed-client/src/locales/nn/messages.po

@@ -321,6 +321,10 @@ msgstr ""
 msgid "Enter your current password to change profile settings"
 msgstr "Skriv inn ditt nåværende passord for å endre profilinnstillinger"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtrerende uttrykk"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Glemt passord?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Beklager!"

commafeed-client/src/locales/pl/messages.po

@@ -321,6 +321,10 @@ msgstr "Wprowadź"
 msgid "Enter your current password to change profile settings"
 msgstr "Wprowadź swoje aktualne hasło, aby zmienić ustawienia profilu"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Wyrażenie filtrujące"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Zapomniałeś hasła?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Ups!"

commafeed-client/src/locales/pt/messages.po

@@ -321,6 +321,10 @@ msgstr "Entrar"
 msgid "Enter your current password to change profile settings"
 msgstr "Digite sua senha atual para alterar as configurações do perfil"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtrando expressão"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Esqueceu a senha?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Opa!"

commafeed-client/src/locales/ru/messages.po

@@ -321,6 +321,10 @@ msgstr "Ввод"
 msgid "Enter your current password to change profile settings"
 msgstr "Введите текущий пароль, чтобы изменить настройки профиля."
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr "Ссылка Fever API"
 msgid "Filtering expression"
 msgstr "Выражение фильтрации"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Забыли пароль?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr "На мобильных устройствах отображать кнопки действий в нижней части экрана"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Ой!"

commafeed-client/src/locales/sk/messages.po

@@ -321,6 +321,10 @@ msgstr "Vstúpte"
 msgid "Enter your current password to change profile settings"
 msgstr "Ak chcete zmeniť nastavenia profilu, zadajte svoje aktuálne heslo"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtrovanie výrazu"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Zabudli ste heslo?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Ojoj!"

commafeed-client/src/locales/sv/messages.po

@@ -321,6 +321,10 @@ msgstr ""
 msgid "Enter your current password to change profile settings"
 msgstr "Ange ditt nuvarande lösenord för att ändra profilinställningar"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtrerande uttryck"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Glömt lösenord?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Hoppsan!"

commafeed-client/src/locales/tr/messages.po

@@ -321,6 +321,10 @@ msgstr "Girin"
 msgid "Enter your current password to change profile settings"
 msgstr "Profil ayarlarını değiştirmek için mevcut şifrenizi girin"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr ""
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr ""
@@ -372,6 +376,10 @@ msgstr ""
 msgid "Filtering expression"
 msgstr "Filtreleme ifadesi"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr ""
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "Parolanızı mı unuttunuz?"
@@ -608,6 +616,10 @@ msgstr ""
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "Hata!"

commafeed-client/src/locales/zh/messages.po

@@ -142,7 +142,7 @@ msgstr "浏览器扩展"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Browser tab"
-msgstr ""
+msgstr "浏览器标签页"
 
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
@@ -321,6 +321,10 @@ msgstr "回车"
 msgid "Enter your current password to change profile settings"
 msgstr "输入您当前的密码以更改配置文件设置"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Entries to keep above the selected entry when scrolling"
+msgstr "滚动时固定在顶部的条目"
+
 #: src/components/settings/DisplaySettings.tsx
 msgid "Entry headers"
 msgstr "条目头部"
@@ -372,6 +376,10 @@ msgstr "Fever API 网址"
 msgid "Filtering expression"
 msgstr "过滤表达式"
 
+#: src/components/header/ProfileMenu.tsx
+msgid "Force fetching feeds is not yet available."
+msgstr "强制获取订阅源功能不可用。"
+
 #: src/pages/auth/LoginPage.tsx
 msgid "Forgot password?"
 msgstr "忘记密码？"
@@ -608,6 +616,10 @@ msgstr "移动端"
 msgid "On mobile, show action buttons at the bottom of the screen"
 msgstr "在移动端，显示屏幕底部的操作按钮"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr ""
+
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
 msgstr "哎呀！"
@@ -832,11 +844,11 @@ msgstr "显示星标图标"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show unread count in tab favicon"
-msgstr ""
+msgstr "在标签页图标上显示未读数量"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show unread count in tab title"
-msgstr ""
+msgstr "在标签页标题中显示未读数量"
 
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx

commafeed-client/src/main.tsx

@@ -6,11 +6,13 @@ import "react-contexify/ReactContexify.css"
 import { App } from "App"
 import { store } from "app/store"
 import dayjs from "dayjs"
+import duration from "dayjs/plugin/duration"
 import relativeTime from "dayjs/plugin/relativeTime"
 import ReactDOM from "react-dom/client"
 import { Provider } from "react-redux"
 
 dayjs.extend(relativeTime)
+dayjs.extend(duration)
 
 const root = document.getElementById("root")
 root &&

commafeed-client/src/pages/ErrorPage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Box, Button, Container, Group, Text, Title } from "@mantine/core"
 import { TbRefresh } from "react-icons/tb"
 import { tss } from "tss"

commafeed-client/src/pages/WelcomePage.tsx

@@ -1,4 +1,4 @@
-import { msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { Anchor, Box, Center, Container, Divider, Group, Image, Space, Title, useMantineColorScheme } from "@mantine/core"
 import { client } from "app/client"
 import { redirectToApiDocumentation, redirectToLogin, redirectToRegistration, redirectToRootCategory } from "app/redirect/thunks"

commafeed-client/src/pages/admin/AdminUsersPage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { ActionIcon, Box, Code, Container, Group, Table, Text, Title, useMantineTheme } from "@mantine/core"
 import { closeAllModals, openConfirmModal, openModal } from "@mantine/modals"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/pages/admin/MetricsPage.tsx

@@ -23,6 +23,8 @@ const shownGauges: Record<string, string> = {
     "com.commafeed.backend.HttpGetter.pool.size": "HttpGetter current pool size",
     "com.commafeed.backend.HttpGetter.pool.leased": "HttpGetter active connections",
     "com.commafeed.backend.HttpGetter.pool.pending": "HttpGetter waiting for a connection",
+    "com.commafeed.backend.HttpGetter.cache.size": "HttpGetter cached entries",
+    "com.commafeed.backend.HttpGetter.cache.memoryUsage": "HttpGetter cache memory usage",
     "com.commafeed.frontend.ws.WebSocketSessions.users": "WebSocket users",
     "com.commafeed.frontend.ws.WebSocketSessions.sessions": "WebSocket sessions",
 }

commafeed-client/src/pages/app/AboutPage.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Container, List, NativeSelect, SimpleGrid, Title } from "@mantine/core"
 import { Constants } from "app/constants"
 import { redirectToApiDocumentation } from "app/redirect/thunks"

commafeed-client/src/pages/app/AddPage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Container, Tabs } from "@mantine/core"
 import { AddCategory } from "components/content/add/AddCategory"
 import { ImportOpml } from "components/content/add/ImportOpml"

commafeed-client/src/pages/app/CategoryDetailsPage.tsx

@@ -1,4 +1,6 @@
-import { Trans } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
+import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Button, Code, Container, Divider, Group, Input, NumberInput, Stack, Text, TextInput, Title } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { openConfirmModal } from "@mantine/modals"
@@ -19,6 +21,7 @@ import { useParams } from "react-router-dom"
 
 export function CategoryDetailsPage() {
     const { id = Constants.categories.all.id } = useParams()
+    const { _ } = useLingui()
 
     const apiKey = useAppSelector(state => state.user.profile?.apiKey)
     const dispatch = useAppDispatch()
@@ -26,7 +29,7 @@ export function CategoryDetailsPage() {
     const query = useAsync(async () => await client.category.getRoot(), [])
     const category =
         id === Constants.categories.starred.id
-            ? Constants.categories.starred
+            ? { ...Constants.categories.starred, name: _(msg`Starred`) }
             : query.result && flattenCategoryTree(query.result.data).find(c => c.id === id)
 
     const form = useForm<CategoryModificationRequest>()
@@ -63,14 +66,14 @@ export function CategoryDetailsPage() {
     }
 
     useEffect(() => {
-        if (!category) return
+        if (!category?.id) return
         setValues({
             id: +category.id,
             name: category.name,
             parentId: category.parentId,
             position: category.position,
         })
-    }, [setValues, category])
+    }, [setValues, category?.id, category?.name, category?.parentId, category?.position])
 
     const editable = id !== Constants.categories.all.id && id !== Constants.categories.starred.id
     if (!category) return <Loader />

commafeed-client/src/pages/app/DonatePage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Code, Container, Group, List, Title } from "@mantine/core"
 import { Constants } from "app/constants"
 import React from "react"

commafeed-client/src/pages/app/FeedDetailsPage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Button, Code, Container, Divider, Group, Input, NumberInput, Stack, Text, TextInput, Title } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { openConfirmModal } from "@mantine/modals"

commafeed-client/src/pages/app/FeedEntriesPage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { ActionIcon, Box, Center, Divider, Group, Title, useMantineTheme } from "@mantine/core"
 import { useViewportSize } from "@mantine/hooks"
 import { Constants } from "app/constants"

commafeed-client/src/pages/app/Layout.tsx

@@ -1,10 +1,11 @@
-import { msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { ActionIcon, AppShell, Box, Center, Group, ScrollArea, Title, useMantineTheme } from "@mantine/core"
 import { Constants } from "app/constants"
 import { redirectToAdd, redirectToRootCategory } from "app/redirect/thunks"
 import { useAppDispatch, useAppSelector } from "app/store"
 import { setMobileMenuOpen } from "app/tree/slice"
 import { reloadTree } from "app/tree/thunks"
+import { setSidebarWidth } from "app/user/slice"
 import { reloadProfile, reloadSettings, reloadTags } from "app/user/thunks"
 import { ActionButton } from "components/ActionButton"
 import { AnnouncementDialog } from "components/AnnouncementDialog"
@@ -17,13 +18,12 @@ import { useBrowserExtension } from "hooks/useBrowserExtension"
 import { useMobile } from "hooks/useMobile"
 import { useWebSocket } from "hooks/useWebSocket"
 import { LoadingPage } from "pages/LoadingPage"
-import { type ReactNode, Suspense, useEffect } from "react"
+import { type ReactNode, type RefObject, Suspense, useEffect, useRef } from "react"
 import Draggable from "react-draggable"
 import { TbMenu2, TbPlus, TbX } from "react-icons/tb"
 import { Outlet } from "react-router-dom"
 import { useSwipeable } from "react-swipeable"
 import { tss } from "tss"
-import useLocalStorage from "use-local-storage"
 
 interface LayoutProps {
     sidebar: ReactNode
@@ -64,21 +64,24 @@ export default function Layout(props: LayoutProps) {
     const theme = useMantineTheme()
     const mobile = useMobile()
     const { isBrowserExtensionPopup } = useBrowserExtension()
-    const [sidebarWidth, setSidebarWidth] = useLocalStorage("sidebar-width", 350)
+    const draggableSeparator = useRef<HTMLDivElement>(null)
+
+    const { loading } = useAppLoading()
+    const mobileMenuOpen = useAppSelector(state => state.tree.mobileMenuOpen)
+    const webSocketConnected = useAppSelector(state => state.server.webSocketConnected)
+    const treeReloadInterval = useAppSelector(state => state.server.serverInfos?.treeReloadInterval)
+    const mobileFooter = useAppSelector(state => state.user.settings?.mobileFooter)
+    const sidebarWidth = useAppSelector(state => state.user.localSettings.sidebarWidth)
+    const headerInFooter = mobile && !isBrowserExtensionPopup && mobileFooter
+    const dispatch = useAppDispatch()
+    useWebSocket()
+
     const sidebarPadding = theme.spacing.xs
     const { classes } = useStyles({
         sidebarWidth,
         sidebarPadding,
         sidebarRightBorderWidth: "1px",
     })
-    const { loading } = useAppLoading()
-    const mobileMenuOpen = useAppSelector(state => state.tree.mobileMenuOpen)
-    const webSocketConnected = useAppSelector(state => state.server.webSocketConnected)
-    const treeReloadInterval = useAppSelector(state => state.server.serverInfos?.treeReloadInterval)
-    const mobileFooter = useAppSelector(state => state.user.settings?.mobileFooter)
-    const headerInFooter = mobile && !isBrowserExtensionPopup && mobileFooter
-    const dispatch = useAppDispatch()
-    useWebSocket()
 
     useEffect(() => {
         // load initial data
@@ -182,6 +185,7 @@ export default function Layout(props: LayoutProps) {
                 </AppShell.Navbar>
                 <OnDesktop>
                     <Draggable
+                        nodeRef={draggableSeparator as RefObject<HTMLElement>}
                         axis="x"
                         defaultPosition={{
                             x: sidebarWidth,
@@ -192,9 +196,13 @@ export default function Layout(props: LayoutProps) {
                             right: 1000,
                         }}
                         grid={[30, 30]}
-                        onDrag={(_e, data) => setSidebarWidth(data.x)}
+                        onDrag={(_e, data) => {
+                            dispatch(setSidebarWidth(data.x))
+                            return
+                        }}
                     >
                         <Box
+                            ref={draggableSeparator}
                             style={{
                                 position: "fixed",
                                 height: "100%",

commafeed-client/src/pages/app/SettingsPage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 import { Container, Tabs } from "@mantine/core"
 import { CustomCodeSettings } from "components/settings/CustomCodeSettings"
 import { DisplaySettings } from "components/settings/DisplaySettings"

commafeed-client/src/pages/app/TagDetailsPage.tsx

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans } from "@lingui/react/macro"
 
 import { Anchor, Box, Button, Container, Group, Input, Stack, Title } from "@mantine/core"
 import { Constants } from "app/constants"

commafeed-client/src/pages/auth/LoginPage.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Button, Center, Container, Group, Paper, PasswordInput, Stack, TextInput, Title } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/pages/auth/PasswordRecoveryPage.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Button, Center, Container, Group, Paper, Stack, TextInput, Title } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/pages/auth/RegistrationPage.tsx

@@ -1,5 +1,6 @@
-import { Trans, msg } from "@lingui/macro"
+import { msg } from "@lingui/core/macro"
 import { useLingui } from "@lingui/react"
+import { Trans } from "@lingui/react/macro"
 import { Anchor, Box, Button, Center, Container, Group, Paper, PasswordInput, Stack, TextInput, Title } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"

commafeed-client/src/setupTests.ts

@@ -0,0 +1,16 @@
+import "@testing-library/jest-dom"
+import { vi } from "vitest"
+
+Object.defineProperty(window, "matchMedia", {
+    writable: true,
+    value: vi.fn().mockImplementation(query => ({
+        matches: false,
+        media: query,
+        onchange: null,
+        addListener: vi.fn(), // deprecated
+        removeListener: vi.fn(), // deprecated
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+        dispatchEvent: vi.fn(),
+    })),
+})