Skip to content

[Feature] Cover Image Usability Improvements#6865

Open
Stash-KennyG wants to merge 5 commits intostashapp:developfrom
Stash-KennyG:feature/6861-cover-image-usability-improvements
Open

[Feature] Cover Image Usability Improvements#6865
Stash-KennyG wants to merge 5 commits intostashapp:developfrom
Stash-KennyG:feature/6861-cover-image-usability-improvements

Conversation

@Stash-KennyG
Copy link
Copy Markdown
Contributor

@Stash-KennyG Stash-KennyG commented Apr 26, 2026

Resolves #6861

Summary

  • Improves Scene cover image workflows in the edit UI by consolidating actions into one grouped menu and keeping source metadata in sync.
  • Creates a new cover_image_source tracking across UI and API, including fallback behavior for legacy/external callers.
  • Adds File Info presentation for cover_image_source with readable, icon-based output for known source types.
  • Generate flows refresh edit preview image without requiring full page reload.

Why This Change

  • Cover image actions were split between multiple controls and were harder to discover/use consistently.
  • Interface had grown to set cover images through multiple paths; UI layout was inconsistent.
  • Source provenance is valuable for debugging and eventual scene handling through dupes/merges/etc.
  • Existing external tools (userscripts/plugins) may update cover image without explicitly setting source metadata.

User-Facing Improvements

  • Scene edit panel now uses a single Set image menu near the preview window with grouped actions:
image - FileInfo pane now includes cover image source data with icons consistent with the UI elements that generated them to help users connect behaviors. **Null** image **Default** image **Clipboard** image **Userscript** image **URL** image **Stash** image **Timestamp** image **File** image

API / Data Contract

  • Scene.cover_image_source is a nullable string field with semantic contract:
    • NULL means unknown / legacy / no cover.
    • Non-null values are provenance tokens describing the source of the current cover image.
  • SQLite enforces allowed values with a CHECK constraint:
    • fixed tokens: default, clipboard, userscript
    • prefixed tokens: url:*, stash:*, timestamp:*, file:*
  • GraphQL exposure:
    • field is available on Scene
    • writable via SceneCreateInput and SceneUpdateInput
  • Server defaulting behavior for compatibility:
    • If a mutation provides cover_image but omits cover_image_source, source defaults to userscript.
    • Explicit cover_image_source: null is preserved as null (intentional clear).
    • Explicit non-null source is preserved as provided (after normalization/trim).

Backwards Compatibility

  • Legacy scenes with NULL source remain valid and do not display in UI (no forced migration rewrite).
  • Existing external clients that only set cover_image now get deterministic source (userscript) without requiring client changes.
  • Existing clients that explicitly send cover_image_source continue to control source behavior.

UI enhancement

  • Added reusable IconField abstraction in src/utils/field.tsx.
  • Extends the existing behavior to allow consistent rendering of a UI element with Stash token or UI icon + string/url.

LLM Notes

I have done a first review of this and feel I've made some progress form feedback of others - thank you.
This was made with the help of Cursor

KennyG added 5 commits April 26, 2026 10:52
Moving generate buttons to Set Image control
c1f58dc 
- Removed direct thumbnail generation options from Scene dropdown.
- Added onGenerateThumbFromCurrent and onGenerateThumbDefault props to SceneEditPanel for handling thumbnail generation.
- Updated ImageInput component to include buttons for generating thumbnails from the current image and a default image.
Add cover image source to Scene model and GraphQL schema
0730983 
- Introduced `cover_image_source` field in the Scene type, SceneCreateInput, and SceneUpdateInput to track the origin of cover images.
- Updated the GraphQL schema and corresponding resolver logic to handle the new field.
- Implemented default cover image source logic in the resolver for scene creation and updates.
- Added migration to include `cover_image_source` column in the scenes table.
- Enhanced UI components to support the new cover image source functionality, including updates to SceneEditPanel and SceneDetails.
Fix lint-only issues from CI checks.
d985bd7 
Resolve naming-convention and React hook dependency warnings in SceneFileInfoPanel, and apply gofmt whitespace normalization in sqlite scene model.

Made-with: Cursor
Apply non-functional formatting normalization in cover image UI helpers.
543ceef 
Adjust import/order and JSX wrapping in ImageInput and IconField to align with Prettier style expectations.

Made-with: Cursor
Normalize Prettier formatting in cover image UI flow.
457cc61 
Apply style-only formatting changes in Scene cover source/update files to satisfy validate-ui format checks without behavioral changes.

Made-with: Cursor
@Stash-KennyG Stash-KennyG changed the title [Feature] Cover Umage Usability Improvements [Feature] Cover Image Usability Improvements Apr 26, 2026
Gykes
Gykes reviewed Apr 29, 2026
View reviewed changes
Copy link
Copy Markdown
Collaborator

@Gykes Gykes left a comment

Choose a reason for hiding this comment

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

So I haven't actually reviewed the code but here are my 2 thoughts:

  1. The set image button should probably be changed to a split button similar to what was done here

  2. The file info pane changes seem.... excessive. Is knowing that you pasted your image from clipboard really needed? I feel like most of those options are somewhat useless. This seems to just take up more screen space for not total gain. This is an opinion but that feature might need more discussion before we go ahead with it.

@Stash-KennyG
Copy link
Copy Markdown
Contributor Author

Stash-KennyG commented May 1, 2026

I like the button idea.
Happy to look at that. Before I do, I will defer to the group whether we want to even keep,display the information.

I grabbed this off the roadmap as it was labeled 'ready' so I assuemd we were ready to move forward.

Overall, I can make the argument that being able to filter on 'custom/not-custom' has some value but I took the request from @feederbox826 on #6861 for feature 4 and 5 and just ran with them. But, I'm also not going to war over this hill....

Once there is clear guidance from the group, I'm happy to take whatever direction we want.

@Gykes
Copy link
Copy Markdown
Collaborator

Gykes commented May 1, 2026

I grabbed this off the roadmap as it was labeled 'ready' so I assuemd we were ready to move forward.

It is ready but discussions still need to happen. WP/the community are always available to overturn me. I just personally feel like most of the options listed is very low value information and just increases core code requirements.

Overall, I can make the argument that being able to filter on 'custom/not-custom' has some value but I took the request from @feederbox826 on #6861 for feature 4 and 5 and just ran with them. But, I'm also not going to war over this hill....

I don't disagree just I'm not a huge fan of the current implementation.

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

Reviewers

@Gykes Gykes Gykes left review comments

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[Feature] Cover Image usability improvements + metadata

2 participants

@Stash-KennyG @Gykes