diff --git a/ui/v2.5/package.json b/ui/v2.5/package.json index 7eb5b470a..124d0eed7 100644 --- a/ui/v2.5/package.json +++ b/ui/v2.5/package.json @@ -46,7 +46,6 @@ "react-apollo": "^3.1.3", "react-bootstrap": "^1.0.0-beta.16", "react-dom": "16.12.0", - "react-hotkeys": "^2.0.0", "react-images": "0.5.19", "react-intl": "^3.12.0", "react-jw-player": "1.19.0", diff --git a/ui/v2.5/src/components/Galleries/GalleryList.tsx b/ui/v2.5/src/components/Galleries/GalleryList.tsx index 428f12239..6067c82bf 100644 --- a/ui/v2.5/src/components/Galleries/GalleryList.tsx +++ b/ui/v2.5/src/components/Galleries/GalleryList.tsx @@ -45,7 +45,10 @@ export const GalleryList: React.FC = () => { - {gallery.path} ({gallery.files.length} {gallery.files.length === 1 ? 'image' : 'images'}) + + {gallery.path} ({gallery.files.length}{" "} + {gallery.files.length === 1 ? "image" : "images"}) + ))} diff --git a/ui/v2.5/src/components/Movies/MovieDetails/Movie.tsx b/ui/v2.5/src/components/Movies/MovieDetails/Movie.tsx index cef9e9c8c..f95921480 100644 --- a/ui/v2.5/src/components/Movies/MovieDetails/Movie.tsx +++ b/ui/v2.5/src/components/Movies/MovieDetails/Movie.tsx @@ -253,7 +253,7 @@ export const Movie: React.FC = () => { })} {TableUtils.renderHtmlSelect({ title: "Rating", - value: rating ? rating : "", + value: rating ?? "", isEditing, onChange: (value: string) => setRating(Number.parseInt(value, 10)), diff --git a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx index b8581efb8..f737ad1c8 100644 --- a/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx +++ b/ui/v2.5/src/components/Performers/PerformerDetails/Performer.tsx @@ -189,7 +189,10 @@ export const Performer: React.FC = () => { {performer.twitter && ( diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneFileInfoPanel.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneFileInfoPanel.tsx index c10310d2c..675b81545 100644 --- a/ui/v2.5/src/components/Scenes/SceneDetails/SceneFileInfoPanel.tsx +++ b/ui/v2.5/src/components/Scenes/SceneDetails/SceneFileInfoPanel.tsx @@ -151,9 +151,7 @@ export const SceneFileInfoPanel: React.FC = (
Downloaded From - - {props.scene.url} - + {props.scene.url}
); diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx index 7833cc466..f91b1eff1 100644 --- a/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx +++ b/ui/v2.5/src/components/Scenes/SceneDetails/SceneMarkerForm.tsx @@ -84,7 +84,7 @@ export const SceneMarkerForm: React.FC = ({ ) } numericValue={Number.parseInt(fieldProps.field.value ?? "0", 10)} - mandatory={true} + mandatory /> ); diff --git a/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx b/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx index 1bd8ce865..670a9fa0a 100644 --- a/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx +++ b/ui/v2.5/src/components/Settings/SettingsConfigurationPanel.tsx @@ -307,7 +307,8 @@ export const SettingsConfigurationPanel: React.FC = () => { onChange={() => setForceMkv(!forceMkv)} /> - Treat Matroska (MKV) as a supported container. Recommended for Chromium based browsers + Treat Matroska (MKV) as a supported container. Recommended for + Chromium based browsers @@ -318,7 +319,8 @@ export const SettingsConfigurationPanel: React.FC = () => { onChange={() => setForceHevc(!forceHevc)} /> - Treat HEVC as a supported codec. Recommended for Safari or some Android based browsers + Treat HEVC as a supported codec. Recommended for Safari or some + Android based browsers diff --git a/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx b/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx index e01fa0812..0ca327e70 100644 --- a/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx +++ b/ui/v2.5/src/components/Settings/SettingsLogsPanel.tsx @@ -68,9 +68,10 @@ class LogEntry { const MAX_LOG_ENTRIES = 200; const logLevels = ["Debug", "Info", "Warning", "Error"]; -const logReducer = (existingEntries:LogEntry[], newEntries:LogEntry[]) => ( - [...newEntries.reverse(), ...existingEntries] -); +const logReducer = (existingEntries: LogEntry[], newEntries: LogEntry[]) => [ + ...newEntries.reverse(), + ...existingEntries, +]; export const SettingsLogsPanel: React.FC = () => { const { data, error } = StashService.useLoggingSubscribe(); @@ -78,10 +79,9 @@ export const SettingsLogsPanel: React.FC = () => { const [currentData, dispatchLogUpdate] = useReducer(logReducer, []); const [logLevel, setLogLevel] = useState("Info"); - useEffect(() => { const newData = (data?.loggingSubscribe ?? []).map((e) => new LogEntry(e)); - dispatchLogUpdate(newData) + dispatchLogUpdate(newData); }, [data]); const oldData = (existingData?.logs ?? []).map((e) => new LogEntry(e)); diff --git a/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx b/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx index 7302e225f..a3731b119 100644 --- a/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx +++ b/ui/v2.5/src/components/Settings/SettingsTasksPanel/SettingsTasksPanel.tsx @@ -105,9 +105,9 @@ export const SettingsTasksPanel: React.FC = () => { cancel={{ onClick: () => setIsCleanAlertOpen(false) }} >

- Are you sure you want to Clean? This will delete database information and - generated content for all scenes and galleries that are no longer found in the - filesystem. + Are you sure you want to Clean? This will delete database information + and generated content for all scenes and galleries that are no longer + found in the filesystem.

); diff --git a/ui/v2.5/src/components/Shared/DurationInput.tsx b/ui/v2.5/src/components/Shared/DurationInput.tsx index 422e08ce4..4d999086c 100644 --- a/ui/v2.5/src/components/Shared/DurationInput.tsx +++ b/ui/v2.5/src/components/Shared/DurationInput.tsx @@ -7,14 +7,19 @@ interface IProps { disabled?: boolean; numericValue: number | undefined; mandatory?: boolean; - onValueChange(valueAsNumber: number | undefined, valueAsString?: string): void; + onValueChange( + valueAsNumber: number | undefined, + valueAsString?: string + ): void; onReset?(): void; className?: string; } export const DurationInput: React.FC = (props: IProps) => { const [value, setValue] = useState( - props.numericValue !== undefined ? DurationUtils.secondsToString(props.numericValue) : undefined + props.numericValue !== undefined + ? DurationUtils.secondsToString(props.numericValue) + : undefined ); useEffect(() => { diff --git a/ui/v2.5/src/components/Shared/ImageInput.tsx b/ui/v2.5/src/components/Shared/ImageInput.tsx index e0d1d3aa0..9c96858f1 100644 --- a/ui/v2.5/src/components/Shared/ImageInput.tsx +++ b/ui/v2.5/src/components/Shared/ImageInput.tsx @@ -22,7 +22,7 @@ export const ImageInput: React.FC = ({ ); diff --git a/ui/v2.5/src/components/Shared/Select.tsx b/ui/v2.5/src/components/Shared/Select.tsx index 447b47ce9..41a492c03 100644 --- a/ui/v2.5/src/components/Shared/Select.tsx +++ b/ui/v2.5/src/components/Shared/Select.tsx @@ -42,6 +42,7 @@ interface ISelectProps { placeholder?: string; showDropdown?: boolean; groupHeader?: string; + closeMenuOnSelect?: boolean; } interface ISceneGallerySelect { @@ -355,6 +356,7 @@ export const TagSelect: React.FC = (props) => { items={items} onCreateOption={onCreate} selectedOptions={selected} + closeMenuOnSelect={false} /> ); }; @@ -376,6 +378,7 @@ const SelectComponent: React.FC = ({ placeholder, showDropdown = true, groupHeader, + closeMenuOnSelect = true, }) => { const defaultValue = items.filter((item) => initialIds?.indexOf(item.value) !== -1) ?? null; @@ -421,6 +424,7 @@ const SelectComponent: React.FC = ({ isDisabled, isLoading, styles, + closeMenuOnSelect, components: { IndicatorSeparator: () => null, ...((!showDropdown || isDisabled) && { DropdownIndicator: () => null }), diff --git a/ui/v2.5/src/components/Stats.tsx b/ui/v2.5/src/components/Stats.tsx index 3302285f5..e1d212cec 100644 --- a/ui/v2.5/src/components/Stats.tsx +++ b/ui/v2.5/src/components/Stats.tsx @@ -10,7 +10,7 @@ export const Stats: React.FC = () => { if (error) return error.message; - var size = data.stats.scene_size_count.split(" ") + const size = data.stats.scene_size_count.split(" "); return (
@@ -18,7 +18,7 @@ export const Stats: React.FC = () => {

- {" " + size[1]} + {` ${size[1]}`}

diff --git a/ui/v2.5/src/index.scss b/ui/v2.5/src/index.scss index 5e37ac35c..f5dc948e2 100755 --- a/ui/v2.5/src/index.scss +++ b/ui/v2.5/src/index.scss @@ -196,14 +196,6 @@ div.dropdown-menu { .dropdown-item { display: flex; - - & > * { - margin-right: 7px; - } - - & > :last-child { - margin-right: 0; - } } } @@ -396,8 +388,8 @@ div.dropdown-menu { overflow: hidden; position: relative; - input[type=file], /* FF, IE7+, chrome (except button) */ - input[type=file]::-webkit-file-upload-button { + input[type="file"], /* FF, IE7+, chrome (except button) */ + input[type="file"]::-webkit-file-upload-button { /* chromes and blink button */ cursor: pointer; } diff --git a/ui/v2.5/src/models/list-filter/criteria/is-missing.ts b/ui/v2.5/src/models/list-filter/criteria/is-missing.ts index 19aa23410..128276a91 100644 --- a/ui/v2.5/src/models/list-filter/criteria/is-missing.ts +++ b/ui/v2.5/src/models/list-filter/criteria/is-missing.ts @@ -43,7 +43,7 @@ export class PerformerIsMissingCriterion extends IsMissingCriterion { "piercings", "aliases", "gender", - "scenes" + "scenes", ]; } diff --git a/ui/v2.5/src/models/list-filter/criteria/utils.ts b/ui/v2.5/src/models/list-filter/criteria/utils.ts index 9c94fe516..785d5f1dd 100644 --- a/ui/v2.5/src/models/list-filter/criteria/utils.ts +++ b/ui/v2.5/src/models/list-filter/criteria/utils.ts @@ -9,7 +9,10 @@ import { } from "./criterion"; import { FavoriteCriterion } from "./favorite"; import { HasMarkersCriterion } from "./has-markers"; -import {PerformerIsMissingCriterion, SceneIsMissingCriterion} from "./is-missing"; +import { + PerformerIsMissingCriterion, + SceneIsMissingCriterion, +} from "./is-missing"; import { NoneCriterion } from "./none"; import { PerformersCriterion } from "./performers"; import { RatingCriterion } from "./rating"; diff --git a/ui/v2.5/src/models/list-filter/filter.ts b/ui/v2.5/src/models/list-filter/filter.ts index 1d2246154..d33fa2a27 100644 --- a/ui/v2.5/src/models/list-filter/filter.ts +++ b/ui/v2.5/src/models/list-filter/filter.ts @@ -29,7 +29,7 @@ import { import { IsMissingCriterion, PerformerIsMissingCriterionOption, - SceneIsMissingCriterionOption + SceneIsMissingCriterionOption, } from "./criteria/is-missing"; import { NoneCriterionOption } from "./criteria/none"; import { @@ -148,7 +148,9 @@ export class ListFilterModel { new FavoriteCriterionOption(), new GenderCriterionOption(), new PerformerIsMissingCriterionOption(), - ...numberCriteria.concat(stringCriteria).map(c => ListFilterModel.createCriterionOption(c)) + ...numberCriteria + .concat(stringCriteria) + .map((c) => ListFilterModel.createCriterionOption(c)), ]; break; diff --git a/ui/v2.5/src/utils/editabletext.tsx b/ui/v2.5/src/utils/editabletext.tsx index d74acd307..5f4e326a7 100644 --- a/ui/v2.5/src/utils/editabletext.tsx +++ b/ui/v2.5/src/utils/editabletext.tsx @@ -20,7 +20,7 @@ const renderTextArea = (options: { value={options.value} /> ); -} +}; const renderEditableText = (options: { title?: string; @@ -42,8 +42,8 @@ const renderEditableText = (options: { } placeholder={options.title} /> - ) -} + ); +}; const renderInputGroup = (options: { title?: string; @@ -55,16 +55,12 @@ const renderInputGroup = (options: { }) => { if (options.url && !options.isEditing) { return ( - + {options.value} ); } - + return ( ); -} +}; const renderDurationInput = (options: { value: string | undefined; isEditing: boolean; url?: string; - asString?: boolean + asString?: boolean; onChange: (value: string | undefined) => void; }) => { let numericValue: number | undefined; @@ -98,7 +94,7 @@ const renderDurationInput = (options: { numericValue = DurationUtils.stringToSeconds(options.value); } } - + if (!options.isEditing) { let durationString; if (numericValue !== undefined) { @@ -118,17 +114,18 @@ const renderDurationInput = (options: { { + onValueChange={(valueAsNumber: number, valueAsString?: string) => { let value = valueAsString; if (!options.asString) { - value = valueAsNumber !== undefined ? valueAsNumber.toString() : undefined; + value = + valueAsNumber !== undefined ? valueAsNumber.toString() : undefined; } options.onChange(value); }} /> ); -} +}; const renderHtmlSelect = (options: { value?: string | number; @@ -164,7 +161,7 @@ const renderHtmlSelect = (options: { ))} ); -} +}; // TODO: isediting const renderFilterSelect = (options: { @@ -202,4 +199,4 @@ const EditableTextUtils = { renderFilterSelect, renderMultiSelect, }; -export default EditableTextUtils; \ No newline at end of file +export default EditableTextUtils; diff --git a/ui/v2.5/src/utils/table.tsx b/ui/v2.5/src/utils/table.tsx index 5e3347647..e78ba579d 100644 --- a/ui/v2.5/src/utils/table.tsx +++ b/ui/v2.5/src/utils/table.tsx @@ -9,9 +9,7 @@ const renderEditableTextTableRow = (options: { }) => ( {options.title} - - {EditableTextUtils.renderEditableText(options)} - + {EditableTextUtils.renderEditableText(options)} ); @@ -23,9 +21,7 @@ const renderTextArea = (options: { }) => ( {options.title} - - {EditableTextUtils.renderTextArea(options)} - + {EditableTextUtils.renderTextArea(options)} ); @@ -39,9 +35,7 @@ const renderInputGroup = (options: { }) => ( {options.title} - - {EditableTextUtils.renderInputGroup(options)} - + {EditableTextUtils.renderInputGroup(options)} ); @@ -56,9 +50,7 @@ const renderDurationInput = (options: { return ( {options.title} - - {EditableTextUtils.renderDurationInput(options)} - + {EditableTextUtils.renderDurationInput(options)} ); }; @@ -72,9 +64,7 @@ const renderHtmlSelect = (options: { }) => ( {options.title} - - {EditableTextUtils.renderHtmlSelect(options)} - + {EditableTextUtils.renderHtmlSelect(options)} ); @@ -87,9 +77,7 @@ const renderFilterSelect = (options: { }) => ( {options.title} - - {EditableTextUtils.renderFilterSelect(options)} - + {EditableTextUtils.renderFilterSelect(options)} ); @@ -102,9 +90,7 @@ const renderMultiSelect = (options: { }) => ( {options.title} - - {EditableTextUtils.renderMultiSelect(options)} - + {EditableTextUtils.renderMultiSelect(options)} ); diff --git a/ui/v2.5/src/utils/text.ts b/ui/v2.5/src/utils/text.ts index b897c25f1..4812dd826 100644 --- a/ui/v2.5/src/utils/text.ts +++ b/ui/v2.5/src/utils/text.ts @@ -90,7 +90,7 @@ const sanitiseURL = (url?: string, siteURL?: URL) => { if (!url) { return url; } - + if (url.startsWith("http://") || url.startsWith("https://")) { // just return the entire URL return url; @@ -103,12 +103,12 @@ const sanitiseURL = (url?: string, siteURL?: URL) => { } // otherwise, construct the url from the protocol, host and passed url - return siteURL.protocol + siteURL.host + "/" + url; + return `${siteURL.protocol}${siteURL.host}/${url}`; } // just prepend the protocol - assume https - return "https://" + url; -} + return `https://${url}`; +}; const TextUtils = { truncate,