mirror of
https://git.bsd.gay/fef/nyastodon.git
synced 2024-12-27 06:03:42 +01:00
[Glitch] Rewrite <LoadGap />
as FC and TS
Port 7336f3648b
to glitch-soc
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
parent
0e7466717f
commit
017fbc7a74
4 changed files with 38 additions and 39 deletions
|
@ -1,37 +0,0 @@
|
|||
import PropTypes from 'prop-types';
|
||||
import { PureComponent } from 'react';
|
||||
|
||||
import { injectIntl, defineMessages } from 'react-intl';
|
||||
|
||||
import { Icon } from 'flavours/glitch/components/icon';
|
||||
|
||||
const messages = defineMessages({
|
||||
load_more: { id: 'status.load_more', defaultMessage: 'Load more' },
|
||||
});
|
||||
|
||||
class LoadGap extends PureComponent {
|
||||
|
||||
static propTypes = {
|
||||
disabled: PropTypes.bool,
|
||||
maxId: PropTypes.string,
|
||||
onClick: PropTypes.func.isRequired,
|
||||
intl: PropTypes.object.isRequired,
|
||||
};
|
||||
|
||||
handleClick = () => {
|
||||
this.props.onClick(this.props.maxId);
|
||||
};
|
||||
|
||||
render () {
|
||||
const { disabled, intl } = this.props;
|
||||
|
||||
return (
|
||||
<button className='load-more load-gap' disabled={disabled} onClick={this.handleClick} aria-label={intl.formatMessage(messages.load_more)}>
|
||||
<Icon id='ellipsis-h' />
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default injectIntl(LoadGap);
|
36
app/javascript/flavours/glitch/components/load_gap.tsx
Normal file
36
app/javascript/flavours/glitch/components/load_gap.tsx
Normal file
|
@ -0,0 +1,36 @@
|
|||
import { useCallback } from 'react';
|
||||
|
||||
import type { InjectedIntl } from 'react-intl';
|
||||
import { injectIntl, defineMessages } from 'react-intl';
|
||||
|
||||
import { Icon } from 'flavours/glitch/components/icon';
|
||||
|
||||
const messages = defineMessages({
|
||||
load_more: { id: 'status.load_more', defaultMessage: 'Load more' },
|
||||
});
|
||||
|
||||
interface Props {
|
||||
disabled: boolean;
|
||||
maxId: string;
|
||||
onClick: (maxId: string) => void;
|
||||
intl: InjectedIntl;
|
||||
}
|
||||
|
||||
export const LoadGap = injectIntl<Props>(
|
||||
({ disabled, maxId, onClick, intl }) => {
|
||||
const handleClick = useCallback(() => {
|
||||
onClick(maxId);
|
||||
}, [maxId, onClick]);
|
||||
|
||||
return (
|
||||
<button
|
||||
className='load-more load-gap'
|
||||
disabled={disabled}
|
||||
onClick={handleClick}
|
||||
aria-label={intl.formatMessage(messages.load_more)}
|
||||
>
|
||||
<Icon id='ellipsis-h' />
|
||||
</button>
|
||||
);
|
||||
}
|
||||
);
|
|
@ -8,7 +8,7 @@ import { debounce } from 'lodash';
|
|||
import RegenerationIndicator from 'flavours/glitch/components/regeneration_indicator';
|
||||
import StatusContainer from 'flavours/glitch/containers/status_container';
|
||||
|
||||
import LoadGap from './load_gap';
|
||||
import { LoadGap } from './load_gap';
|
||||
import ScrollableList from './scrollable_list';
|
||||
|
||||
export default class StatusList extends ImmutablePureComponent {
|
||||
|
|
|
@ -28,7 +28,7 @@ import { compareId } from 'flavours/glitch/compare_id';
|
|||
import Column from 'flavours/glitch/components/column';
|
||||
import ColumnHeader from 'flavours/glitch/components/column_header';
|
||||
import { Icon } from 'flavours/glitch/components/icon';
|
||||
import LoadGap from 'flavours/glitch/components/load_gap';
|
||||
import { LoadGap } from 'flavours/glitch/components/load_gap';
|
||||
import { NotSignedInIndicator } from 'flavours/glitch/components/not_signed_in_indicator';
|
||||
import ScrollableList from 'flavours/glitch/components/scrollable_list';
|
||||
import NotificationPurgeButtonsContainer from 'flavours/glitch/containers/notification_purge_buttons_container';
|
||||
|
|
Loading…
Reference in a new issue