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

Fix field metadata creation page (#11285)

Browse Source 
in this pr 
1. fixing error helper was no longer showing. unfortunately had to
resort to `formConfig.trigger`...
2. closes https://github.com/twentyhq/twenty/issues/11262
3. closes https://github.com/twentyhq/twenty/issues/11263


https://github.com/user-attachments/assets/11f763bb-3098-4b0e-bc96-8a0de3cb3c19
This commit is contained in:
Marie
2025-04-01 14:09:24 +02:00
committed by GitHub
parent 9cbc2e3df0
commit 366106bb2b
5 changed files with 99 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
packages/twenty-front/src/modules/settings/components/AdvancedSettingsContentWrapperWithDot.tsx Normal file
View File

@ -0,0 +1,59 @@
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { IconPoint } from 'twenty-ui';
const StyledWrapper = styled.div`
position: relative;
width: 100%;
`;
type DotPosition = 'top' | 'centered';
type AdvancedSettingsContentWrapperWithDotProps = {
children: React.ReactNode;
hideDot?: boolean;
dotPosition?: DotPosition;
};
const StyledDotContainer = styled.div<{ dotPosition: DotPosition }>`
display: flex;
position: absolute;
height: 100%;
left: ${({ theme }) => theme.spacing(-5)};
${({ dotPosition }) => {
if (dotPosition === 'top') {
return `
top: 0;
`;
}
return `
align-items: center;
`;
}}
`;
const StyledIconPoint = styled(IconPoint)`
margin-right: 0;
`;
export const AdvancedSettingsContentWrapperWithDot = ({
children,
hideDot = false,
dotPosition = 'centered',
}: AdvancedSettingsContentWrapperWithDotProps) => {
const theme = useTheme();
return (
<StyledWrapper>
{!hideDot && (
<StyledDotContainer dotPosition={dotPosition}>
<StyledIconPoint
size={12}
color={theme.color.yellow}
fill={theme.color.yellow}
/>
</StyledDotContainer>
)}
{children}
</StyledWrapper>
);
};

49
packages/twenty-front/src/modules/settings/components/AdvancedSettingsWrapper.tsx
View File

@ -1,41 +1,14 @@
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, IconPoint, MAIN_COLORS } from 'twenty-ui';
type DotPosition = 'top' | 'centered';
const StyledAdvancedWrapper = styled.div`
position: relative;
width: 100%;
`;
const StyledDotContainer = styled.div<{ dotPosition: DotPosition }>`
display: flex;
position: absolute;
height: 100%;
left: ${({ theme }) => theme.spacing(-5)};
${({ dotPosition }) => {
if (dotPosition === 'top') {
return `
top: 0;
`;
}
return `
align-items: center;
`;
}}
`;
import { AnimatedExpandableContainer } from 'twenty-ui';
const StyledContent = styled.div`
width: 100%;
`;
const StyledIconPoint = styled(IconPoint)`
margin-right: 0;
`;
type DotPosition = 'top' | 'centered';
type AdvancedSettingsWrapperProps = {
children: React.ReactNode;
@ -60,18 +33,12 @@ export const AdvancedSettingsWrapper = ({
mode="scroll-height"
containAnimation={false}
>
<StyledAdvancedWrapper>
{!hideDot && (
<StyledDotContainer dotPosition={dotPosition}>
<StyledIconPoint
size={12}
color={MAIN_COLORS.yellow}
fill={MAIN_COLORS.yellow}
/>
</StyledDotContainer>
)}
<AdvancedSettingsContentWrapperWithDot
hideDot={hideDot}
dotPosition={dotPosition}
>
<StyledContent>{children}</StyledContent>
</StyledAdvancedWrapper>
</AdvancedSettingsContentWrapperWithDot>
</AnimatedExpandableContainer>
);
};