starred/immich

Fork 0

mirror of https://github.com/immich-app/immich.git synced 2026-03-02 22:57:45 -05:00

Server usage "slider" places its delimiter before its own start #7180

New issue

Open

opened 2026-02-20 05:00:20 -05:00 by deekerman · 3 comments

deekerman commented

2026-02-20 05:00:20 -05:00

Owner

Originally created by @Thibaulltt on GitHub (Oct 29, 2025).

I have searched the existing issues, both open and closed, to make sure this is not a duplicate report.

The bug

Quite a simple issue: when the server has a low amount of data used relative to the remaining size on disk left, the "delimiter" on the server usage widget is before the "slider" bar even starts -- see the following screenshot:

In this case, I'm using approx. 0.32% of my storage, and I'd expect the slider to behave more like this (shown here with a rough edit of the above screenshot):

The OS that Immich Server is running on

Truenas 24.10.2

Version of Immich Server

v2.1.0

Version of Immich Mobile App

2.1.0 build.3022

Platform with the issue

Server
Web
Mobile

Device make and model

Fairphone 4

Your docker-compose.yml content

The default one provided by the TrueNas community :)

Your .env content

Same as the docker-compose, the one provided by the Truenas community

Reproduction steps

Setup immich as usual.
Copy over some files, all for a very small %age of your available disk space
Setup the storage template and apply it
Notice the widget's state

Relevant log output

Additional information

No response

Originally created by @Thibaulltt on GitHub (Oct 29, 2025). ### I have searched the existing issues, both open and closed, to make sure this is not a duplicate report. - [x] Yes ### The bug Quite a simple issue: when the server has a low amount of data used relative to the remaining size on disk left, the "delimiter" on the server usage widget is before the "slider" bar even starts -- see the following screenshot: <img width="1080" height="492" alt="Image" src="https://github.com/user-attachments/assets/07469b96-a7bb-467f-9508-a1f435c7b44f" /> In this case, I'm using approx. 0.32% of my storage, and I'd expect the slider to behave more like this (shown here with a rough edit of the above screenshot): <img width="1080" height="492" alt="Image" src="https://github.com/user-attachments/assets/f1972bc1-d635-4dd4-a113-db53bded10dc" /> ### The OS that Immich Server is running on Truenas 24.10.2 ### Version of Immich Server v2.1.0 ### Version of Immich Mobile App 2.1.0 build.3022 ### Platform with the issue - [ ] Server - [ ] Web - [x] Mobile ### Device make and model Fairphone 4 ### Your docker-compose.yml content ```YAML The default one provided by the TrueNas community :) ``` ### Your .env content ```Shell Same as the docker-compose, the one provided by the Truenas community ``` ### Reproduction steps 1. Setup immich as usual. 2. Copy over some files, all for a very small %age of your available disk space 3. Setup the storage template and apply it 4. Notice the widget's state ### Relevant log output ```shell ``` ### Additional information _No response_

deekerman added the

good first issue

📱mobile

labels

2026-02-20 05:00:20 -05:00

deekerman commented

2026-02-20 05:00:21 -05:00

Author

Owner

@RealFinalCode commented on GitHub (Dec 28, 2025):

I took a quick look and it seems this is not really a bug, but more like a feature.
github.com/immich-app/immich@0df618feee/mobile/lib/widgets/common/app_bar_dialog/app_bar_dialog.dart (L137-L169)

The ugly line we are seeing is actually the left half of the progress bar forming.

Bar with 0.32%:

Bar with 2%:

Bar with 4%:

I am not sure how to fix this. My probably non ideal solution would be to clamp the progress to a reasonably good looking minimum of maybe 4%.

Any other opinions on this?

@RealFinalCode commented on GitHub (Dec 28, 2025): I took a quick look and it seems this is not really a bug, but more like a feature. https://github.com/immich-app/immich/blob/0df618feee47a4a23ace9ddfe650ce2d8e541fb6/mobile/lib/widgets/common/app_bar_dialog/app_bar_dialog.dart#L137-L169 The ugly line we are seeing is actually the left half of the progress bar forming. Bar with 0.32%: <img width="1172" height="356" alt="Image" src="https://github.com/user-attachments/assets/a8b15eef-1a82-4214-9f91-7d589e7d3a15" /> Bar with 2%: <img width="1150" height="342" alt="Image" src="https://github.com/user-attachments/assets/41e23977-caae-48dc-b3ed-788fe6af32a3" /> Bar with 4%: <img width="1140" height="341" alt="Image" src="https://github.com/user-attachments/assets/ff005f19-092d-4c17-b132-77a7a80a3929" /> I am not sure how to fix this. My probably non ideal solution would be to clamp the progress to a reasonably good looking minimum of maybe 4%. Any other opinions on this?

deekerman commented

2026-02-20 05:00:21 -05:00

Author

Owner

@Thibaulltt commented on GitHub (Dec 29, 2025):

Thanks for looking into this. Another solution would be to clamp the minimum amount shown to a "good" lower bound, as well as integrating the indicator inside the bar, like Android's default volume slider:

This shows the design of the default Android volume sliders in Android 15. Both the light and dark theme variants. Taken from AndroidPolice.

(taken from this page on AndroidPolice)

It's not shown here, but when those sliders are at 0% they get condensed into a circle with a diameter equal to the height of the horizontal bar, placed at its left-most edge.

@Thibaulltt commented on GitHub (Dec 29, 2025): Thanks for looking into this. Another solution would be to clamp the minimum amount shown to a "good" lower bound, as well as integrating the indicator _inside_ the bar, like Android's default volume slider: <img width="1536" height="822" alt="This shows the design of the default Android volume sliders in Android 15. Both the light and dark theme variants. Taken from AndroidPolice." src="https://github.com/user-attachments/assets/3e869c90-773e-4a66-b37c-283a9e65a6eb" /> (taken from [this page on AndroidPolice](https://www.androidpolice.com/android-15-dp2-volume-panel-changes/)) It's not shown here, but when those sliders are at 0% they get condensed into a circle with a diameter equal to the height of the horizontal bar, placed at its left-most edge.

deekerman commented

2026-02-20 05:00:21 -05:00

Author

Owner

@RealFinalCode commented on GitHub (Dec 30, 2025):

I actually think this is not an issue within Immich, but within Flutter. The M3 Docs state this:

At low percentages where space is limited, this should appear as a dot to help people understand that there’s progress underway.

In their code I found nothing indicating that they actually draw this circle at the start for low percentages...
github.com/flutter/flutter@c2d6b01bbd/packages/flutter/lib/src/material/progress_indicator.dart (L201-L353)

So maybe we should open an issue at the Flutter repo?

@RealFinalCode commented on GitHub (Dec 30, 2025): I actually think this is not an issue within Immich, but within Flutter. The M3 Docs state [this](https://m3.material.io/components/progress-indicators/guidelines#817a3dbd-9dd5-471f-a7d0-50eae6270ee0): > At low percentages where space is limited, this should appear as a dot to help people understand that there’s progress underway. > <img width="1352" height="600" alt="Image" src="https://github.com/user-attachments/assets/033108d8-7a49-4f27-9d59-56fdb0b03c30" /> In their code I found nothing indicating that they actually draw this circle at the start for low percentages... https://github.com/flutter/flutter/blob/c2d6b01bbd1102df129d24e63d1583d5b4a691ec/packages/flutter/lib/src/material/progress_indicator.dart#L201-L353 So maybe we should open an issue at the Flutter repo?

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

starred/immich#7180

No description provided.

Rows
Columns

Server usage "slider" places its delimiter *before* its own start #7180

I have searched the existing issues, both open and closed, to make sure this is not a duplicate report.

The bug

The OS that Immich Server is running on

Version of Immich Server

Version of Immich Mobile App

Platform with the issue

Device make and model

Your docker-compose.yml content

Your .env content

Reproduction steps

Relevant log output

Additional information

Server usage "slider" places its delimiter before its own start #7180