mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-23 15:47:53 -05:00
Merge pull request #5697 from paulkaplan/load-full-rows
Load full rows for projects, curators, managers
This commit is contained in:
commit
f84b142c93
9 changed files with 38 additions and 40 deletions
|
@ -17,6 +17,8 @@ const Errors = keyMirror({
|
|||
MANAGER_LIMIT: null
|
||||
});
|
||||
|
||||
const PER_PAGE_LIMIT = 24;
|
||||
|
||||
const normalizeError = (err, body, res) => {
|
||||
if (err) return Errors.NETWORK;
|
||||
if (res.statusCode === 400 && body.message === 'too many owners') {
|
||||
|
@ -40,15 +42,14 @@ const loadManagers = () => ((dispatch, getState) => {
|
|||
const state = getState();
|
||||
const studioId = selectStudioId(state);
|
||||
const managerCount = managers.selector(state).items.length;
|
||||
const managersPerPage = 20;
|
||||
const opts = {
|
||||
uri: `/studios/${studioId}/managers/`,
|
||||
params: {limit: managersPerPage, offset: managerCount}
|
||||
params: {limit: PER_PAGE_LIMIT, offset: managerCount}
|
||||
};
|
||||
api(withAdmin(opts, state), (err, body, res) => {
|
||||
const error = normalizeError(err, body, res);
|
||||
if (error) return dispatch(managers.actions.error(error));
|
||||
dispatch(managers.actions.append(body, body.length === managersPerPage));
|
||||
dispatch(managers.actions.append(body, body.length === PER_PAGE_LIMIT));
|
||||
});
|
||||
});
|
||||
|
||||
|
@ -56,15 +57,14 @@ const loadCurators = () => ((dispatch, getState) => {
|
|||
const state = getState();
|
||||
const studioId = selectStudioId(state);
|
||||
const curatorCount = curators.selector(state).items.length;
|
||||
const curatorsPerPage = 20;
|
||||
const opts = {
|
||||
uri: `/studios/${studioId}/curators/`,
|
||||
params: {limit: curatorsPerPage, offset: curatorCount}
|
||||
params: {limit: PER_PAGE_LIMIT, offset: curatorCount}
|
||||
};
|
||||
api(withAdmin(opts, state), (err, body, res) => {
|
||||
const error = normalizeError(err, body, res);
|
||||
if (error) return dispatch(curators.actions.error(error));
|
||||
dispatch(curators.actions.append(body, body.length === curatorsPerPage));
|
||||
dispatch(curators.actions.append(body, body.length === PER_PAGE_LIMIT));
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -17,6 +17,8 @@ const Errors = keyMirror({
|
|||
USER_MUTED: null
|
||||
});
|
||||
|
||||
const PER_PAGE_LIMIT = 24;
|
||||
|
||||
const normalizeError = (err, body, res) => {
|
||||
if (err) return Errors.NETWORK;
|
||||
if (res.statusCode === 403 && body.mute_status) return Errors.USER_MUTED;
|
||||
|
@ -32,15 +34,14 @@ const loadProjects = () => ((dispatch, getState) => {
|
|||
const state = getState();
|
||||
const studioId = selectStudioId(state);
|
||||
const projectCount = projects.selector(state).items.length;
|
||||
const projectsPerPage = 20;
|
||||
const opts = {
|
||||
uri: `/studios/${studioId}/projects/`,
|
||||
params: {limit: projectsPerPage, offset: projectCount}
|
||||
params: {limit: PER_PAGE_LIMIT, offset: projectCount}
|
||||
};
|
||||
api(withAdmin(opts, state), (err, body, res) => {
|
||||
const error = normalizeError(err, body, res);
|
||||
if (error) return dispatch(projects.actions.error(error));
|
||||
dispatch(projects.actions.append(body, body.length === projectsPerPage));
|
||||
dispatch(projects.actions.append(body, body.length === PER_PAGE_LIMIT));
|
||||
});
|
||||
});
|
||||
|
||||
|
|
|
@ -92,19 +92,20 @@ const UserProjectsModal = ({
|
|||
onRemove={onRemove}
|
||||
/>
|
||||
))}
|
||||
{moreToLoad &&
|
||||
<div className="studio-grid-load-more">
|
||||
<button
|
||||
className={classNames('button', {
|
||||
'mod-mutating': loading
|
||||
})}
|
||||
onClick={() => onLoadMore(filter)}
|
||||
>
|
||||
<FormattedMessage id="general.loadMore" />
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
{moreToLoad &&
|
||||
<div className="studio-projects-load-more">
|
||||
<button
|
||||
className={classNames('button', {
|
||||
'mod-mutating': loading
|
||||
})}
|
||||
onClick={() => onLoadMore(filter)}
|
||||
>
|
||||
<FormattedMessage id="general.loadMore" />
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
</React.Fragment>
|
||||
}
|
||||
{!loading && items.length === 0 &&
|
||||
|
|
|
@ -44,10 +44,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.studio-projects-load-more {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.studio-projects-done-row {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
|
|
@ -196,8 +196,8 @@ const StudioActivity = ({items, loading, error, moreToLoad, onLoadMore}) => {
|
|||
getComponentForItem(item)
|
||||
)}
|
||||
</ul>
|
||||
<div>
|
||||
{moreToLoad &&
|
||||
{moreToLoad &&
|
||||
<div className="studio-grid-load-more">
|
||||
<button
|
||||
className={classNames('button', {
|
||||
'mod-mutating': loading
|
||||
|
@ -206,8 +206,8 @@ const StudioActivity = ({items, loading, error, moreToLoad, onLoadMore}) => {
|
|||
>
|
||||
<FormattedMessage id="general.loadMore" />
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -66,7 +66,7 @@ const StudioCurators = ({
|
|||
/>)
|
||||
)}
|
||||
{moreToLoad &&
|
||||
<div className="studio-members-load-more">
|
||||
<div className="studio-grid-load-more">
|
||||
<button
|
||||
className={classNames('button', {
|
||||
'mod-mutating': loading
|
||||
|
|
|
@ -103,7 +103,7 @@ const StudioManagers = ({
|
|||
/>)
|
||||
)}
|
||||
{moreToLoad &&
|
||||
<div className="studio-members-load-more">
|
||||
<div className="studio-grid-load-more">
|
||||
<button
|
||||
className={classNames('button', {
|
||||
'mod-mutating': loading
|
||||
|
|
|
@ -105,7 +105,7 @@ const StudioProjects = ({
|
|||
/>)
|
||||
)}
|
||||
{moreToLoad &&
|
||||
<div className="studio-projects-load-more">
|
||||
<div className="studio-grid-load-more">
|
||||
<button
|
||||
className={classNames('button', {
|
||||
'mod-mutating': loading
|
||||
|
|
|
@ -147,7 +147,7 @@ $radius: 8px;
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* Overrides for when title and description are editable textareas. These override inplace-input */
|
||||
textarea.studio-title, textarea.studio-description {
|
||||
padding: 5px 8px;
|
||||
|
@ -241,14 +241,14 @@ $radius: 8px;
|
|||
|
||||
border: 1px solid $ui-blue;
|
||||
border-radius: 1rem;
|
||||
|
||||
|
||||
font-weight: bold;
|
||||
color: $ui-blue;
|
||||
font-size: 12px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.manager-threshold-message {
|
||||
|
@ -270,9 +270,12 @@ $radius: 8px;
|
|||
}
|
||||
column-gap: 20px;
|
||||
row-gap: 20px;
|
||||
}
|
||||
|
||||
.studio-projects-load-more {
|
||||
grid-column: 1 / -1;
|
||||
.studio-grid-load-more {
|
||||
grid-column: 1 / -1;
|
||||
button {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -345,9 +348,6 @@ $radius: 8px;
|
|||
}
|
||||
column-gap: 20px;
|
||||
row-gap: 20px;
|
||||
.studio-members-load-more {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
}
|
||||
|
||||
.studio-tabs {
|
||||
|
|
Loading…
Reference in a new issue