IntenseWebs/mattermost
3
0
Fork 0
mirror of https://github.com/mattermost/mattermost.git synced 2025-02-25 18:55:24 -06:00
Code Issues Packages Projects Releases Wiki Activity

Convert ./components/post_view/scroll_to_bottom_arrows.tsx to functional component (#24801)

Browse Source 
* Convert ./components/post_view/scroll_to_bottom_arrows.tsx from Class Component to Function Component

* update scroll_to_bottom_arrows component

* enhancement: scroll_to_bottom_arrows component

* update scroll_to_bottom_arrows component

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
This commit is contained in:
Kritik Jiyaviya 2023-10-18 13:22:34 +05:30 committed by GitHub
parent d2d820cb31
commit 0bf7f1413c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 21 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
webapp/channels/src/components/post_view/scroll_to_bottom_arrows.tsx
View File

@ -1,35 +1,33 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import classNames from 'classnames';
import React from 'react';
import ScrollToBottomIcon from 'components/widgets/icons/scroll_to_bottom_icon';
interface Props {
type Props = {
isScrolling: boolean;
atBottom?: boolean;
onClick: () => void;
}
};
export default class ScrollToBottomArrows extends React.PureComponent<Props> {
render() {
// only show on mobile
if (window.innerWidth > 768) {
return null;
}
let className = 'post-list__arrows';
if (this.props.isScrolling && this.props.atBottom === false) {
className += ' scrolling';
}
return (
<div
className={className}
onClick={this.props.onClick}
>
<ScrollToBottomIcon/>
</div>
);
const ScrollToBottomArrows = ({isScrolling, atBottom, onClick}: Props) => {
// only show on mobile
if (window.innerWidth > 768) {
return null;
}
}
return (
<div
className={classNames('post-list__arrows', {
scrolling: isScrolling && atBottom === false,
})}
onClick={onClick}
>
<ScrollToBottomIcon/>
</div>
);
};
export default ScrollToBottomArrows;