Paul Rastoin
4a4e65fe4a
# Introduction closes https://github.com/twentyhq/core-team-issues/issues/591 Same than for `twenty-shared` made in https://github.com/twentyhq/twenty/pull/11083. ## TODO - [x] Manual migrate twenty-website twenty-ui imports ## What's next: - Generate barrel and migration script factorization within own package + tests - Refactoring using preconstruct ? TimeBox - Lint circular dependencies - Lint import from barrel and forbid them ### Preconstruct We need custom rollup plugins addition, but preconstruct does not expose its rollup configuration. It might be possible to handle this using the babel overrides. But was a big tunnel. We could give it a try afterwards ! ( allowing cjs interop and stuff like that ) Stuck to vite lib app Closed related PRs: - https://github.com/twentyhq/twenty/pull/11294 - https://github.com/twentyhq/twenty/pull/11203
46 lines
1.5 KiB
TypeScript
46 lines
1.5 KiB
TypeScript
import { AdvancedSettingsContentWrapperWithDot } from '@/settings/components/AdvancedSettingsContentWrapperWithDot';
|
|
import { ADVANCED_SETTINGS_ANIMATION_DURATION } from '@/settings/constants/AdvancedSettingsAnimationDurations';
|
|
import { isAdvancedModeEnabledState } from '@/ui/navigation/navigation-drawer/states/isAdvancedModeEnabledState';
|
|
import styled from '@emotion/styled';
|
|
import { useRecoilValue } from 'recoil';
|
|
import { AnimatedExpandableContainer } from 'twenty-ui/layout';
|
|
|
|
const StyledContent = styled.div`
|
|
width: 100%;
|
|
`;
|
|
|
|
type DotPosition = 'top' | 'centered';
|
|
|
|
type AdvancedSettingsWrapperProps = {
|
|
children: React.ReactNode;
|
|
animationDimension?: 'width' | 'height';
|
|
hideDot?: boolean;
|
|
dotPosition?: DotPosition;
|
|
};
|
|
|
|
export const AdvancedSettingsWrapper = ({
|
|
children,
|
|
hideDot = false,
|
|
dotPosition = 'centered',
|
|
animationDimension = 'height',
|
|
}: AdvancedSettingsWrapperProps) => {
|
|
const isAdvancedModeEnabled = useRecoilValue(isAdvancedModeEnabledState);
|
|
|
|
return (
|
|
<AnimatedExpandableContainer
|
|
isExpanded={isAdvancedModeEnabled}
|
|
dimension={animationDimension}
|
|
animationDurations={ADVANCED_SETTINGS_ANIMATION_DURATION}
|
|
mode="scroll-height"
|
|
containAnimation={false}
|
|
>
|
|
<AdvancedSettingsContentWrapperWithDot
|
|
hideDot={hideDot}
|
|
dotPosition={dotPosition}
|
|
>
|
|
<StyledContent>{children}</StyledContent>
|
|
</AdvancedSettingsContentWrapperWithDot>
|
|
</AnimatedExpandableContainer>
|
|
);
|
|
};
|