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

Feat/improve mobile display (#843)

Browse Source 
* Ok 1

* Finished

* Fix PR

* Fix PR

* Fix desktop

* Fix

* Fix absolute listen click outside

* console.log

* Fix according to code review

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Lucas Bordeau
2023-07-23 19:53:35 +02:00
committed by GitHub
parent 742791bd92
commit 21d5133564
45 changed files with 464 additions and 315 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
front/src/modules/activities/components/CommentThreadComments.tsx
View File

@ -4,6 +4,7 @@ import { useRecoilValue } from 'recoil';
import { v4 } from 'uuid';
import { currentUserState } from '@/auth/states/currentUserState';
import { useIsMobile } from '@/ui/hooks/useIsMobile';
import { AutosizeTextInput } from '@/ui/input/components/AutosizeTextInput';
import { CommentThread, useCreateCommentMutation } from '~/generated/graphql';
import { isNonEmptyString } from '~/utils/isNonEmptyString';
@ -38,7 +39,10 @@ const StyledCommentActionBar = styled.div`
border-top: 1px solid ${({ theme }) => theme.border.color.light};
display: flex;
padding: 16px 24px 16px 48px;
width: calc(${({ theme }) => theme.rightDrawerWidth} - 48px - 24px);
width: calc(
${({ theme }) => (useIsMobile() ? '100%' : theme.rightDrawerWidth)} - 48px -
24px
);
`;
const StyledThreadCommentTitle = styled.div`

4
front/src/modules/activities/components/CommentThreadRelationPicker.tsx
View File

@ -12,7 +12,7 @@ import { CompanyChip } from '@/companies/components/CompanyChip';
import { useFilteredSearchCompanyQuery } from '@/companies/queries';
import { PersonChip } from '@/people/components/PersonChip';
import { useFilteredSearchPeopleQuery } from '@/people/queries';
import { useListenClickOutsideArrayOfRef } from '@/ui/hooks/useListenClickOutsideArrayOfRef';
import { useListenClickOutside } from '@/ui/hooks/useListenClickOutside';
import { usePreviousHotkeyScope } from '@/ui/hotkey/hooks/usePreviousHotkeyScope';
import { useScopedHotkeys } from '@/ui/hotkey/hooks/useScopedHotkeys';
import { RecoilScope } from '@/ui/recoil-scope/components/RecoilScope';
@ -194,7 +194,7 @@ export function CommentThreadRelationPicker({ commentThread }: OwnProps) {
placement: 'bottom-start',
});
useListenClickOutsideArrayOfRef({
useListenClickOutside({
refs: [refs.floating, refs.domReference],
callback: () => {
exitEditMode();