✨ add xinput gamepad feature

Author: peppapighs

src/api/use-get-gamepad-buttons.ts

@@ -0,0 +1,26 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { useDevice } from "@/components/providers/device-provider"
+import { useQuery } from "@tanstack/react-query"
+
+export function useGetGamepadButtons(profile: number) {
+  const { id, getGamepadButtons } = useDevice()
+
+  return useQuery({
+    queryKey: [id, profile, "gamepadButtons"],
+    queryFn: async () => await getGamepadButtons(profile),
+  })
+}

src/api/use-get-gamepad-options.ts

@@ -0,0 +1,26 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { useDevice } from "@/components/providers/device-provider"
+import { useQuery } from "@tanstack/react-query"
+
+export function useGetGamepadOptions(profile: number) {
+  const { id, getGamepadOptions } = useDevice()
+
+  return useQuery({
+    queryKey: [id, profile, "gamepadOptions"],
+    queryFn: async () => await getGamepadOptions(profile),
+  })
+}

src/api/use-get-keymap-with-advanced-keys.ts

@@ -20,7 +20,7 @@ import { produce } from "immer"
 import { useGetAdvancedKeys } from "./use-get-advanced-keys"
 import { useGetKeymap } from "./use-get-keymap"
 
-export function useGetKeymapWithAdvancedKeys(profile: number):
+type GetKeymapWithAdvancedKeysReturnType =
   | {
       isSuccess: false
       keymap?: undefined
@@ -34,7 +34,11 @@ export function useGetKeymapWithAdvancedKeys(profile: number):
       normalKeymap: number[][]
       advancedKeys: DeviceAdvancedKey[]
       akIndices: (number | null)[][]
-    } {
+    }
+
+export function useGetKeymapWithAdvancedKeys(
+  profile: number,
+): GetKeymapWithAdvancedKeysReturnType {
   const { metadata } = useDevice()
 
   const { isSuccess: isKeymapSuccess, data: keymap } = useGetKeymap(profile)

src/api/use-get-keymap-with-gamepad-buttons.ts

@@ -0,0 +1,66 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { useDevice } from "@/components/providers/device-provider"
+import { gamepadButtonToKeycode } from "@/lib/gamepad"
+import { GamepadButton } from "@/types/gamepad"
+import { produce } from "immer"
+import { useGetGamepadButtons } from "./use-get-gamepad-buttons"
+import { useGetKeymap } from "./use-get-keymap"
+
+type GetKeymapWithGamepadButtonsReturnType =
+  | {
+      isSuccess: false
+      keymap?: undefined
+      normalKeymap?: undefined
+      gamepadButtons?: undefined
+    }
+  | {
+      isSuccess: true
+      keymap: number[][]
+      normalKeymap: number[][]
+      gamepadButtons: number[]
+    }
+
+export function useGetKeymapWithGamepadButtons(
+  profile: number,
+): GetKeymapWithGamepadButtonsReturnType {
+  const { metadata } = useDevice()
+
+  const { isSuccess: isKeymapSuccess, data: keymap } = useGetKeymap(profile)
+  const { isSuccess: isGamepadButtonsSuccess, data: gamepadButtons } =
+    useGetGamepadButtons(profile)
+
+  if (!isKeymapSuccess || !isGamepadButtonsSuccess) {
+    return { isSuccess: false }
+  }
+
+  const keymapWithGamepadButtons = produce(keymap, (draft) => {
+    for (let i = 0; i < gamepadButtons.length; i++) {
+      if (gamepadButtons[i] !== GamepadButton.GP_BUTTON_NONE) {
+        for (let layer = 0; layer < metadata.numLayers; layer++) {
+          draft[layer][i] = gamepadButtonToKeycode(gamepadButtons[i])
+        }
+      }
+    }
+  })
+
+  return {
+    isSuccess: true,
+    keymap: keymapWithGamepadButtons,
+    normalKeymap: keymap,
+    gamepadButtons,
+  }
+}

src/api/use-get-options.ts

@@ -0,0 +1,26 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { useDevice } from "@/components/providers/device-provider"
+import { useQuery } from "@tanstack/react-query"
+
+export function useGetOptions() {
+  const { id, getOptions } = useDevice()
+
+  return useQuery({
+    queryKey: [id, "options"],
+    queryFn: getOptions,
+  })
+}

src/api/use-set-gamepad-buttons.ts

@@ -0,0 +1,56 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { useDevice } from "@/components/providers/device-provider"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
+import { produce } from "immer"
+
+type SetGamepadButtonsParams = {
+  start: number
+  buttons: number[]
+}
+
+export function useSetGamepadButtons(profile: number) {
+  const { id, setGamepadButtons } = useDevice()
+
+  const queryClient = useQueryClient()
+  const queryKey = [id, profile, "gamepadButtons"]
+
+  return useMutation({
+    mutationFn: ({ start, buttons }: SetGamepadButtonsParams) =>
+      setGamepadButtons(profile, start, buttons),
+    onMutate: async ({ start, buttons }) => {
+      await queryClient.cancelQueries({ queryKey })
+      const previousButtons = queryClient.getQueryData<number[]>(queryKey)
+      queryClient.setQueryData(
+        queryKey,
+        produce(previousButtons, (draft) => {
+          if (draft) {
+            for (let i = 0; i < buttons.length; i++) {
+              draft[start + i] = buttons[i]
+            }
+          }
+        }),
+      )
+
+      return { previousButtons }
+    },
+    onError: (err, _, context) => {
+      console.error(err)
+      queryClient.setQueryData(queryKey, context?.previousButtons)
+    },
+    onSettled: () => queryClient.invalidateQueries({ queryKey }),
+  })
+}

src/api/use-set-gamepad-options.ts

@@ -0,0 +1,43 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { useDevice } from "@/components/providers/device-provider"
+import { DeviceGamepadOptions } from "@/types/devices"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
+
+export function useSetGamepadOptions(profile: number) {
+  const { id, setGamepadOptions } = useDevice()
+
+  const queryClient = useQueryClient()
+  const queryKey = [id, profile, "gamepadOptions"]
+
+  return useMutation({
+    mutationFn: (options: DeviceGamepadOptions) =>
+      setGamepadOptions(profile, options),
+    onMutate: async (options) => {
+      await queryClient.cancelQueries({ queryKey })
+      const previousOptions =
+        queryClient.getQueryData<DeviceGamepadOptions>(queryKey)
+      queryClient.setQueryData(queryKey, options)
+
+      return { previousOptions }
+    },
+    onError: (err, _, context) => {
+      console.error(err)
+      queryClient.setQueryData(queryKey, context?.previousOptions)
+    },
+    onSettled: () => queryClient.invalidateQueries({ queryKey }),
+  })
+}

src/api/use-set-options.ts

@@ -0,0 +1,41 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import { useDevice } from "@/components/providers/device-provider"
+import { DeviceOptions } from "@/types/devices"
+import { useMutation, useQueryClient } from "@tanstack/react-query"
+
+export function useSetOptions() {
+  const { id, setOptions } = useDevice()
+
+  const queryClient = useQueryClient()
+  const queryKey = [id, "options"]
+
+  return useMutation({
+    mutationFn: (options: DeviceOptions) => setOptions(options),
+    onMutate: async (options) => {
+      await queryClient.cancelQueries({ queryKey })
+      const previousOptions = queryClient.getQueryData<DeviceOptions>(queryKey)
+      queryClient.setQueryData(queryKey, options)
+
+      return { previousOptions }
+    },
+    onError: (err, _, context) => {
+      console.error(err)
+      queryClient.setQueryData(queryKey, context?.previousOptions)
+    },
+    onSettled: () => queryClient.invalidateQueries({ queryKey }),
+  })
+}

src/components/configurator/advanced-keys/advanced-keys-create.tsx

@@ -19,7 +19,7 @@ import { useSetAdvancedKeys } from "@/api/use-set-advanced-keys"
 import { useConfigurator } from "@/components/providers/configurator-provider"
 import { useDevice } from "@/components/providers/device-provider"
 import { Button } from "@/components/ui/button"
-import { AK_TYPE_TO_METADATA } from "@/constants/devices"
+import { AK_TYPE_TO_METADATA } from "@/constants/advanced-keys"
 import { DeviceAKType } from "@/types/devices"
 import { ToggleGroup, ToggleGroupItem } from "@radix-ui/react-toggle-group"
 import { KeyboardEditorLayout } from "../common/keyboard-editor"

src/components/configurator/advanced-keys/advanced-keys-editor.tsx

@@ -18,12 +18,9 @@
 import { useGetAdvancedKeys } from "@/api/use-get-advanced-keys"
 import { useConfigurator } from "@/components/providers/configurator-provider"
 import { Button } from "@/components/ui/button"
-import { AK_TYPE_TO_METADATA } from "@/constants/devices"
-import {
-  DeviceAdvancedKey,
-  DeviceAdvancedKeyMetadata,
-  DeviceAKType,
-} from "@/types/devices"
+import { AK_TYPE_TO_METADATA } from "@/constants/advanced-keys"
+import { DeviceAdvancedKeyMetadata } from "@/types/advanced-keys"
+import { DeviceAdvancedKey, DeviceAKType } from "@/types/devices"
 import { createContext, useContext, useLayoutEffect } from "react"
 import { KeyboardEditorLayout } from "../common/keyboard-editor"
 import { AKDeleteDialog } from "./ak-delete-dialog"