feat: manually mirror opencoze's code from bytedance

Change-Id: I09a73aadda978ad9511264a756b2ce51f5761adf
This commit is contained in:
fanlv
2025-07-20 17:36:12 +08:00
commit 890153324f
14811 changed files with 1923430 additions and 0 deletions

View File

@@ -0,0 +1,5 @@
const { defineConfig } = require('@coze-arch/stylelint-config');
module.exports = defineConfig({
extends: [],
});

View File

@@ -0,0 +1,68 @@
# @coze-common/chat-hooks
Simple pure helpful hooks.
## Overview
This package is part of the Coze Studio monorepo and provides utilities functionality. It includes hook.
## Getting Started
### Installation
Add this package to your `package.json`:
```json
{
"dependencies": {
"@coze-common/chat-hooks": "workspace:*"
}
}
```
Then run:
```bash
rush update
```
### Usage
```typescript
import { /* exported functions/components */ } from '@coze-common/chat-hooks';
// Example usage
// TODO: Add specific usage examples
```
## Features
- Hook
## API Reference
### Exports
- `useImperativeLayoutEffect`
- `useSearch`
- `useEventCallback`
For detailed API documentation, please refer to the TypeScript definitions.
## Development
This package is built with:
- TypeScript
- Modern JavaScript
- Vitest for testing
- ESLint for code quality
## Contributing
This package is part of the Coze Studio monorepo. Please follow the monorepo contribution guidelines.
## License
Apache-2.0

View File

@@ -0,0 +1,52 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { useRef, useState } from 'react';
import { expect, it, vi } from 'vitest';
import { act, renderHook } from '@testing-library/react-hooks';
import { useEventCallback } from '../src/hooks/use-event-callback';
it('get a fixed reference', () => {
const print = vi.fn();
const { result } = renderHook(() => {
const [count, setCount] = useState(0);
const fn = useEventCallback(print);
const fnRef = useRef(fn);
const isSame = fnRef.current === fn;
const update = setCount;
fn(count);
return {
isSame,
update,
};
});
act(() => {
result.current.update(100);
});
expect(result.current.isSame).toBe(true);
expect(print.mock.calls.length).toBe(2);
expect(print.mock.calls[1][0]).toBe(100);
act(() => {
result.current.update(200);
});
expect(result.current.isSame).toBe(true);
expect(print.mock.calls.length).toBe(3);
expect(print.mock.calls[2][0]).toBe(200);
});

View File

@@ -0,0 +1,32 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { expect, it, vi } from 'vitest';
import { act, renderHook } from '@testing-library/react-hooks';
import { useImperativeLayoutEffect } from '../src/hooks/use-imperative-layout-effect';
it('run after layout effect', () => {
const fn = vi.fn();
const { result } = renderHook(() => useImperativeLayoutEffect(fn));
expect(fn.mock.calls.length).toBe(0);
act(() => {
result.current(22);
expect(fn.mock.calls.length).toBe(0);
});
expect(fn.mock.calls.length).toBe(1);
expect(fn.mock.calls[0][0]).toBe(22);
});

View File

@@ -0,0 +1,218 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { expect, it, vi } from 'vitest';
import { renderHook, act } from '@testing-library/react-hooks';
import { useSearch } from '../src/hooks/use-search';
const sleep = (t: number) => new Promise(resolve => setTimeout(resolve, t));
const getSearch = (delay: number) =>
vi.fn(async (str: string): Promise<string> => {
await sleep(delay);
return str;
});
const config = {
searchWait: 40,
debounce: { debounceInterval: 20 },
};
describe('search', () => {
beforeEach(() => {
vi.useFakeTimers();
});
it('run once input', async () => {
const search = getSearch(config.searchWait);
const { result } = renderHook(() => useSearch(search, config.debounce));
expect(result.current.searchStage).toBe('empty');
act(() => {
result.current.setPayload('1');
});
// 10ms
await vi.advanceTimersByTimeAsync(10);
expect(result.current.searchStage).toBe('debouncing');
// 40ms
await vi.advanceTimersByTimeAsync(30);
expect(result.current.searchStage).toBe('searching');
// 65ms
await vi.advanceTimersByTimeAsync(25);
expect(result.current.searchStage).toBe('success');
});
it('support adjust debounce time', async () => {
const search = getSearch(config.searchWait);
const adjustDebounce = (payload: string | null): number => {
if (payload === '') {
return 0;
}
return config.debounce.debounceInterval;
};
const { result } = renderHook(() =>
useSearch(search, { ...config.debounce, adjustDebounce }),
);
expect(result.current.searchStage).toBe('empty');
act(() => {
result.current.setPayload('');
});
await vi.advanceTimersByTimeAsync(1);
expect(result.current.searchStage).toBe('searching');
});
it('debounce well', async () => {
const search = getSearch(config.searchWait);
const { result } = renderHook(() => useSearch(search, config.debounce));
act(() => {
result.current.setPayload('1');
});
expect(result.current.searchStage).toBe('debouncing');
await vi.advanceTimersByTimeAsync(10);
act(() => {
result.current.setPayload('2');
});
expect(result.current.searchStage).toBe('debouncing');
// 25ms
await vi.advanceTimersByTimeAsync(25);
expect(result.current.searchStage).toBe('searching');
expect(search.mock.calls.length).toBe(1);
// 65ms
await vi.advanceTimersByTimeAsync(65);
expect(result.current.searchStage).toBe('success');
expect(search.mock.calls.length).toBe(1);
});
it('use latest result', async () => {
const search = getSearch(config.searchWait);
const { result } = renderHook(() => useSearch(search, config.debounce));
act(() => {
result.current.setPayload('1');
});
await vi.advanceTimersByTimeAsync(25);
expect(result.current.searchStage).toBe('searching');
expect(search.mock.calls.length).toBe(1);
act(() => {
result.current.setPayload('2');
});
expect(result.current.searchStage).toBe('debouncing');
// 25ms
await vi.advanceTimersByTimeAsync(25);
expect(result.current.searchStage).toBe('searching');
// 45ms
await vi.advanceTimersByTimeAsync(20);
expect(result.current.searchStage).toBe('searching');
// 65ms
await vi.advanceTimersByTimeAsync(20);
expect(result.current.searchStage).toBe('success');
expect(search.mock.calls.length).toBe(2);
expect(result.current.res).toBe('2');
});
it('distinguishes payload between null and other falsy value', () => {
const search = getSearch(config.searchWait);
const { result } = renderHook(() => useSearch(search, config.debounce));
act(() => {
result.current.setPayload('');
});
expect(result.current.searchStage).toBe('debouncing');
act(() => {
result.current.setPayload(null);
});
expect(result.current.searchStage).toBe('empty');
});
it('goes empty immediately', async () => {
const search = getSearch(config.searchWait);
const { result } = renderHook(() => useSearch(search, config.debounce));
act(() => {
result.current.setPayload('1');
});
await vi.advanceTimersByTimeAsync(10);
expect(result.current.searchStage).toBe('debouncing');
// 30ms
await vi.advanceTimersByTimeAsync(20);
expect(result.current.searchStage).toBe('searching');
act(() => {
result.current.setPayload(null);
});
expect(result.current.searchStage).toBe('empty');
// 70ms
await vi.advanceTimersByTimeAsync(40);
expect(result.current.searchStage).toBe('empty');
expect(result.current.res).toBe(null);
});
const failSearch = async (str: string) => {
await sleep(config.searchWait);
throw new Error(str);
};
it('get error', async () => {
const { result } = renderHook(() => useSearch(failSearch, config.debounce));
act(() => {
result.current.setPayload('1');
});
expect(result.current.searchStage).toBe('debouncing');
await vi.advanceTimersByTimeAsync(100);
expect(result.current.searchStage).toBe('failed');
expect(result.current.res).toBe(null);
});
it('get error but cleared', async () => {
const { result } = renderHook(() => useSearch(failSearch, config.debounce));
act(() => {
result.current.setPayload('1');
});
await vi.advanceTimersByTimeAsync(25);
expect(result.current.searchStage).toBe('searching');
act(() => {
result.current.setPayload(null);
});
expect(result.current.searchStage).toBe('empty');
// 75ms
await vi.advanceTimersByTimeAsync(50);
expect(result.current.searchStage).toBe('empty');
});
it('get error but covered', async () => {
let err = 0;
const failOnceSearch = vi.fn(async (str: string) => {
await sleep(config.searchWait);
if (!err++) {
throw new Error(str);
}
return str;
});
const { result } = renderHook(() =>
useSearch(failOnceSearch, config.debounce),
);
act(() => {
result.current.setPayload('1');
});
await vi.advanceTimersByTimeAsync(25);
act(() => {
result.current.setPayload('2');
});
// 1: 65ms; 2: 40ms
await vi.advanceTimersByTimeAsync(40);
expect(failOnceSearch.mock.results[0].value).rejects.toThrowError('1');
expect(result.current.searchStage).toBe('searching');
// 2: 70ms
await vi.advanceTimersByTimeAsync(30);
expect(result.current.searchStage).toBe('success');
expect(result.current.res).toBe('2');
});
});

View File

@@ -0,0 +1,12 @@
{
"operationSettings": [
{
"operationName": "test:cov",
"outputFolderNames": ["coverage"]
},
{
"operationName": "ts-check",
"outputFolderNames": ["./dist"]
}
]
}

View File

@@ -0,0 +1,7 @@
const { defineConfig } = require('@coze-arch/eslint-config');
module.exports = defineConfig({
packageRoot: __dirname,
preset: 'web',
rules: {},
});

View File

@@ -0,0 +1,41 @@
{
"name": "@coze-common/chat-hooks",
"version": "0.0.1",
"description": "Simple pure helpful hooks.",
"license": "Apache-2.0",
"author": "wanglitong@bytedance.com",
"maintainers": [],
"main": "src/index.ts",
"scripts": {
"build": "exit 0",
"lint": "eslint ./ --cache",
"lint:type": "tsc -p tsconfig.json --noEmit",
"test": "vitest --run --passWithNoTests",
"test:cov": "npm run test -- --coverage"
},
"devDependencies": {
"@coze-arch/bot-typings": "workspace:*",
"@coze-arch/eslint-config": "workspace:*",
"@coze-arch/stylelint-config": "workspace:*",
"@coze-arch/ts-config": "workspace:*",
"@coze-arch/vitest-config": "workspace:*",
"@testing-library/jest-dom": "^6.1.5",
"@testing-library/react": "^14.1.2",
"@testing-library/react-hooks": "^8.0.1",
"@types/lodash-es": "^4.17.10",
"@types/react": "18.2.37",
"@types/react-dom": "18.2.15",
"@vitest/coverage-v8": "~3.0.5",
"lodash-es": "^4.17.21",
"react": "~18.2.0",
"react-dom": "~18.2.0",
"stylelint": "^15.11.0",
"vitest": "~3.0.5"
},
"peerDependencies": {
"lodash-es": "^4.17.21",
"react": ">=18.2.0",
"react-dom": ">=18.2.0"
}
}

View File

@@ -0,0 +1,31 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { useRef } from 'react';
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- .
type Fn<ARGS extends any[], R> = (...args: ARGS) => R;
// https://github.com/Volune/use-event-callback/blob/master/src/index.ts
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- .
export const useEventCallback = <A extends any[], R>(
fn: Fn<A, R>,
): Fn<A, R> => {
const ref = useRef(fn);
ref.current = fn;
const exposedRef = useRef((...args: A) => ref.current(...args));
return exposedRef.current;
};

View File

@@ -0,0 +1,42 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { useState, useRef, useLayoutEffect } from 'react';
// eslint-disable-next-line @typescript-eslint/no-invalid-void-type -- x
type Destructor = (() => void) | void;
type Fn<ARGS extends unknown[]> = (...args: ARGS) => Destructor;
export const useImperativeLayoutEffect = <Params extends unknown[]>(
effect: Fn<Params>,
) => {
const [effectValue, setEffectValue] = useState(0);
const paramRef = useRef<Params>();
const effectRef = useRef<Fn<Params>>(() => undefined);
effectRef.current = effect;
useLayoutEffect(() => {
if (!effectValue) {
return;
}
// 经过一次运行后一定不为 undefined
return paramRef.current && effectRef.current(...paramRef.current);
}, [effectValue]);
return (...args: Params) => {
paramRef.current = args;
setEffectValue(pre => pre + 1);
};
};

View File

@@ -0,0 +1,97 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { useEffect, useRef, useState } from 'react';
import { useEventCallback } from './use-event-callback';
type SearchStage = 'empty' | 'debouncing' | 'searching' | 'failed' | 'success';
export interface UseSearchConfig<Payload, Res> {
debounceInterval: number;
adjustDebounce?: (payload: Payload | null) => number;
onError?: (e: unknown) => void;
onSuccess?: (searchRes: Res, payload: Payload) => void;
}
// todo 补充关于 res 重置的测试 case
/** 小心 service 引用变化! 一旦变化会触发重新加载 */
export const useSearch = <Payload, Res>(
service: (payload: Payload) => Promise<Res>,
{
onError,
debounceInterval,
adjustDebounce,
onSuccess,
}: UseSearchConfig<Payload, Res>,
) => {
const [payload, setPayload] = useState<Payload | null>(null);
const [searchStage, setSearchStage] = useState<SearchStage>('empty');
const [res, setRes] = useState<Res | null>(null);
const [triggerId, setTriggerId] = useState(0);
const debounceIdRef = useRef<ReturnType<typeof setTimeout>>();
const isEmpty = (localPayload: Payload | null): localPayload is null =>
localPayload === null;
const doSearch = useEventCallback(() => {
clearTimeout(debounceIdRef.current);
const finalDebounceTime = adjustDebounce?.(payload) ?? debounceInterval;
debounceIdRef.current = setTimeout(async () => {
setRes(null);
const searchCount = debounceIdRef.current;
if (isEmpty(payload)) {
setSearchStage('empty');
return;
}
setSearchStage('searching');
try {
const searchRes = await service(payload);
if (searchCount !== debounceIdRef.current) {
return;
}
setRes(searchRes);
setSearchStage('success');
onSuccess?.(searchRes, payload);
} catch (e) {
if (searchCount !== debounceIdRef.current) {
return;
}
console.error('[doSearch in use-search]', e);
onError?.(e);
setSearchStage('failed');
}
}, finalDebounceTime);
});
useEffect(() => {
setRes(null);
if (isEmpty(payload)) {
setSearchStage('empty');
} else {
setSearchStage('debouncing');
}
doSearch();
}, [payload, service, triggerId]);
return {
/** 注意清空时设置为 null */
setPayload,
searchStage,
res,
/** 主要用于重试 */
run: () => setTriggerId(c => c + 1),
};
};

View File

@@ -0,0 +1,19 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
export { useImperativeLayoutEffect } from './hooks/use-imperative-layout-effect';
export { useSearch } from './hooks/use-search';
export { useEventCallback } from './hooks/use-event-callback';

View File

@@ -0,0 +1,17 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/// <reference types='@coze-arch/bot-typings' />

View File

@@ -0,0 +1,30 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"extends": "@coze-arch/ts-config/tsconfig.web.json",
"compilerOptions": {
"types": [],
"strictNullChecks": true,
"noImplicitAny": true,
"rootDir": "./src",
"outDir": "./dist",
"tsBuildInfoFile": "dist/tsconfig.build.tsbuildinfo"
},
"include": ["src"],
"references": [
{
"path": "../../../arch/bot-typings/tsconfig.build.json"
},
{
"path": "../../../../config/eslint-config/tsconfig.build.json"
},
{
"path": "../../../../config/stylelint-config/tsconfig.build.json"
},
{
"path": "../../../../config/ts-config/tsconfig.build.json"
},
{
"path": "../../../../config/vitest-config/tsconfig.build.json"
}
]
}

View File

@@ -0,0 +1,15 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"compilerOptions": {
"composite": true
},
"references": [
{
"path": "./tsconfig.build.json"
},
{
"path": "./tsconfig.misc.json"
}
],
"exclude": ["**/*"]
}

View File

@@ -0,0 +1,18 @@
{
"extends": "@coze-arch/ts-config/tsconfig.web.json",
"$schema": "https://json.schemastore.org/tsconfig",
"include": ["__tests__", "vitest.config.ts"],
"exclude": ["./dist"],
"references": [
{
"path": "./tsconfig.build.json"
}
],
"compilerOptions": {
"rootDir": "./",
"outDir": "./dist",
"types": ["vitest/globals"],
"strictNullChecks": true,
"noImplicitAny": true
}
}

View File

@@ -0,0 +1,22 @@
/*
* Copyright 2025 coze-dev Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { defineConfig } from '@coze-arch/vitest-config';
export default defineConfig({
dirname: __dirname,
preset: 'web',
});