From c45780dc5958381c88287540016af0681789399a Mon Sep 17 00:00:00 2001 From: SpedNSFW <68614336+SpedNSFW@users.noreply.github.com> Date: Tue, 1 Dec 2020 19:38:53 +1100 Subject: [PATCH] Add missing gallery components (#969) * add gallery scrapers to settings page * add galleries to performers page * add galleries to studios page --- .../src/components/Changelog/versions/v050.md | 2 + .../Performers/PerformerDetails/Performer.tsx | 6 +++ .../PerformerGalleriesPanel.tsx | 14 ++++++ .../Settings/SettingsScrapersPanel.tsx | 43 ++++++++++++++++++- .../Studios/StudioDetails/Studio.tsx | 8 +++- .../StudioDetails/StudioGalleriesPanel.tsx | 14 ++++++ 6 files changed, 85 insertions(+), 2 deletions(-) create mode 100644 ui/v2.5/src/components/Performers/PerformerDetails/PerformerGalleriesPanel.tsx create mode 100644 ui/v2.5/src/components/Studios/StudioDetails/StudioGalleriesPanel.tsx diff --git a/ui/v2.5/src/components/Changelog/versions/v050.md b/ui/v2.5/src/components/Changelog/versions/v050.md index 5a0a8cad6..4964b8295 100644 --- a/ui/v2.5/src/components/Changelog/versions/v050.md +++ b/ui/v2.5/src/components/Changelog/versions/v050.md @@ -1,4 +1,6 @@ ### 🎨 Improvements +* Add gallery tabs to performer and studio pages. +* Add gallery scrapers to scraper page. * Add support for setting cookies in scrapers. * Truncate long text and show on hover. * Show scene studio as text where image is missing. diff --git a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx index d78ce161b..6fd7a54b0 100644 --- a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx +++ b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx @@ -22,6 +22,7 @@ import FsLightbox from "fslightbox-react"; import { PerformerDetailsPanel } from "./PerformerDetailsPanel"; import { PerformerOperationsPanel } from "./PerformerOperationsPanel"; import { PerformerScenesPanel } from "./PerformerScenesPanel"; +import { PerformerGalleriesPanel } from "./PerformerGalleriesPanel"; import { PerformerImagesPanel } from "./PerformerImagesPanel"; interface IPerformerParams { @@ -60,6 +61,7 @@ export const Performer: React.FC = () => { const activeTabKey = tab === "scenes" || + tab === "galleries" || tab === "images" || tab === "edit" || tab === "operations" @@ -81,6 +83,7 @@ export const Performer: React.FC = () => { Mousetrap.bind("a", () => setActiveTabKey("details")); Mousetrap.bind("e", () => setActiveTabKey("edit")); Mousetrap.bind("c", () => setActiveTabKey("scenes")); + Mousetrap.bind("g", () => setActiveTabKey("galleries")); Mousetrap.bind("o", () => setActiveTabKey("operations")); Mousetrap.bind("f", () => setFavorite(!performer.favorite)); @@ -163,6 +166,9 @@ export const Performer: React.FC = () => { + + + diff --git a/ui/v2.5/src/components/Performers/PerformerDetails/PerformerGalleriesPanel.tsx b/ui/v2.5/src/components/Performers/PerformerDetails/PerformerGalleriesPanel.tsx new file mode 100644 index 000000000..7d1810bac --- /dev/null +++ b/ui/v2.5/src/components/Performers/PerformerDetails/PerformerGalleriesPanel.tsx @@ -0,0 +1,14 @@ +import React from "react"; +import * as GQL from "src/core/generated-graphql"; +import { GalleryList } from "src/components/Galleries/GalleryList"; +import { performerFilterHook } from "src/core/performers"; + +interface IPerformerDetailsProps { + performer: Partial; +} + +export const PerformerGalleriesPanel: React.FC = ({ + performer, +}) => { + return ; +}; diff --git a/ui/v2.5/src/components/Settings/SettingsScrapersPanel.tsx b/ui/v2.5/src/components/Settings/SettingsScrapersPanel.tsx index 8f0dfb7ac..b4865f80a 100644 --- a/ui/v2.5/src/components/Settings/SettingsScrapersPanel.tsx +++ b/ui/v2.5/src/components/Settings/SettingsScrapersPanel.tsx @@ -5,6 +5,7 @@ import { useListMovieScrapers, useListPerformerScrapers, useListSceneScrapers, + useListGalleryScrapers, } from "src/core/StashService"; import { useToast } from "src/hooks"; import { TextUtils } from "src/utils"; @@ -75,6 +76,10 @@ export const SettingsScrapersPanel: React.FC = () => { data: sceneScrapers, loading: loadingScenes, } = useListSceneScrapers(); + const { + data: galleryScrapers, + loading: loadingGalleries, + } = useListGalleryScrapers(); const { data: movieScrapers, loading: loadingMovies, @@ -124,6 +129,25 @@ export const SettingsScrapersPanel: React.FC = () => { ); } + function renderGalleryScrapeTypes(types: ScrapeType[]) { + const typeStrings = types.map((t) => { + switch (t) { + case ScrapeType.Fragment: + return "Gallery Metadata"; + default: + return t; + } + }); + + return ( +
    + {typeStrings.map((t) => ( +
  • {t}
    • + ))} +
+ ); + } + function renderMovieScrapeTypes(types: ScrapeType[]) { const typeStrings = types.map((t) => { switch (t) { @@ -161,6 +185,22 @@ export const SettingsScrapersPanel: React.FC = () => { return renderTable("Scene scrapers", elements); } + function renderGalleryScrapers() { + const elements = (galleryScrapers?.listGalleryScrapers ?? []).map( + (scraper) => ( + + {scraper.name} + + {renderGalleryScrapeTypes(scraper.gallery?.supported_scrapes ?? [])} + + {renderURLs(scraper.gallery?.urls ?? [])} + + ) + ); + + return renderTable("Gallery Scrapers", elements); + } + function renderPerformerScrapers() { const elements = (performerScrapers?.listPerformerScrapers ?? []).map( (scraper) => ( @@ -213,7 +253,7 @@ export const SettingsScrapersPanel: React.FC = () => { } } - if (loadingScenes || loadingPerformers || loadingMovies) + if (loadingScenes || loadingGalleries || loadingPerformers || loadingMovies) return ; return ( @@ -230,6 +270,7 @@ export const SettingsScrapersPanel: React.FC = () => {
{renderSceneScrapers()} + {renderGalleryScrapers()} {renderPerformerScrapers()} {renderMovieScrapers()}
diff --git a/ui/v2.5/src/components/Studios/StudioDetails/Studio.tsx b/ui/v2.5/src/components/Studios/StudioDetails/Studio.tsx index ba2b25f5d..f76c9b3dc 100644 --- a/ui/v2.5/src/components/Studios/StudioDetails/Studio.tsx +++ b/ui/v2.5/src/components/Studios/StudioDetails/Studio.tsx @@ -21,6 +21,7 @@ import { } from "src/components/Shared"; import { useToast } from "src/hooks"; import { StudioScenesPanel } from "./StudioScenesPanel"; +import { StudioGalleriesPanel } from "./StudioGalleriesPanel"; import { StudioImagesPanel } from "./StudioImagesPanel"; import { StudioChildrenPanel } from "./StudioChildrenPanel"; @@ -233,7 +234,9 @@ export const Studio: React.FC = () => { } const activeTabKey = - tab === "childstudios" || tab === "images" ? tab : "scenes"; + tab === "childstudios" || tab === "images" || tab === "galleries" + ? tab + : "scenes"; const setActiveTabKey = (newTab: string | null) => { if (tab !== newTab) { const tabParam = newTab === "scenes" ? "" : `/${newTab}`; @@ -329,6 +332,9 @@ export const Studio: React.FC = () => { + + + diff --git a/ui/v2.5/src/components/Studios/StudioDetails/StudioGalleriesPanel.tsx b/ui/v2.5/src/components/Studios/StudioDetails/StudioGalleriesPanel.tsx new file mode 100644 index 000000000..278a3a162 --- /dev/null +++ b/ui/v2.5/src/components/Studios/StudioDetails/StudioGalleriesPanel.tsx @@ -0,0 +1,14 @@ +import React from "react"; +import * as GQL from "src/core/generated-graphql"; +import { GalleryList } from "src/components/Galleries/GalleryList"; +import { studioFilterHook } from "src/core/studios"; + +interface IStudioGalleriesPanel { + studio: Partial; +} + +export const StudioGalleriesPanel: React.FC = ({ + studio, +}) => { + return ; +};