Skip to content

fix(FilePreview): prevent layout breaks with long filenames#2415

Merged
lidel merged 1 commit intoipfs:mainfrom
alikhere:fix/long-name
Sep 17, 2025
Merged

fix(FilePreview): prevent layout breaks with long filenames#2415
lidel merged 1 commit intoipfs:mainfrom
alikhere:fix/long-name

Conversation

@alikhere
Copy link
Contributor

@alikhere alikhere commented Aug 27, 2025

Issue

Long filenames in the file preview were causing horizontal scrollbars and breaking the layout.

Changes

  • Added smart middle truncation for filenames longer than 40 characters
  • Shows the beginning and end with "..." in the middle (like very-long-filename...layout.pdf)
  • File extensions stay visible so you always know the file type

The truncation is smart about preserving the most useful parts of the filename while keeping the layout clean.

Screenshot

2025-08-28.02-42-19.mp4

Fixes #2405

@alikhere alikhere requested a review from a team as a code owner August 27, 2025 21:33
@alikhere
Copy link
Contributor Author

@SgtPooki Could you please review this PR

@lidel lidel changed the title Fix: Prevent layout breaks with long filenames fix(FilePreview): prevent layout breaks with long filenames Sep 17, 2025
Copy link
Member

@lidel lidel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you @alikhere, lgtm!

@lidel lidel merged commit f82efcd into ipfs:main Sep 17, 2025
20 checks passed
ipfs-gui-bot pushed a commit that referenced this pull request Sep 17, 2025
## [4.9.0](v4.8.0...v4.9.0) (2025-09-17)

 CID `bafybeietkqxghs3hm56e3w64s4papqlvvzqzjigs4eyuy24plkpz652fee`

 ---

### Features

* add Agent Version column to peers table ([#2433](#2433)) ([614f30d](614f30d)), closes [ipfs/kubo#9465](ipfs/kubo#9465) [ipfs/js-kubo-rpc-client#342](ipfs/js-kubo-rpc-client#342) [ipfs/kubo#9465](ipfs/kubo#9465)
* add close button to file viewer for improved navigation ([#2401](#2401)) ([84969a5](84969a5))
* add diagnostics screen ([#2392](#2392)) ([f3a8179](f3a8179)), closes [#2424](#2424) [ipfs-check#102](ipfs/ipfs-check#102) [/github.com/ipfs/ipfs-check/pull/102#pullrequestreview-3214396503](https://github.com/ipfs//github.com/ipfs/ipfs-check/pull/102/issues/pullrequestreview-3214396503) [#2434](#2434)
* **files:** advanced sorting options ([#2421](#2421)) ([c9251eb](c9251eb))
* migrate Tooltip from Javascript to Typescript ([#2381](#2381)) ([dc9e9ac](dc9e9ac))

### Bug Fixes

* create redux-bundler migration helpers ([#2388](#2388)) ([d1fdb87](d1fdb87))
* display UX friendly error for missing files ([#2346](#2346)) ([d4e7fca](d4e7fca))
* **files:** rename in Grid View ([#2422](#2422)) ([e39bce6](e39bce6))
* **i18n:** prevent English replacements in translation sync workflow ([#2418](#2418)) ([323c59e](323c59e))
* macos input focus issue in draggable regions ([#2416](#2416)) ([5382688](5382688))
* migrate error boundary to typescript ([#2402](#2402)) ([b33775a](b33775a))
* **navbar:**  highlighting on browser back ([#2425](#2425)) ([cec6dfd](cec6dfd))
* Prevent layout breaks with long filenames in file preview ([#2415](#2415)) ([f82efcd](f82efcd))
* reference to `global` in browser environment ([#2408](#2408)) ([03b2e92](03b2e92))
* shared max for bandwidth chart ([#2426](#2426)) ([cd17032](cd17032))
* typecheck more files ([#2409](#2409)) ([fb967ee](fb967ee))

### Tests

* fix bring-your-own kubo node functionality ([#2396](#2396)) ([0883cfa](0883cfa))
* make e2e tests more robust ([#2438](#2438)) ([3de544b](3de544b))

### Trivial Changes

* **readme:** update links ([dc6f8f4](dc6f8f4))
* remove selectApiUrl selector ([#2412](#2412)) ([d4710e8](d4710e8))
@ipfs-gui-bot
Copy link
Collaborator

🎉 This PR is included in version 4.9.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug: very long names in mfs are not truncated

3 participants