hiro/Vulcan
1
0
Fork 0
mirror of https://github.com/vale981/Vulcan synced 2025-03-06 01:51:40 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Include posts loading component inside PostsLoadMore to make it easier for both to occupy the same space

Browse source
This commit is contained in:
SachaG 2017-06-07 17:50:36 -07:00
parent 35a7904f92
commit bb83965789
2 changed files with 17 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/vulcan-base-components/lib/posts/PostsList.jsx
View file

@ -23,7 +23,12 @@ const PostsList = ({className, results, loading, count, totalCount, loadMore, sh
<div className="posts-list-content">
{results.map(post => <Components.PostsItem post={post} key={post._id} currentUser={currentUser} terms={terms} />)}
</div>
{showLoadMore ? hasMore ? (loadingMore ? <Components.PostsLoading/> : <Components.PostsLoadMore loadMore={loadMore} count={count} totalCount={totalCount} />) : <Components.PostsNoMore/> : null}
{showLoadMore ?
hasMore ?
<Components.PostsLoadMore loading={loadingMore} loadMore={loadMore} count={count} totalCount={totalCount} /> :
<Components.PostsNoMore/> :
null
}
</div>
)
} else if (loading) {

18
packages/vulcan-base-components/lib/posts/PostsLoadMore.jsx
View file

@ -1,14 +1,18 @@
import { registerComponent } from 'meteor/vulcan:core';
import { Components, registerComponent } from 'meteor/vulcan:core';
import React from 'react';
import { FormattedMessage } from 'meteor/vulcan:i18n';
import classNames from 'classnames';
const PostsLoadMore = ({loadMore, count, totalCount}) => {
const PostsLoadMore = ({loading, loadMore, count, totalCount}) => {
return (
<a className="posts-load-more" href="#" onClick={e => {e.preventDefault(); loadMore();}}>
<span><FormattedMessage id="posts.load_more"/></span>
&nbsp;
{totalCount ? <span className="load-more-count">{`(${count}/${totalCount})`}</span> : null}
</a>
<div className={classNames('posts-load-more', {'posts-load-more-loading': loading})}>
<a className="posts-load-more-link" href="#" onClick={e => {e.preventDefault(); loadMore();}}>
<span><FormattedMessage id="posts.load_more"/></span>
&nbsp;
{totalCount ? <span className="load-more-count">{`(${count}/${totalCount})`}</span> : null}
</a>
{loading ? <div className="posts-load-more-loader"><Components.Loading/></div> : null}
</div>
)
}