simeonradivoev/gameflow-deck
simeonradivoev/gameflow-deck
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: moved queries to their own file

Browse source
This commit is contained in:
Simeon Radivoev 2026-03-17 12:57:11 +02:00
parent 364bc9d0be
commit cf6fff6fac
Signed by: simeonradivoev
GPG key ID: 7611A451D2A5D37A
83 changed files with 1107 additions and 852 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/mainview/components/options/Button.tsx
View file

@ -5,7 +5,7 @@ import
useFocusable,
} from "@noriginmedia/norigin-spatial-navigation";
import classNames from "classnames";
import { GamePadButtonCode, Shortcut, useShortcuts } from "@/mainview/scripts/shortcuts";
import { GamePadButtonCode, useShortcuts } from "@/mainview/scripts/shortcuts";
import { CSSProperties } from "react";
export type ButtonStyle = 'base' | 'accent' | 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error';

4
src/mainview/components/options/DownloadDirectoryOption.tsx
View file

@ -1,14 +1,14 @@
import { useState } from "react";
import { PathSettingsOptionBase, PathSettingsOptionParams } from "./PathSettingsOption";
import { useMutation } from "@tanstack/react-query";
import { changeDownloadsMutation } from "@/mainview/scripts/queries";
import queries from "@/mainview/scripts/queries";
export default function DownloadDirectoryOption (data: PathSettingsOptionParams)
{
const [localValue, setLocalValue] = useState<string | undefined>();
const [dirty, setDirty] = useState(false);
const setSettingMutation = useMutation({
...changeDownloadsMutation,
...queries.settings.changeDownloadsMutation,
onSuccess: (d, v, r, cx) =>
{
setDirty(r !== localValue);

11
src/mainview/components/options/OptionDropdown.tsx
View file

@ -1,6 +1,5 @@
import { FocusEventHandler, HTMLInputAutoCompleteAttribute, HTMLInputTypeAttribute, JSX, useRef, useState } from "react";
import { FocusEventHandler, HTMLInputAutoCompleteAttribute, HTMLInputTypeAttribute, JSX, useState } from "react";
import { twMerge } from "tailwind-merge";
import { useOptionContext } from "./OptionSpace";
import { useFocusable } from "@noriginmedia/norigin-spatial-navigation";
import { ContextDialog, ContextList, DialogEntry } from "../ContextDialog";
import { ChevronDown } from "lucide-react";
@ -25,15 +24,9 @@ export function OptionDropdown (data: {
setOpen(true);
};
const handleClose = () => setOpen(false);
const { ref, focused, focusKey } = useFocusable({
const { ref } = useFocusable({
focusKey: data.name, onEnterPress: handlePress
});
const inputRef = useRef<HTMLInputElement>(null);
const option = useOptionContext({
onOptionEnterPress: handlePress,
});
const valueIndex = data.value ? data.values?.indexOf(data.value) : -1;
return (
<>

2
src/mainview/components/options/OptionInput.tsx
View file

@ -28,7 +28,7 @@ export function OptionInput (data: {
inputRef.current?.focus();
}
};
const { ref, focused } = useFocusable({
const { ref } = useFocusable({
focusKey: data.name, onEnterPress: handlePress
});
const inputRef = useRef<HTMLInputElement>(null);

2
src/mainview/components/options/OptionSpace.tsx
View file

@ -41,7 +41,7 @@ export function OptionSpace (data: {
})
{
const eventTarget = useMemo(() => new EventTarget(), []);
const { ref, focused, focusSelf, focusKey, hasFocusedChild } = useFocusable({
const { ref, focused, focusSelf, focusKey } = useFocusable({
focusKey: data.id,
focusable: data.focusable !== false,
trackChildren: true,

39
src/mainview/components/options/PathSettingsOption.tsx
View file

@ -1,14 +1,14 @@
import { HTMLInputTypeAttribute, JSX, useCallback, useState } from "react";
import { HTMLInputTypeAttribute, JSX, useEffect, useState } from "react";
import { SettingsType } from "../../../shared/constants";
import { useMutation, useQuery } from "@tanstack/react-query";
import { OptionSpace } from "./OptionSpace";
import { OptionInput } from "./OptionInput";
import { settingsApi } from "../../scripts/clientApi";
import { Button } from "./Button";
import { FileSearchCorner, FolderSearch, Pen, Save } from "lucide-react";
import { ContextDialog } from "../ContextDialog";
import FilePicker from "../FilePicker";
import { setFocus } from "@noriginmedia/norigin-spatial-navigation";
import queries from "@/mainview/scripts/queries";
type KeysWithValueAssignableTo<T, Value> = {
[K in keyof T]: Exclude<T[K], undefined> extends Value ? K : never;
@ -32,14 +32,8 @@ export function PathSettingsOption (data: PathSettingsOptionParams)
{
const [localValue, setLocalValue] = useState<string | undefined>();
const [dirty, setDirty] = useState(false);
const setSettingMutation = useMutation({
mutationKey: ["setting", data.id],
mutationFn: async (value: any) =>
{
const response = await settingsApi.api.settings({ id: data.id! }).post({ value });
if (response.error) throw response.error;
return response.data;
},
const setMutation = useMutation({
...queries.settings.setSettingMutation(data.id),
onSuccess: (d, v, r, cx) =>
{
setDirty(r !== localValue);
@ -51,7 +45,7 @@ export function PathSettingsOption (data: PathSettingsOptionParams)
label={data.label}
id={data.id}
type={data.type}
save={setSettingMutation.mutate}
save={setMutation.mutate}
localValue={localValue}
allowNewFolderCreation={data.allowNewFolderCreation}
setLocalValue={(v) =>
@ -69,22 +63,17 @@ export function PathSettingsOptionBase (data: PathSettingsOptionParams & {
})
{
const [isBrowsing, setIsBrowsing] = useState(false);
const { data: defaultValue } = useQuery({
enabled: !!data.id,
queryKey: ["setting", data.id],
queryFn: async () =>
{
const { data: value, error } = await settingsApi.api.settings({ id: data.id! }).get();
if (error) throw error;
if (!data.isDirty)
{
data.setLocalValue(String(value.value));
}
return value.value;
},
});
const { data: defaultValue } = useQuery(queries.settings.getSettingQuery(data.id));
const changed = defaultValue !== data.localValue;
useEffect(() =>
{
if (!data.isDirty)
{
data.setLocalValue(String(defaultValue));
}
}, [data.isDirty, defaultValue]);
const handleSelectPath = (path: string) =>
{
data.setLocalValue(path);

29
src/mainview/components/options/SettingsOption.tsx
View file

@ -3,7 +3,7 @@ import { SettingsType } from "../../../shared/constants";
import { useMutation, useQuery } from "@tanstack/react-query";
import { OptionSpace } from "./OptionSpace";
import { OptionInput } from "./OptionInput";
import { settingsApi } from "../../scripts/clientApi";
import queries from "@/mainview/scripts/queries";
type KeysWithValueAssignableTo<T, Value> = {
[K in keyof T]: Exclude<T[K], undefined> extends Value ? K : never;
@ -20,36 +20,15 @@ export function SettingsOption (data: {
{
const [dirty, setDirty] = useState(false);
const [localValue, setLocalValue] = useState<string | undefined>();
useQuery({
enabled: !!data.id,
queryKey: ["setting", data.id],
queryFn: async () =>
{
const { data: value, error } = await settingsApi.api.settings({ id: data.id! }).get();
if (error) throw error;
if (!dirty)
{
setLocalValue(String(value.value));
}
return value.value;
},
});
const setSettingMutation = useMutation({
mutationKey: ["setting", data.id],
mutationFn: async (value: any) =>
{
const response = await settingsApi.api.settings({ id: data.id! }).post({ value });
if (response.error) throw response.error;
return response.data;
}
});
useQuery(queries.settings.getSettingQuery(data.id));
const setMutation = useMutation(queries.settings.setSettingMutation(data.id));
const handleSave = useCallback(() =>
{
if (dirty)
{
setDirty(false);
setSettingMutation.mutate(localValue);
setMutation.mutate(localValue);
}
}, [dirty, setDirty, localValue]);