Add scene toggle to scenePairings list (#580)

stashapp · Dec 28, 2022 · fc5d4f9 · fc5d4f9
1 parent 9fb0ec8
commit fc5d4f9
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 19 deletions.
diff --git a/frontend/src/graphql/queries/ScenePairings.gql b/frontend/src/graphql/queries/ScenePairings.gql
@@ -8,6 +8,7 @@ query ScenePairings(
   $per_page: Int! = 25
   $direction: SortDirectionEnum!
   $sort: PerformerSortEnum!
+  $fetchScenes: Boolean!
 ) {
   queryPerformers(
     input: {
@@ -34,7 +35,8 @@ query ScenePairings(
       images {
         ...ImageFragment
       }
-      scenes(input: { performed_with: $performerId }) {
+      scenes(input: { performed_with: $performerId })
+        @include(if: $fetchScenes) {
         id
         title
         date

diff --git a/frontend/src/graphql/types.ts b/frontend/src/graphql/types.ts
@@ -18022,6 +18022,7 @@ export type ScenePairingsQueryVariables = Exact<{
   per_page?: Scalars["Int"];
   direction: SortDirectionEnum;
   sort: PerformerSortEnum;
+  fetchScenes: Scalars["Boolean"];
 }>;
 
 export type ScenePairingsQuery = {
@@ -18046,7 +18047,7 @@ export type ScenePairingsQuery = {
         width: number;
         height: number;
       }>;
-      scenes: Array<{
+      scenes?: Array<{
         __typename: "Scene";
         id: string;
         title?: string | null;

diff --git a/frontend/src/pages/performers/components/scenePairings.tsx b/frontend/src/pages/performers/components/scenePairings.tsx
@@ -47,11 +47,13 @@ export const ScenePairings: FC<Props> = ({ id }) => {
     direction: { name: "dir", type: "string", default: SortDirectionEnum.ASC },
     sort: { name: "sort", type: "string", default: PerformerSortEnum.NAME },
     favorite: { name: "favorite", type: "string", default: "false" },
+    scenes: { name: "scenes", type: "string", default: "false" },
   });
   const gender = resolveEnum(GenderFilterEnum, params.gender);
   const direction = ensureEnum(SortDirectionEnum, params.direction);
   const sort = ensureEnum(PerformerSortEnum, params.sort);
   const favorite = params.favorite === "true" || undefined;
+  const fetchScenes = params.scenes === "true";
   const { page, setPage } = usePagination();
 
   const { data, loading } = useScenePairings({
@@ -63,6 +65,7 @@ export const ScenePairings: FC<Props> = ({ id }) => {
     per_page: PER_PAGE,
     sort,
     direction,
+    fetchScenes,
   });
 
   const performers = data?.queryPerformers.performers;
@@ -125,13 +128,24 @@ export const ScenePairings: FC<Props> = ({ id }) => {
         <Form.Check
           className="mt-2"
           type="switch"
-          label="Only favorites"
+          label="Favorites"
           defaultChecked={favorite}
           onChange={(e) =>
             setParams("favorite", e.currentTarget.checked.toString())
           }
         />
       </Form.Group>
+      <Form.Group controlId="scenes">
+        <Form.Check
+          className="mt-2 ms-2"
+          type="switch"
+          label="Scenes"
+          defaultChecked={fetchScenes}
+          onChange={(e) =>
+            setParams("scenes", e.currentTarget.checked.toString())
+          }
+        />
+      </Form.Group>
     </>
   );
 
@@ -146,23 +160,33 @@ export const ScenePairings: FC<Props> = ({ id }) => {
         loading={loading}
         listCount={data?.queryPerformers?.count}
       >
-        {performers?.map((p, i) => (
-          <Row key={p.id}>
-            <Col xs={3} key={p.id}>
-              <PerformerCard performer={p} />
-            </Col>
-            <Col xs={9}>
-              <Row>
-                {p.scenes.map((s) => (
-                  <Col xs={4} key={s.id}>
-                    <SceneCard scene={s} />
-                  </Col>
-                ))}
-              </Row>
-            </Col>
-            {i < performers.length - 1 && <hr />}
+        {fetchScenes ? (
+          performers?.map((p, i) => (
+            <Row key={p.id}>
+              <Col xs={3} key={p.id}>
+                <PerformerCard performer={p} />
+              </Col>
+              <Col xs={9}>
+                <Row>
+                  {p?.scenes?.map((s) => (
+                    <Col xs={4} key={s.id}>
+                      <SceneCard scene={s} />
+                    </Col>
+                  ))}
+                </Row>
+              </Col>
+              {i < performers.length - 1 && <hr />}
+            </Row>
+          ))
+        ) : (
+          <Row>
+            {performers?.map((p) => (
+              <Col xs={3} key={p.id}>
+                <PerformerCard performer={p} />
+              </Col>
+            ))}
           </Row>
-        ))}
+        )}
       </List>
     </>
   );