diff --git a/graphql/documents/data/performer-slim.graphql b/graphql/documents/data/performer-slim.graphql index 5fbd1a2eb..0018c9700 100644 --- a/graphql/documents/data/performer-slim.graphql +++ b/graphql/documents/data/performer-slim.graphql @@ -40,4 +40,5 @@ fragment SelectPerformerData on Performer { name disambiguation alias_list + image_path } diff --git a/ui/v2.5/src/components/Performers/PerformerSelect.tsx b/ui/v2.5/src/components/Performers/PerformerSelect.tsx index d37b8fe37..c4b43e265 100644 --- a/ui/v2.5/src/components/Performers/PerformerSelect.tsx +++ b/ui/v2.5/src/components/Performers/PerformerSelect.tsx @@ -34,7 +34,7 @@ export type SelectObject = { export type Performer = Pick< GQL.Performer, - "id" | "name" | "alias_list" | "disambiguation" + "id" | "name" | "alias_list" | "disambiguation" | "image_path" >; type Option = SelectOption; @@ -86,6 +86,18 @@ export const PerformerSelect: React.FC< ...optionProps, children: ( + + + {name} {object.disambiguation && ( {` (${object.disambiguation})`} diff --git a/ui/v2.5/src/components/Performers/styles.scss b/ui/v2.5/src/components/Performers/styles.scss index 1679ac337..6ca07e5be 100644 --- a/ui/v2.5/src/components/Performers/styles.scss +++ b/ui/v2.5/src/components/Performers/styles.scss @@ -221,6 +221,14 @@ } } -.performer-select .alias { - font-weight: bold; +.performer-select { + .alias { + font-weight: bold; + } + + .performer-select-image { + margin-right: 0.5em; + max-height: 50px; + max-width: 50px; + } }