admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: fix cell border radius on soft focus (#649)

Browse Source 
* refactor: add RootDecorator

* docs: add EditableCellText stories

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Thaïs
2023-07-14 00:03:23 +02:00
committed by GitHub
parent d70234f918
commit ca1723f2e6
6 changed files with 120 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
front/src/testing/decorators.tsx Normal file
View File

@ -0,0 +1,32 @@
import { ApolloProvider } from '@apollo/client';
import { Decorator } from '@storybook/react';
import { RecoilRoot } from 'recoil';
import { RecoilScope } from '../modules/recoil-scope/components/RecoilScope';
import { CellContext } from '../modules/ui/tables/states/CellContext';
import { RowContext } from '../modules/ui/tables/states/RowContext';
import { ComponentStorybookLayout } from './ComponentStorybookLayout';
import { mockedClient } from './mockedClient';
export const RootDecorator: Decorator = (Story) => (
<RecoilRoot>
<ApolloProvider client={mockedClient}>
<Story />
</ApolloProvider>
</RecoilRoot>
);
export const ComponentDecorator: Decorator = (Story) => (
<ComponentStorybookLayout>
<Story />
</ComponentStorybookLayout>
);
export const CellPositionDecorator: Decorator = (Story) => (
<RecoilScope SpecificContext={RowContext}>
<RecoilScope SpecificContext={CellContext}>
<Story />
</RecoilScope>
</RecoilScope>
);

58
front/src/testing/renderWrappers.tsx
View File

@ -1,8 +1,6 @@
import React from 'react';
import { HotkeysProvider } from 'react-hotkeys-hook';
import { MemoryRouter } from 'react-router-dom';
import { ApolloProvider } from '@apollo/client';
import { RecoilRoot } from 'recoil';
import { INITIAL_HOTKEYS_SCOPES } from '@/hotkeys/constants';
import { RecoilScope } from '@/recoil-scope/components/RecoilScope';
@ -15,7 +13,6 @@ import { UserProvider } from '~/providers/user/UserProvider';
import { ComponentStorybookLayout } from './ComponentStorybookLayout';
import { FullHeightStorybookLayout } from './FullHeightStorybookLayout';
import { mockedClient } from './mockedClient';
export function getRenderWrapperForPage(
children: React.ReactElement,
@ -23,34 +20,24 @@ export function getRenderWrapperForPage(
) {
return function render() {
return (
<RecoilRoot>
<ApolloProvider client={mockedClient}>
<UserProvider>
<ClientConfigProvider>
<HotkeysProvider initiallyActiveScopes={INITIAL_HOTKEYS_SCOPES}>
<MemoryRouter initialEntries={[currentPath]}>
<FullHeightStorybookLayout>
<DefaultLayout>{children}</DefaultLayout>
</FullHeightStorybookLayout>
</MemoryRouter>
</HotkeysProvider>
</ClientConfigProvider>
</UserProvider>
</ApolloProvider>
</RecoilRoot>
<UserProvider>
<ClientConfigProvider>
<HotkeysProvider initiallyActiveScopes={INITIAL_HOTKEYS_SCOPES}>
<MemoryRouter initialEntries={[currentPath]}>
<FullHeightStorybookLayout>
<DefaultLayout>{children}</DefaultLayout>
</FullHeightStorybookLayout>
</MemoryRouter>
</HotkeysProvider>
</ClientConfigProvider>
</UserProvider>
);
};
}
export function getRenderWrapperForComponent(children: React.ReactElement) {
return function render() {
return (
<RecoilRoot>
<ApolloProvider client={mockedClient}>
<ComponentStorybookLayout>{children}</ComponentStorybookLayout>
</ApolloProvider>
</RecoilRoot>
);
return <ComponentStorybookLayout>{children}</ComponentStorybookLayout>;
};
}
@ -59,17 +46,16 @@ export function getRenderWrapperForEntityTableComponent(
) {
return function Render() {
return (
<RecoilRoot>
<ApolloProvider client={mockedClient}>
<RecoilScope SpecificContext={TableContext}>
<HooksEntityTable
availableFilters={companiesFilters}
numberOfColumns={5}
/>
<ComponentStorybookLayout>{children}</ComponentStorybookLayout>
</RecoilScope>
</ApolloProvider>
</RecoilRoot>
<RecoilScope SpecificContext={TableContext}>
{/*
TODO: add company mocked loader
<CompanyEntityTableData */}
<HooksEntityTable
availableFilters={companiesFilters}
numberOfColumns={5}
/>
<ComponentStorybookLayout>{children}</ComponentStorybookLayout>
</RecoilScope>
);
};
}