mirror of
https://github.com/filecoin-project/slate.git
synced 2024-09-20 10:47:18 +03:00
working
This commit is contained in:
parent
d51096e128
commit
a77c99f279
@ -19,8 +19,6 @@ import { TabGroup } from "~/components/core/TabGroup";
|
|||||||
import SlateMediaObjectPreview from "~/components/core/SlateMediaObjectPreview";
|
import SlateMediaObjectPreview from "~/components/core/SlateMediaObjectPreview";
|
||||||
import FilePreviewBubble from "~/components/core/FilePreviewBubble";
|
import FilePreviewBubble from "~/components/core/FilePreviewBubble";
|
||||||
|
|
||||||
const VIEW_LIMIT = 5;
|
|
||||||
|
|
||||||
const STYLES_CONTAINER_HOVER = css`
|
const STYLES_CONTAINER_HOVER = css`
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
@ -106,12 +104,6 @@ const STYLES_ICON_BOX_BACKGROUND = css`
|
|||||||
right: 8px;
|
right: 8px;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const STYLES_ARROWS = css`
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: flex-end;
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_ACTION_BAR = css`
|
const STYLES_ACTION_BAR = css`
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -153,28 +145,6 @@ const STYLES_FILES_SELECTED = css`
|
|||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const STYLES_ICON_ELEMENT = css`
|
|
||||||
height: 40px;
|
|
||||||
width: 40px;
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
color: #565151;
|
|
||||||
user-select: none;
|
|
||||||
cursor: pointer;
|
|
||||||
pointer-events: auto;
|
|
||||||
margin: 16px 8px;
|
|
||||||
|
|
||||||
:hover {
|
|
||||||
color: ${Constants.system.brand};
|
|
||||||
}
|
|
||||||
|
|
||||||
svg {
|
|
||||||
transform: rotate(0deg);
|
|
||||||
transition: 200ms ease transform;
|
|
||||||
}
|
|
||||||
`;
|
|
||||||
|
|
||||||
const STYLES_COPY_INPUT = css`
|
const STYLES_COPY_INPUT = css`
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -231,7 +201,7 @@ export default class DataView extends React.Component {
|
|||||||
startIndex: 0,
|
startIndex: 0,
|
||||||
checked: {},
|
checked: {},
|
||||||
view: "grid",
|
view: "grid",
|
||||||
viewLimit: 3,
|
viewLimit: 20,
|
||||||
};
|
};
|
||||||
|
|
||||||
async componentDidMount() {
|
async componentDidMount() {
|
||||||
@ -284,11 +254,11 @@ export default class DataView extends React.Component {
|
|||||||
_increment = (direction) => {
|
_increment = (direction) => {
|
||||||
if (
|
if (
|
||||||
direction > 0 &&
|
direction > 0 &&
|
||||||
this.state.startIndex + VIEW_LIMIT < this.props.viewer.library[0].children.length
|
this.state.startIndex + this.state.viewLimit < this.props.viewer.library[0].children.length
|
||||||
) {
|
) {
|
||||||
this.setState({ startIndex: this.state.startIndex + VIEW_LIMIT });
|
this.setState({ startIndex: this.state.startIndex + this.state.viewLimit });
|
||||||
} else if (direction < 0 && this.state.startIndex - VIEW_LIMIT >= 0) {
|
} else if (direction < 0 && this.state.startIndex - this.state.viewLimit >= 0) {
|
||||||
this.setState({ startIndex: this.state.startIndex - VIEW_LIMIT });
|
this.setState({ startIndex: this.state.startIndex - this.state.viewLimit });
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -594,7 +564,7 @@ export default class DataView extends React.Component {
|
|||||||
{header}
|
{header}
|
||||||
<div css={STYLES_IMAGE_GRID}>
|
<div css={STYLES_IMAGE_GRID}>
|
||||||
{this.props.items
|
{this.props.items
|
||||||
.slice(this.state.startIndex, this.state.startIndex + VIEW_LIMIT)
|
.slice(this.state.startIndex, this.state.startIndex + this.state.viewLimit)
|
||||||
.map((each, i) => {
|
.map((each, i) => {
|
||||||
const cid = each.ipfs.replace("/ipfs/", "");
|
const cid = each.ipfs.replace("/ipfs/", "");
|
||||||
return (
|
return (
|
||||||
@ -749,7 +719,7 @@ export default class DataView extends React.Component {
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
const rows = this.props.items
|
const rows = this.props.items
|
||||||
.slice(this.state.startIndex, this.state.startIndex + VIEW_LIMIT)
|
.slice(this.state.startIndex, this.state.startIndex + this.state.viewLimit)
|
||||||
.map((each, index) => {
|
.map((each, index) => {
|
||||||
const cid = each.ipfs.replace("/ipfs/", "");
|
const cid = each.ipfs.replace("/ipfs/", "");
|
||||||
const isOnNetwork = each.networks && each.networks.includes("FILECOIN");
|
const isOnNetwork = each.networks && each.networks.includes("FILECOIN");
|
||||||
|
Loading…
Reference in New Issue
Block a user