Web: Files: TilesView: fix display sorting combobox

This commit is contained in:
Viktor Fomin 2022-04-29 15:58:32 +03:00
parent 3b36fe739a
commit 188822fe05

View File

@ -382,6 +382,40 @@ class TileContainer extends React.PureComponent {
const advancedOptions = this.getAdvancedOptions();
const renderSorting = () => {
return (
<>
{!isRecentFolder && !isFavoritesFolder && !isMobile && !isTablet() && (
<div onClick={this.toggleDropdown}>
<ComboBox
opened={this.state.isOpen}
className={"sort-combo-box"}
options={[]}
selectedOption={{}}
directionX={"right"}
directionY={"both"}
scaled={false}
size={"content"}
advancedOptions={advancedOptions}
disableIconClick={false}
// disableItemClick={true}
isDefaultMode={false}
noBorder={true}
manualY={"102%"}
>
<IconButton
className={"sort-icon"}
iconName="/static/images/sort.react.svg"
size={16}
/>
{t("Common:Sorting")}
</ComboBox>
</div>
)}
</>
);
};
return (
<StyledTileContainer
id={id}
@ -390,60 +424,32 @@ class TileContainer extends React.PureComponent {
useReactWindow={useReactWindow}
isDesc={this.state.selectedFilterData.sortDirection === "desc"}
>
{Folders.length > 0 && (
<>
<Heading
size="xsmall"
id={"folder-tile-heading"}
className="tile-items-heading"
>
{headingFolders}
{!isRecentFolder &&
!isFavoritesFolder &&
!isMobile &&
!isTablet() && (
<div onClick={this.toggleDropdown}>
<ComboBox
opened={this.state.isOpen}
className={"sort-combo-box"}
options={[]}
selectedOption={{}}
directionX={"right"}
directionY={"both"}
scaled={false}
size={"content"}
advancedOptions={advancedOptions}
disableIconClick={false}
// disableItemClick={true}
isDefaultMode={false}
noBorder={true}
manualY={"102%"}
>
<IconButton
className={"sort-icon"}
iconName="/static/images/sort.react.svg"
size={16}
/>
{t("Common:Sorting")}
</ComboBox>
</div>
)}
</Heading>
{useReactWindow ? (
<AutoSizer>{renderList}</AutoSizer>
) : (
<StyledGridWrapper isFolders>{Folders}</StyledGridWrapper>
)}
</>
)}
<>
<Heading
size="xsmall"
id={"folder-tile-heading"}
className="tile-items-heading"
>
{Folders.length > 0 && headingFolders}
{Folders.length > 0 && renderSorting()}
</Heading>
{Folders.length > 0 && (
<>
{useReactWindow ? (
<AutoSizer>{renderList}</AutoSizer>
) : (
<StyledGridWrapper isFolders>{Folders}</StyledGridWrapper>
)}
</>
)}
</>
{Files.length > 0 && (
<>
{Folders.length > 0 && (
<Heading size="xsmall" className="tile-items-heading">
{headingFiles}
</Heading>
)}
<Heading size="xsmall" className="tile-items-heading">
{headingFiles}
{Folders.length === 0 && renderSorting()}
</Heading>
{useReactWindow ? (
<AutoSizer>{renderList}</AutoSizer>
) : (