From 12d7f114bc38f79a67e8e38d51a22f2f517e9ea3 Mon Sep 17 00:00:00 2001
From: Max Frederiksen <maxfrederiksen@Maxs-MacBook-Air.local>
Date: Fri, 3 Jan 2025 16:06:25 +0100
Subject: [PATCH] Add typing /hooks + /icons + /style + /types
---
src/hooks/MountEffects.ts | 23 -----------------------
src/hooks/Redirect.ts | 2 +-
src/hooks/useTypingTimer.tsx | 21 +++++++++++++++------
src/icons/BatchDeploySymbol.tsx | 10 +++++++---
src/icons/BatchUndeploySymbol.tsx | 10 +++++++---
src/icons/CCCEControlSymbol.tsx | 2 +-
src/icons/RocketLaunch.tsx | 10 ----------
src/style/Theme.ts | 7 +++++++
src/types/common.ts | 22 ++++++++++++++++++++++
9 files changed, 60 insertions(+), 47 deletions(-)
delete mode 100644 src/hooks/MountEffects.ts
delete mode 100644 src/icons/RocketLaunch.tsx
diff --git a/src/hooks/MountEffects.ts b/src/hooks/MountEffects.ts
deleted file mode 100644
index 98c36bf9..00000000
--- a/src/hooks/MountEffects.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import { useEffect, useRef } from "react";
-
-function useMountEffect(effect, deps = [], afterMount) {
- const didMountRef = useRef(false);
-
- useEffect(() => {
- let cleanup;
- if (didMountRef.current === afterMount) {
- cleanup = effect();
- }
- didMountRef.current = true;
- return cleanup;
- // eslint-disable-next-line
- }, deps);
-}
-
-export function useEffectOnMount(effect) {
- useMountEffect(effect, [], false);
-}
-
-export function useEffectAfterMount(effect, deps) {
- useMountEffect(effect, deps, true);
-}
diff --git a/src/hooks/Redirect.ts b/src/hooks/Redirect.ts
index cf0f5774..27fa6823 100644
--- a/src/hooks/Redirect.ts
+++ b/src/hooks/Redirect.ts
@@ -6,7 +6,7 @@ export function useRedirect() {
const navigate = useNavigate();
// const history = useHistory();
const redirect = useCallback(
- (destination, state, replace = false) => {
+ (destination: string, state: object, replace: boolean = false) => {
/* const method = replace ? history.replace : history.push;
method(destination, { ...state, from: history.location.pathname });*/
navigate(destination, { replace: replace, state: state });
diff --git a/src/hooks/useTypingTimer.tsx b/src/hooks/useTypingTimer.tsx
index 92538a99..eb680237 100644
--- a/src/hooks/useTypingTimer.tsx
+++ b/src/hooks/useTypingTimer.tsx
@@ -1,12 +1,21 @@
-import { useState } from "react";
+import { useState, type KeyboardEvent } from "react";
-export function useTypingTimer({ init = "", interval = 750 } = {}) {
- const [typingTimer, setTypingTimer] = useState();
+interface UseTypingTimerReturn {
+ value: string;
+ onKeyUp: (event: KeyboardEvent<HTMLInputElement>) => void;
+}
+
+export function useTypingTimer({
+ init = "",
+ interval = 750
+} = {}): UseTypingTimerReturn {
+ const [typingTimer, setTypingTimer] = useState<number | undefined>(undefined);
const [value, setValue] = useState(init);
const doneTypingInterval = interval; // ms
- const onKeyUp = (event) => {
- const { target, key } = event;
+ const onKeyUp = (event: KeyboardEvent<HTMLInputElement>): void => {
+ const target = event.target as HTMLInputElement;
+ const { key } = event;
clearTimeout(typingTimer);
if (key === "Enter") {
setValue(target.value);
@@ -20,5 +29,5 @@ export function useTypingTimer({ init = "", interval = 750 } = {}) {
}
};
- return [value, onKeyUp];
+ return { value, onKeyUp };
}
diff --git a/src/icons/BatchDeploySymbol.tsx b/src/icons/BatchDeploySymbol.tsx
index 2cad91c3..4177beae 100644
--- a/src/icons/BatchDeploySymbol.tsx
+++ b/src/icons/BatchDeploySymbol.tsx
@@ -1,5 +1,9 @@
-import BatchDeployIcon from "./resources/batch/batch_deploy_icon.svg?react";
+import { ComponentProps } from "react";
+import BatchDeployIconSvg from "./resources/batch/batch_deploy_icon.svg?react";
+import { BatchDeployIcon } from "../components/Job/JobIcons";
-export function BatchDeploySymbol(props) {
- return <BatchDeployIcon {...props} />;
+export function BatchDeploySymbol(
+ props: ComponentProps<typeof BatchDeployIcon>
+) {
+ return <BatchDeployIconSvg {...props} />;
}
diff --git a/src/icons/BatchUndeploySymbol.tsx b/src/icons/BatchUndeploySymbol.tsx
index 4afdad2d..3ad1d693 100644
--- a/src/icons/BatchUndeploySymbol.tsx
+++ b/src/icons/BatchUndeploySymbol.tsx
@@ -1,5 +1,9 @@
-import BatchUndeployIcon from "./resources/batch/batch_undeploy_icon.svg?react";
+import { type ComponentProps } from "react";
+import BatchUndeployIconSvg from "./resources/batch/batch_undeploy_icon.svg?react";
+import { BatchUndeployIcon } from "../components/Job/JobIcons";
-export function BatchUndeploySymbol(props) {
- return <BatchUndeployIcon {...props} />;
+export function BatchUndeploySymbol(
+ props: ComponentProps<typeof BatchUndeployIcon>
+) {
+ return <BatchUndeployIconSvg {...props} />;
}
diff --git a/src/icons/CCCEControlSymbol.tsx b/src/icons/CCCEControlSymbol.tsx
index 11061f4d..92627a16 100644
--- a/src/icons/CCCEControlSymbol.tsx
+++ b/src/icons/CCCEControlSymbol.tsx
@@ -1,5 +1,5 @@
import CcceControlSymbolGray from "./resources/control/ccce-control-symbol_757575.svg?react";
-export function CCCEControlSymbol(props) {
+export function CCCEControlSymbol(props: { width: string; height: string }) {
return <CcceControlSymbolGray {...props} />;
}
diff --git a/src/icons/RocketLaunch.tsx b/src/icons/RocketLaunch.tsx
deleted file mode 100644
index c960e88b..00000000
--- a/src/icons/RocketLaunch.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { Tooltip } from "@mui/material";
-import { ReactComponent as RocketLaunchBlack } from "./resources/rocket/rocket_launch_black_24dp.svg?react";
-
-export function RocketLaunch(props) {
- return (
- <Tooltip title="Deployment">
- <RocketLaunchBlack {...props} />
- </Tooltip>
- );
-}
diff --git a/src/style/Theme.ts b/src/style/Theme.ts
index 127994bf..7a7c76ef 100644
--- a/src/style/Theme.ts
+++ b/src/style/Theme.ts
@@ -17,6 +17,13 @@ declare module "@mui/material/styles" {
disabled: {
main: string;
};
+ icons: string;
+ };
+ error: {
+ main: string;
+ };
+ warning: {
+ main: string;
};
primary: {
inconsistency: string;
diff --git a/src/types/common.ts b/src/types/common.ts
index 4f06d5aa..97affd9c 100644
--- a/src/types/common.ts
+++ b/src/types/common.ts
@@ -47,3 +47,25 @@ export interface ApiResult<T> {
export type FormElements<U extends string> = HTMLFormControlsCollection &
Record<U, HTMLInputElement>;
+
+export interface Pagination {
+ page: number;
+ rows: number;
+ query?: string;
+ orderAsc?: boolean;
+ totalCount?: number;
+ rowsPerPageOptions?: number[];
+}
+
+export interface DeployIocFormDefaults {
+ name: string;
+ description: string;
+ git: string;
+ gitProjectId?: number;
+ reference?: string;
+ short_reference?: string;
+ netBoxHost?: {
+ fqdn: string;
+ hostId: string;
+ };
+}
--
GitLab