Fix storybook / chromatic tests flakyness and integration tests (#11687)

## Storybook flakyness

### Actor Display image flakyness

<img width="1512" alt="image"
src="https://github.com/user-attachments/assets/875c0738-5e31-4aba-9231-4ba5f78d1355"
/>

**Fix:** stop using a random usage

### Task Groups broken

<img width="1512" alt="image"
src="https://github.com/user-attachments/assets/c67e47a1-a027-43f1-9601-68d61a8052b4"
/>

**Fix:** add missing TabListComponentInstance

## Flaky dates

Add https://github.com/k35o/storybook-addon-mock-date

## Integration tests

Fix broken tests due to relation refactoring
This commit is contained in:
Charles Bochet
2025-04-23 01:57:36 +02:00
committed by GitHub
parent 8694840b92
commit fa5f758228
20 changed files with 153 additions and 155 deletions

View File

@ -1,38 +1,39 @@
import { ActionConfig } from '@/action-menu/actions/types/ActionConfig';
import { getActionLabel } from '@/action-menu/utils/getActionLabel';
import { isNonEmptyString } from '@sniptt/guards';
import { useDebounce } from 'use-debounce';
import { useCallback } from 'react';
const checkInShortcuts = (action: ActionConfig, search: string) => {
const concatenatedString = action.hotKeys?.join('') ?? '';
return concatenatedString.toLowerCase().includes(search.toLowerCase().trim());
};
const checkInLabels = (action: ActionConfig, search: string) => {
const actionLabel = getActionLabel(action.label);
if (isNonEmptyString(actionLabel)) {
return actionLabel.toLowerCase().includes(search.toLowerCase());
}
return false;
};
type UseFilterActionsWithCommandMenuSearchProps = {
commandMenuSearch: string;
};
export const useFilterActionsWithCommandMenuSearch = ({
commandMenuSearch,
}: {
commandMenuSearch: string;
}) => {
const [deferredCommandMenuSearch] = useDebounce(commandMenuSearch, 300); // 200ms - 500ms
const checkInShortcuts = (action: ActionConfig, search: string) => {
const concatenatedString = action.hotKeys?.join('') ?? '';
return concatenatedString
.toLowerCase()
.includes(search.toLowerCase().trim());
};
const checkInLabels = (action: ActionConfig, search: string) => {
const actionLabel = getActionLabel(action.label);
if (isNonEmptyString(actionLabel)) {
return actionLabel.toLowerCase().includes(search.toLowerCase());
}
return false;
};
const filterActionsWithCommandMenuSearch = (actions: ActionConfig[]) => {
return actions.filter((action) =>
deferredCommandMenuSearch.length > 0
? checkInShortcuts(action, deferredCommandMenuSearch) ||
checkInLabels(action, deferredCommandMenuSearch)
: true,
);
};
}: UseFilterActionsWithCommandMenuSearchProps) => {
const filterActionsWithCommandMenuSearch = useCallback(
(actions: ActionConfig[]) => {
return actions.filter((action) =>
commandMenuSearch.length > 0
? checkInShortcuts(action, commandMenuSearch) ||
checkInLabels(action, commandMenuSearch)
: true,
);
},
[commandMenuSearch],
);
return {
filterActionsWithCommandMenuSearch,