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

Created a specific scroll wrapper context per scroll wrapper and made ScrollTop and ScrollLeft componentStates (#6645)

Browse Source 
@lucasbordeau @charlesBochet 

Issue #4826 

Could u review this changes.

Let me know what do you think.

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
nitin
2024-08-22 21:51:14 +05:30
committed by GitHub
parent 0a7700351f
commit 1030ff43d8
26 changed files with 205 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuItemsContainer.tsx
View File

@ -45,7 +45,7 @@ export const DropdownMenuItemsContainer = ({
return (
<StyledDropdownMenuItemsExternalContainer hasMaxHeight={hasMaxHeight}>
{hasMaxHeight ? (
<StyledScrollWrapper>
<StyledScrollWrapper contextProviderName="dropdownMenuItemsContainer">
<StyledDropdownMenuItemsInternalContainer>
{children}
</StyledDropdownMenuItemsInternalContainer>

2
packages/twenty-front/src/modules/ui/layout/page/ShowPageContainer.tsx
View File

@ -32,7 +32,7 @@ export const ShowPageContainer = ({ children }: ShowPageContainerProps) => {
const isMobile = useIsMobile();
return isMobile ? (
<StyledOuterContainer>
<StyledScrollWrapper>
<StyledScrollWrapper contextProviderName="showPageContainer">
<StyledInnerContainer>{children}</StyledInnerContainer>
</StyledScrollWrapper>
</StyledOuterContainer>

4
packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageLeftContainer.tsx
View File

@ -1,5 +1,5 @@
import { ReactNode } from 'react';
import styled from '@emotion/styled';
import { ReactNode } from 'react';
import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
import { ScrollWrapper } from '@/ui/utilities/scroll/components/ScrollWrapper';
@ -46,7 +46,7 @@ export const ShowPageLeftContainer = ({
{children}
</StyledInnerContainer>
) : (
<ScrollWrapper>
<ScrollWrapper contextProviderName="showPageLeftContainer">
<StyledIntermediateContainer>
<StyledInnerContainer isMobile={isMobile}>
{children}

4
packages/twenty-front/src/modules/ui/layout/tab/components/TabList.tsx
View File

@ -1,5 +1,5 @@
import * as React from 'react';
import styled from '@emotion/styled';
import * as React from 'react';
import { useRecoilValue } from 'recoil';
import { IconComponent } from 'twenty-ui';
@ -53,7 +53,7 @@ export const TabList = ({
return (
<TabListScope tabListScopeId={tabListId}>
<ScrollWrapper hideY>
<ScrollWrapper hideY contextProviderName="tabList">
<StyledContainer className={className}>
{tabs
.filter((tab) => !tab.hide)