muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 04:46:40 +07:00
Code Packages Activity Actions

fixed node loading

Browse source
This commit is contained in:
Fedor Katurov 2021-10-05 13:44:38 +07:00
parent c986bc434b
commit d31b94c42a
3 changed files with 13 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/containers/lab/LabGrid/index.tsx
View file

@ -1,13 +1,15 @@
import React, { FC } from 'react'; import React, { FC } from 'react';
import Masonry from 'react-masonry-css'; import Masonry from 'react-masonry-css';
import { useShallowSelect } from '~/utils/hooks/useShallowSelect';
import styles from './styles.module.scss'; import styles from './styles.module.scss';
import { LabNode } from '~/components/lab/LabNode'; import { LabNode } from '~/components/lab/LabNode';
import { selectLabList, selectLabListNodes } from '~/redux/lab/selectors';
import { EMPTY_NODE, NODE_TYPES } from '~/redux/node/constants'; import { EMPTY_NODE, NODE_TYPES } from '~/redux/node/constants';
import { values } from 'ramda'; import { values } from 'ramda';
import { ILabNode } from '~/redux/lab/types';
interface IProps {} interface IProps {
isLoading: boolean;
nodes: ILabNode[];
}
const breakpointCols = { const breakpointCols = {
default: 2, default: 2,
@ -26,11 +28,8 @@ const LoadingNode = () => (
/> />
); );
const LabGrid: FC<IProps> = () => { const LabGrid: FC<IProps> = ({ isLoading, nodes }) => {
const nodes = useShallowSelect(selectLabListNodes); if (isLoading) {
const { is_loading } = useShallowSelect(selectLabList);
if (is_loading) {
return ( return (
<Masonry <Masonry
className={styles.wrap} className={styles.wrap}

8
src/layouts/LabLayout/index.tsx
View file

@ -20,7 +20,7 @@ import { useLabPagination } from '~/utils/hooks/lab/useLabPagination';
interface IProps {} interface IProps {}
const LabLayout: FC<IProps> = () => { const LabLayout: FC<IProps> = () => {
const { is_loading } = useShallowSelect(selectLabList); const { is_loading, nodes } = useShallowSelect(selectLabList);
const dispatch = useDispatch(); const dispatch = useDispatch();
useLabPagination({ isLoading: is_loading }); useLabPagination({ isLoading: is_loading });
@ -30,16 +30,18 @@ const LabLayout: FC<IProps> = () => {
dispatch(labGetStats()); dispatch(labGetStats());
}, [dispatch]); }, [dispatch]);
const isInitialLoading = is_loading && !nodes.length;
return ( return (
<Container> <Container>
<div className={styles.container}> <div className={styles.container}>
<div className={styles.wrap}> <div className={styles.wrap}>
<Group className={styles.content}> <Group className={styles.content}>
<div className={styles.head}> <div className={styles.head}>
<LabHead isLoading={is_loading} /> <LabHead isLoading={isInitialLoading} />
</div> </div>
<LabGrid /> <LabGrid nodes={nodes} isLoading={isInitialLoading} />
</Group> </Group>
<div className={styles.panel}> <div className={styles.panel}>

3
src/redux/lab/sagas.ts
View file

@ -62,12 +62,11 @@ function* getMore() {
return; return;
} }
const last = list.nodes[list.nodes.length]; const last = list.nodes[list.nodes.length - 1];
if (!last) { if (!last) {
return; return;
} }
const after = last.node.created_at; const after = last.node.created_at;
const { nodes, count }: Unwrap<typeof getLabNodes> = yield call(getLabNodes, { after }); const { nodes, count }: Unwrap<typeof getLabNodes> = yield call(getLabNodes, { after });
const newNodes = [...list.nodes, ...nodes]; const newNodes = [...list.nodes, ...nodes];