Refactor metadataRender function

[JassonCordones]

Splited into:

• ensureMetadataLoaded
• sortMetadata
• getMaxKeyLength
• computeWidths
• formatMetadataLines

Summary by CodeRabbit

• Refactor
  • Improved the performance and reliability of metadata display by restructuring internal logic for loading, sorting, and formatting metadata, while maintaining the same user experience.
  • Enhanced file panel rendering with clearer separation of interface elements including top bar, search bar, file entries, and footer for better modularity.
  • Upgraded image preview to support multiple rendering backends, adding compatibility with the Kitty graphics protocol alongside ANSI output for richer image display.

[coderabbitai[bot]]

Walkthrough

This change refactors the file preview rendering by extracting helper functions for different preview types and error handling. It introduces a new ImagePreviewer type with caching, terminal capability detection, and support for Kitty and ANSI image rendering. The update removes PDF and auto preview code, adds image resizing with EXIF orientation handling, updates dependencies, and adjusts related configuration, constants, and tests.

Changes

File(s)	Change Summary
src/internal/model_render.go, src/internal/model_render_test.go	Refactored file preview rendering into multiple helper methods; added helpers for empty preview, error display, unsupported formats, directory, image, and text previews; updated tests with output normalization helper; removed unused import.
src/internal/type.go, src/internal/default_config.go	Added imagePreviewer *filepreview.ImagePreviewer field to model struct and initialized it; added errorMesssage field to typingModal; updated imports accordingly.
src/internal/common/predefined_variable.go	Added constant DateModifiedOption and variable FilePreviewError; updated UI text variables to include consistent spacing around icons and error messages.
src/pkg/file_preview/image_preview.go	Introduced ImagePreviewer type with caching, renderer selection (Kitty/ANSI), and enhanced error handling; replaced direct file decoding with memory buffer processing; removed EXIF orientation adjustment functions and unused imports.
src/pkg/file_preview/image_resize.go	Added new file with functions for image preparation, resizing, EXIF orientation adjustment, resolution limiting, and ANSI-specific resizing.
src/pkg/file_preview/kitty.go	Added new file supporting Kitty graphics protocol: detection of Kitty capability, clear image commands, rendering with aspect ratio preservation, and placement ID generation.
src/pkg/file_preview/utils.go	Added terminal capability detection for pixel dimensions of terminal cells; introduced TerminalCapabilities and TerminalCellSize types; implemented asynchronous detection with fallback defaults; added initialization in ImagePreviewer.
src/pkg/file_preview/auto.go, src/pkg/file_preview/pdf_preview.go	Removed entire files related to automatic preview detection and PDF preview functionality.
go.mod, gomod2nix.toml	Updated dependencies: added github.com/BourgeoisBear/rasterm, upgraded golang.org/x/* modules, removed github.com/nfnt/resize, and adjusted direct/indirect dependency declarations.
testsuite/core/base_test.py, testsuite/core/test_constants.py	Added start_wait_time parameter with validation and delay in test startup; prepended a no-op key press to key inputs to fix first key press issue; defined new constant START_WAIT_TIME.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Model
    participant ImagePreviewer
    participant TerminalCapabilities

    User->>Model: Request file preview
    Model->>Model: Determine file type/state
    alt Directory
        Model->>Model: renderDirectoryPreview()
    else Image
        Model->>ImagePreviewer: ImagePreview(path, width, height, bg, sideAreaWidth)
        ImagePreviewer->>TerminalCapabilities: GetTerminalCellSize()
        ImagePreviewer->>ImagePreviewer: Check cache
        alt Not cached
            ImagePreviewer->>ImagePreviewer: Prepare and resize image
            ImagePreviewer->>ImagePreviewer: Render with Kitty or ANSI
            ImagePreviewer->>ImagePreviewer: Store in cache
        end
        ImagePreviewer-->>Model: Rendered image preview string
    else Text
        Model->>Model: renderTextPreview()
    else Error/Unsupported
        Model->>Model: renderFileInfoError()/renderUnsupportedFormat()
    end
    Model-->>User: Return preview output

Possibly related PRs

• yorukot/superfile#756: Refactors file preview rendering and introduces the ImagePreviewer type with caching and terminal capability detection, directly related to the image preview functionality changes in this PR.

Suggested labels

refactoring

Suggested reviewers

• yorukot

Poem

A hop, a skip, a preview anew,
Images cached and rendered true.
Kitty or ANSI, the terminal knows,
Directories sorted in tidy rows.
With code refactored, errors are few—
This rabbit leaps forward, just for you!
🐇✨

✨ Finishing Touches

• [ ] 📝 Generate Docstrings

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Explain this complex logic.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai explain this code block.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read src/utils.ts and explain its main purpose.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai generate docstrings to generate docstrings for this PR.
• @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[JassonCordones]

please do not merge b128dd6961b4343960110ef34d029e1d423da7ed I still have not figured out this.

[lazysegtree]

@JassonCordones Just a tip. to fix go fmt build issues. Just run go fmt ./...

or if you have golangcilint then golangci-lint run --fix

[booth-w]

The kitty image preview does not work for me.

https://github.com/user-attachments/assets/8fe3387f-8781-404b-a804-9dae19650244

It displays two small images in the bottom left, pushing most of the UI up. The image stays there when the cursor has moved from the file.

kitty 0.42.1-1 kitty-shell-integration 0.42.1-1 kitty-terminfo 0.42.1-1

[JassonCordones]

@booth-w As I mentioned above this MR is not ready yet. I'm working on it, but I probably wont have time to debug it until the weekend.

[booth-w]

I just thought I should mention it because I didn't know if I was only happening to me or not. I thought the refactoring was the only reason it wasn't ready.

[JassonCordones]

Thanks. I'll try to fix it ASAP since is the only thing that keep me from making spf my main terminal filemanager.

[JassonCordones]

Apparently this task is not as easy as I thought. Rendering kitty images breaks the layout of spf because the lipgloss renderer is only suitable for ANSI escape sequences and to OSC sequences (kitty graphics protocol).

[JassonCordones]

I removed the kitty renderer related code since I concluded it would be to much time for me to to write a renderer that doesn't break the layout

[lazysegtree]

@JassonCordones Can you fix build failures ?

[yorukot]

I'm working on fixing this right now. I think I've made some progress, but there are still a few issues(as you can see below). This is just a demo for now.

https://github.com/user-attachments/assets/9582629f-0b30-4560-b8f2-bf53a8c6c4ad

The reason why the third picture takes so long is because it is an 8k picture

[yorukot]

I’ve mostly finished the file preview feature for Kitty (thanks to @JassonCordones for the idea on how to implement it). However, there are still a few issues:

1. The top part of the file panel disappears when previewing images.I haven’t figured out why yet.
2. There’s serious lag when previewing large images. Maybe we could skip previewing files over a certain size? (Yazi handles it this way.)

https://github.com/user-attachments/assets/0334a078-7db5-415b-9043-21305664ca15

Yazi handle large image:

[JassonCordones]

@yorukot Thanks for taking on this. I'll give it a check later to see how I can help.

[lazysegtree]

Yazi

Image preview doesn't works for me at least right now. Its showing blurry output and its breaking the layout.

@JassonCordones Can you cut out a separate PR for just metadata function refactoring. And keep image preview in this PR. This might take a long time. I wanted to get done with metadata function refactoring.

[yorukot]

@lazysegtree What terminal are you using? The issue might be that your terminal isn’t recognized, and it probably needs to be added manually in the code.

[lazysegtree]

@yorukot Moved conversation to discord chat. PR comments are getting too huge. (#image-preview channel)

@JassonCordones Please check out the discord channel mentioned in the ReadMe.

[lazysegtree]

After the metadata refactor PR (https://github.com/yorukot/superfile/pull/867) is merged, need to remove these refactor commits. Or maybe create a new PR altogether.