= (props: IProps) => {
| URL |
) =>
+ onChange={(newValue: React.ChangeEvent) =>
setUrl(newValue.currentTarget.value)
}
value={url}
@@ -494,7 +497,7 @@ export const SceneEditPanel: React.FC = (props: IProps) => {
) =>
+ onChange={(newValue: React.ChangeEvent) =>
setDetails(newValue.currentTarget.value)
}
value={details}
diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx
index f91b1eff1..9e9568207 100644
--- a/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx
@@ -2,7 +2,11 @@ import React from "react";
import { Button, Form } from "react-bootstrap";
import { Field, FieldProps, Form as FormikForm, Formik } from "formik";
import * as GQL from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import {
+ useSceneMarkerCreate,
+ useSceneMarkerUpdate,
+ useSceneMarkerDestroy,
+} from "src/core/StashService";
import {
DurationInput,
TagSelect,
@@ -29,9 +33,9 @@ export const SceneMarkerForm: React.FC = ({
editingMarker,
onClose,
}) => {
- const [sceneMarkerCreate] = StashService.useSceneMarkerCreate();
- const [sceneMarkerUpdate] = StashService.useSceneMarkerUpdate();
- const [sceneMarkerDestroy] = StashService.useSceneMarkerDestroy();
+ const [sceneMarkerCreate] = useSceneMarkerCreate();
+ const [sceneMarkerUpdate] = useSceneMarkerUpdate();
+ const [sceneMarkerDestroy] = useSceneMarkerDestroy();
const Toast = useToast();
const onSubmit = (values: IFormFields) => {
diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneMovieTable.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneMovieTable.tsx
index 0263ca4e7..488ae67d9 100644
--- a/ui/v2.5/src/components/Scenes/SceneDetails/SceneMovieTable.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneDetails/SceneMovieTable.tsx
@@ -1,6 +1,6 @@
import * as React from "react";
import * as GQL from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import { useAllMoviesForFilter } from "src/core/StashService";
import { Form } from "react-bootstrap";
type ValidTypes = GQL.SlimMovieDataFragment;
@@ -15,7 +15,7 @@ export interface IProps {
export const SceneMovieTable: React.FunctionComponent = (
props: IProps
) => {
- const { data } = StashService.useAllMoviesForFilter();
+ const { data } = useAllMoviesForFilter();
const items = !!data && !!data.allMoviesSlim ? data.allMoviesSlim : [];
let itemsFilter: ValidTypes[] = [];
@@ -49,7 +49,7 @@ export const SceneMovieTable: React.FunctionComponent = (
as="select"
className="input-control"
value={storeIdx[index] ? storeIdx[index]?.toString() : ""}
- onChange={(e: React.FormEvent) =>
+ onChange={(e: React.ChangeEvent) =>
updateFieldChanged(
item.id,
Number.parseInt(
diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneOperationsPanel.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneOperationsPanel.tsx
index 6c21e8a83..033967a46 100644
--- a/ui/v2.5/src/components/Scenes/SceneDetails/SceneOperationsPanel.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneDetails/SceneOperationsPanel.tsx
@@ -1,7 +1,7 @@
import { Button } from "react-bootstrap";
import React, { FunctionComponent } from "react";
import * as GQL from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import { useSceneGenerateScreenshot } from "src/core/StashService";
import { useToast } from "src/hooks";
import { JWUtils } from "src/utils";
@@ -13,7 +13,7 @@ export const SceneOperationsPanel: FunctionComponent = (
props: IOperationsPanelProps
) => {
const Toast = useToast();
- const [generateScreenshot] = StashService.useSceneGenerateScreenshot();
+ const [generateScreenshot] = useSceneGenerateScreenshot();
async function onGenerateScreenshot(at?: number) {
await generateScreenshot({
diff --git a/ui/v2.5/src/components/Scenes/SceneList.tsx b/ui/v2.5/src/components/Scenes/SceneList.tsx
index a1ee2465e..a29d8502b 100644
--- a/ui/v2.5/src/components/Scenes/SceneList.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneList.tsx
@@ -5,7 +5,7 @@ import {
FindScenesQueryResult,
SlimSceneDataFragment,
} from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import { queryFindScenes } from "src/core/StashService";
import { useScenesList } from "src/hooks";
import { ListFilterModel } from "src/models/list-filter/filter";
import { DisplayMode } from "src/models/list-filter/types";
@@ -52,7 +52,7 @@ export const SceneList: React.FC = ({
const filterCopy = _.cloneDeep(filter);
filterCopy.itemsPerPage = 1;
filterCopy.currentPage = index + 1;
- const singleResult = await StashService.queryFindScenes(filterCopy);
+ const singleResult = await queryFindScenes(filterCopy);
if (
singleResult &&
singleResult.data &&
diff --git a/ui/v2.5/src/components/Scenes/SceneMarkerList.tsx b/ui/v2.5/src/components/Scenes/SceneMarkerList.tsx
index f61cb3fb0..a0f1d929d 100644
--- a/ui/v2.5/src/components/Scenes/SceneMarkerList.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneMarkerList.tsx
@@ -2,7 +2,7 @@ import _ from "lodash";
import React from "react";
import { useHistory } from "react-router-dom";
import { FindSceneMarkersQueryResult } from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import { queryFindSceneMarkers } from "src/core/StashService";
import { NavUtils } from "src/utils";
import { useSceneMarkersList } from "src/hooks";
import { ListFilterModel } from "src/models/list-filter/filter";
@@ -35,7 +35,7 @@ export const SceneMarkerList: React.FC = () => {
const filterCopy = _.cloneDeep(filter);
filterCopy.itemsPerPage = 1;
filterCopy.currentPage = index + 1;
- const singleResult = await StashService.queryFindSceneMarkers(filterCopy);
+ const singleResult = await queryFindSceneMarkers(filterCopy);
if (singleResult?.data?.findSceneMarkers?.scene_markers?.length === 1) {
// navigate to the scene player page
const url = NavUtils.makeSceneMarkerUrl(
diff --git a/ui/v2.5/src/components/Scenes/SceneSelectedOptions.tsx b/ui/v2.5/src/components/Scenes/SceneSelectedOptions.tsx
index 374a99382..8646ce840 100644
--- a/ui/v2.5/src/components/Scenes/SceneSelectedOptions.tsx
+++ b/ui/v2.5/src/components/Scenes/SceneSelectedOptions.tsx
@@ -1,7 +1,7 @@
import React, { useEffect, useState } from "react";
import { Button, Form } from "react-bootstrap";
import _ from "lodash";
-import { StashService } from "src/core/StashService";
+import { useBulkSceneUpdate } from "src/core/StashService";
import * as GQL from "src/core/generated-graphql";
import { StudioSelect, LoadingIndicator } from "src/components/Shared";
import { useToast } from "src/hooks";
@@ -27,7 +27,7 @@ export const SceneSelectedOptions: React.FC = (
);
const [tagIds, setTagIds] = useState();
- const [updateScenes] = StashService.useBulkSceneUpdate(getSceneInput());
+ const [updateScenes] = useBulkSceneUpdate(getSceneInput());
// Network state
const [isLoading, setIsLoading] = useState(true);
@@ -318,7 +318,7 @@ export const SceneSelectedOptions: React.FC = (
as="select"
className="btn-secondary"
value={rating}
- onChange={(event: React.FormEvent) =>
+ onChange={(event: React.ChangeEvent) =>
setRating(event.currentTarget.value)
}
>
diff --git a/ui/v2.5/src/components/Settings/SettingsAboutPanel.tsx b/ui/v2.5/src/components/Settings/SettingsAboutPanel.tsx
index da9b1def3..15bd35850 100644
--- a/ui/v2.5/src/components/Settings/SettingsAboutPanel.tsx
+++ b/ui/v2.5/src/components/Settings/SettingsAboutPanel.tsx
@@ -1,17 +1,17 @@
import React from "react";
import { Button, Table } from "react-bootstrap";
import { LoadingIndicator } from "src/components/Shared";
-import { StashService } from "src/core/StashService";
+import { useVersion, useLatestVersion } from "src/core/StashService";
export const SettingsAboutPanel: React.FC = () => {
- const { data, error, loading } = StashService.useVersion();
+ const { data, error, loading } = useVersion();
const {
data: dataLatest,
error: errorLatest,
loading: loadingLatest,
refetch,
networkStatus,
- } = StashService.useLatestVersion();
+ } = useLatestVersion();
function maybeRenderTag() {
if (!data || !data.version || !data.version.version) {
diff --git a/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx b/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx
index 670a9fa0a..e2b50fa6b 100644
--- a/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx
+++ b/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx
@@ -1,7 +1,7 @@
import React, { useEffect, useState } from "react";
import { Button, Form, InputGroup } from "react-bootstrap";
import * as GQL from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import { useConfiguration, useConfigureGeneral } from "src/core/StashService";
import { useToast } from "src/hooks";
import { Icon, LoadingIndicator } from "src/components/Shared";
import { FolderSelect } from "src/components/Shared/FolderSelect/FolderSelect";
@@ -36,9 +36,9 @@ export const SettingsConfigurationPanel: React.FC = () => {
undefined
);
- const { data, error, loading } = StashService.useConfiguration();
+ const { data, error, loading } = useConfiguration();
- const [updateGeneralConfig] = StashService.useConfigureGeneral({
+ const [updateGeneralConfig] = useConfigureGeneral({
stashes,
databasePath,
generatedPath,
@@ -189,7 +189,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
) =>
+ onChange={(e: React.ChangeEvent) =>
setDatabasePath(e.currentTarget.value)
}
/>
@@ -203,7 +203,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
) =>
+ onChange={(e: React.ChangeEvent) =>
setGeneratedPath(e.currentTarget.value)
}
/>
@@ -222,7 +222,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
) =>
+ onChange={(e: React.ChangeEvent) =>
excludeRegexChanged(i, e.currentTarget.value)
}
/>
@@ -262,7 +262,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
) =>
+ onChange={(event: React.ChangeEvent) =>
setMaxTranscodeSize(translateQuality(event.currentTarget.value))
}
value={resolutionToString(maxTranscodeSize)}
@@ -282,7 +282,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
) =>
+ onChange={(event: React.ChangeEvent) =>
setMaxStreamingTranscodeSize(
translateQuality(event.currentTarget.value)
)
@@ -332,7 +332,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
) =>
+ onChange={(e: React.ChangeEvent) =>
setScraperUserAgent(e.currentTarget.value)
}
/>
@@ -425,7 +425,7 @@ export const SettingsConfigurationPanel: React.FC = () => {
) =>
+ onChange={(event: React.ChangeEvent) =>
setLogLevel(event.currentTarget.value)
}
value={logLevel}
diff --git a/ui/v2.5/src/components/Settings/SettingsInterfacePanel.tsx b/ui/v2.5/src/components/Settings/SettingsInterfacePanel.tsx
index 9def1e190..3b36c6abd 100644
--- a/ui/v2.5/src/components/Settings/SettingsInterfacePanel.tsx
+++ b/ui/v2.5/src/components/Settings/SettingsInterfacePanel.tsx
@@ -1,12 +1,12 @@
import React, { useEffect, useState } from "react";
import { Button, Form } from "react-bootstrap";
import { DurationInput, LoadingIndicator } from "src/components/Shared";
-import { StashService } from "src/core/StashService";
+import { useConfiguration, useConfigureInterface } from "src/core/StashService";
import { useToast } from "src/hooks";
export const SettingsInterfacePanel: React.FC = () => {
const Toast = useToast();
- const { data: config, error, loading } = StashService.useConfiguration();
+ const { data: config, error, loading } = useConfiguration();
const [soundOnPreview, setSoundOnPreview] = useState(true);
const [wallShowTitle, setWallShowTitle] = useState(true);
const [maximumLoopDuration, setMaximumLoopDuration] = useState(0);
@@ -16,7 +16,7 @@ export const SettingsInterfacePanel: React.FC = () => {
const [cssEnabled, setCSSEnabled] = useState(false);
const [language, setLanguage] = useState("en");
- const [updateInterfaceConfig] = StashService.useConfigureInterface({
+ const [updateInterfaceConfig] = useConfigureInterface({
soundOnPreview,
wallShowTitle,
maximumLoopDuration,
@@ -62,7 +62,7 @@ export const SettingsInterfacePanel: React.FC = () => {
as="select"
className="col-4 input-control"
value={language}
- onChange={(e: React.FormEvent) =>
+ onChange={(e: React.ChangeEvent) =>
setLanguage(e.currentTarget.value)
}
>
@@ -142,12 +142,12 @@ export const SettingsInterfacePanel: React.FC = () => {
) =>
+ onChange={(e: React.ChangeEvent) =>
setCSS(e.currentTarget.value)
}
rows={16}
className="col col-sm-6 text-input code"
- >
+ />
Page must be reloaded for changes to take effect.
diff --git a/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx b/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx
index 0ca327e70..d7401b514 100644
--- a/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx
+++ b/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx
@@ -1,7 +1,7 @@
import React, { useEffect, useReducer, useState } from "react";
import { Form } from "react-bootstrap";
import * as GQL from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import { useLogs, useLoggingSubscribe } from "src/core/StashService";
function convertTime(logEntry: GQL.LogEntryDataFragment) {
function pad(val: number) {
@@ -74,8 +74,8 @@ const logReducer = (existingEntries: LogEntry[], newEntries: LogEntry[]) => [
];
export const SettingsLogsPanel: React.FC = () => {
- const { data, error } = StashService.useLoggingSubscribe();
- const { data: existingData } = StashService.useLogs();
+ const { data, error } = useLoggingSubscribe();
+ const { data: existingData } = useLogs();
const [currentData, dispatchLogUpdate] = useReducer(logReducer, []);
const [logLevel, setLogLevel] = useState("Info");
diff --git a/ui/v2.5/src/components/Settings/SettingsTasksPanel/GenerateButton.tsx b/ui/v2.5/src/components/Settings/SettingsTasksPanel/GenerateButton.tsx
index 728cb50f4..abd72f9ea 100644
--- a/ui/v2.5/src/components/Settings/SettingsTasksPanel/GenerateButton.tsx
+++ b/ui/v2.5/src/components/Settings/SettingsTasksPanel/GenerateButton.tsx
@@ -1,6 +1,6 @@
import React, { useState } from "react";
import { Button, Form } from "react-bootstrap";
-import { StashService } from "src/core/StashService";
+import { mutateMetadataGenerate } from "src/core/StashService";
import { useToast } from "src/hooks";
export const GenerateButton: React.FC = () => {
@@ -12,7 +12,7 @@ export const GenerateButton: React.FC = () => {
async function onGenerate() {
try {
- await StashService.mutateMetadataGenerate({
+ await mutateMetadataGenerate({
sprites,
previews,
markers,
diff --git a/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx b/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx
index a3731b119..c392c3c29 100644
--- a/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx
+++ b/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx
@@ -1,7 +1,16 @@
import React, { useState, useEffect } from "react";
import { Button, Form, ProgressBar } from "react-bootstrap";
import { Link } from "react-router-dom";
-import { StashService } from "src/core/StashService";
+import {
+ useJobStatus,
+ useMetadataUpdate,
+ mutateMetadataImport,
+ mutateMetadataClean,
+ mutateMetadataScan,
+ mutateMetadataAutoTag,
+ mutateMetadataExport,
+ mutateStopJob,
+} from "src/core/StashService";
import { useToast } from "src/hooks";
import { Modal } from "src/components/Shared";
import { GenerateButton } from "./GenerateButton";
@@ -18,8 +27,8 @@ export const SettingsTasksPanel: React.FC = () => {
const [autoTagStudios, setAutoTagStudios] = useState(true);
const [autoTagTags, setAutoTagTags] = useState(true);
- const jobStatus = StashService.useJobStatus();
- const metadataUpdate = StashService.useMetadataUpdate();
+ const jobStatus = useJobStatus();
+ const metadataUpdate = useMetadataUpdate();
function statusToText(s: string) {
switch (s) {
@@ -68,7 +77,7 @@ export const SettingsTasksPanel: React.FC = () => {
function onImport() {
setIsImportAlertOpen(false);
- StashService.mutateMetadataImport().then(() => {
+ mutateMetadataImport().then(() => {
jobStatus.refetch();
});
}
@@ -91,7 +100,7 @@ export const SettingsTasksPanel: React.FC = () => {
function onClean() {
setIsCleanAlertOpen(false);
- StashService.mutateMetadataClean().then(() => {
+ mutateMetadataClean().then(() => {
jobStatus.refetch();
});
}
@@ -115,7 +124,7 @@ export const SettingsTasksPanel: React.FC = () => {
async function onScan() {
try {
- await StashService.mutateMetadataScan({ useFileMetadata });
+ await mutateMetadataScan({ useFileMetadata });
Toast.success({ content: "Started scan" });
jobStatus.refetch();
} catch (e) {
@@ -134,7 +143,7 @@ export const SettingsTasksPanel: React.FC = () => {
async function onAutoTag() {
try {
- await StashService.mutateMetadataAutoTag(getAutoTagInput());
+ await mutateMetadataAutoTag(getAutoTagInput());
Toast.success({ content: "Started auto tagging" });
jobStatus.refetch();
} catch (e) {
@@ -152,9 +161,7 @@ export const SettingsTasksPanel: React.FC = () => {
@@ -277,7 +284,7 @@ export const SettingsTasksPanel: React.FC = () => {
variant="secondary"
type="submit"
onClick={() =>
- StashService.mutateMetadataExport().then(() => {
+ mutateMetadataExport().then(() => {
jobStatus.refetch();
})
}
diff --git a/ui/v2.5/src/components/Shared/DurationInput.tsx b/ui/v2.5/src/components/Shared/DurationInput.tsx
index 4d999086c..d8363b882 100644
--- a/ui/v2.5/src/components/Shared/DurationInput.tsx
+++ b/ui/v2.5/src/components/Shared/DurationInput.tsx
@@ -98,7 +98,7 @@ export const DurationInput: React.FC = (props: IProps) => {
className="duration-control text-input"
disabled={props.disabled}
value={value}
- onChange={(e: React.FormEvent) =>
+ onChange={(e: React.ChangeEvent) =>
setValue(e.currentTarget.value)
}
onBlur={() => {
diff --git a/ui/v2.5/src/components/Shared/FolderSelect/FolderSelect.tsx b/ui/v2.5/src/components/Shared/FolderSelect/FolderSelect.tsx
index c6edf3124..ceb6cc4b4 100644
--- a/ui/v2.5/src/components/Shared/FolderSelect/FolderSelect.tsx
+++ b/ui/v2.5/src/components/Shared/FolderSelect/FolderSelect.tsx
@@ -1,7 +1,7 @@
import React, { useEffect, useState } from "react";
import { Button, InputGroup, Form, Modal } from "react-bootstrap";
import { LoadingIndicator } from "src/components/Shared";
-import { StashService } from "src/core/StashService";
+import { useDirectories } from "src/core/StashService";
interface IProps {
directories: string[];
@@ -12,9 +12,7 @@ export const FolderSelect: React.FC = (props: IProps) => {
const [currentDirectory, setCurrentDirectory] = useState("");
const [isDisplayingDialog, setIsDisplayingDialog] = useState(false);
const [selectedDirectories, setSelectedDirectories] = useState([]);
- const { data, error, loading } = StashService.useDirectories(
- currentDirectory
- );
+ const { data, error, loading } = useDirectories(currentDirectory);
useEffect(() => {
setSelectedDirectories(props.directories);
@@ -51,7 +49,7 @@ export const FolderSelect: React.FC = (props: IProps) => {
) =>
+ onChange={(e: React.ChangeEvent) =>
setCurrentDirectory(e.currentTarget.value)
}
defaultValue={currentDirectory}
diff --git a/ui/v2.5/src/components/Shared/ImageInput.tsx b/ui/v2.5/src/components/Shared/ImageInput.tsx
index 9c96858f1..e2d3e39f4 100644
--- a/ui/v2.5/src/components/Shared/ImageInput.tsx
+++ b/ui/v2.5/src/components/Shared/ImageInput.tsx
@@ -4,7 +4,7 @@ import { Button, Form } from "react-bootstrap";
interface IImageInput {
isEditing: boolean;
text?: string;
- onImageChange: (event: React.FormEvent) => void;
+ onImageChange: (event: React.ChangeEvent) => void;
acceptSVG?: boolean;
}
diff --git a/ui/v2.5/src/components/Shared/Select.tsx b/ui/v2.5/src/components/Shared/Select.tsx
index 41a492c03..071bd0482 100644
--- a/ui/v2.5/src/components/Shared/Select.tsx
+++ b/ui/v2.5/src/components/Shared/Select.tsx
@@ -1,10 +1,19 @@
-import React, { useState, useCallback, CSSProperties } from "react";
+import React, { useState, CSSProperties } from "react";
import Select, { ValueType } from "react-select";
import CreatableSelect from "react-select/creatable";
import { debounce } from "lodash";
import * as GQL from "src/core/generated-graphql";
-import { StashService } from "src/core/StashService";
+import {
+ useAllTagsForFilter,
+ useAllMoviesForFilter,
+ useAllStudiosForFilter,
+ useAllPerformersForFilter,
+ useMarkerStrings,
+ useScrapePerformerList,
+ useValidGalleriesForScene,
+ useTagCreate,
+} from "src/core/StashService";
import { useToast } from "src/hooks";
type ValidTypes =
@@ -63,9 +72,7 @@ const getSelectedValues = (selectedItems: ValueType |