release 5.3.2

chore(deps): update dependency com.microsoft.playwright:playwright to v1.48.0

.dockerignore

@@ -1,6 +1 @@
-# ignore everything
-*
-
-# allow only what we need
-!commafeed-server/target/commafeed.jar
-!commafeed-server/config.yml.example
+commafeed-client

.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/ISSUE_TEMPLATE/bug_report.md

@@ -25,7 +25,8 @@ If applicable, add screenshots to help explain your problem.
 
 **Environment (please complete the following information):**
 
-- CommaFeed version (or "commafeed.com"): 3.2.1
+- commafeed.com or self-hosted:
+- If self-hosted, CommaFeed version [e.g. 5.1.0 (a3dcb2c)]:
 - Browser [e.g. chrome, firefox]:
 - Device [e.g. desktop, mobile]:
 

.github/dependabot.yml

@@ -1,24 +0,0 @@
-version: 2
-updates:
-  - package-ecosystem: "maven"
-    directory: "/"
-    schedule:
-      interval: "weekly"
-    open-pull-requests-limit: 50
-  - package-ecosystem: "npm"
-    directory: "/commafeed-client"
-    schedule:
-      interval: "monthly"
-    open-pull-requests-limit: 50
-    groups:
-      mantine:
-        patterns:
-          - "@mantine/*"
-      lingui:
-        patterns:
-          - "@lingui/*"
-  - package-ecosystem: "github-actions"
-    directory: "/"
-    schedule:
-      interval: "weekly"
-    open-pull-requests-limit: 10

.github/workflows/build.yml

@@ -1,89 +0,0 @@
-name: Java CI
-
-on: [ push ]
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    strategy:
-      matrix:
-        java: [ "17", "21" ]
-
-    steps:
-      - 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 Java
-        uses: actions/setup-java@v4
-        with:
-          java-version: ${{ matrix.java }}
-          distribution: "temurin"
-          cache: "maven"
-
-      # Build
-      - name: Build with Maven
-        run: mvn --batch-mode --update-snapshots verify
-
-      - name: Upload JAR
-        uses: actions/upload-artifact@v4
-        if: ${{ matrix.java == '17' }}
-        with:
-          name: commafeed.jar
-          path: commafeed-server/target/commafeed.jar
-
-      # Docker
-      - name: Login to Container Registry
-        uses: docker/login-action@v3
-        if: ${{ matrix.java == '17' && (github.ref_type == 'tag' || github.ref_name == 'master') }}
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-
-      - name: Docker build and push tag
-        uses: docker/build-push-action@v5
-        if: ${{ matrix.java == '17' && github.ref_type == 'tag' }}
-        with:
-          context: .
-          push: true
-          platforms: linux/amd64,linux/arm/v7,linux/arm64/v8
-          tags: |
-            athou/commafeed:latest
-            athou/commafeed:${{ github.ref_name }}
-
-      - name: Docker build and push master
-        uses: docker/build-push-action@v5
-        if: ${{ matrix.java == '17' && github.ref_name == 'master' }}
-        with:
-          context: .
-          push: true
-          platforms: linux/amd64,linux/arm/v7,linux/arm64/v8
-          tags: athou/commafeed:master
-
-      # Create GitHub release after Docker image has been published
-      - name: Extract Changelog Entry
-        uses: mindsers/changelog-reader-action@v2
-        if: ${{ matrix.java == '17' && github.ref_type == 'tag' }}
-        id: changelog_reader
-        with:
-          version: ${{ github.ref_name }}
-
-      - name: Create GitHub release
-        uses: softprops/action-gh-release@v2
-        if: ${{ matrix.java == '17' && github.ref_type == 'tag' }}
-        with:
-          name: CommaFeed ${{ github.ref_name }}
-          body: ${{ steps.changelog_reader.outputs.changes }}
-          draft: false
-          prerelease: false
-          files: |
-            commafeed-server/target/commafeed.jar
-            commafeed-server/config.yml.example

.github/workflows/ci.yml

@@ -0,0 +1,183 @@
+name: ci
+
+on: [ push ]
+
+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
+    strategy:
+      matrix:
+        database: [ "h2", "postgresql", "mysql", "mariadb" ]
+
+    steps:
+      # Checkout
+      - name: Configure git to checkout as-is
+        run: git config --global core.autocrlf false
+
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      # Setup
+      - 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 }} -DskipTests=${{ matrix.database != 'h2' }}
+
+      # Upload artifacts
+      - name: Upload native executable
+        uses: actions/upload-artifact@v4
+        with:
+          name: commafeed-${{ matrix.database }}-${{ runner.os }}-${{ runner.arch }}
+          path: commafeed-server/target/commafeed-*-runner.exe
+
+  release:
+    runs-on: ubuntu-latest
+    needs:
+      - build-linux
+      - build-windows
+    if: github.ref_type == 'tag'
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Download artifacts
+        uses: actions/download-artifact@v4
+        with:
+          pattern: commafeed-*
+          path: ./artifacts
+          merge-multiple: true
+
+      - name: Extract Changelog Entry
+        uses: mindsers/changelog-reader-action@v2
+        id: changelog_reader
+        with:
+          version: ${{ github.ref_name }}
+
+      - name: Create GitHub release
+        uses: ncipollo/release-action@v1
+        with:
+          name: CommaFeed ${{ github.ref_name }}
+          body: ${{ steps.changelog_reader.outputs.changes }}
+          artifacts: ./artifacts/*
+
+      - name: Update Docker Hub Description
+        uses: peter-evans/dockerhub-description@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

.mvn/wrapper/maven-wrapper.properties

@@ -6,7 +6,7 @@
 # "License"); you may not use this file except in compliance
 # with the License.  You may obtain a copy of the License at
 #
-#   https://www.apache.org/licenses/LICENSE-2.0
+#   http://www.apache.org/licenses/LICENSE-2.0
 #
 # Unless required by applicable law or agreed to in writing,
 # software distributed under the License is distributed on an
@@ -14,5 +14,5 @@
 # KIND, either express or implied.  See the License for the
 # specific language governing permissions and limitations
 # under the License.
-distributionUrl=https://repo.maven.apache.org/maven2/org/apache/maven/apache-maven/3.8.3/apache-maven-3.8.3-bin.zip
-wrapperUrl=https://repo.maven.apache.org/maven2/org/apache/maven/wrapper/maven-wrapper/3.1.1/maven-wrapper-3.1.1.jar
+distributionType=only-script
+distributionUrl=https://repo.maven.apache.org/maven2/org/apache/maven/apache-maven/3.9.9/apache-maven-3.9.9-bin.zip

CHANGELOG.md

@@ -1,5 +1,100 @@
 # Changelog
 
+## [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)
+- When feeds without unread entries are hidden from the tree, the feed is displayed in the tree until another one is selected (#1543)
+
+## [5.1.0]
+
+- Added a setting for showing/hiding unread count in the browser's tab title/favicon (#1518)
+- Fixed an issue that could prevent the app from starting on some systems (#1532)
+- Added a cache busting filter for the webapp index.html and openapi documentation to make sure they are always up to date
+- Reduced database cleanup log verbosity
+
+## [5.0.2]
+
+- Fix favicon fetching for Youtube channels in native mode when Google auth key is set
+- Fix an error that appears in the logs when fetching some favicons
+
+## [5.0.1]
+
+- Configure native compilation to support older CPU architectures (#1524)
+
+## [5.0.0]
+
+CommaFeed is now powered by Quarkus instead of Dropwizard. Read the rationale behind this change in
+the [announcement](https://github.com/Athou/commafeed/discussions/1517).
+The gist of it is that CommaFeed can now be compiled to a native binary, resulting in blazing fast startup times (around
+0.3s) and very low memory footprint (< 50M).
+
+- CommaFeed now has a different package for each supported database.
+    - If you are deploying CommaFeed with a precompiled package, please
+      read [this section of the README](https://github.com/Athou/commafeed/tree/master?tab=readme-ov-file#download-a-precompiled-package).
+    - If you are building CommaFeed from sources, please
+      read [this section of the README](https://github.com/Athou/commafeed/tree/master?tab=readme-ov-file#build-from-sources).
+    - If you are using the Docker image, please read the instructions on
+      the [Docker Hub page](https://hub.docker.com/r/athou/commafeed).
+- Due to the switch to Quarkus, the way CommaFeed is configured is very different (the `config.yml` file is gone).
+  Please
+  read [this section of the README](https://github.com/Athou/commafeed/tree/master?tab=readme-ov-file#configuration).
+  Note that a lot of configuration elements have been removed or renamed and are now nested/grouped by feature.
+- Added a setting to prevent parsing large feeds to avoid out of memory errors. The default is 5MB.
+- Use a different icon for filtering unread entries and marking an entry as read (#1506)
+- Added various HTML attributes to ease custom JS/CSS customization (#1507)
+- The Redis cache has been removed. There have been multiple enhancements to the feed refresh engine and it is no longer
+  needed, even for instances with a large number of feeds.
+- The H2 migration tool that automatically upgrades H2 databases from format 2 to 3 has been removed. If you're using
+  the H2 embedded database, please upgrade to at least version 4.3.0 before upgrading to CommaFeed 5.0.0.
+
+## [4.6.0]
+
+- switched from Temurin to OpenJ9 as the JVM used in the Docker image, resulting in memory usage reduction by up to 50%
+- fix an issue that could cause old entries to reappear if they were updated by their author (#1486)
+- show all entries regardless of their read status when searching with keywords, even if the ui is configured to show
+  unread entries only
+
+## [4.5.0]
+
+- significantly reduce the time needed to retrieve entries or mark them as read, especially when there are a lot of
+  entries (#1452)
+- fix a race condition where a feed could be refreshed before it was created in the database
+- fix an issue that could cause the websocket notification to contain the wrong number of unread entries when using
+  mysql/mariadb
+- fix an error when trying to mark all starred entries as read
+- remove the `onlyIds` parameter from REST endpoints since retrieving all the entries is now just as fast
+- remove support for microsoft sqlserver because it's not covered with integration tests (please open an issue if you'd
+  like it back)
+
+## [4.4.1]
+
+- fix vertical scrolling issues with Safari (#1168)
+- the default value for new users for the "star entry" button and the "open in new tab" button in the entry headers is
+  now "on desktop" instead of "always"
+- the "keyboard shortcuts" help page now shows "Cmd" instead of "Ctrl" on macOS (#1389)
+- remove a superfluous feed fetch when subscribing to a feed (#1431)
+- the Docker image now uses Java 21
+
 ## [4.4.0]
 
 - add support for sharing using the browser native capabilities if available (#1255)

Dockerfile

@@ -1,12 +0,0 @@
-FROM eclipse-temurin:17-jre
-
-EXPOSE 8082
-
-RUN mkdir -p /commafeed/data
-VOLUME /commafeed/data
-
-COPY commafeed-server/config.yml.example config.yml
-COPY commafeed-server/target/commafeed.jar .
-
-ENV JAVA_TOOL_OPTIONS -Djava.net.preferIPv4Stack=true -Xms20m -XX:+UseG1GC -XX:-ShrinkHeapInSteps -XX:G1PeriodicGCInterval=10000 -XX:-G1PeriodicGCInvokesConcurrent -XX:MinHeapFreeRatio=5 -XX:MaxHeapFreeRatio=10
-CMD ["java", "-jar", "commafeed.jar", "server", "config.yml"]

README.md

@@ -1,6 +1,6 @@
 # CommaFeed
 
-Google Reader inspired self-hosted RSS reader, based on Dropwizard and React/TypeScript.
+Google Reader inspired self-hosted RSS reader, based on Quarkus and React/TypeScript.
 
 ![preview](https://user-images.githubusercontent.com/1256795/184886828-1973f148-58a9-4c6d-9587-ee5e5d3cc2cb.png)
 
@@ -8,14 +8,22 @@ Google Reader inspired self-hosted RSS reader, based on Dropwizard and React/Typ
 
 - 4 different layouts
 - Light/Dark theme
-- Fully responsive
+- Fully responsive, works great on both mobile and desktop
 - Keyboard shortcuts for almost everything
 - Support for right-to-left feeds
 - Translated in 25+ languages
 - Supports thousands of users and millions of feeds
 - OPML import/export
-- REST API and a Fever-compatible API for native mobile apps
+- REST API
+- Fever-compatible API for native mobile apps
+- Can automatically mark articles as read based on user-defined rules
 - [Browser extension](https://github.com/Athou/commafeed-browser-extension)
+- Compiles to native code for blazing fast startup and low memory usage
+- Supports 4 databases
+    - H2 (embedded database)
+    - PostgreSQL
+    - MySQL
+    - MariaDB
 
 ## Deployment
 
@@ -33,50 +41,112 @@ PikaPods shares 20% of the revenue back to CommaFeed.
 
 [![PikaPods](https://www.pikapods.com/static/run-button.svg)](https://www.pikapods.com/pods?run=commafeed)
 
-### Download precompiled package
+### Download a precompiled package
 
-    mkdir commafeed && cd commafeed
-    wget https://github.com/Athou/commafeed/releases/latest/download/commafeed.jar
-    wget https://github.com/Athou/commafeed/releases/latest/download/config.yml.example -O config.yml
-    java -Djava.net.preferIPv4Stack=true -jar commafeed.jar server config.yml
+Go to the [release page](https://github.com/Athou/commafeed/releases) and download the latest version for your operating
+system and database of choice.
 
-The server will listen on http://localhost:8082. The default
-user is `admin` and the default password is `admin`.
+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
+  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`.
+
+If available for your operating system, the native package is recommended because it has a faster startup time and lower
+memory usage.
 
 ### Build from sources
 
-    git clone https://github.com/Athou/commafeed.git
-    cd commafeed
-    ./mvnw clean package
-    cp commafeed-server/config.yml.example config.yml
-    java -Djava.net.preferIPv4Stack=true -jar commafeed-server/target/commafeed.jar server config.yml
+    ./mvnw clean package [-P<database>] [-Pnative] [-DskipTests]
 
-The server will listen on http://localhost:8082. The default
-user is `admin` and the default password is `admin`.
+- `<database>` can be one of `h2`, `postgresql`, `mysql` or `mariadb`. The default is `h2`.
+- `-Pnative` compiles the application to native code. This requires GraalVM to be installed (`GRAALVM_HOME` environment
+  variable pointing to a GraalVM installation).
+- `-DskipTests` to speed up the build process by skipping tests.
+
+When the build is complete:
+
+- a zip containing all jars required to run the application is located at
+  `commafeed-server/target/commafeed-<version>-<database>-jvm.zip`. Extract it and run the application with
+  `java -jar quarkus-run.jar`
+- if you used the native profile, the executable is located at
+  `commafeed-server/target/commafeed-<version>-<database>-<platform>-<arch>-runner[.exe]`
+
+## Configuration
+
+CommaFeed doesn't require any configuration to run with its embedded database (H2). The database file will be stored in
+the `data` directory of the current directory.
+
+To use a different database, you will need to configure the following properties:
+
+- `quarkus.datasource.jdbc.url`
+    - e.g. for H2: `jdbc:h2:./data/db;DEFRAG_ALWAYS=TRUE`
+    - e.g. for PostgreSQL: `jdbc:postgresql://localhost:5432/commafeed`
+    - e.g. for MySQL:
+      `jdbc:mysql://localhost/commafeed?autoReconnect=true&failOverReadOnly=false&maxReconnects=20&rewriteBatchedStatements=true&timezone=UTC`
+    - e.g. for MariaDB:
+      `jdbc:mariadb://localhost/commafeed?autoReconnect=true&failOverReadOnly=false&maxReconnects=20&rewriteBatchedStatements=true&timezone=UTC`
+- `quarkus.datasource.username`
+- `quarkus.datasource.password`
+
+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)
+- 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.
+
+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
+`quarkus.http.auth.session.encryption-key` property to a fixed value (min. 16 characters).
+All other Quarkus settings can be found [here](https://quarkus.io/guides/all-config).
+
+When started, the server will listen on http://localhost:8082.
+The default user is `admin` and the default password is `admin`.
+
+### Updates
+
+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
 
 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.
-However, this can be problematic on systems with limited memory.
+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)
 
-The JVM can be configured to release unused memory to the operating system with the following parameters:
+In addition to the previous setting, the JVM can be configured to release unused memory to the operating system with the
+following parameters:
 
-    -Xms20m -XX:+UseG1GC -XX:-ShrinkHeapInSteps -XX:G1PeriodicGCInterval=10000 -XX:-G1PeriodicGCInvokesConcurrent -XX:MinHeapFreeRatio=5 -XX:MaxHeapFreeRatio=10
+    -Xms20m -XX:+UseG1GC -XX:+UseStringDeduplication -XX:-ShrinkHeapInSteps -XX:G1PeriodicGCInterval=10000 -XX:-G1PeriodicGCInvokesConcurrent -XX:MinHeapFreeRatio=5 -XX:MaxHeapFreeRatio=10
 
-This is how the Docker image is configured.
 See [here](https://docs.oracle.com/en/java/javase/17/gctuning/garbage-first-g1-garbage-collector1.html)
 and [here](https://docs.oracle.com/en/java/javase/17/gctuning/factors-affecting-garbage-collection-performance.html) for
 more
 information.
 
+#### 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.
+
+IBM provides precompiled binaries for OpenJ9
+named [Semeru](https://developer.ibm.com/languages/java/semeru-runtimes/downloads/).
+This is the JVM used in
+the [Docker image](https://github.com/Athou/commafeed/blob/master/commafeed-server/src/main/docker/Dockerfile.jvm).
+
 ## Translation
 
 Files for internationalization are
@@ -99,7 +169,7 @@ two-letters [ISO-639-1 language code](http://en.wikipedia.org/wiki/List_of_ISO_6
 
 - Open `commafeed-server` in your preferred Java IDE.
     - CommaFeed uses Lombok, you need the Lombok plugin for your IDE.
-- Start `CommaFeedApplication.java` in debug mode with `server config.dev.yml` as arguments
+- run `./mvnw quarkus:dev`
 
 ### Frontend
 

commafeed-client/.eslintignore

@@ -1,8 +0,0 @@
-dist
-node_modules
-
-vite.config.ts
-
-# compiled linguijs locales
-# they no longer exist but we keep this to avoid issues with people still having those files on disk
-src/locales/**/*.ts

commafeed-client/.eslintrc.cjs

@@ -1,52 +0,0 @@
-module.exports = {
-    env: {
-        browser: true,
-        es2021: true,
-    },
-    extends: [
-        "eslint:recommended",
-        "standard",
-        "love",
-        "plugin:@typescript-eslint/strict-type-checked",
-        "plugin:@typescript-eslint/stylistic-type-checked",
-        "plugin:react/recommended",
-        "plugin:react-hooks/recommended",
-        "plugin:prettier/recommended",
-    ],
-    settings: {
-        react: {
-            version: "detect",
-        },
-    },
-    overrides: [
-        {
-            env: {
-                node: true,
-            },
-            files: [".eslintrc.{js,cjs}"],
-            parserOptions: {
-                sourceType: "script",
-            },
-        },
-    ],
-    parserOptions: {
-        project: true,
-        ecmaVersion: "latest",
-        sourceType: "module",
-    },
-    plugins: ["react"],
-    rules: {
-        "@typescript-eslint/consistent-type-assertions": ["error", { assertionStyle: "as" }],
-        "@typescript-eslint/explicit-function-return-type": "off",
-        "@typescript-eslint/no-confusing-void-expression": ["error", { ignoreArrowShorthand: true }],
-        "@typescript-eslint/no-floating-promises": "off",
-        "@typescript-eslint/no-misused-promises": "off",
-        "@typescript-eslint/prefer-nullish-coalescing": ["error", { ignoreConditionalTests: true }],
-        "@typescript-eslint/restrict-template-expressions": ["error", { allowNumber: true }],
-        "@typescript-eslint/strict-boolean-expressions": "off",
-        "react/jsx-curly-brace-presence": ["error", "never"],
-        "react/no-unescaped-entities": "off",
-        "react/react-in-jsx-scope": "off",
-        "react-hooks/exhaustive-deps": "error",
-    },
-}

commafeed-client/.linguirc

@@ -1,52 +0,0 @@
-{
-    "locales": [
-        "ar",
-        "ca",
-        "cs",
-        "cy",
-        "da",
-        "de",
-        "en",
-        "es",
-        "fa",
-        "fi",
-        "fr",
-        "gl",
-        "hu",
-        "id",
-        "it",
-        "ja",
-        "ko",
-        "ms",
-        "nb",
-        "nl",
-        "nn",
-        "pl",
-        "pt",
-        "ru",
-        "sk",
-        "sv",
-        "tr",
-        "zh"
-    ],
-    "catalogs": [
-        {
-            "path": "src/locales/{locale}/messages",
-            "include": [
-                "src"
-            ],
-            "exclude": [
-                "src/locales/**"
-            ]
-        }
-    ],
-    "format": "po",
-    "formatOptions": {
-        "origins": true,
-        "lineNumbers": false
-    },
-    "sourceLocale": "en",
-    "fallbackLocales": {
-        "default": "en"
-    }
-}

commafeed-client/.prettierrc

@@ -1,8 +0,0 @@
-{
-    "printWidth": 140,
-    "semi": false,
-    "tabWidth": 4,
-    "arrowParens": "avoid",
-    "endOfLine": "auto",
-    "trailingComma": "es5"
-}

commafeed-client/biome.json

@@ -0,0 +1,19 @@
+{
+    "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
+    "formatter": {
+        "indentStyle": "space",
+        "indentWidth": 4,
+        "lineEnding": "lf",
+        "lineWidth": 140
+    },
+    "javascript": {
+        "formatter": {
+            "trailingCommas": "es5",
+            "semicolons": "asNeeded",
+            "arrowParentheses": "asNeeded"
+        }
+    },
+    "files": {
+        "ignore": ["dist", "node_modules", "target", "target-ide"]
+    }
+}

commafeed-client/lingui.config.ts

@@ -0,0 +1,52 @@
+import type { LinguiConfig } from "@lingui/conf"
+
+const config: LinguiConfig = {
+    locales: [
+        "ar",
+        "ca",
+        "cs",
+        "cy",
+        "da",
+        "de",
+        "en",
+        "es",
+        "fa",
+        "fi",
+        "fr",
+        "gl",
+        "hu",
+        "id",
+        "it",
+        "ja",
+        "ko",
+        "ms",
+        "nb",
+        "nl",
+        "nn",
+        "pl",
+        "pt",
+        "ru",
+        "sk",
+        "sv",
+        "tr",
+        "zh",
+    ],
+    catalogs: [
+        {
+            path: "src/locales/{locale}/messages",
+            include: ["src"],
+            exclude: ["src/locales/**"],
+        },
+    ],
+    format: "po",
+    formatOptions: {
+        origins: true,
+        lineNumbers: false,
+    },
+    sourceLocale: "en",
+    fallbackLocales: {
+        default: "en",
+    },
+}
+
+export default config

commafeed-client/package.json

@@ -10,74 +10,71 @@
         "preview": "vite preview",
         "test": "vitest",
         "test:ci": "vitest run",
-    "eslint": "eslint --ext=.js,.jsx,.ts,.tsx src",
+        "lint": "biome check ./src",
+        "lint:fix": "biome check --write ./src",
         "i18n:extract": "lingui extract --clean"
     },
     "dependencies": {
-    "@emotion/react": "^11.11.4",
-    "@fontsource/open-sans": "^5.0.27",
-    "@lingui/core": "^4.10.0",
-    "@lingui/macro": "^4.10.0",
-    "@lingui/react": "^4.10.0",
-    "@mantine/core": "^7.8.0",
-    "@mantine/form": "^7.8.0",
-    "@mantine/hooks": "^7.8.0",
-    "@mantine/modals": "^7.8.0",
-    "@mantine/notifications": "^7.8.0",
-    "@mantine/spotlight": "^7.8.0",
+        "@emotion/react": "^11.13.3",
+        "@fontsource/open-sans": "^5.1.0",
+        "@lingui/core": "^4.13.0",
+        "@lingui/macro": "^4.13.0",
+        "@lingui/react": "^4.13.0",
+        "@mantine/core": "^7.13.3",
+        "@mantine/form": "^7.13.3",
+        "@mantine/hooks": "^7.13.3",
+        "@mantine/modals": "^7.13.3",
+        "@mantine/notifications": "^7.13.3",
+        "@mantine/spotlight": "^7.13.3",
         "@monaco-editor/react": "^4.6.0",
-    "@reduxjs/toolkit": "^2.2.3",
-    "axios": "^1.6.8",
-    "dayjs": "^1.11.10",
+        "@reduxjs/toolkit": "^2.3.0",
+        "axios": "^1.7.7",
+        "dayjs": "^1.11.13",
         "escape-string-regexp": "^5.0.0",
         "interweave": "^13.1.0",
-    "monaco-editor": "^0.47.0",
+        "monaco-editor": "^0.52.0",
         "mousetrap": "^1.6.5",
-    "react": "^18.2.0",
+        "react": "^18.3.1",
         "react-async-hook": "^4.0.0",
         "react-contexify": "^6.0.0",
-    "react-dom": "^18.2.0",
+        "react-device-detect": "^2.2.3",
+        "react-dom": "^18.3.1",
         "react-draggable": "^4.4.6",
         "react-ga4": "^2.1.0",
-    "react-icons": "^5.0.1",
+        "react-helmet": "^6.1.0",
+        "react-icons": "^5.3.0",
         "react-infinite-scroller": "^1.2.6",
-    "react-redux": "^9.1.0",
-    "react-router-dom": "^6.22.3",
+        "react-redux": "^9.1.2",
+        "react-router-dom": "^6.27.0",
         "react-swipeable": "^7.0.1",
-    "redoc": "^2.1.3",
-    "throttle-debounce": "^5.0.0",
+        "redoc": "^2.2.0",
+        "style-to-object": "^1.0.8",
+        "throttle-debounce": "^5.0.2",
         "tinycon": "^0.6.8",
-    "tss-react": "^4.9.6",
-    "use-local-storage": "^3.0.0",
+        "tss-react": "^4.9.13",
         "websocket-heartbeat-js": "^1.1.3"
     },
     "devDependencies": {
-    "@lingui/cli": "^4.10.0",
-    "@lingui/vite-plugin": "^4.10.0",
+        "@biomejs/biome": "^1.9.4",
+        "@lingui/cli": "^4.13.0",
+        "@lingui/vite-plugin": "^4.13.0",
         "@types/mousetrap": "^1.6.15",
-    "@types/react": "^18.2.78",
-    "@types/react-dom": "^18.2.25",
+        "@types/react": "^18.3.11",
+        "@types/react-dom": "^18.3.1",
+        "@types/react-helmet": "^6.1.11",
         "@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",
-    "@typescript-eslint/eslint-plugin": "^7.6.0",
-    "@vitejs/plugin-react": "^4.2.1",
+        "@vitejs/plugin-react": "^4.3.3",
         "babel-plugin-macros": "^3.1.0",
-    "eslint": "^8.57.0",
-    "eslint-config-love": "^47.0.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-config-standard": "^17.1.0",
-    "eslint-plugin-prettier": "^5.1.3",
-    "eslint-plugin-react": "^7.34.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "prettier": "^3.2.5",
+        "jsdom": "^25.0.1",
         "rollup-plugin-visualizer": "^5.12.0",
-    "typescript": "^5.4.5",
-    "vite": "^5.2.8",
-    "vite-plugin-eslint": "^1.8.1",
-    "vite-tsconfig-paths": "^4.3.2",
-    "vitest": "^1.5.0",
-    "vitest-mock-extended": "^1.3.1"
+        "typescript": "^5.6.3",
+        "vite": "^5.4.9",
+        "vite-plugin-checker": "^0.8.0",
+        "vite-tsconfig-paths": "^5.0.1",
+        "vitest": "^2.1.3",
+        "vitest-mock-extended": "^2.0.2"
     }
 }

commafeed-client/pom.xml

@@ -1,21 +1,29 @@
-<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
+<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+		 xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
 
 	<modelVersion>4.0.0</modelVersion>
 
 	<parent>
 		<groupId>com.commafeed</groupId>
 		<artifactId>commafeed</artifactId>
-		<version>4.4.0</version>
+		<version>5.3.2</version>
 	</parent>
 	<artifactId>commafeed-client</artifactId>
 	<name>CommaFeed Client</name>
 
+	<properties>
+		<!-- renovate: datasource=node-version depName=node -->
+		<node.version>v20.18.0</node.version>
+		<!-- renovate: datasource=npm depName=npm -->
+		<npm.version>10.9.0</npm.version>
+	</properties>
+
 	<build>
 		<plugins>
 			<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>
@@ -25,8 +33,8 @@
 						</goals>
 						<phase>compile</phase>
 						<configuration>
-							<nodeVersion>v20.10.0</nodeVersion>
-							<npmVersion>10.2.5</npmVersion>
+							<nodeVersion>${node.version}</nodeVersion>
+							<npmVersion>${npm.version}</npmVersion>
 						</configuration>
 					</execution>
 					<execution>
@@ -72,7 +80,7 @@
 							<goal>copy-resources</goal>
 						</goals>
 						<configuration>
-							<outputDirectory>${project.build.directory}/classes/assets</outputDirectory>
+							<outputDirectory>${project.build.directory}/classes/META-INF/resources</outputDirectory>
 							<resources>
 								<resource>
 									<directory>dist</directory>

commafeed-client/src/App.tsx

@@ -1,7 +1,6 @@
 import { i18n } from "@lingui/core"
 import { I18nProvider } from "@lingui/react"
 import { MantineProvider } from "@mantine/core"
-import { useDidUpdate } from "@mantine/hooks"
 import { ModalsProvider } from "@mantine/modals"
 import { Notifications } from "@mantine/notifications"
 import { Constants } from "app/constants"
@@ -9,11 +8,13 @@ import { redirectTo } from "app/redirect/slice"
 import { reloadServerInfos } from "app/server/thunks"
 import { useAppDispatch, useAppSelector } from "app/store"
 import { categoryUnreadCount } from "app/utils"
+import { DisablePullToRefresh } from "components/DisablePullToRefresh"
 import { ErrorBoundary } from "components/ErrorBoundary"
 import { Header } from "components/header/Header"
 import { Tree } from "components/sidebar/Tree"
 import { useBrowserExtension } from "hooks/useBrowserExtension"
 import { useI18n } from "i18n"
+import { WelcomePage } from "pages/WelcomePage"
 import { AdminUsersPage } from "pages/admin/AdminUsersPage"
 import { MetricsPage } from "pages/admin/MetricsPage"
 import { AboutPage } from "pages/app/AboutPage"
@@ -28,9 +29,10 @@ import { TagDetailsPage } from "pages/app/TagDetailsPage"
 import { LoginPage } from "pages/auth/LoginPage"
 import { PasswordRecoveryPage } from "pages/auth/PasswordRecoveryPage"
 import { RegistrationPage } from "pages/auth/RegistrationPage"
-import { WelcomePage } from "pages/WelcomePage"
-import React, { useEffect, useRef } from "react"
+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"
 
@@ -69,7 +71,7 @@ function Providers(props: { children: React.ReactNode }) {
     )
 }
 
-// swagger-ui is very large, load only on-demand
+// api documentation page is very large, load only on-demand
 const ApiDocumentationPage = React.lazy(async () => await import("pages/app/ApiDocumentationPage"))
 
 function AppRoutes() {
@@ -140,16 +142,18 @@ function GoogleAnalyticsHandler() {
     return null
 }
 
-function FaviconHandler() {
-    const root = useAppSelector(state => state.tree.rootCategory)
+function UnreadCountTitleHandler({ unreadCount, enabled }: { unreadCount: number; enabled?: boolean }) {
+    return <Helmet title={enabled && unreadCount > 0 ? `(${unreadCount}) CommaFeed` : "CommaFeed"} />
+}
+
+function UnreadCountFaviconHandler({ unreadCount, enabled }: { unreadCount: number; enabled?: boolean }) {
     useEffect(() => {
-        const unreadCount = categoryUnreadCount(root)
-        if (unreadCount === 0) {
-            Tinycon.reset()
-        } else {
+        if (enabled && unreadCount > 0) {
             Tinycon.setBubble(unreadCount)
+        } else {
+            Tinycon.reset()
         }
-    }, [root])
+    }, [unreadCount, enabled])
 
     return null
 }
@@ -166,44 +170,24 @@ function BrowserExtensionBadgeUnreadCountHandler() {
     return null
 }
 
-function CustomJs() {
-    const scriptLoaded = useRef(false)
-
-    // useDidUpdate is used instead of useEffect because we want to skip the first render
-    // the first render is the render of react-router, the routes are actually loaded in a second render
-    // we want the script to be executed when the first route is done loading
-    useDidUpdate(() => {
-        if (scriptLoaded.current) {
-            return
-        }
-
-        const script = document.createElement("script")
-        script.src = "custom_js.js"
-        script.async = true
-        document.body.appendChild(script)
-
-        scriptLoaded.current = true
-    })
-
-    return null
-}
-
-function CustomCss() {
-    useEffect(() => {
-        const link = document.createElement("link")
-        link.rel = "stylesheet"
-        link.type = "text/css"
-        link.href = "custom_css.css"
-        document.head.appendChild(link)
-    }, [])
-
-    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)
+    const unreadCountTitle = useAppSelector(state => state.user.settings?.unreadCountTitle)
+    const unreadCountFavicon = useAppSelector(state => state.user.settings?.unreadCountFavicon)
     const dispatch = useAppDispatch()
 
+    const unreadCount = categoryUnreadCount(root)
+
     useEffect(() => {
         dispatch(reloadServerInfos())
     }, [dispatch])
@@ -211,14 +195,19 @@ export function App() {
     return (
         <Providers>
             <>
-                <FaviconHandler />
+                <UnreadCountTitleHandler unreadCount={unreadCount} enabled={unreadCountTitle} />
+                <UnreadCountFaviconHandler unreadCount={unreadCount} enabled={unreadCountFavicon} />
                 <BrowserExtensionBadgeUnreadCountHandler />
                 <HashRouter>
                     <GoogleAnalyticsHandler />
                     <RedirectHandler />
                     <AppRoutes />
-                    <CustomJs />
-                    <CustomCss />
+                    <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
+                    */}
+                    {!isSafari && <DisablePullToRefresh />}
                 </HashRouter>
             </>
         </Providers>

commafeed-client/src/app/async-thunk.ts

@@ -1,5 +1,5 @@
 import { createAsyncThunk } from "@reduxjs/toolkit"
-import { type AppDispatch, type RootState } from "app/store"
+import type { AppDispatch, RootState } from "app/store"
 
 export const createAppAsyncThunk = createAsyncThunk.withTypes<{
     state: RootState

commafeed-client/src/app/client.ts

@@ -1,31 +1,31 @@
 import axios, { type AxiosError } from "axios"
-import {
-    type AddCategoryRequest,
-    type AdminSaveUserRequest,
-    type AuthenticationError,
-    type Category,
-    type CategoryModificationRequest,
-    type CollapseRequest,
-    type Entries,
-    type FeedInfo,
-    type FeedInfoRequest,
-    type FeedModificationRequest,
-    type GetEntriesPaginatedRequest,
-    type IDRequest,
-    type LoginRequest,
-    type MarkRequest,
-    type Metrics,
-    type MultipleMarkRequest,
-    type PasswordResetRequest,
-    type ProfileModificationRequest,
-    type RegistrationRequest,
-    type ServerInfo,
-    type Settings,
-    type StarRequest,
-    type SubscribeRequest,
-    type Subscription,
-    type TagRequest,
-    type UserModel,
+import type {
+    AddCategoryRequest,
+    AdminSaveUserRequest,
+    AuthenticationError,
+    Category,
+    CategoryModificationRequest,
+    CollapseRequest,
+    Entries,
+    FeedInfo,
+    FeedInfoRequest,
+    FeedModificationRequest,
+    GetEntriesPaginatedRequest,
+    IDRequest,
+    LoginRequest,
+    MarkRequest,
+    Metrics,
+    MultipleMarkRequest,
+    PasswordResetRequest,
+    ProfileModificationRequest,
+    RegistrationRequest,
+    ServerInfo,
+    Settings,
+    StarRequest,
+    SubscribeRequest,
+    Subscription,
+    TagRequest,
+    UserModel,
 } from "./types"
 
 const axiosInstance = axios.create({ baseURL: "./rest", withCredentials: true })
@@ -81,7 +81,17 @@ export const client = {
         },
     },
     user: {
-        login: async (req: LoginRequest) => await axiosInstance.post("user/login", req),
+        login: async (req: LoginRequest) => {
+            const formData = new URLSearchParams()
+            formData.append("j_username", req.name)
+            formData.append("j_password", req.password)
+            return await axiosInstance.post("j_security_check", formData, {
+                baseURL: ".",
+                headers: {
+                    "Content-Type": "application/x-www-form-urlencoded",
+                },
+            })
+        },
         register: async (req: RegistrationRequest) => await axiosInstance.post("user/register", req),
         passwordReset: async (req: PasswordResetRequest) => await axiosInstance.post("user/passwordReset", req),
         getSettings: async () => await axiosInstance.get<Settings>("user/settings"),

commafeed-client/src/app/constants.ts

@@ -1,8 +1,8 @@
 import { t } from "@lingui/macro"
-import { type IconType } from "react-icons"
+import type { IconType } from "react-icons"
 import { FaAt } from "react-icons/fa"
-import { SiBuffer, SiFacebook, SiGmail, SiInstapaper, SiPocket, SiTumblr, SiTwitter } from "react-icons/si"
-import { type Category, type Entry, type SharingSettings } from "./types"
+import { SiBuffer, SiFacebook, SiGmail, SiInstapaper, SiPocket, SiTumblr, SiX } from "react-icons/si"
+import type { Category, Entry, SharingSettings } from "./types"
 
 const categories: Record<string, Category> = {
     all: {
@@ -50,10 +50,10 @@ const sharing: {
         url: url => `https://www.facebook.com/sharer/sharer.php?u=${url}`,
     },
     twitter: {
-        label: "Twitter",
-        icon: SiTwitter,
-        color: "#1D9BF0",
-        url: (url, desc) => `https://twitter.com/share?text=${desc}&url=${url}`,
+        label: "X",
+        icon: SiX,
+        color: "#000000",
+        url: (url, desc) => `https://x.com/share?text=${desc}&url=${url}`,
     },
     tumblr: {
         label: "Tumblr",

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

@@ -1,11 +1,11 @@
 import { configureStore } from "@reduxjs/toolkit"
-import { type client } from "app/client"
+import type { client } from "app/client"
 import { loadEntries, loadMoreEntries, markAllEntries, markEntry } from "app/entries/thunks"
-import { reducers, type RootState } from "app/store"
-import { type Entries, type Entry } from "app/types"
-import { type AxiosResponse } from "axios"
+import { type RootState, reducers } from "app/store"
+import type { Entries, Entry } from "app/types"
+import type { AxiosResponse } from "axios"
 import { beforeEach, describe, expect, it, vi } from "vitest"
-import { mockReset } from "vitest-mock-extended"
+import { any, mockReset } from "vitest-mock-extended"
 
 const mockClient = await vi.hoisted(async () => {
     const mockModule = await import("vitest-mock-extended")
@@ -19,7 +19,7 @@ describe("entries", () => {
     })
 
     it("loads entries", async () => {
-        mockClient.feed.getEntries.mockResolvedValue({
+        mockClient.feed.getEntries.calledWith(any()).mockResolvedValue({
             data: {
                 entries: [{ id: "3" } as Entry],
                 hasMore: false,
@@ -53,7 +53,7 @@ describe("entries", () => {
     })
 
     it("loads more entries", async () => {
-        mockClient.category.getEntries.mockResolvedValue({
+        mockClient.category.getEntries.calledWith(any()).mockResolvedValue({
             data: {
                 entries: [{ id: "4" } as Entry],
                 hasMore: false,

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

@@ -1,7 +1,7 @@
-import { createSlice, type PayloadAction } from "@reduxjs/toolkit"
+import { type PayloadAction, createSlice } from "@reduxjs/toolkit"
 import { Constants } from "app/constants"
 import { loadEntries, loadMoreEntries, markAllEntries, markEntry, markMultipleEntries, starEntry, tagEntry } from "app/entries/thunks"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
 
 export type EntrySourceType = "category" | "feed" | "tag"
 
@@ -51,11 +51,9 @@ export const entriesSlice = createSlice({
             state.selectedEntryId = action.payload.id
         },
         setEntryExpanded: (state, action: PayloadAction<{ entry: Entry; expanded: boolean }>) => {
-            state.entries
-                .filter(e => e.id === action.payload.entry.id)
-                .forEach(e => {
+            for (const e of state.entries.filter(e => e.id === action.payload.entry.id)) {
                 e.expanded = action.payload.expanded
-                })
+            }
         },
         setScrollingToEntry: (state, action: PayloadAction<boolean>) => {
             state.scrollingToEntry = action.payload
@@ -66,32 +64,24 @@ export const entriesSlice = createSlice({
     },
     extraReducers: builder => {
         builder.addCase(markEntry.pending, (state, action) => {
-            state.entries
-                .filter(e => e.id === action.meta.arg.entry.id)
-                .forEach(e => {
+            for (const e of state.entries.filter(e => e.id === action.meta.arg.entry.id)) {
                 e.read = action.meta.arg.read
-                })
+            }
         })
         builder.addCase(markMultipleEntries.pending, (state, action) => {
-            state.entries
-                .filter(e => action.meta.arg.entries.some(e2 => e2.id === e.id))
-                .forEach(e => {
+            for (const e of state.entries.filter(e => action.meta.arg.entries.some(e2 => e2.id === e.id))) {
                 e.read = action.meta.arg.read
-                })
+            }
         })
         builder.addCase(markAllEntries.pending, (state, action) => {
-            state.entries
-                .filter(e => (action.meta.arg.req.olderThan ? e.date < action.meta.arg.req.olderThan : true))
-                .forEach(e => {
+            for (const e of state.entries.filter(e => (action.meta.arg.req.olderThan ? e.date < action.meta.arg.req.olderThan : true))) {
                 e.read = true
-                })
+            }
         })
         builder.addCase(starEntry.pending, (state, action) => {
-            state.entries
-                .filter(e => action.meta.arg.entry.id === e.id && action.meta.arg.entry.feedId === e.feedId)
-                .forEach(e => {
+            for (const e of state.entries.filter(e => action.meta.arg.entry.id === e.id && action.meta.arg.entry.feedId === e.feedId)) {
                 e.starred = action.meta.arg.starred
-                })
+            }
         })
         builder.addCase(loadEntries.pending, (state, action) => {
             state.source = action.meta.arg.source
@@ -122,11 +112,9 @@ export const entriesSlice = createSlice({
             state.loading = false
         })
         builder.addCase(tagEntry.pending, (state, action) => {
-            state.entries
-                .filter(e => +e.id === action.meta.arg.entryId)
-                .forEach(e => {
+            for (const e of state.entries.filter(e => +e.id === action.meta.arg.entryId)) {
                 e.tags = action.meta.arg.tags
-                })
+            }
         })
     },
 })

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

@@ -1,7 +1,7 @@
 import { createAppAsyncThunk } from "app/async-thunk"
 import { client } from "app/client"
 import { Constants } from "app/constants"
-import { entriesSlice, type EntrySource, type EntrySourceType, setSearch } from "app/entries/slice"
+import { type EntrySource, type EntrySourceType, entriesSlice, setSearch } from "app/entries/slice"
 import type { RootState } from "app/store"
 import { reloadTree } from "app/tree/thunks"
 import type { Entry, MarkRequest, TagRequest } from "app/types"
@@ -40,7 +40,7 @@ export const loadMoreEntries = createAppAsyncThunk("entries/loadMore", async (_,
 const buildGetEntriesPaginatedRequest = (state: RootState, source: EntrySource, offset: number) => ({
     id: source.type === "tag" ? Constants.categories.all.id : source.id,
     order: state.user.settings?.readingOrder,
-    readType: state.user.settings?.readingMode,
+    readType: state.entries.search ? "all" : state.user.settings?.readingMode,
     offset,
     limit: 50,
     tag: source.type === "tag" ? source.id : undefined,
@@ -166,22 +166,34 @@ 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,
@@ -218,7 +230,7 @@ export const selectPreviousEntry = createAppAsyncThunk(
 )
 export const selectNextEntry = createAppAsyncThunk(
     "entries/entry/selectNext",
-    (
+    async (
         arg: {
             expand: boolean
             markAsRead: boolean
@@ -227,12 +239,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,

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

@@ -1,4 +1,4 @@
-import { createSlice, type PayloadAction } from "@reduxjs/toolkit"
+import { type PayloadAction, createSlice } from "@reduxjs/toolkit"
 
 interface RedirectState {
     to?: string

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

@@ -1,6 +1,6 @@
-import { createSlice, type PayloadAction } from "@reduxjs/toolkit"
+import { type PayloadAction, createSlice } from "@reduxjs/toolkit"
 import { reloadServerInfos } from "app/server/thunks"
-import { type ServerInfo } from "app/types"
+import type { ServerInfo } from "app/types"
 
 interface ServerState {
     serverInfos?: ServerInfo

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/slice.ts

@@ -1,8 +1,8 @@
-import { createSlice, type PayloadAction } from "@reduxjs/toolkit"
+import { type PayloadAction, createSlice } from "@reduxjs/toolkit"
 import { markEntry } from "app/entries/thunks"
 import { redirectTo } from "app/redirect/slice"
 import { collapseTreeCategory, reloadTree } from "app/tree/thunks"
-import { type Category } from "app/types"
+import type { Category } from "app/types"
 import { visitCategoryTree } from "app/utils"
 
 interface TreeState {
@@ -34,13 +34,11 @@ export const treeSlice = createSlice({
             }>
         ) => {
             if (!state.rootCategory) return
-            visitCategoryTree(state.rootCategory, c =>
-                c.feeds
-                    .filter(f => f.id === action.payload.feedId)
-                    .forEach(f => {
+            visitCategoryTree(state.rootCategory, c => {
+                for (const f of c.feeds.filter(f => f.id === action.payload.feedId)) {
                     f.unread += action.payload.amount
+                }
             })
-            )
         },
     },
     extraReducers: builder => {
@@ -55,13 +53,11 @@ export const treeSlice = createSlice({
         })
         builder.addCase(markEntry.pending, (state, action) => {
             if (!state.rootCategory) return
-            visitCategoryTree(state.rootCategory, c =>
-                c.feeds
-                    .filter(f => f.id === +action.meta.arg.entry.feedId)
-                    .forEach(f => {
+            visitCategoryTree(state.rootCategory, c => {
+                for (const f of c.feeds.filter(f => f.id === +action.meta.arg.entry.feedId)) {
                     f.unread = action.meta.arg.read ? f.unread - 1 : f.unread + 1
+                }
             })
-            )
         })
         builder.addCase(redirectTo, state => {
             state.mobileMenuOpen = false

commafeed-client/src/app/types.ts

@@ -117,7 +117,6 @@ export interface GetEntriesRequest {
     newerThan?: number
     order?: ReadingOrder
     keywords?: string
-    onlyIds?: boolean
     excludedSubscriptionIds?: string
     tag?: string
 }
@@ -221,6 +220,7 @@ export interface ServerInfo {
     websocketEnabled: boolean
     websocketPingInterval: number
     treeReloadInterval: number
+    forceRefreshCooldownDuration: number
 }
 
 export interface SharingSettings {
@@ -244,14 +244,23 @@ export interface Settings {
     customJs?: string
     scrollSpeed: number
     scrollMode: ScrollMode
+    entriesToKeepOnTopWhenScrolling: number
     starIconDisplayMode: IconDisplayMode
     externalLinkIconDisplayMode: IconDisplayMode
     markAllAsReadConfirmation: boolean
     customContextMenu: boolean
     mobileFooter: boolean
+    unreadCountTitle: boolean
+    unreadCountFavicon: boolean
     sharingSettings: SharingSettings
 }
 
+export interface LocalSettings {
+    viewMode: ViewMode
+    sidebarWidth: number
+    announcementHash: string
+}
+
 export interface StarRequest {
     id: string
     feedId: number
@@ -279,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 { showNotification } from "@mantine/notifications"
-import { createSlice, isAnyOf } from "@reduxjs/toolkit"
-import { type Settings, type 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,
@@ -16,6 +17,8 @@ import {
     changeSharingSetting,
     changeShowRead,
     changeStarIconDisplayMode,
+    changeUnreadCountFavicon,
+    changeUnreadCountTitle,
     reloadProfile,
     reloadSettings,
     reloadTags,
@@ -23,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
@@ -71,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
@@ -91,6 +117,14 @@ export const userSlice = createSlice({
             if (!state.settings) return
             state.settings.mobileFooter = action.meta.arg
         })
+        builder.addCase(changeUnreadCountTitle.pending, (state, action) => {
+            if (!state.settings) return
+            state.settings.unreadCountTitle = action.meta.arg
+        })
+        builder.addCase(changeUnreadCountFavicon.pending, (state, action) => {
+            if (!state.settings) return
+            state.settings.unreadCountFavicon = action.meta.arg
+        })
         builder.addCase(changeSharingSetting.pending, (state, action) => {
             if (!state.settings) return
             state.settings.sharingSettings[action.meta.arg.site] = action.meta.arg.value
@@ -102,11 +136,14 @@ export const userSlice = createSlice({
                 changeShowRead.fulfilled,
                 changeScrollMarks.fulfilled,
                 changeScrollMode.fulfilled,
+                changeEntriesToKeepOnTopWhenScrolling.fulfilled,
                 changeStarIconDisplayMode.fulfilled,
                 changeExternalLinkIconDisplayMode.fulfilled,
                 changeMarkAllAsReadConfirmation.fulfilled,
                 changeCustomContextMenu.fulfilled,
                 changeMobileFooter.fulfilled,
+                changeUnreadCountTitle.fulfilled,
+                changeUnreadCountFavicon.fulfilled,
                 changeSharingSetting.fulfilled
             ),
             () => {
@@ -118,3 +155,5 @@ export const userSlice = createSlice({
         )
     },
 })
+
+export const { setViewMode, setSidebarWidth, setAnnouncementHash } = userSlice.actions

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

@@ -43,6 +43,14 @@ export const changeScrollMode = createAppAsyncThunk("settings/scrollMode", (scro
     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) => {
@@ -77,6 +85,16 @@ export const changeMobileFooter = createAppAsyncThunk("settings/mobileFooter", (
     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/app/utils.ts

@@ -1,9 +1,11 @@
 import { throttle } from "throttle-debounce"
-import { type Category } from "./types"
+import type { Category } from "./types"
 
 export function visitCategoryTree(category: Category, visitor: (category: Category) => void): void {
     visitor(category)
-    category.children.forEach(child => visitCategoryTree(child, visitor))
+    for (const child of category.children) {
+        visitCategoryTree(child, visitor)
+    }
 }
 
 export function flattenCategoryTree(category: Category): Category[] {

commafeed-client/src/components/ActionButton.tsx

@@ -1,13 +1,15 @@
+import type { MessageDescriptor } from "@lingui/core"
+import { useLingui } from "@lingui/react"
 import { ActionIcon, Button, type ButtonVariant, Tooltip, useMantineTheme } from "@mantine/core"
-import { type ActionIconVariant } from "@mantine/core/lib/components/ActionIcon/ActionIcon"
+import type { ActionIconVariant } from "@mantine/core/lib/components/ActionIcon/ActionIcon"
 import { Constants } from "app/constants"
 import { useActionButton } from "hooks/useActionButton"
-import { forwardRef, type MouseEventHandler, type ReactNode } from "react"
+import { type MouseEventHandler, type ReactNode, forwardRef } from "react"
 
 interface ActionButtonProps {
     className?: string
     icon?: ReactNode
-    label: ReactNode
+    label?: string | MessageDescriptor
     onClick?: MouseEventHandler
     variant?: ActionIconVariant & ButtonVariant
     hideLabelOnDesktop?: boolean
@@ -20,17 +22,35 @@ interface ActionButtonProps {
 export const ActionButton = forwardRef<HTMLButtonElement, ActionButtonProps>((props: ActionButtonProps, ref) => {
     const { mobile } = useActionButton()
     const theme = useMantineTheme()
+    const { _ } = useLingui()
+
+    const label = typeof props.label === "string" ? props.label : props.label && _(props.label)
     const variant = props.variant ?? "subtle"
     const iconOnly = (mobile && !props.showLabelOnMobile) || (!mobile && props.hideLabelOnDesktop)
     return iconOnly ? (
-        <Tooltip label={props.label} openDelay={Constants.tooltip.delay}>
-            <ActionIcon ref={ref} color={theme.primaryColor} variant={variant} className={props.className} onClick={props.onClick}>
+        <Tooltip label={label} openDelay={Constants.tooltip.delay}>
+            <ActionIcon
+                ref={ref}
+                color={theme.primaryColor}
+                variant={variant}
+                className={props.className}
+                onClick={props.onClick}
+                aria-label={label}
+            >
                 {props.icon}
             </ActionIcon>
         </Tooltip>
     ) : (
-        <Button ref={ref} variant={variant} size="xs" className={props.className} leftSection={props.icon} onClick={props.onClick}>
-            {props.label}
+        <Button
+            ref={ref}
+            variant={variant}
+            size="xs"
+            className={props.className}
+            leftSection={props.icon}
+            onClick={props.onClick}
+            aria-label={label}
+        >
+            {label}
         </Button>
     )
 })

commafeed-client/src/components/Alert.tsx

@@ -1,5 +1,5 @@
 import { Trans } from "@lingui/macro"
-import { Alert as MantineAlert, Box } from "@mantine/core"
+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 { 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.tsx

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

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,7 @@ export function ImageWithPlaceholderWhileLoading({
                 width={width}
                 height={height}
                 onLoad={() => setLoading(false)}
-                style={{ display: loading ? "none" : "block" }}
+                style={{ ...style, display: loading ? "none" : (style?.display ?? "initial") }}
             />
         </>
     )

commafeed-client/src/components/KeyboardShortcutsHelp.tsx

@@ -1,8 +1,10 @@
 import { Trans } from "@lingui/macro"
 import { Anchor, Box, Kbd, Stack, Table } from "@mantine/core"
+import { useOs } from "@mantine/hooks"
 import { Constants } from "app/constants"
 
 export function KeyboardShortcutsHelp() {
+    const isMacOS = useOs() === "macos"
     return (
         <Stack gap="xs">
             <Table striped highlightOnHover>
@@ -148,9 +150,7 @@ export function KeyboardShortcutsHelp() {
                             <Trans>Navigate to a subscription by entering its name</Trans>
                         </Table.Td>
                         <Table.Td>
-                            <Kbd>
-                                <Trans>Ctrl</Trans>
-                            </Kbd>
+                            <Kbd>{isMacOS ? <Trans>Cmd</Trans> : <Trans>Ctrl</Trans>}</Kbd>
                             <span> + </span>
                             <Kbd>K</Kbd>
                             <span>, </span>

commafeed-client/src/components/RelativeDate.tsx

@@ -2,14 +2,10 @@ import { Trans } from "@lingui/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

@@ -2,7 +2,7 @@ import { Trans } from "@lingui/macro"
 import { Box, Button, Checkbox, Group, PasswordInput, Stack, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"
-import { type AdminSaveUserRequest, type UserModel } from "app/types"
+import type { AdminSaveUserRequest, UserModel } from "app/types"
 import { Alert } from "components/Alert"
 import { useAsyncCallback } from "react-async-hook"
 import { TbDeviceFloppy } from "react-icons/tb"

commafeed-client/src/components/code/CodeEditor.tsx

@@ -1,7 +1,7 @@
 import { Input, Textarea } from "@mantine/core"
 import RichCodeEditor from "components/code/RichCodeEditor"
 import { useMobile } from "hooks/useMobile"
-import { type ReactNode } from "react"
+import type { ReactNode } from "react"
 
 interface CodeEditorProps {
     description?: ReactNode

commafeed-client/src/components/code/RichCodeEditor.tsx

@@ -5,7 +5,7 @@ import { useAsync } from "react-async-hook"
 const init = async () => {
     window.MonacoEnvironment = {
         async getWorker(_, label) {
-            let worker
+            let worker: typeof import("*?worker")
             if (label === "css") {
                 worker = await import("monaco-editor/esm/vs/language/css/css.worker?worker")
             } else if (label === "javascript") {
@@ -13,7 +13,6 @@ const init = async () => {
             } else {
                 worker = await import("monaco-editor/esm/vs/editor/editor.worker?worker")
             }
-            // eslint-disable-next-line new-cap
             return new worker.default()
         },
     }

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

@@ -1,5 +1,5 @@
 import { TypographyStylesProvider } from "@mantine/core"
-import { type ReactNode } from "react"
+import type { ReactNode } from "react"
 
 /**
  * This component is used to provide basic styles to html typography elements.

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

@@ -1,11 +1,12 @@
 import { Box, Mark } from "@mantine/core"
 import { Constants } from "app/constants"
 import { calculatePlaceholderSize } from "app/utils"
-import { BasicHtmlStyles } from "components/content/BasicHtmlStyles"
 import { ImageWithPlaceholderWhileLoading } from "components/ImageWithPlaceholderWhileLoading"
+import { BasicHtmlStyles } from "components/content/BasicHtmlStyles"
 import escapeStringRegexp from "escape-string-regexp"
-import { type ChildrenNode, Interweave, Matcher, type MatchResponse, type Node, type TransformCallback } from "interweave"
+import { 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 {
@@ -40,8 +41,9 @@ const transform: TransformCallback = node => {
         const title = node.getAttribute("title") ?? undefined
         const nodeWidth = node.getAttribute("width")
         const nodeHeight = node.getAttribute("height")
-        const width = nodeWidth ? parseInt(nodeWidth, 10) : undefined
-        const height = nodeHeight ? parseInt(nodeHeight, 10) : undefined
+        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}
             />

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

@@ -1,7 +1,10 @@
-import { BasicHtmlStyles } from "components/content/BasicHtmlStyles"
 import { ImageWithPlaceholderWhileLoading } from "components/ImageWithPlaceholderWhileLoading"
+import { BasicHtmlStyles } from "components/content/BasicHtmlStyles"
 
-export function Enclosure(props: { enclosureType: string; enclosureUrl: string }) {
+export function Enclosure(props: {
+    enclosureType: string
+    enclosureUrl: string
+}) {
     const hasVideo = props.enclosureType.startsWith("video")
     const hasAudio = props.enclosureType.startsWith("audio")
     const hasImage = props.enclosureType.startsWith("image")
@@ -9,11 +12,13 @@ export function Enclosure(props: { enclosureType: string; enclosureUrl: string }
     return (
         <BasicHtmlStyles>
             {hasVideo && (
+                // biome-ignore lint/a11y/useMediaCaption: we don't have any captions for videos
                 <video controls width="100%">
                     <source src={props.enclosureUrl} type={props.enclosureType} />
                 </video>
             )}
             {hasAudio && (
+                // biome-ignore lint/a11y/useMediaCaption: we don't have any captions for audio
                 <audio controls>
                     <source src={props.enclosureUrl} type={props.enclosureType} />
                 </audio>

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

@@ -2,7 +2,7 @@ import { Trans } from "@lingui/macro"
 import { Box } from "@mantine/core"
 import { openModal } from "@mantine/modals"
 import { Constants } from "app/constants"
-import { type ExpendableEntry } from "app/entries/slice"
+import type { ExpendableEntry } from "app/entries/slice"
 import {
     loadMoreEntries,
     markAllEntries,
@@ -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()
 
@@ -126,7 +125,7 @@ export function FeedEntries() {
         })
         window.addEventListener("scroll", listener)
         return () => window.removeEventListener("scroll", listener)
-    }, [dispatch, contextMenu, entries, viewMode, scrollMarks, scrollingToEntry])
+    }, [dispatch, entries, viewMode, scrollMarks, scrollingToEntry])
 
     useMousetrap("r", async () => await dispatch(reloadEntries()))
     useMousetrap(
@@ -305,11 +304,12 @@ export function FeedEntries() {
             loader={<Box key={0}>{loading && <Loader />}</Box>}
         >
             {entries.map(entry => (
-                <div
+                <article
                     key={entry.id}
                     ref={el => {
                         if (el) el.id = Constants.dom.entryId(entry)
                     }}
+                    data-id={entry.id}
                 >
                     <FeedEntry
                         entry={entry}
@@ -322,7 +322,7 @@ export function FeedEntries() {
                         onBodyClick={() => bodyClicked(entry)}
                         onSwipedLeft={async () => await swipedLeft(entry)}
                     />
-                </div>
+                </article>
             ))}
         </InfiniteScroll>
     )

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

@@ -1,12 +1,11 @@
 import { Box, Divider, type MantineRadius, type MantineSpacing, Paper } from "@mantine/core"
 import { Constants } from "app/constants"
 import { useAppSelector } from "app/store"
-import { type Entry, type ViewMode } from "app/types"
+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 React from "react"
+import type React from "react"
 import { useSwipeable } from "react-swipeable"
 import { tss } from "tss"
 import { FeedEntryBody } from "./FeedEntryBody"
@@ -35,7 +34,7 @@ const useStyles = tss
         maxWidth?: number
     }>()
     .create(({ theme, colorScheme, read, expanded, viewMode, rtl, showSelectionIndicator, maxWidth }) => {
-        let backgroundColor
+        let backgroundColor: string
         if (colorScheme === "dark") {
             backgroundColor = read ? "inherit" : theme.colors.dark[5]
         } else {
@@ -61,7 +60,7 @@ const useStyles = tss
             backgroundHoverColor = colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[1]
         }
 
-        let paperBorderLeftColor
+        let paperBorderLeftColor = ""
         if (showSelectionIndicator) {
             const borderLeftColor = colorScheme === "dark" ? theme.colors[theme.primaryColor][4] : theme.colors[theme.primaryColor][6]
             paperBorderLeftColor = `${borderLeftColor} !important`
@@ -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/FeedEntryBody.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@mantine/core"
 import { useAppSelector } from "app/store"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
 import { Content } from "./Content"
 import { Enclosure } from "./Enclosure"
 import { Media } from "./Media"

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

@@ -4,12 +4,12 @@ import { Constants } from "app/constants"
 import { markEntriesUpToEntry, markEntry, starEntry } from "app/entries/thunks"
 import { redirectToFeed } from "app/redirect/thunks"
 import { useAppDispatch, useAppSelector } from "app/store"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
 import { truncate } from "app/utils"
 import { useBrowserExtension } from "hooks/useBrowserExtension"
 import { useColorScheme } from "hooks/useColorScheme"
 import { Item, Menu, Separator } from "react-contexify"
-import { TbArrowBarToDown, TbExternalLink, TbEyeCheck, TbEyeOff, TbRss, TbStar, TbStarOff } from "react-icons/tb"
+import { TbArrowBarToDown, TbExternalLink, TbMail, TbMailOpened, TbRss, TbStar, TbStarOff } from "react-icons/tb"
 import { tss } from "tss"
 
 interface FeedEntryContextMenuProps {
@@ -70,7 +70,7 @@ export function FeedEntryContextMenu(props: FeedEntryContextMenuProps) {
             {props.entry.markable && (
                 <Item onClick={async () => await dispatch(markEntry({ entry: props.entry, read: !props.entry.read }))}>
                     <Group>
-                        {props.entry.read ? <TbEyeOff size={iconSize} /> : <TbEyeCheck size={iconSize} />}
+                        {props.entry.read ? <TbMail size={iconSize} /> : <TbMailOpened size={iconSize} />}
                         {props.entry.read ? <Trans>Keep unread</Trans> : <Trans>Mark as read</Trans>}
                     </Group>
                 </Item>

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

@@ -1,12 +1,13 @@
-import { t, Trans } from "@lingui/macro"
+import { msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
 import { Group, Indicator, Popover, TagsInput } from "@mantine/core"
 import { markEntriesUpToEntry, markEntry, starEntry, tagEntry } from "app/entries/thunks"
 import { useAppDispatch, useAppSelector } from "app/store"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
 import { ActionButton } from "components/ActionButton"
 import { useActionButton } from "hooks/useActionButton"
 import { useMobile } from "hooks/useMobile"
-import { TbArrowBarToDown, TbExternalLink, TbEyeCheck, TbEyeOff, TbShare, TbStar, TbStarOff, TbTag } from "react-icons/tb"
+import { TbArrowBarToDown, TbExternalLink, TbMail, TbMailOpened, TbShare, TbStar, TbStarOff, TbTag } from "react-icons/tb"
 import { ShareButtons } from "./ShareButtons"
 
 interface FeedEntryFooterProps {
@@ -18,6 +19,7 @@ export function FeedEntryFooter(props: FeedEntryFooterProps) {
     const mobile = useMobile()
     const { spacing } = useActionButton()
     const dispatch = useAppDispatch()
+    const { _ } = useLingui()
 
     const readStatusButtonClicked = async () =>
         await dispatch(
@@ -39,14 +41,14 @@ export function FeedEntryFooter(props: FeedEntryFooterProps) {
             <Group gap={spacing}>
                 {props.entry.markable && (
                     <ActionButton
-                        icon={props.entry.read ? <TbEyeOff size={18} /> : <TbEyeCheck size={18} />}
-                        label={props.entry.read ? <Trans>Keep unread</Trans> : <Trans>Mark as read</Trans>}
+                        icon={props.entry.read ? <TbMail size={18} /> : <TbMailOpened size={18} />}
+                        label={props.entry.read ? msg`Keep unread` : msg`Mark as read`}
                         onClick={readStatusButtonClicked}
                     />
                 )}
                 <ActionButton
                     icon={props.entry.starred ? <TbStarOff size={18} /> : <TbStar size={18} />}
-                    label={props.entry.starred ? <Trans>Unstar</Trans> : <Trans>Star</Trans>}
+                    label={props.entry.starred ? msg`Unstar` : msg`Star`}
                     onClick={async () =>
                         await dispatch(
                             starEntry({
@@ -59,7 +61,7 @@ export function FeedEntryFooter(props: FeedEntryFooterProps) {
 
                 <Popover withArrow withinPortal shadow="md" closeOnClickOutside={!mobile}>
                     <Popover.Target>
-                        <ActionButton icon={<TbShare size={18} />} label={<Trans>Share</Trans>} />
+                        <ActionButton icon={<TbShare size={18} />} label={msg`Share`} />
                     </Popover.Target>
                     <Popover.Dropdown>
                         <ShareButtons url={props.entry.url} description={props.entry.title} />
@@ -70,12 +72,12 @@ export function FeedEntryFooter(props: FeedEntryFooterProps) {
                     <Popover withArrow shadow="md" closeOnClickOutside={!mobile}>
                         <Popover.Target>
                             <Indicator label={props.entry.tags.length} disabled={props.entry.tags.length === 0} inline size={16}>
-                                <ActionButton icon={<TbTag size={18} />} label={<Trans>Tags</Trans>} />
+                                <ActionButton icon={<TbTag size={18} />} label={msg`Tags`} />
                             </Indicator>
                         </Popover.Target>
                         <Popover.Dropdown>
                             <TagsInput
-                                placeholder={t`Tags`}
+                                placeholder={_(msg`Tags`)}
                                 data={tags}
                                 value={props.entry.tags}
                                 onChange={onTagsChange}
@@ -88,13 +90,13 @@ export function FeedEntryFooter(props: FeedEntryFooterProps) {
                 )}
 
                 <a href={props.entry.url} target="_blank" rel="noreferrer">
-                    <ActionButton icon={<TbExternalLink size={18} />} label={<Trans>Open link</Trans>} />
+                    <ActionButton icon={<TbExternalLink size={18} />} label={msg`Open link`} />
                 </a>
             </Group>
 
             <ActionButton
                 icon={<TbArrowBarToDown size={18} />}
-                label={<Trans>Mark as read up to here</Trans>}
+                label={msg`Mark as read up to here`}
                 onClick={async () => await dispatch(markEntriesUpToEntry(props.entry))}
             />
         </Group>

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

@@ -1,8 +1,8 @@
 import { Box } from "@mantine/core"
 import { Constants } from "app/constants"
 import { calculatePlaceholderSize } from "app/utils"
-import { BasicHtmlStyles } from "components/content/BasicHtmlStyles"
 import { ImageWithPlaceholderWhileLoading } from "components/ImageWithPlaceholderWhileLoading"
+import { BasicHtmlStyles } from "components/content/BasicHtmlStyles"
 import { Content } from "./Content"
 
 export interface MediaProps {

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

@@ -2,10 +2,10 @@ import { Trans } from "@lingui/macro"
 import { ActionIcon, Box, CopyButton, Divider, SimpleGrid } from "@mantine/core"
 import { Constants } from "app/constants"
 import { useAppSelector } from "app/store"
-import { type SharingSettings } from "app/types"
+import type { SharingSettings } from "app/types"
 import { useBrowserExtension } from "hooks/useBrowserExtension"
 import { useMobile } from "hooks/useMobile"
-import { type IconType } from "react-icons"
+import type { IconType } from "react-icons"
 import { TbCheck, TbCopy, TbDeviceDesktopShare, TbDeviceMobileShare } from "react-icons/tb"
 import { tss } from "tss"
 

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

@@ -1,11 +1,12 @@
-import { t, Trans } from "@lingui/macro"
+import { Trans, msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
 import { Box, Button, Group, Stack, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"
 import { redirectToSelectedSource } from "app/redirect/thunks"
 import { useAppDispatch } from "app/store"
 import { reloadTree } from "app/tree/thunks"
-import { type AddCategoryRequest } from "app/types"
+import type { AddCategoryRequest } from "app/types"
 import { Alert } from "components/Alert"
 import { useAsyncCallback } from "react-async-hook"
 import { TbFolderPlus } from "react-icons/tb"
@@ -13,6 +14,7 @@ import { CategorySelect } from "./CategorySelect"
 
 export function AddCategory() {
     const dispatch = useAppDispatch()
+    const { _ } = useLingui()
 
     const form = useForm<AddCategoryRequest>()
 
@@ -33,7 +35,7 @@ export function AddCategory() {
 
             <form onSubmit={form.onSubmit(addCategory.execute)}>
                 <Stack>
-                    <TextInput label={<Trans>Category</Trans>} placeholder={t`Category`} {...form.getInputProps("name")} required />
+                    <TextInput label={<Trans>Category</Trans>} placeholder={_(msg`Category`)} {...form.getInputProps("name")} required />
                     <CategorySelect label={<Trans>Parent</Trans>} {...form.getInputProps("parentId")} clearable />
                     <Group justify="center">
                         <Button variant="default" onClick={async () => await dispatch(redirectToSelectedSource())}>

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

@@ -1,9 +1,10 @@
-import { t } from "@lingui/macro"
+import { msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
 import { Select, type SelectProps } from "@mantine/core"
-import { type ComboboxItem } from "@mantine/core/lib/components/Combobox/Combobox.types"
+import type { ComboboxItem } from "@mantine/core/lib/components/Combobox/Combobox.types"
 import { Constants } from "app/constants"
 import { useAppSelector } from "app/store"
-import { type Category } from "app/types"
+import type { Category } from "app/types"
 import { flattenCategoryTree } from "app/utils"
 
 type CategorySelectProps = Partial<SelectProps> & {
@@ -13,12 +14,15 @@ type CategorySelectProps = Partial<SelectProps> & {
 
 export function CategorySelect(props: CategorySelectProps) {
     const rootCategory = useAppSelector(state => state.tree.rootCategory)
+    const { _ } = useLingui()
+
     const categories = rootCategory && flattenCategoryTree(rootCategory)
     const categoriesById = categories?.reduce((map, c) => {
         map.set(c.id, c)
         return map
     }, new Map<string, Category>())
-    const categoryLabel = (cat: Category) => {
+    const categoryLabel = (category: Category) => {
+        let cat = category
         let label = cat.name
 
         while (cat.parentId) {
@@ -42,7 +46,7 @@ export function CategorySelect(props: CategorySelectProps) {
         .sort((c1, c2) => c1.label.localeCompare(c2.label))
     if (props.withAll) {
         selectData?.unshift({
-            label: t`All`,
+            label: _(msg`All`),
             value: Constants.categories.all.id,
         })
     }

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

@@ -1,4 +1,5 @@
-import { t, Trans } from "@lingui/macro"
+import { Trans, msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
 import { Box, Button, FileInput, Group, Stack } from "@mantine/core"
 import { isNotEmpty, useForm } from "@mantine/form"
 import { client, errorToStrings } from "app/client"
@@ -11,10 +12,11 @@ import { TbFileImport } from "react-icons/tb"
 
 export function ImportOpml() {
     const dispatch = useAppDispatch()
+    const { _ } = useLingui()
 
     const form = useForm<{ file: File }>({
         validate: {
-            file: isNotEmpty(t`OPML file is required`),
+            file: isNotEmpty(_(msg`OPML file is required`)),
         },
     })
 
@@ -38,7 +40,7 @@ export function ImportOpml() {
                     <FileInput
                         label={<Trans>OPML file</Trans>}
                         leftSection={<TbFileImport />}
-                        placeholder={t`OPML file`}
+                        placeholder={_(msg`OPML file`)}
                         description={
                             <Trans>
                                 An opml file is an XML file containing feed URLs and categories. You can get an OPML file by exporting your

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

@@ -6,7 +6,7 @@ import { Constants } from "app/constants"
 import { redirectToFeed, redirectToSelectedSource } from "app/redirect/thunks"
 import { useAppDispatch } from "app/store"
 import { reloadTree } from "app/tree/thunks"
-import { type FeedInfoRequest, type SubscribeRequest } from "app/types"
+import type { FeedInfoRequest, SubscribeRequest } from "app/types"
 import { Alert } from "components/Alert"
 import { useState } from "react"
 import { useAsyncCallback } from "react-async-hook"

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

@@ -1,9 +1,9 @@
 import { Box, Text } from "@mantine/core"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
+import { RelativeDate } from "components/RelativeDate"
 import { FeedFavicon } from "components/content/FeedFavicon"
 import { OpenExternalLink } from "components/content/header/OpenExternalLink"
 import { Star } from "components/content/header/Star"
-import { RelativeDate } from "components/RelativeDate"
 import { OnDesktop } from "components/responsive/OnDesktop"
 import { tss } from "tss"
 import { FeedEntryTitle } from "./FeedEntryTitle"

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

@@ -1,9 +1,9 @@
 import { Box, Flex, Space, Text } from "@mantine/core"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
+import { RelativeDate } from "components/RelativeDate"
 import { FeedFavicon } from "components/content/FeedFavicon"
 import { OpenExternalLink } from "components/content/header/OpenExternalLink"
 import { Star } from "components/content/header/Star"
-import { RelativeDate } from "components/RelativeDate"
 import { tss } from "tss"
 import { FeedEntryTitle } from "./FeedEntryTitle"
 

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

@@ -1,6 +1,6 @@
 import { Highlight } from "@mantine/core"
 import { useAppSelector } from "app/store"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
 
 export interface FeedEntryTitleProps {
     entry: Entry

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

@@ -3,7 +3,7 @@ import { ActionIcon, Anchor, Tooltip } from "@mantine/core"
 import { Constants } from "app/constants"
 import { markEntry } from "app/entries/thunks"
 import { useAppDispatch } from "app/store"
-import { type Entry } from "app/types"
+import type { Entry } from "app/types"
 import { TbExternalLink } from "react-icons/tb"
 
 export function OpenExternalLink(props: { entry: Entry }) {

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

@@ -1,4 +1,5 @@
-import { t, Trans } from "@lingui/macro"
+import { msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
 import { Box, Center, CloseButton, Divider, Group, Indicator, Popover, TextInput } from "@mantine/core"
 import { useForm } from "@mantine/form"
 import { reloadEntries, search, selectNextEntry, selectPreviousEntry } from "app/entries/thunks"
@@ -57,10 +58,11 @@ export function Header() {
     const searchFromStore = useAppSelector(state => state.entries.search)
     const { isBrowserExtensionPopup, openSettingsPage, openAppInNewTab } = useBrowserExtension()
     const dispatch = useAppDispatch()
+    const { _ } = useLingui()
 
     const searchForm = useForm<{ search: string }>({
         validate: {
-            search: value => (value.length > 0 && value.length < 3 ? t`Search requires at least 3 characters` : null),
+            search: value => (value.length > 0 && value.length < 3 ? _(msg`Search requires at least 3 characters`) : null),
         },
     })
     const { setValues } = searchForm
@@ -77,7 +79,7 @@ export function Header() {
             <HeaderToolbar>
                 <ActionButton
                     icon={<TbArrowUp size={iconSize} />}
-                    label={<Trans>Previous</Trans>}
+                    label={msg`Previous`}
                     onClick={async () =>
                         await dispatch(
                             selectPreviousEntry({
@@ -90,7 +92,7 @@ export function Header() {
                 />
                 <ActionButton
                     icon={<TbArrowDown size={iconSize} />}
-                    label={<Trans>Next</Trans>}
+                    label={msg`Next`}
                     onClick={async () =>
                         await dispatch(
                             selectNextEntry({
@@ -106,7 +108,7 @@ export function Header() {
 
                 <ActionButton
                     icon={<TbRefresh size={iconSize} />}
-                    label={<Trans>Refresh</Trans>}
+                    label={msg`Refresh`}
                     onClick={async () => await dispatch(reloadEntries())}
                 />
                 <MarkAllAsReadButton iconSize={iconSize} />
@@ -115,25 +117,25 @@ export function Header() {
 
                 <ActionButton
                     icon={settings.readingMode === "all" ? <TbEye size={iconSize} /> : <TbEyeOff size={iconSize} />}
-                    label={settings.readingMode === "all" ? <Trans>All</Trans> : <Trans>Unread</Trans>}
+                    label={settings.readingMode === "all" ? msg`All` : msg`Unread`}
                     onClick={async () => await dispatch(changeReadingMode(settings.readingMode === "all" ? "unread" : "all"))}
                 />
                 <ActionButton
                     icon={settings.readingOrder === "asc" ? <TbSortAscending size={iconSize} /> : <TbSortDescending size={iconSize} />}
-                    label={settings.readingOrder === "asc" ? <Trans>Asc</Trans> : <Trans>Desc</Trans>}
+                    label={settings.readingOrder === "asc" ? msg`Asc` : msg`Desc`}
                     onClick={async () => await dispatch(changeReadingOrder(settings.readingOrder === "asc" ? "desc" : "asc"))}
                 />
 
                 <Popover>
                     <Popover.Target>
                         <Indicator disabled={!searchFromStore}>
-                            <ActionButton icon={<TbSearch size={iconSize} />} label={<Trans>Search</Trans>} />
+                            <ActionButton icon={<TbSearch size={iconSize} />} label={msg`Search`} />
                         </Indicator>
                     </Popover.Target>
                     <Popover.Dropdown>
                         <form onSubmit={searchForm.onSubmit(async values => await dispatch(search(values.search)))}>
                             <TextInput
-                                placeholder={t`Search`}
+                                placeholder={_(msg`Search`)}
                                 {...searchForm.getInputProps("search")}
                                 leftSection={<TbSearch size={iconSize} />}
                                 rightSection={<CloseButton onClick={async () => await (searchFromStore && dispatch(search("")))} />}
@@ -153,12 +155,12 @@ export function Header() {
 
                         <ActionButton
                             icon={<TbSettings size={iconSize} />}
-                            label={<Trans>Extension options</Trans>}
+                            label={msg`Extension options`}
                             onClick={() => openSettingsPage()}
                         />
                         <ActionButton
                             icon={<TbExternalLink size={iconSize} />}
-                            label={<Trans>Open CommaFeed</Trans>}
+                            label={msg`Open CommaFeed`}
                             onClick={() => openAppInNewTab()}
                         />
                     </>

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

@@ -1,4 +1,4 @@
-import { Trans } from "@lingui/macro"
+import { Trans, msg } from "@lingui/macro"
 
 import { Button, Code, Group, Modal, Slider, Stack, Text } from "@mantine/core"
 import { markAllEntries } from "app/entries/thunks"
@@ -91,7 +91,7 @@ export function MarkAllAsReadButton(props: { iconSize: number }) {
                     </Group>
                 </Stack>
             </Modal>
-            <ActionButton icon={<TbChecks size={props.iconSize} />} label={<Trans>Mark all as read</Trans>} onClick={buttonClicked} />
+            <ActionButton icon={<TbChecks size={props.iconSize} />} label={msg`Mark all as read`} onClick={buttonClicked} />
         </>
     )
 }

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

@@ -13,8 +13,11 @@ import { showNotification } from "@mantine/notifications"
 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 type { ViewMode } from "app/types"
+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,9 +1,10 @@
-import { type MetricGauge } from "app/types"
+import { NumberFormatter } from "@mantine/core"
+import type { MetricGauge } from "app/types"
 
 interface MeterProps {
     gauge: MetricGauge
 }
 
 export function Gauge(props: MeterProps) {
-    return <span>{props.gauge.value}</span>
+    return <NumberFormatter value={props.gauge.value} thousandSeparator />
 }

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

@@ -1,5 +1,5 @@
 import { Box } from "@mantine/core"
-import { type MetricMeter } from "app/types"
+import type { MetricMeter } from "app/types"
 
 interface MeterProps {
     meter: MetricMeter

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

@@ -1,5 +1,5 @@
 import { Box } from "@mantine/core"
-import { type MetricTimer } from "app/types"
+import type { MetricTimer } from "app/types"
 
 interface MetricTimerProps {
     timer: MetricTimer

commafeed-client/src/components/responsive/OnDesktop.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@mantine/core"
 import { useMobile } from "hooks/useMobile"
-import React from "react"
+import type React from "react"
 
 export function OnDesktop(props: { children: React.ReactNode }) {
     const mobile = useMobile()

commafeed-client/src/components/responsive/OnMobile.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@mantine/core"
 import { useMobile } from "hooks/useMobile"
-import React from "react"
+import type React from "react"
 
 export function OnMobile(props: { children: React.ReactNode }) {
     const mobile = useMobile()

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

@@ -1,11 +1,13 @@
-import { t, Trans } from "@lingui/macro"
-import { Divider, Group, Radio, Select, SimpleGrid, Stack, Switch } from "@mantine/core"
-import { type ComboboxData } from "@mantine/core/lib/components/Combobox/Combobox.types"
+import { Trans, msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
+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, type ScrollMode, type SharingSettings } from "app/types"
+import type { IconDisplayMode, ScrollMode, SharingSettings } from "app/types"
 import {
     changeCustomContextMenu,
+    changeEntriesToKeepOnTopWhenScrolling,
     changeExternalLinkIconDisplayMode,
     changeLanguage,
     changeMarkAllAsReadConfirmation,
@@ -16,9 +18,11 @@ import {
     changeSharingSetting,
     changeShowRead,
     changeStarIconDisplayMode,
+    changeUnreadCountFavicon,
+    changeUnreadCountTitle,
 } from "app/user/thunks"
 import { locales } from "i18n"
-import { type ReactNode } from "react"
+import type { ReactNode } from "react"
 
 export function DisplaySettings() {
     const language = useAppSelector(state => state.user.settings?.language)
@@ -26,13 +30,17 @@ 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)
     const customContextMenu = useAppSelector(state => state.user.settings?.customContextMenu)
     const mobileFooter = useAppSelector(state => state.user.settings?.mobileFooter)
+    const unreadCountTitle = useAppSelector(state => state.user.settings?.unreadCountTitle)
+    const unreadCountFavicon = useAppSelector(state => state.user.settings?.unreadCountFavicon)
     const sharingSettings = useAppSelector(state => state.user.settings?.sharingSettings)
     const dispatch = useAppDispatch()
+    const { _ } = useLingui()
 
     const scrollModeOptions: Record<ScrollMode, ReactNode> = {
         always: <Trans>Always</Trans>,
@@ -43,19 +51,19 @@ export function DisplaySettings() {
     const displayModeData: ComboboxData = [
         {
             value: "always",
-            label: t`Always`,
+            label: _(msg`Always`),
         },
         {
             value: "on_desktop",
-            label: t`On desktop`,
+            label: _(msg`On desktop`),
         },
         {
             value: "on_mobile",
-            label: t`On mobile`,
+            label: _(msg`On mobile`),
         },
         {
             value: "never",
-            label: t`Never`,
+            label: _(msg`Never`),
         },
     ]
 
@@ -89,6 +97,20 @@ export function DisplaySettings() {
                 onChange={async e => await dispatch(changeMobileFooter(e.currentTarget.checked))}
             />
 
+            <Divider label={<Trans>Browser tab</Trans>} labelPosition="center" />
+
+            <Switch
+                label={<Trans>Show unread count in tab title</Trans>}
+                checked={unreadCountTitle}
+                onChange={async e => await dispatch(changeUnreadCountTitle(e.currentTarget.checked))}
+            />
+
+            <Switch
+                label={<Trans>Show unread count in tab favicon</Trans>}
+                checked={unreadCountFavicon}
+                onChange={async e => await dispatch(changeUnreadCountFavicon(e.currentTarget.checked))}
+            />
+
             <Divider label={<Trans>Entry headers</Trans>} labelPosition="center" />
 
             <Select
@@ -125,6 +147,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,11 +1,12 @@
-import { t, Trans } from "@lingui/macro"
+import { Trans, msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
 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"
 import { client, errorToStrings } from "app/client"
 import { redirectToLogin, redirectToSelectedSource } from "app/redirect/thunks"
 import { useAppDispatch, useAppSelector } from "app/store"
-import { type ProfileModificationRequest } from "app/types"
+import type { ProfileModificationRequest } from "app/types"
 import { reloadProfile } from "app/user/thunks"
 import { Alert } from "components/Alert"
 import { useEffect } from "react"
@@ -19,10 +20,11 @@ interface FormData extends ProfileModificationRequest {
 export function ProfileSettings() {
     const profile = useAppSelector(state => state.user.profile)
     const dispatch = useAppDispatch()
+    const { _ } = useLingui()
 
     const form = useForm<FormData>({
         validate: {
-            newPasswordConfirmation: (value, values) => (value !== values.newPassword ? t`Passwords do not match` : null),
+            newPasswordConfirmation: (value, values) => (value !== values.newPassword ? _(msg`Passwords do not match`) : null),
         },
     })
     const { setValues } = form

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

@@ -11,7 +11,7 @@ import {
 } from "app/redirect/thunks"
 import { useAppDispatch, useAppSelector } from "app/store"
 import { collapseTreeCategory } from "app/tree/thunks"
-import { type Category, type Subscription } from "app/types"
+import type { Category, Subscription } from "app/types"
 import { categoryUnreadCount, flattenCategoryTree } from "app/utils"
 import { Loader } from "components/Loader"
 import { OnDesktop } from "components/responsive/OnDesktop"
@@ -35,6 +35,21 @@ export function Tree() {
     const showRead = useAppSelector(state => state.user.settings?.showRead)
     const dispatch = useAppDispatch()
 
+    const isFeedDisplayed = (feed: Subscription) => {
+        const isCurrentFeed = source.type === "feed" && source.id === String(feed.id)
+        return isCurrentFeed || feed.unread > 0 || showRead
+    }
+
+    const isCategoryDisplayed = (category: Category): boolean => {
+        const isCurrentCategory = source.type === "category" && source.id === category.id
+        return (
+            isCurrentCategory ||
+            showRead ||
+            category.children.some(c => isCategoryDisplayed(c)) ||
+            category.feeds.some(f => isFeedDisplayed(f))
+        )
+    }
+
     const feedClicked = (e: React.MouseEvent, id: string) => {
         if (e.detail === 2) {
             dispatch(redirectToFeedDetails(id))
@@ -70,6 +85,7 @@ export function Tree() {
     const allCategoryNode = () => (
         <TreeNode
             id={Constants.categories.all.id}
+            type="category"
             name={<Trans>All</Trans>}
             icon={allIcon}
             unread={categoryUnreadCount(root)}
@@ -83,6 +99,7 @@ export function Tree() {
     const starredCategoryNode = () => (
         <TreeNode
             id={Constants.categories.starred.id}
+            type="category"
             name={<Trans>Starred</Trans>}
             icon={starredIcon}
             unread={0}
@@ -95,16 +112,16 @@ export function Tree() {
     )
 
     const categoryNode = (category: Category, level = 0) => {
-        const unreadCount = categoryUnreadCount(category)
-        if (unreadCount === 0 && !showRead) return null
+        if (!isCategoryDisplayed(category)) return null
 
         const hasError = !category.expanded && flattenCategoryTree(category).some(c => c.feeds.some(f => f.errorCount > errorThreshold))
         return (
             <TreeNode
                 id={category.id}
+                type="category"
                 name={category.name}
                 icon={category.expanded ? expandedIcon : collapsedIcon}
-                unread={unreadCount}
+                unread={categoryUnreadCount(category)}
                 selected={source.type === "category" && source.id === category.id}
                 expanded={category.expanded}
                 level={level}
@@ -117,11 +134,12 @@ export function Tree() {
     }
 
     const feedNode = (feed: Subscription, level = 0) => {
-        if (feed.unread === 0 && !showRead) return null
+        if (!isFeedDisplayed(feed)) return null
 
         return (
             <TreeNode
                 id={String(feed.id)}
+                type="feed"
                 name={feed.name}
                 icon={feed.iconUrl}
                 unread={feed.unread}
@@ -137,6 +155,7 @@ export function Tree() {
     const tagNode = (tag: string) => (
         <TreeNode
             id={tag}
+            type="tag"
             name={tag}
             icon={tagIcon}
             unread={0}

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

@@ -1,13 +1,15 @@
 import { Box, Center } from "@mantine/core"
+import type { EntrySourceType } from "app/entries/slice"
 import { FeedFavicon } from "components/content/FeedFavicon"
-import React, { type ReactNode } from "react"
+import type React from "react"
 import { tss } from "tss"
 import { UnreadCount } from "./UnreadCount"
 
 interface TreeNodeProps {
     id: string
-    name: ReactNode
-    icon: ReactNode
+    type: EntrySourceType
+    name: React.ReactNode
+    icon: React.ReactNode
     unread: number
     selected: boolean
     expanded?: boolean
@@ -27,7 +29,7 @@ const useStyles = tss
         let backgroundColor = "inherit"
         if (selected) backgroundColor = colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[1]
 
-        let color
+        let color: string
         if (hasError) {
             color = theme.colors.red[6]
         } else if (colorScheme === "dark") {
@@ -63,7 +65,15 @@ export function TreeNode(props: TreeNodeProps) {
         hasUnread: props.unread > 0,
     })
     return (
-        <Box py={1} pl={props.level * 20} className={classes.node} onClick={(e: React.MouseEvent) => props.onClick(e, props.id)}>
+        <Box
+            py={1}
+            pl={props.level * 20}
+            className={classes.node}
+            onClick={(e: React.MouseEvent) => props.onClick(e, props.id)}
+            data-id={props.id}
+            data-type={props.type}
+            data-unread-count={props.unread}
+        >
             <Box mr={6} onClick={(e: React.MouseEvent) => props.onIconClick?.(e, props.id)}>
                 <Center>{typeof props.icon === "string" ? <FeedFavicon url={props.icon} /> : props.icon}</Center>
             </Box>

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

@@ -1,9 +1,10 @@
-import { t, Trans } from "@lingui/macro"
-import { Box, Center, Kbd, TextInput } from "@mantine/core"
-import { Spotlight, spotlight, type SpotlightActionData } from "@mantine/spotlight"
+import { Trans, msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
+import { TextInput } from "@mantine/core"
+import { Spotlight, type SpotlightActionData, spotlight } from "@mantine/spotlight"
 import { redirectToFeed } from "app/redirect/thunks"
 import { useAppDispatch } from "app/store"
-import { type Subscription } from "app/types"
+import type { Subscription } from "app/types"
 import { FeedFavicon } from "components/content/FeedFavicon"
 import { useMousetrap } from "hooks/useMousetrap"
 import { TbSearch } from "react-icons/tb"
@@ -14,6 +15,7 @@ export interface TreeSearchProps {
 
 export function TreeSearch(props: TreeSearchProps) {
     const dispatch = useAppDispatch()
+    const { _ } = useLingui()
 
     const actions: SpotlightActionData[] = props.feeds
         .map(f => ({
@@ -25,13 +27,6 @@ export function TreeSearch(props: TreeSearchProps) {
         .sort((f1, f2) => f1.label.localeCompare(f2.label))
 
     const searchIcon = <TbSearch size={18} />
-    const rightSection = (
-        <Center style={{ cursor: "pointer" }} onClick={() => spotlight.open()}>
-            <Kbd>Ctrl</Kbd>
-            <Box mx={5}>+</Box>
-            <Kbd>K</Kbd>
-        </Center>
-    )
 
     // additional keyboard shortcut used by commafeed v1
     useMousetrap("g u", () => spotlight.open())
@@ -39,10 +34,9 @@ export function TreeSearch(props: TreeSearchProps) {
     return (
         <>
             <TextInput
-                placeholder={t`Search`}
+                placeholder={_(msg`Search`)}
                 leftSection={searchIcon}
                 rightSectionWidth={100}
-                rightSection={rightSection}
                 styles={{
                     input: {
                         cursor: "pointer",
@@ -56,13 +50,13 @@ export function TreeSearch(props: TreeSearchProps) {
             <Spotlight
                 actions={actions}
                 limit={10}
-                shortcut="ctrl+k"
+                shortcut="mod+k"
                 searchProps={{
                     leftSection: searchIcon,
-                    placeholder: t`Search`,
+                    placeholder: _(msg`Search`),
                 }}
                 nothingFound={<Trans>Nothing found</Trans>}
-            ></Spotlight>
+            />
         </>
     )
 }

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

@@ -18,7 +18,7 @@ export function UnreadCount(props: { unreadCount: number }) {
     const count = props.unreadCount >= 10000 ? "10k+" : props.unreadCount
     return (
         <Tooltip label={props.unreadCount} disabled={props.unreadCount === count} openDelay={Constants.tooltip.delay}>
-            <Badge className={classes.badge} variant="light">
+            <Badge className={classes.badge} variant="light" fullWidth>
                 {count}
             </Badge>
         </Tooltip>

commafeed-client/src/hooks/useAppLoading.ts

@@ -1,4 +1,5 @@
-import { t } from "@lingui/macro"
+import { msg } from "@lingui/macro"
+import { useLingui } from "@lingui/react"
 import { useAppSelector } from "app/store"
 
 interface Step {
@@ -11,22 +12,23 @@ export const useAppLoading = () => {
     const settings = useAppSelector(state => state.user.settings)
     const rootCategory = useAppSelector(state => state.tree.rootCategory)
     const tags = useAppSelector(state => state.user.tags)
+    const { _ } = useLingui()
 
     const steps: Step[] = [
         {
-            label: t`Loading settings...`,
+            label: _(msg`Loading settings...`),
             done: !!settings,
         },
         {
-            label: t`Loading profile...`,
+            label: _(msg`Loading profile...`),
             done: !!profile,
         },
         {
-            label: t`Loading subscriptions...`,
+            label: _(msg`Loading subscriptions...`),
             done: !!rootCategory,
         },
         {
-            label: t`Loading tags...`,
+            label: _(msg`Loading tags...`),
             done: !!tags,
         },
     ]

commafeed-client/src/hooks/useBrowserExtension.ts

@@ -9,13 +9,13 @@ export const useBrowserExtension = () => {
     // monitor the attribute on the root element as it may change after the page was loaded
     useEffect(() => {
         const observer = new MutationObserver(mutations => {
-            mutations.forEach(mutation => {
+            for (const mutation of mutations) {
                 if (mutation.type === "attributes") {
                     const element = mutation.target as Element
                     const version = element.getAttribute("browser-extension-installed")
                     if (version) setBrowserExtensionVersion(version)
                 }
-            })
+            }
         })
 
         observer.observe(document.documentElement, {

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/i18n.ts

@@ -1,4 +1,4 @@
-import { i18n, type Messages } from "@lingui/core"
+import { type Messages, i18n } from "@lingui/core"
 import { useAppSelector } from "app/store"
 import dayjs from "dayjs"
 import { useEffect } from "react"
@@ -10,7 +10,7 @@ interface Locale {
 }
 
 // add an object to the array to add a new locale
-// don't forget to also add it to the 'locales' array in .linguirc
+// don't forget to also add it to the 'locales' array in lingui.config.ts
 export const locales: Locale[] = [
     { key: "ar", label: "العربية", dayjsImportFn: async () => await import("dayjs/locale/ar") },
     { key: "ca", label: "Català", dayjsImportFn: async () => await import("dayjs/locale/ca") },

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "تأكد من عمل الخلاصة"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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 "هل نسيت كلمة المرور؟"
@@ -600,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 "اوووه!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr "Extensió del navegador necessària per a Chrome"
 msgid "Browser extention"
 msgstr "Extensió del navegador"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Comproveu que el canal funciona"
 msgid "Close menu"
 msgstr "Tanca el menu"
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr "Versió de l'extensió del navegador CommaFeed {browserExtensionVersion}."
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr "Mostra el menú natiu (escriptori)"
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Zkontrolujte, zda zdroj funguje"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Gwiriwch fod y porthiant yn gweithio"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Tjek, at foderet virker"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr "Browser-Erweiterung für Chrome benötigt"
 msgid "Browser extention"
 msgstr "Browser-Erweiterung"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Überprüfe, ob der Feed funktioniert"
 msgid "Close menu"
 msgstr "Menü schließen"
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr "CommaFeed Browser Erweiterung Version {browserExtensionVersion}."
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr "Natives Menü anzeigen (Desktop)"
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr "Browser extension required for Chrome"
 msgid "Browser extention"
 msgstr "Browser extention"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr "Browser tab"
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Check that the feed is working"
 msgid "Close menu"
 msgstr "Close menu"
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr "Cmd"
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr "CommaFeed browser extension version {browserExtensionVersion}."
@@ -313,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"
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr "Show native menu (desktop)"
 msgid "Show star icon"
 msgstr "Show star icon"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr "Show unread count in tab favicon"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr "Show unread count in tab title"
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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,11 +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 "Pestaña del navegador"
 
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
@@ -170,19 +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 "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"
@@ -190,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"
@@ -214,7 +223,7 @@ msgstr "Acogedor"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Ctrl"
-msgstr ""
+msgstr "Ctrl"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Current password"
@@ -222,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"
@@ -259,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"
@@ -294,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"
@@ -311,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}."
@@ -331,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?"
@@ -386,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"
@@ -398,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"
@@ -406,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"
@@ -422,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
@@ -432,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"
@@ -440,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"
@@ -452,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
@@ -484,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
@@ -520,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"
@@ -544,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"
@@ -557,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
@@ -570,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"
@@ -578,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"
@@ -586,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!"
@@ -606,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"
@@ -623,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"
@@ -647,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"
@@ -697,7 +718,7 @@ msgstr "Posición"
 
 #: src/components/header/Header.tsx
 msgid "Previous"
-msgstr ""
+msgstr "Previo"
 
 #: src/pages/app/SettingsPage.tsx
 msgid "Profile"
@@ -723,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
@@ -735,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"
@@ -743,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
@@ -758,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."
@@ -784,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"
@@ -812,15 +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 "Mostrar recuento de no leídos en la pestaña favicon"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+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
@@ -841,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
@@ -856,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"
@@ -868,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"
@@ -880,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
@@ -889,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"
@@ -897,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"
@@ -905,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"
@@ -953,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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "بررسی کنید که خوراک کار می کند"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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 "رمز عبور را فراموش کرده اید؟"
@@ -600,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 "اوه!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Tarkista, että syöttö toimii"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr "L'extension navigateur est nécessaire sur Chrome"
 msgid "Browser extention"
 msgstr "Extension navigateur"
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr "Onglet navigateur"
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Vérifie que le flux fonctionne"
 msgid "Close menu"
 msgstr "Fermer le menu"
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr "Cmd"
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr "Extension CommaFeed pour navigateur version {browserExtensionVersion}."
@@ -313,9 +321,13 @@ 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 ""
+msgstr "En-têtes de l'entrée"
 
 #: src/components/Alert.tsx
 msgid "Error"
@@ -364,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é ?"
@@ -578,7 +594,7 @@ msgstr "Fin de la liste"
 
 #: src/components/content/ShareButtons.tsx
 msgid "No sharing options available."
-msgstr ""
+msgstr "Aucune option de partage disponible"
 
 #: src/components/sidebar/TreeSearch.tsx
 msgid "Nothing found"
@@ -590,16 +606,20 @@ msgstr "Du plus ancien au plus récent"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On desktop"
-msgstr ""
+msgstr "Version PC"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On mobile"
-msgstr ""
+msgstr "Version mobile"
 
 #: src/components/settings/DisplaySettings.tsx
 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 !"
@@ -660,7 +680,7 @@ msgstr "Fichier OPML"
 
 #: src/components/content/add/ImportOpml.tsx
 msgid "OPML file is required"
-msgstr ""
+msgstr "Vous devez fournir un fichier OPML"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Order"
@@ -804,7 +824,7 @@ msgstr "Afficher les options de l'entrée (mobile)"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show external link icon"
-msgstr ""
+msgstr "Afficher l'icône du lien distant"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show feeds and categories with no unread entries"
@@ -820,7 +840,15 @@ msgstr "Afficher les options du navigateur (ordinateur)"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show star icon"
-msgstr ""
+msgstr "Afficher l'icône Favori"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr "Afficher le nombre d'entrées non lues dans la favicône de l'onglet"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr "Afficher le nombre d'entrées non lues dans le titre de l'onglet"
 
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Comproba que a fonte funciona"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Ellenőrizze, hogy a feed működik-e"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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á!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Periksa apakah umpannya berfungsi"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Verifica che il feed funzioni"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -9,17 +9,17 @@ msgstr ""
 "Project-Id-Version: \n"
 "Report-Msgid-Bugs-To: \n"
 "PO-Revision-Date: \n"
-"Last-Translator: \n"
+"Last-Translator: https://github.com/dai\n"
 "Language-Team: \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 はオープンソースのプロジェクトです。 ソースは以下でホストされています </0><1>GitHub</1>。"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "<0>Complete syntax is available </0><1>here</1>."
-msgstr ""
+msgstr "<0>完全な syntax </0><1>こちら</1>で利用可能です。"
 
 #: src/pages/auth/RegistrationPage.tsx
 msgid "<0>Have an account?</0><1>Log in!</1>"
@@ -27,7 +27,7 @@ msgstr "<0>アカウントをお持ちですか?</0><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>こんにちは、</0><1>私はベルギーのジェレミーです。私はこれまで 10 年以上、CommaFeed のオープンソースプロジェクトを無料で開発してきました。あなたの関心に感謝します。</1>"
 
 #: src/pages/auth/LoginPage.tsx
 msgid "<0>Need an account?</0><1>Sign up!</1>"
@@ -36,7 +36,7 @@ msgstr "<0>アカウントが必要ですか?</0><1>サインアップ!</1>"
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/app/AboutPage.tsx
 msgid "About"
-msgstr "約"
+msgstr "About"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Actions"
@@ -44,7 +44,7 @@ msgstr "アクション"
 
 #: src/components/content/add/AddCategory.tsx
 msgid "Add"
-msgstr "追記"
+msgstr "追加"
 
 #: src/pages/app/AddPage.tsx
 msgid "Add category"
@@ -58,27 +58,27 @@ 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
 #: src/components/header/Header.tsx
 #: src/components/sidebar/Tree.tsx
 msgid "All"
-msgstr "全員"
+msgstr "すべて"
 
 #: src/components/settings/DisplaySettings.tsx
 #: src/components/settings/DisplaySettings.tsx
 msgid "Always"
-msgstr ""
+msgstr "常に"
 
 #: src/pages/auth/PasswordRecoveryPage.tsx
 msgid "An email has been sent if this address was registered. Check your inbox."
-msgstr "このアドレスが登録されていれば、メールが送信されました。"
+msgstr "このアドレスに確認メールを送信しました。受信箱を確認してください。"
 
 #: 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 "opml ファイルは、フィードの URL とカテゴリを含む XML ファイルです。"
+msgstr "opmlファイルは、フィードのURLとカテゴリを含むXMLファイルです。OPMLファイルは他のフィードサービスからエクスポートして取得することができます"
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Analyze feed"
@@ -86,7 +86,7 @@ msgstr "フィードを分析する"
 
 #: src/components/AnnouncementDialog.tsx
 msgid "Announcement"
-msgstr ""
+msgstr "お知らせ"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "API key"
@@ -94,27 +94,27 @@ msgstr "APIキー"
 
 #: src/pages/app/CategoryDetailsPage.tsx
 msgid "Are you sure you want to delete category <0>{categoryName}</0>?"
-msgstr "カテゴリ <0>{categoryName}</0> を削除してもよろしいですか?"
+msgstr "カテゴリ <0>{categoryName}</0> を削除してもよろしいですか？"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Are you sure you want to delete user <0>{userName}</0> ?"
-msgstr "ユーザー <0>{userName}</0> を削除してもよろしいですか?"
+msgstr "ユーザー <0>{userName}</0> を削除してもよろしいですか？"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Are you sure you want to delete your account? There's no turning back!"
-msgstr "本当にアカウントを削除しますか?"
+msgstr "本当にアカウントを削除しますか？元には戻せません！"
 
 #: src/components/header/MarkAllAsReadButton.tsx
 msgid "Are you sure you want to mark all entries of <0>{sourceLabel}</0> as read?"
-msgstr "<0>{sourceLabel}</0> のすべてのエントリを既読にしますか?"
+msgstr "<0>{sourceLabel}</0> のすべてのエントリーを既読にしますか？"
 
 #: 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 "<0>{sourceLabel}</0> の {threshold} 日より前のエントリを既読としてマークしてもよろしいですか?"
+msgstr "<0>{sourceLabel}</0> の {threshold} 日より前のエントリーを既読としてマークしてもよろしいですか？"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Are you sure you want to unsubscribe from <0>{feedName}</0>?"
-msgstr "<0>{feedName}</0> の登録を解除してもよろしいですか?"
+msgstr "<0>{feedName}</0> の登録を解除してもよろしいですか？"
 
 #: src/components/header/Header.tsx
 msgid "Asc"
@@ -126,7 +126,7 @@ msgstr "使用可能な変数は「title」、「content」、「url」、「aut
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Back"
-msgstr "裏"
+msgstr "戻る"
 
 #: src/pages/auth/PasswordRecoveryPage.tsx
 msgid "Back to log in"
@@ -134,11 +134,15 @@ msgstr "ログインに戻る"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Browser extension required for Chrome"
-msgstr ""
+msgstr "Chromeのブラウザー拡張が必要です"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Browser extention"
-msgstr ""
+msgstr "ブラウザー拡張"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr "ブラウザータブ"
 
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
@@ -166,7 +170,7 @@ msgstr "カテゴリー"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Changing password will generate a new API key"
-msgstr "パスワードを変更すると、新しい API キーが生成されます"
+msgstr "パスワードを変更すると、新しいAPIキーが生成されます"
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Check that the feed is working"
@@ -174,23 +178,27 @@ msgstr "フィードが動作していることを確認してください"
 
 #: src/pages/app/Layout.tsx
 msgid "Close menu"
-msgstr ""
+msgstr "メニューを閉じる"
+
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr "Cmd"
 
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
-msgstr ""
+msgstr "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はFever APIと互換性があります。Fever互換のモバイルクライアントで次のURLを使用してください。ユーザー名と <0>API キー</0> でログインしてください。"
 
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed next unread item"
-msgstr "次の未読アイテムをカンマフィード"
+msgstr "CommaFeed 次の未読アイテム"
 
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed version {version} ({revision})."
-msgstr ""
+msgstr "CommaFeed バージョン {version} ({revision})。"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Compact"
@@ -210,11 +218,11 @@ msgstr "パスワード確認"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Cozy"
-msgstr "コージー"
+msgstr "Cozy"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Ctrl"
-msgstr "コントロール"
+msgstr "Ctrl"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Current password"
@@ -222,19 +230,19 @@ msgstr "現在のパスワード"
 
 #: src/pages/app/SettingsPage.tsx
 msgid "Custom code"
-msgstr ""
+msgstr "カスタムコード"
 
 #: src/components/settings/CustomCodeSettings.tsx
 msgid "Custom CSS rules that will be applied"
-msgstr ""
+msgstr "適用されるカスタムCSSルール"
 
 #: src/components/settings/CustomCodeSettings.tsx
 msgid "Custom JS code that will be executed on page load"
-msgstr ""
+msgstr "ページ読み込み時に実行されるカスタムJSコード"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Dark"
-msgstr ""
+msgstr "ダーク"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Date created"
@@ -251,7 +259,7 @@ msgstr "アカウント削除"
 
 #: src/pages/app/CategoryDetailsPage.tsx
 msgid "Delete Category"
-msgstr "カテゴリを削除"
+msgstr "カテゴリーを削除"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Delete user"
@@ -263,7 +271,7 @@ msgstr "説明"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Detailed"
-msgstr ""
+msgstr "詳細"
 
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/app/SettingsPage.tsx
@@ -273,7 +281,7 @@ msgstr "ディスプレイ"
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/app/DonatePage.tsx
 msgid "Donate"
-msgstr ""
+msgstr "寄付"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Download"
@@ -298,7 +306,7 @@ msgstr "メールアドレス"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Edit user"
-msgstr "ユーザー編集"
+msgstr "ユーザーの編集"
 
 #: src/components/admin/UserEdit.tsx
 #: src/pages/admin/AdminUsersPage.tsx
@@ -313,9 +321,13 @@ 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 ""
+msgstr "エントリーヘッダー"
 
 #: src/components/Alert.tsx
 msgid "Error"
@@ -323,7 +335,7 @@ msgstr "エラー"
 
 #: src/pages/app/FeedDetailsPage.tsx
 msgid "Example: {example}."
-msgstr "例: {例}."
+msgstr "例: {example}."
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Expanded"
@@ -336,7 +348,7 @@ msgstr "サブスクリプションとカテゴリを、他のフィード読み
 #: src/components/header/Header.tsx
 #: src/pages/WelcomePage.tsx
 msgid "Extension options"
-msgstr ""
+msgstr "拡張機能オプション"
 
 #: src/components/content/add/Subscribe.tsx
 msgid "Feed name"
@@ -350,43 +362,47 @@ msgstr "フィード URL"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Fetch all my feeds now"
-msgstr ""
+msgstr "すべてのフィードを今すぐ取得"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Fever API"
-msgstr ""
+msgstr "Fever API"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Fever API URL"
-msgstr ""
+msgstr "Fever API URL"
 
 #: src/pages/app/FeedDetailsPage.tsx
 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 "パスワードをお忘れですか?"
+msgstr "パスワードをお忘れですか？"
 
 #: src/pages/app/CategoryDetailsPage.tsx
 #: src/pages/app/FeedDetailsPage.tsx
 #: src/pages/app/TagDetailsPage.tsx
 msgid "Generate an API key in your profile first."
-msgstr "最初にプロファイルで API キーを生成します。"
+msgstr "最初にプロファイルでAPIキーを生成します。"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "Generate new API key"
-msgstr "新しい API キーを生成する"
+msgstr "新しいAPIキーを生成する"
 
 #: src/pages/app/CategoryDetailsPage.tsx
 #: src/pages/app/FeedDetailsPage.tsx
 #: src/pages/app/TagDetailsPage.tsx
 msgid "Generated feed url"
-msgstr "生成されたフィード URL"
+msgstr "生成されたフィードURL"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 msgid "Go to {0}"
-msgstr ""
+msgstr "{0} に移動"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Go to the All view"
@@ -394,11 +410,11 @@ msgstr "すべてのビューに移動"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Go to the API documentation."
-msgstr "API ドキュメントに移動します。"
+msgstr "APIドキュメントに移動します。"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Goodies"
-msgstr "グッディーズ"
+msgstr "グッズ"
 
 #: src/pages/admin/AdminUsersPage.tsx
 msgid "Id"
@@ -406,15 +422,15 @@ 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' に評価される式。 "
+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."
-msgstr "問題が発生した場合は、GitHub プロジェクトの問題ページで報告してください。"
+msgstr "問題が発生した場合は、GitHubプロジェクトのissuesページで報告してください。"
 
 #: src/components/content/add/ImportOpml.tsx
 msgid "Import"
@@ -422,7 +438,7 @@ msgstr "インポート"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "In expanded view, scrolling through entries mark them as read"
-msgstr "展開ビューでエントリをスクロールすると、それらが既読としてマークされます"
+msgstr "展開ビューでエントリーをスクロールすると、それらが既読としてマークされます"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 #: src/components/content/FeedEntryFooter.tsx
@@ -452,7 +468,7 @@ msgstr "最終更新メッセージ"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Light"
-msgstr ""
+msgstr "ライト"
 
 #: src/pages/app/CategoryDetailsPage.tsx
 #: src/pages/app/FeedDetailsPage.tsx
@@ -488,7 +504,7 @@ msgstr "ログアウト"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Long press"
-msgstr ""
+msgstr "長押し"
 
 #: src/components/header/ProfileMenu.tsx
 #: src/pages/admin/AdminUsersPage.tsx
@@ -502,7 +518,7 @@ msgstr "すべて既読にする"
 #: src/components/header/MarkAllAsReadButton.tsx
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Mark all entries as read"
-msgstr "すべてのエントリを既読にする"
+msgstr "すべてのエントリーを既読にする"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 #: src/components/content/FeedEntryFooter.tsx
@@ -516,11 +532,11 @@ msgstr "ここまで既読にする"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Metrics"
-msgstr "メトリクス"
+msgstr "メトリックス"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Middle click"
-msgstr ""
+msgstr "中クリック"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Move the page down"
@@ -549,7 +565,7 @@ msgstr "名前を入力してサブスクリプションに移動します"
 #: src/components/settings/DisplaySettings.tsx
 #: src/components/settings/DisplaySettings.tsx
 msgid "Never"
-msgstr ""
+msgstr "しない"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "New password"
@@ -574,11 +590,11 @@ msgstr "次の未読アイテムのブックマークレット"
 
 #: src/pages/app/FeedEntriesPage.tsx
 msgid "No more entries"
-msgstr "これ以上エントリはありません"
+msgstr "これ以上エントリーはありません"
 
 #: src/components/content/ShareButtons.tsx
 msgid "No sharing options available."
-msgstr ""
+msgstr "共有オプションは利用できません。"
 
 #: src/components/sidebar/TreeSearch.tsx
 msgid "Nothing found"
@@ -590,15 +606,19 @@ msgstr "古い順"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On desktop"
-msgstr ""
+msgstr "デスクトップ"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On mobile"
-msgstr ""
+msgstr "モバイル"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "On mobile, show action buttons at the bottom of the screen"
-msgstr ""
+msgstr "モバイルでは、画面の下部にアクションボタンを表示します"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Only applies to compact, cozy and detailed modes"
+msgstr "これはコンパクト/cozy/詳細モードでのみ適用されます"
 
 #: src/pages/ErrorPage.tsx
 msgid "Oops!"
@@ -606,15 +626,15 @@ msgstr "おっと！"
 
 #: src/components/header/Header.tsx
 msgid "Open CommaFeed"
-msgstr ""
+msgstr "CommaFeedを開く"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Open current entry in a new tab"
-msgstr "現在のエントリを新しいタブで開く"
+msgstr "現在のエントリーを新しいタブで開く"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Open current entry in a new tab in the background"
-msgstr "現在のエントリをバックグラウンドで新しいタブで開く"
+msgstr "現在のエントリーを新しいバックグラウンドタブで開く"
 
 #: src/components/content/FeedEntryFooter.tsx
 #: src/components/content/header/OpenExternalLink.tsx
@@ -623,31 +643,31 @@ msgstr "リンクを開く"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 msgid "Open link in new background tab"
-msgstr ""
+msgstr "リンクを新しいバックグラウンドタブで開く"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 msgid "Open link in new tab"
-msgstr ""
+msgstr "リンクを新しいタブで開く"
 
 #: src/pages/app/Layout.tsx
 msgid "Open menu"
-msgstr ""
+msgstr "メニューを開く"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Open next entry"
-msgstr "次のエントリを開く"
+msgstr "次のエントリーを開く"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Open previous entry"
-msgstr "前のエントリを開く"
+msgstr "前のエントリーを開く"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Open/close current entry"
-msgstr "現在のエントリを開く/閉じる"
+msgstr "現在のエントリーを開く/閉じる"
 
 #: src/pages/app/AddPage.tsx
 msgid "OPML"
-msgstr ""
+msgstr "OPML"
 
 #: src/components/settings/ProfileSettings.tsx
 msgid "OPML export"
@@ -660,7 +680,7 @@ msgstr "OPMLファイル"
 
 #: src/components/content/add/ImportOpml.tsx
 msgid "OPML file is required"
-msgstr ""
+msgstr "OPMLファイルは必要です"
 
 #: src/pages/app/AboutPage.tsx
 msgid "Order"
@@ -697,7 +717,7 @@ msgstr "位置"
 
 #: src/components/header/Header.tsx
 msgid "Previous"
-msgstr ""
+msgstr "前へ"
 
 #: src/pages/app/SettingsPage.tsx
 msgid "Profile"
@@ -714,16 +734,16 @@ msgstr "リフレッシュ"
 
 #: src/pages/auth/RegistrationPage.tsx
 msgid "Registrations are closed on this CommaFeed instance"
-msgstr "この CommaFeed インスタンスの登録は終了しています"
+msgstr "このCommaFeedインスタンスの登録は終了しています"
 
 #: src/pages/app/AboutPage.tsx
 msgid "REST API"
-msgstr ""
+msgstr "REST API"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Right click"
-msgstr ""
+msgstr "右クリック"
 
 #: src/components/admin/UserEdit.tsx
 #: src/components/settings/CustomCodeSettings.tsx
@@ -735,15 +755,15 @@ 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"
-msgstr "エントリ間を移動するときにスムーズにスクロールする"
+msgstr "エントリー間を移動するときにスムーズにスクロールする"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Scrolling"
-msgstr ""
+msgstr "スクロール"
 
 #: src/components/header/Header.tsx
 #: src/components/header/Header.tsx
@@ -754,15 +774,15 @@ msgstr "検索"
 
 #: src/components/header/Header.tsx
 msgid "Search requires at least 3 characters"
-msgstr "検索には少なくとも 3 文字が必要です"
+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"
@@ -784,31 +804,31 @@ msgstr "共有サイト"
 #: src/components/KeyboardShortcutsHelp.tsx
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Shift"
-msgstr "シフト"
+msgstr "Shift"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show CommaFeed's own context menu on right click"
-msgstr ""
+msgstr "右クリックでCommaFeedのコンテキストメニューを表示する"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show confirmation when marking all entries as read"
-msgstr ""
+msgstr "すべてのエントリーを既読にするときに確認を表示する"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show entry menu (desktop)"
-msgstr ""
+msgstr "エントリーメニューを表示する(デスクトップ)"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show entry menu (mobile)"
-msgstr ""
+msgstr "エントリーメニューを表示する(モバイル)"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show external link icon"
-msgstr ""
+msgstr "外部リンクアイコンを表示する"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show feeds and categories with no unread entries"
-msgstr "未読エントリのないフィードとカテゴリを表示する"
+msgstr "未読エントリーのないフィードとカテゴリーを表示する"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show keyboard shortcut help"
@@ -816,11 +836,19 @@ msgstr "キーボード ショートカットのヘルプを表示"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Show native menu (desktop)"
-msgstr ""
+msgstr "ネイティブメニューを表示する(デスクトップ)"
 
 #: src/components/settings/DisplaySettings.tsx
 msgid "Show star icon"
-msgstr ""
+msgstr "スターアイコンを表示する"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr "未読数をタブのアイコンに表示する"
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr "未読数をタブのタイトルに表示する"
 
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
@@ -830,12 +858,12 @@ msgstr "サインアップ"
 
 #: src/pages/ErrorPage.tsx
 msgid "Something bad just happened..."
-msgstr "何か悪いことが起こった..."
+msgstr "何か悪いことが起きました..."
 
 #: src/components/KeyboardShortcutsHelp.tsx
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Space"
-msgstr "スペース"
+msgstr "Space"
 
 #: src/components/content/FeedEntryContextMenu.tsx
 #: src/components/content/FeedEntryFooter.tsx
@@ -868,7 +896,7 @@ msgstr "成功"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Swipe header to the left"
-msgstr ""
+msgstr "ヘッダーを左にスワイプ"
 
 #: src/pages/WelcomePage.tsx
 msgid "Switch to dark theme"
@@ -880,7 +908,7 @@ msgstr "ライトテーマに切り替え"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "System"
-msgstr ""
+msgstr "システム"
 
 #: src/components/content/FeedEntryFooter.tsx
 #: src/components/content/FeedEntryFooter.tsx
@@ -889,7 +917,7 @@ msgstr "タグ"
 
 #: 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 "購読したいフィードのURL。 "
+msgstr "購読したいフィードのURL。ウェブサイトのURLを直接使用して、CommaFeedはページ内のフィードを検索します。"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Theme"
@@ -897,27 +925,27 @@ msgstr "テーマ"
 
 #: 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 "これはあなたのAPIキーです。いくつかの読み取り専用API操作に使用できます。これにより、Fever APIへのアクセスが可能になります。ページの下部のフォームを使用して新しいAPIキーを生成します。"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Toggle read status of current entry"
-msgstr "現在のエントリの読み取りステータスを切り替えます"
+msgstr "現在のエントリーの読み取りステータスを切り替えます"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Toggle sidebar"
-msgstr ""
+msgstr "サイドバーを切り替える"
 
 #: src/components/KeyboardShortcutsHelp.tsx
 msgid "Toggle starred status of current entry"
-msgstr ""
+msgstr "現在のエントリーのスターステータスを切り替える"
 
 #: src/pages/auth/LoginPage.tsx
 msgid "Try out CommaFeed with the demo account: demo/demo"
-msgstr "デモアカウントで CommaFeed を試す: demo/demo"
+msgstr "デモアカウントでCommaFeedを試す: demo/demo"
 
 #: src/pages/WelcomePage.tsx
 msgid "Try the demo!"
-msgstr ""
+msgstr "デモを試す！"
 
 #: src/components/header/Header.tsx
 msgid "Unread"
@@ -953,8 +981,8 @@ msgstr "ウェブサイト"
 
 #: 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 "まだサブスクリプションがありません。"
+msgstr "まだサブスクリプションがありません。上部の + 記号をクリックして1つ追加してみませんか？"
 
 #: src/components/header/ProfileMenu.tsx
 msgid "Your feeds have been queued for refresh."
-msgstr ""
+msgstr "フィードの更新がキューに登録されました。"

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "피드가 작동하는지 확인"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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 "비밀번호를 잊으셨나요?"
@@ -600,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 "앗!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx

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

@@ -140,6 +140,10 @@ msgstr ""
 msgid "Browser extention"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Browser tab"
+msgstr ""
+
 #: src/components/admin/UserEdit.tsx
 #: src/components/content/add/AddCategory.tsx
 #: src/components/content/add/ImportOpml.tsx
@@ -176,6 +180,10 @@ msgstr "Semak sama ada suapan berfungsi"
 msgid "Close menu"
 msgstr ""
 
+#: src/components/KeyboardShortcutsHelp.tsx
+msgid "Cmd"
+msgstr ""
+
 #: src/pages/app/AboutPage.tsx
 msgid "CommaFeed browser extension version {browserExtensionVersion}."
 msgstr ""
@@ -313,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 ""
@@ -364,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?"
@@ -600,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!"
@@ -822,6 +842,14 @@ msgstr ""
 msgid "Show star icon"
 msgstr ""
 
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab favicon"
+msgstr ""
+
+#: src/components/settings/DisplaySettings.tsx
+msgid "Show unread count in tab title"
+msgstr ""
+
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/auth/RegistrationPage.tsx
 #: src/pages/WelcomePage.tsx