feat(utils): delay 함수 추가 (#92)

* feat(utils): delay 함수 추가

* fix: delay 함수 관련 문서 내에 존재하는 불필요한 함수 수정 완료

* Create long-lobsters-type.md

* fix: 테스트코드 동작시간 단축을 위한 delay함수 검증시간 수정 완료

* refac: useBlockPromiseMultipleClick 테스트코드에서 사용중인 delay함수를 utils에 있는 함수로 교체 완료

---------

Co-authored-by: Gromit (전민재) <[email protected]>

.changeset/long-lobsters-type.md

@@ -0,0 +1,5 @@
+---
+"@modern-kit/utils": patch
+---
+
+feat(utils): delay 함수 추가

docs/docs/utils/common/delay.md

@@ -0,0 +1,24 @@
+# delay
+
+주어진 시간만큼 기다린 뒤 다음 동작을 수행할 수 있도록 하는 함수입니다.
+
+setTimeout을 사용하여 특정 시간 뒤의 동작을 정의할 경우, 해당 시간 뒤 동작해야하는 함수 다음에 Promise가 존재한다면 setTimeout은 macroTaskQueue에 속하고 Promise는 microTaskQueue에 속하게 되어 의도한 바와 같이 순서대로의 동작을 보장하지 못할 수 있습니다. delay 함수를 사용한다면 이러한 문제를 해결할 수 있습니다.
+
+<br />
+
+## Interface
+```tsx
+const delay: (time: number) => Promise<void>
+```
+
+## Usage
+```ts
+import { delay } from '@modern-kit/utils';
+
+const something = () => Promise.resolve()
+
+const doSomethingAfterDelay = async () => {
+  await delay(1000)
+  await something()
+}
+```

packages/react/src/hooks/useBlockPromiseMultipleClick/useBlockPromiseMultipleClick.spec.tsx

@@ -2,12 +2,7 @@ import { describe, expect, it } from 'vitest';
 import { screen, renderHook } from '@testing-library/react';
 import { renderSetup } from '../../utils/test/renderSetup';
 import { useBlockPromiseMultipleClick } from '.';
-
-const delay = (time: number) => {
-  return new Promise<void>((resolve) => {
-    setTimeout(() => resolve(), time);
-  });
-};
+import { delay } from '@modern-kit/utils';
 
 beforeEach(() => {
   vi.useFakeTimers();
@@ -29,7 +24,7 @@ describe('useBlockPromiseMultipleClick', () => {
 
     const { user } = renderSetup(
       <button onClick={onClick}>TestButton</button>,
-      { delay: null }
+      { delay: null },
     );
 
     const button = screen.getByRole('button');

packages/utils/src/common/delay/delay.spec.ts

@@ -0,0 +1,15 @@
+import { describe, expect, it } from 'vitest';
+import { delay } from '.';
+
+describe('delay', () => {
+  it('should delay the promise by the given time', async () => {
+    const time = 200;
+    const start = Date.now();
+
+    await delay(time);
+
+    const end = Date.now();
+
+    expect(end - start).toBeGreaterThanOrEqual(time);
+  });
+});

packages/utils/src/common/delay/index.ts

@@ -0,0 +1,5 @@
+export const delay = (time: number) => {
+  return new Promise<void>((resolve) => {
+    setTimeout(() => resolve(), time);
+  });
+};

packages/utils/src/common/index.ts

@@ -2,6 +2,7 @@ export * from './abRandom';
 export * from './asyncNoop';
 export * from './deepCopy';
 export * from './deepEqual';
+export * from './delay';
 export * from './getUniqId';
 export * from './getUniqTime';
 export * from './getViewportSize';