const date = new Date();
date.setMinutes(-date.getTimezoneOffset());
.arrow div {
animation-duration: 7s;
}
@keyframes arrow {
12.5% {
width: 60px;
}
25% {
width: 260px;
transform: translateX(0px);
}
37.5%, 50% {
width: 60px;
transform: translateX(200px);
}
87.5% {
transform: translateX(200px);
}
100% {
transform: translateX(0px);
}
}import { useState } from "react";
export type DispatchKey<T> = keyof T;
export type DispatchValue<T, K extends DispatchKey<T>> = T[K];
export type DispatchIterator<T, K extends DispatchKey<T>> = (key: K) => DispatchValue<T, K>;
export type InitialState<T> = T | (() => T);
export default function useDispatch<T extends {}>(
initialState: InitialState<T>
) {
const [state, setState] = useState(initialState);
function dispatch<K extends DispatchKey<T>>(
key: K,
value: DispatchValue<T, K>
): void;
function dispatch<K extends DispatchKey<T>>(
keys: K[],
iterator: DispatchIterator<T, K>
): void;
function dispatch<T, K extends DispatchKey<T>>(
keyOrKeys: K | K[],
valueOrIterator: DispatchValue<T, K> | DispatchIterator<T, K>
): void {
if (Array.isArray(keyOrKeys)) {
if (typeof valueOrIterator === "function") {
const iterator = valueOrIterator as DispatchIterator<T, K>;
setState((prev) => {
const updated = keyOrKeys.map((key) => iterator(key));
console.log(updated);
return prev;
});
}
} else {
setState((prev) => ({
...prev,
[keyOrKeys]: valueOrIterator
}));
}
}
return [state, dispatch] as const;
}
date.getTime().