Enhancement: Extend CJ Card Tweaks to Include Stash Count

[Stash-KennyG]

Enhancement: Stash ID Count Indicator for Performer Cards

Summary

Adds a visual indicator to performer cards showing the count of Stash IDs (GUIDs) attached to each performer. This helps users quickly identify performers linked to external Stash databases and see how many Stash IDs each performer has.

Feature Description

• Setting: stashIDIcon (boolean, default: false)
• Display: A button appears in the card-popovers button group area of performer cards
• Visual Design:
  • Shows a numeric count followed by a box-open icon (FontAwesome)
  • Count displays first (e.g., "2"), then the icon
  • Button styled with Bootstrap btn-primary class
  • Tooltip on hover shows "Has X Stash ID(s)"
• Behavior:
  • Only displays when performer has 1+ Stash IDs attached
  • Uses GraphQL API to fetch performer data dynamically
  • Gracefully handles errors (silent fail if GraphQL request fails)
  • Prevents duplicate indicators (checks for existing .stash-id-count element)

Technical Implementation

GraphQL Integration

• Added queryStashIDs() async function that queries:

  query FindPerformer($id: ID!) {
    findPerformer(id: $id) {
      id
      stash_ids {
        endpoint
        stash_id
      }
    }
  }

• Extracts performer ID from card URL (/performers/{id})
• Converts string ID to integer for GraphQL query

DOM Manipulation

• maybeAddStashIDIcon(): Main entry point, extracts performer ID from card
• addStashIDButton(): Creates and inserts the button element into .card-popovers.btn-group
• Uses createElementFromHTML() helper for safe DOM creation
• Checks for existing elements to prevent duplicates

Styling

• CSS class: .stash-id-count with flexbox layout
• Number display: .stash-id-count-number with right margin
• Icon display: .stash-id-icon with SVG sizing (0.875rem)
• Icon color: White (#fff) to contrast with primary button background

Changes Made

Files Modified

1. plugins/cjCardTweaks/cjCardTweaks.js

   • Added stashIDIcon to parseSettings()
   • Added STASH_ID_ICON_STYLE CSS constant
   • Implemented maybeAddStashIDIcon() function
   • Implemented queryStashIDs() async function for GraphQL queries
   • Implemented addStashIDButton() helper function
   • Integrated into handlePerformersCards() execution flow

2. plugins/cjCardTweaks/cjCardTweaks.yml

   • Added new setting:

     stashIDIcon:
       displayName: Stash ID icon
       description: "Adds a Stash ID icon to the performer cards."
       type: BOOLEAN

3. plugins/cjCardTweaks/README.md

   • Added "Stash ID icon" section documenting the feature

Example Usage

When enabled, performer cards with Stash IDs will display a button like:

[2 📦]  (where 2 is the count of Stash repos the performer has)

[Stash-KennyG]

Everything looks great in my side - thought I would send it forward.
AI assisted so if something is wonky, let me know.

[discourse-stashapp]

This pull request has been mentioned on Stash Forum. There might be relevant details there:

https://discourse.stashapp.cc/t/cjs-card-tweaks/1342/2