fix long activity panel in deleted record details (#12854)
closes #11978 --------- Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
@ -23,7 +23,6 @@ const StyledMainContainer = styled.div`
|
||||
useIsMobile() ? `1px solid ${theme.border.color.medium}` : 'none'};
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
|
||||
justify-content: center;
|
||||
|
||||
@ -4,20 +4,31 @@ import { viewableRecordIdComponentState } from '@/command-menu/pages/record-page
|
||||
import { viewableRecordNameSingularComponentState } from '@/command-menu/pages/record-page/states/viewableRecordNameSingularComponentState';
|
||||
import { CommandMenuPageComponentInstanceContext } from '@/command-menu/states/contexts/CommandMenuPageComponentInstanceContext';
|
||||
import { ContextStoreComponentInstanceContext } from '@/context-store/states/contexts/ContextStoreComponentInstanceContext';
|
||||
import { INFORMATION_BANNER_HEIGHT } from '@/information-banner/constants/InformationBannerHeight';
|
||||
import { RecordFilterGroupsComponentInstanceContext } from '@/object-record/record-filter-group/states/context/RecordFilterGroupsComponentInstanceContext';
|
||||
import { RecordFiltersComponentInstanceContext } from '@/object-record/record-filter/states/context/RecordFiltersComponentInstanceContext';
|
||||
import { RecordShowContainer } from '@/object-record/record-show/components/RecordShowContainer';
|
||||
import { RecordShowEffect } from '@/object-record/record-show/components/RecordShowEffect';
|
||||
import { useRecordShowPage } from '@/object-record/record-show/hooks/useRecordShowPage';
|
||||
import { RecordSortsComponentInstanceContext } from '@/object-record/record-sort/states/context/RecordSortsComponentInstanceContext';
|
||||
import { recordStoreFamilySelector } from '@/object-record/record-store/states/selectors/recordStoreFamilySelector';
|
||||
import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
|
||||
import { useComponentInstanceStateContext } from '@/ui/utilities/state/component-state/hooks/useComponentInstanceStateContext';
|
||||
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
|
||||
import styled from '@emotion/styled';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
|
||||
const StyledRightDrawerRecord = styled.div<{ isMobile: boolean }>`
|
||||
height: ${({ theme, isMobile }) =>
|
||||
isMobile ? `calc(100% - ${theme.spacing(16)})` : '100%'};
|
||||
const StyledRightDrawerRecord = styled.div<{
|
||||
isMobile: boolean;
|
||||
hasDeletedRecordBanner: boolean;
|
||||
}>`
|
||||
height: ${({ theme, isMobile, hasDeletedRecordBanner }) => {
|
||||
const mobileOffset = isMobile ? theme.spacing(16) : '0px';
|
||||
const bannerOffset = hasDeletedRecordBanner
|
||||
? INFORMATION_BANNER_HEIGHT
|
||||
: '0px';
|
||||
return `calc(100% - ${mobileOffset} - ${bannerOffset})`;
|
||||
}};
|
||||
`;
|
||||
|
||||
export const CommandMenuRecordPage = () => {
|
||||
@ -44,6 +55,13 @@ export const CommandMenuRecordPage = () => {
|
||||
viewableRecordId,
|
||||
);
|
||||
|
||||
const recordDeletedAt = useRecoilValue(
|
||||
recordStoreFamilySelector({
|
||||
recordId: objectRecordId,
|
||||
fieldName: 'deletedAt',
|
||||
}),
|
||||
);
|
||||
|
||||
const commandMenuPageInstanceId = useComponentInstanceStateContext(
|
||||
CommandMenuPageComponentInstanceContext,
|
||||
)?.instanceId;
|
||||
@ -70,7 +88,10 @@ export const CommandMenuRecordPage = () => {
|
||||
<ActionMenuComponentInstanceContext.Provider
|
||||
value={{ instanceId: commandMenuPageInstanceId }}
|
||||
>
|
||||
<StyledRightDrawerRecord isMobile={isMobile}>
|
||||
<StyledRightDrawerRecord
|
||||
isMobile={isMobile}
|
||||
hasDeletedRecordBanner={!!recordDeletedAt}
|
||||
>
|
||||
<TimelineActivityContext.Provider
|
||||
value={{
|
||||
recordId: objectRecordId,
|
||||
|
||||
Reference in New Issue
Block a user