diff --git a/ui/v2.5/src/components/Performers/PerformerCard.tsx b/ui/v2.5/src/components/Performers/PerformerCard.tsx index 02e2a68fd..02c304547 100644 --- a/ui/v2.5/src/components/Performers/PerformerCard.tsx +++ b/ui/v2.5/src/components/Performers/PerformerCard.tsx @@ -17,12 +17,15 @@ import { } from "src/models/list-filter/criteria/criterion"; import { PopoverCountButton } from "../Shared/PopoverCountButton"; import GenderIcon from "./GenderIcon"; -import { faTag } from "@fortawesome/free-solid-svg-icons"; +import { faLink, faTag } from "@fortawesome/free-solid-svg-icons"; +import { faInstagram, faTwitter } from "@fortawesome/free-brands-svg-icons"; import { RatingBanner } from "../Shared/RatingBanner"; import { usePerformerUpdate } from "src/core/StashService"; import { ILabeledId } from "src/models/list-filter/types"; import { FavoriteIcon } from "../Shared/FavoriteIcon"; import { PatchComponent } from "src/patch"; +import { ExternalLinksButton } from "../Shared/ExternalLinksButton"; +import { ConfigurationContext } from "src/hooks/Config"; export interface IPerformerCardExtraCriteria { scenes?: ModifierCriterion[]; @@ -176,6 +179,8 @@ const PerformerCardPopovers: React.FC = PatchComponent( const PerformerCardOverlays: React.FC = PatchComponent( "PerformerCard.Overlays", ({ performer }) => { + const { configuration } = React.useContext(ConfigurationContext); + const uiConfig = configuration?.ui; const [updatePerformer] = usePerformerUpdate(); function onToggleFavorite(v: boolean) { @@ -215,6 +220,63 @@ const PerformerCardOverlays: React.FC = PatchComponent( } } + function maybeRenderLinks() { + if (!uiConfig?.showLinksOnPerformerCard) { + return; + } + + if (performer.urls && performer.urls.length > 0) { + const twitter = performer.urls.filter((u) => + u.match(/https?:\/\/(?:www\.)?(?:twitter|x).com\//) + ); + const instagram = performer.urls.filter((u) => + u.match(/https?:\/\/(?:www\.)?instagram.com\//) + ); + const others = performer.urls.filter( + (u) => !twitter.includes(u) && !instagram.includes(u) + ); + + return ( +
+ {twitter.length > 0 && ( + + )} + {instagram.length > 0 && ( + + )} + {others.length > 0 && ( + + )} +
+ ); + } + } + return ( <> = PatchComponent( className="hide-not-favorite" /> {maybeRenderRatingBanner()} + {maybeRenderLinks()} {maybeRenderFlag()} ); diff --git a/ui/v2.5/src/components/Performers/styles.scss b/ui/v2.5/src/components/Performers/styles.scss index 3769bc44b..1840ad960 100644 --- a/ui/v2.5/src/components/Performers/styles.scss +++ b/ui/v2.5/src/components/Performers/styles.scss @@ -107,6 +107,10 @@ .thumbnail-section { position: relative; + + .instagram { + color: pink; + } } &-image { diff --git a/ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx b/ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx index 7d63f9df9..e0c538cd0 100644 --- a/ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx +++ b/ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx @@ -470,6 +470,7 @@ export const SettingsInterfacePanel: React.FC = PatchComponent( onChange={(v) => saveUI({ showChildTagContent: v })} /> + + + saveUI({ showLinksOnPerformerCard: v })} + /> + + = PatchComponent( "ExternalLinksButton", - ({ urls, icon = faLink, className = "" }) => { + ({ urls, icon = faLink, className = "", openIfSingle = false }) => { if (!urls.length) { return null; } @@ -36,14 +37,27 @@ export const ExternalLinksButton: React.FC<{ document.body ); - return ( - - + if (openIfSingle && urls.length === 1) { + return ( + - - - - ); + + ); + } else { + return ( + + + + + + + ); + } } ); diff --git a/ui/v2.5/src/core/config.ts b/ui/v2.5/src/core/config.ts index fcef8fef5..36d915eeb 100644 --- a/ui/v2.5/src/core/config.ts +++ b/ui/v2.5/src/core/config.ts @@ -45,6 +45,7 @@ export interface IUIConfig { showChildTagContent?: boolean; showChildStudioContent?: boolean; + showLinksOnPerformerCard?: boolean; showTagCardOnHover?: boolean; abbreviateCounters?: boolean; diff --git a/ui/v2.5/src/locales/en-GB.json b/ui/v2.5/src/locales/en-GB.json index 48cf2f6d3..f0fe87f61 100644 --- a/ui/v2.5/src/locales/en-GB.json +++ b/ui/v2.5/src/locales/en-GB.json @@ -801,6 +801,14 @@ } } }, + "performer_list": { + "heading": "Performer list", + "options": { + "show_links_on_grid_card": { + "heading": "Display links on performer grid cards" + } + } + }, "tag_panel": { "heading": "Tag view", "options": {