[BUG] Draggable scrollbar incorrect offset - web #1273

Closed
opened 2026-02-05 01:08:29 +03:00 by OVERLORD · 5 comments
Owner

Originally created by @ClumsyAdmin on GitHub (Aug 25, 2023).

The bug

If you click a month on the right side web timeline, it will always show you the following month rather then the month you clicked. For example, if I click on March it will bring me to April. This isn't an issue on mobile, mobile works perfectly. I've tried multiple browsers to confirm it's not a Firefox issue and it occurs on Edge (chrome) as well. Happens on demo immich as well so is not an issue with my specific library.

The OS that Immich Server is running on

Debian

Version of Immich Server

v1.74.0

Version of Immich Mobile App

v1.74.0

Platform with the issue

  • Server
  • Web
  • Mobile

Your docker-compose.yml content

version: "3.8"

services:
  immich-server:
    container_name: immich_server
    image: ghcr.io/immich-app/immich-server:release
    entrypoint: [ "/bin/sh", "./start-server.sh" ]
    volumes:
      - ${UPLOAD_LOCATION}:/usr/src/app/upload
    env_file:
      - .env
    environment:
      - NODE_ENV=production
    depends_on:
      - redis
      - database
      - typesense
    restart: always

  immich-microservices:
    container_name: immich_microservices
    image: ghcr.io/immich-app/immich-server:release
    entrypoint: [ "/bin/sh", "./start-microservices.sh" ]
    volumes:
      - ${UPLOAD_LOCATION}:/usr/src/app/upload
    env_file:
      - .env
    environment:
      - NODE_ENV=production
    depends_on:
      - redis
      - database
      - typesense
    restart: always

  immich-machine-learning:
    container_name: immich_machine_learning
    image: ghcr.io/immich-app/immich-machine-learning:release
    volumes:
      - ${UPLOAD_LOCATION}:/usr/src/app/upload
      - model-cache:/cache
    env_file:
      - .env
    environment:
      - NODE_ENV=production
    restart: always

  immich-web:
    container_name: immich_web
    image: ghcr.io/immich-app/immich-web:release
    entrypoint: [ "/bin/sh", "./entrypoint.sh" ]
    env_file:
      - .env
    restart: always

  typesense:
    container_name: immich_typesense
    image: typesense/typesense:0.24.0
    environment:
      - TYPESENSE_API_KEY=${TYPESENSE_API_KEY}
      - TYPESENSE_DATA_DIR=/data
    logging:
      driver: none
    volumes:
      - tsdata:/data

  redis:
    container_name: immich_redis
    image: redis:6.2
    restart: always

  database:
    container_name: immich_postgres
    image: postgres:14
    env_file:
      - .env
    environment:
      POSTGRES_PASSWORD: ${DB_PASSWORD}
      POSTGRES_USER: ${DB_USERNAME}
      POSTGRES_DB: ${DB_DATABASE_NAME}
      PG_DATA: /var/lib/postgresql/data
    volumes:
      - pgdata:/var/lib/postgresql/data
    restart: always

  immich-proxy:
    container_name: immich_proxy
    image: ghcr.io/immich-app/immich-proxy:release
    environment:
      # Make sure these values get passed through from the env file
      - IMMICH_SERVER_URL
      - IMMICH_WEB_URL
    ports:
      - 2283:8080
    logging:
      driver: none
    depends_on:
      - immich-server
    restart: always

volumes:
  pgdata:
  model-cache:
  tsdata:

Your .env content

###################################################################################
# Database
###################################################################################

DB_HOSTNAME=immich_postgres
DB_USERNAME=
DB_PASSWORD=
DB_DATABASE_NAME=immich

# Optional Database settings:
# DB_PORT=5432

###################################################################################
# Redis
###################################################################################

REDIS_HOSTNAME=immich_redis

# Optional Redis settings:
# REDIS_PORT=6379
# REDIS_DBINDEX=0
# REDIS_PASSWORD=
# REDIS_SOCKET=

###################################################################################
# Upload File Config
###################################################################################

UPLOAD_LOCATION=/mnt/slab1/photos/immich/data/

###################################################################################
# Log message level - [simple|verbose]
###################################################################################

LOG_LEVEL=simple

###################################################################################
# JWT SECRET
###################################################################################

JWT_SECRET=

###################################################################################
# Reverse Geocoding
####################################################################################

# DISABLE_REVERSE_GEOCODING=false

# Reverse geocoding is done locally which has a small impact on memory usage
# This memory usage can be altered by changing the REVERSE_GEOCODING_PRECISION variable
# This ranges from 0-3 with 3 being the most precise
# 3 - Cities > 500 population: ~200MB RAM
# 2 - Cities > 1000 population: ~150MB RAM
# 1 - Cities > 5000 population: ~80MB RAM
# 0 - Cities > 15000 population: ~40MB RAM

REVERSE_GEOCODING_PRECISION=3

####################################################################################
# WEB - Optional
####################################################################################

# Custom message on the login page, should be written in HTML form.
# For example PUBLIC_LOGIN_PAGE_MESSAGE="This is a demo instance of Immich.<br><br>Email: <i>demo@demo.de</i><br>Password: <i>demo</i>"

#PUBLIC_LOGIN_PAGE_MESSAGE=
TYPESENSE_API_KEY=

Reproduction steps

1. Click on web timeline of a month
2. You'll see photos from the month after the one that you clicked

Additional information

No response

Originally created by @ClumsyAdmin on GitHub (Aug 25, 2023). ### The bug If you click a month on the right side web timeline, it will always show you the following month rather then the month you clicked. For example, if I click on March it will bring me to April. This isn't an issue on mobile, mobile works perfectly. I've tried multiple browsers to confirm it's not a Firefox issue and it occurs on Edge (chrome) as well. Happens on demo immich as well so is not an issue with my specific library. ### The OS that Immich Server is running on Debian ### Version of Immich Server v1.74.0 ### Version of Immich Mobile App v1.74.0 ### Platform with the issue - [ ] Server - [X] Web - [ ] Mobile ### Your docker-compose.yml content ```YAML version: "3.8" services: immich-server: container_name: immich_server image: ghcr.io/immich-app/immich-server:release entrypoint: [ "/bin/sh", "./start-server.sh" ] volumes: - ${UPLOAD_LOCATION}:/usr/src/app/upload env_file: - .env environment: - NODE_ENV=production depends_on: - redis - database - typesense restart: always immich-microservices: container_name: immich_microservices image: ghcr.io/immich-app/immich-server:release entrypoint: [ "/bin/sh", "./start-microservices.sh" ] volumes: - ${UPLOAD_LOCATION}:/usr/src/app/upload env_file: - .env environment: - NODE_ENV=production depends_on: - redis - database - typesense restart: always immich-machine-learning: container_name: immich_machine_learning image: ghcr.io/immich-app/immich-machine-learning:release volumes: - ${UPLOAD_LOCATION}:/usr/src/app/upload - model-cache:/cache env_file: - .env environment: - NODE_ENV=production restart: always immich-web: container_name: immich_web image: ghcr.io/immich-app/immich-web:release entrypoint: [ "/bin/sh", "./entrypoint.sh" ] env_file: - .env restart: always typesense: container_name: immich_typesense image: typesense/typesense:0.24.0 environment: - TYPESENSE_API_KEY=${TYPESENSE_API_KEY} - TYPESENSE_DATA_DIR=/data logging: driver: none volumes: - tsdata:/data redis: container_name: immich_redis image: redis:6.2 restart: always database: container_name: immich_postgres image: postgres:14 env_file: - .env environment: POSTGRES_PASSWORD: ${DB_PASSWORD} POSTGRES_USER: ${DB_USERNAME} POSTGRES_DB: ${DB_DATABASE_NAME} PG_DATA: /var/lib/postgresql/data volumes: - pgdata:/var/lib/postgresql/data restart: always immich-proxy: container_name: immich_proxy image: ghcr.io/immich-app/immich-proxy:release environment: # Make sure these values get passed through from the env file - IMMICH_SERVER_URL - IMMICH_WEB_URL ports: - 2283:8080 logging: driver: none depends_on: - immich-server restart: always volumes: pgdata: model-cache: tsdata: ``` ### Your .env content ```Shell ################################################################################### # Database ################################################################################### DB_HOSTNAME=immich_postgres DB_USERNAME= DB_PASSWORD= DB_DATABASE_NAME=immich # Optional Database settings: # DB_PORT=5432 ################################################################################### # Redis ################################################################################### REDIS_HOSTNAME=immich_redis # Optional Redis settings: # REDIS_PORT=6379 # REDIS_DBINDEX=0 # REDIS_PASSWORD= # REDIS_SOCKET= ################################################################################### # Upload File Config ################################################################################### UPLOAD_LOCATION=/mnt/slab1/photos/immich/data/ ################################################################################### # Log message level - [simple|verbose] ################################################################################### LOG_LEVEL=simple ################################################################################### # JWT SECRET ################################################################################### JWT_SECRET= ################################################################################### # Reverse Geocoding #################################################################################### # DISABLE_REVERSE_GEOCODING=false # Reverse geocoding is done locally which has a small impact on memory usage # This memory usage can be altered by changing the REVERSE_GEOCODING_PRECISION variable # This ranges from 0-3 with 3 being the most precise # 3 - Cities > 500 population: ~200MB RAM # 2 - Cities > 1000 population: ~150MB RAM # 1 - Cities > 5000 population: ~80MB RAM # 0 - Cities > 15000 population: ~40MB RAM REVERSE_GEOCODING_PRECISION=3 #################################################################################### # WEB - Optional #################################################################################### # Custom message on the login page, should be written in HTML form. # For example PUBLIC_LOGIN_PAGE_MESSAGE="This is a demo instance of Immich.<br><br>Email: <i>demo@demo.de</i><br>Password: <i>demo</i>" #PUBLIC_LOGIN_PAGE_MESSAGE= TYPESENSE_API_KEY= ``` ### Reproduction steps ```bash 1. Click on web timeline of a month 2. You'll see photos from the month after the one that you clicked ``` ### Additional information _No response_
OVERLORD added the 🖥️web label 2026-02-05 01:08:29 +03:00
Author
Owner

@Ploonet commented on GitHub (Sep 18, 2023):

Did anyone manage to reproduce the issue ? In my library & on the demo library and I don't see the issue. If i click on Aug 2019 pictures, i'll get Aug 2019 pictures, even if there are pictures in Jul 2019 or Sept 2019.

The behavior is a little surprising at first because Immich seems to have a continuous timeline, which means if you click half way between two months, you'll end up right at the middle of the photos of that month. Other than that, i see nothing out of the ordinary.

edit: i use firefox

@Ploonet commented on GitHub (Sep 18, 2023): Did anyone manage to reproduce the issue ? In my library & on the demo library and I don't see the issue. If i click on Aug 2019 pictures, i'll get Aug 2019 pictures, even if there are pictures in Jul 2019 or Sept 2019. The behavior is a little surprising at first because Immich seems to have a continuous timeline, which means if you click half way between two months, you'll end up right at the middle of the photos of that month. Other than that, i see nothing out of the ordinary. edit: i use firefox
Author
Owner

@ClumsyAdmin commented on GitHub (Sep 21, 2023):

jrasm91 removed triage so I assume he was able to reproduce. I can confirm it's still an issue on the latest version, and I use Firefox as well.

@ClumsyAdmin commented on GitHub (Sep 21, 2023): jrasm91 removed triage so I assume he was able to reproduce. I can confirm it's still an issue on the latest version, and I use Firefox as well.
Author
Owner

@gmag11 commented on GitHub (Oct 16, 2023):

I've reproduced this issue under Chrome Version 118.0.5993.71 (Official Build) (64-bit) in Windows 11. With Firefox it works fine.

image

This makes impossible to move cursor to the lower end as mouse pointer gets out of window before cursor reaches down there.

@gmag11 commented on GitHub (Oct 16, 2023): I've reproduced this issue under Chrome Version 118.0.5993.71 (Official Build) (64-bit) in Windows 11. With Firefox it works fine. ![image](https://github.com/immich-app/immich/assets/6190183/a11f678f-0d27-4d98-9c47-e6065da9858a) This makes impossible to move cursor to the lower end as mouse pointer gets out of window before cursor reaches down there.
Author
Owner

@jrasm91 commented on GitHub (Oct 16, 2023):

I think the intended behavior is clicking on the timeline should jump you to the top of the month that you clicked on.

@jrasm91 commented on GitHub (Oct 16, 2023): I think the intended behavior is clicking on the timeline should jump you to the top of the month that you clicked on.
Author
Owner

@ClumsyAdmin commented on GitHub (Oct 18, 2023):

This is now resolved with #4518 thanks @jrasm91!

@ClumsyAdmin commented on GitHub (Oct 18, 2023): This is now resolved with #4518 thanks @jrasm91!
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: immich-app/immich#1273