From 5c1b2f07c3628eb052aa10b325cde1c76c1f19e1 Mon Sep 17 00:00:00 2001 From: Martin Man Date: Tue, 15 Oct 2024 18:48:49 +0200 Subject: [PATCH] feat: Annotate custom hooks with TS types --- src/client/hooks/useAdminApi.js | 107 ------------------ src/client/hooks/useAdminApi.ts | 65 +++++++++++ ...FormValidation.js => useFormValidation.ts} | 14 +-- 3 files changed, 70 insertions(+), 116 deletions(-) delete mode 100644 src/client/hooks/useAdminApi.js create mode 100644 src/client/hooks/useAdminApi.ts rename src/client/hooks/{useFormValidation.js => useFormValidation.ts} (53%) diff --git a/src/client/hooks/useAdminApi.js b/src/client/hooks/useAdminApi.js deleted file mode 100644 index fd0b499..0000000 --- a/src/client/hooks/useAdminApi.js +++ /dev/null @@ -1,107 +0,0 @@ -import { useState, useEffect } from "react" -import useAxios from "axios-hooks" - -const ADMIN_API_CONFIG = "/admin-api/config" -const ADMIN_API_SECURITY = "/admin-api/security" -const ADMIN_API_LOG = "/admin-api/log" -const ADMIN_API_DEBUG = "/admin-api/debug" - -function useGetConfig() { - const [{ data, loading, error }, execute, cancel] = useAxios({ - url: ADMIN_API_CONFIG, - method: "GET", - }) - - const [config, setConfig] = useState() - useEffect(() => { - setConfig(data) - }, [data]) - - return [{ data: config, setData: setConfig, loading, error }, execute, cancel] -} - -function usePutConfig() { - const [{ data, loading, error }, execute, cancel] = useAxios( - { url: ADMIN_API_CONFIG, method: "PUT" }, - { manual: true }, - ) - - return [{ data, loading, error }, execute, cancel] -} - -export { useGetConfig, usePutConfig } - -function usePostSecurity() { - const [{ data, loading, error }, execute, cancel] = useAxios( - { url: ADMIN_API_SECURITY, method: "POST" }, - { manual: true }, - ) - - return [{ data, loading, error }, execute, cancel] -} - -export { usePostSecurity } - -function useGetLog() { - const [{ data, loading, error }, execute, cancel] = useAxios({ - url: ADMIN_API_LOG, - method: "GET", - }) - - return [{ data, loading, error }, execute, cancel] -} - -export { useGetLog } - -function useGetDebug() { - const [{ data, loading, error }, execute, cancel] = useAxios({ - url: ADMIN_API_DEBUG, - method: "GET", - }) - - return [{ data, loading, error }, execute, cancel] -} - -function usePutDebug() { - const [{ data, loading, error }, execute, cancel] = useAxios( - { url: ADMIN_API_DEBUG, method: "PUT" }, - { manual: true }, - ) - - return [{ data, loading, error }, execute, cancel] -} - -export { useGetDebug, usePutDebug } - -const ADMIN_API_VRM_LOGIN = "/admin-api/vrmLogin" -const ADMIN_API_VRM_LOGOUT = "/admin-api/vrmLogout" -const ADMIN_API_VRM_REFRESH = "/admin-api/vrmRefresh" - -function useVRMLogin() { - const [{ data, loading, error }, execute, cancel] = useAxios( - { url: ADMIN_API_VRM_LOGIN, method: "POST" }, - { manual: true }, - ) - - return [{ data, loading, error }, execute, cancel] -} - -function useVRMLogout() { - const [{ data, loading, error }, execute, cancel] = useAxios( - { url: ADMIN_API_VRM_LOGOUT, method: "POST" }, - { manual: true }, - ) - - return [{ data, loading, error }, execute, cancel] -} - -function useVRMRefresh() { - const [{ data, loading, error }, execute, cancel] = useAxios( - { url: ADMIN_API_VRM_REFRESH, method: "PUT" }, - { manual: true }, - ) - - return [{ data, loading, error }, execute, cancel] -} - -export { useVRMLogin, useVRMLogout, useVRMRefresh } diff --git a/src/client/hooks/useAdminApi.ts b/src/client/hooks/useAdminApi.ts new file mode 100644 index 0000000..dfb4f62 --- /dev/null +++ b/src/client/hooks/useAdminApi.ts @@ -0,0 +1,65 @@ +import useAxios from "axios-hooks" +import { ADMIN_API_CONFIG, ADMIN_API_DEBUG, ADMIN_API_LOG, ADMIN_API_SECURITY, ADMIN_API_VRM_LOGOUT, ADMIN_API_VRM_REFRESH, GetConfigRequest, GetConfigResponse, GetDebugRequest, GetDebugResponse, GetLogRequest, GetLogResponse, PostSecurityRequest, PostSecurityResponse, PutConfigRequest, PutConfigResponse, PutDebugRequest, PutDebugResponse, VRMLoginRequest, VRMLoginResponse, VRMLogoutRequest, VRMLogoutResponse, VRMRefreshRequest, VRMRefreshResponse } from "../../shared/api" + +export function useGetConfig() { + return useAxios({ + url: ADMIN_API_CONFIG, + method: "GET", + }) +} + +export function usePutConfig() { + return useAxios( + { url: ADMIN_API_CONFIG, method: "PUT" }, + { manual: true }, + ) +} + +export function usePostSecurity() { + return useAxios( + { url: ADMIN_API_SECURITY, method: "POST" }, + { manual: true }, + ) +} + +export function useGetLog() { + return useAxios({ + url: ADMIN_API_LOG, + method: "GET", + }) +} + +export function useGetDebug() { + return useAxios({ + url: ADMIN_API_DEBUG, + method: "GET", + }) +} + +export function usePutDebug() { + return useAxios( + { url: ADMIN_API_DEBUG, method: "PUT" }, + { manual: true }, + ) +} + +export function useVRMLogin() { + return useAxios( + { url: ADMIN_API_LOG, method: "POST" }, + { manual: true }, + ) +} + +export function useVRMLogout() { + return useAxios( + { url: ADMIN_API_VRM_LOGOUT, method: "POST" }, + { manual: true }, + ) +} + +export function useVRMRefresh() { + return useAxios( + { url: ADMIN_API_VRM_REFRESH, method: "PUT" }, + { manual: true }, + ) +} \ No newline at end of file diff --git a/src/client/hooks/useFormValidation.js b/src/client/hooks/useFormValidation.ts similarity index 53% rename from src/client/hooks/useFormValidation.js rename to src/client/hooks/useFormValidation.ts index a8d79c2..5185f58 100644 --- a/src/client/hooks/useFormValidation.js +++ b/src/client/hooks/useFormValidation.ts @@ -1,6 +1,6 @@ import { useState, useEffect } from "react" -function useFormValidation(validate) { +export function useFormValidation(validate: () => boolean) { const [isValid, setIsValid] = useState(false) useEffect(() => { @@ -10,16 +10,12 @@ function useFormValidation(validate) { return isValid } -export { useFormValidation } - -function extractParameterNameAndValue(event) { - let value = +export function extractParameterNameAndValue(event: React.ChangeEvent): [AppConfigNestedKey, string | number | boolean] { + let value: string | number | boolean = event.target.type === "checkbox" ? event.target.checked : event.target.value // TODO: figure how to better handle this ??? if (event.target.name === "port") { value = Number(value) } - return [event.target.name, value] -} - -export { extractParameterNameAndValue } + return [event.target.name as AppConfigNestedKey, value] +} \ No newline at end of file