remove debug

This commit is contained in:
SrGooglo 2023-03-15 19:22:28 +00:00
parent 550dcafdc0
commit 66c10338b2
2 changed files with 0 additions and 132 deletions

View File

@ -1,109 +0,0 @@
import React from "react"
import { ViewportList } from "react-viewport-list"
import { PostCard, LoadMore } from "components"
import "./index.less"
const useCenteredContainer = () => {
React.useEffect(() => {
app.layout.toogleCenteredContent(true)
return () => {
app.layout.toogleCenteredContent(false)
}
}, [])
}
const useHacks = (hacks) => {
React.useEffect(() => {
window._hacks = hacks
return () => {
delete window._hacks
}
}, [])
}
function generateRandomData() {
return {
_id: Math.random().toString(36).substr(2, 9),
message: `Random post ${Math.random().toString(36).substr(2, 9)}`,
user: {
_id: Math.random().toString(36).substr(2, 9),
username: `Random user ${Math.random().toString(36).substr(2, 9)}`,
avatar: `https://avatars.dicebear.com/api/initials/${Math.random().toString(36).substr(2, 9)}}.svg`,
},
countLikes: Math.floor(Math.random() * 100),
hasLiked: Math.random() > 0.5,
}
}
const defaultList = new Array(20).fill(0).map(() => generateRandomData())
console.log(defaultList)
export default (props) => {
const listRef = React.useRef()
const [list, setList] = React.useState(defaultList)
const appendPost = (post) => {
setList((list) => {
return [post, ...list]
})
}
const removePost = (_id) => {
setList((list) => {
return list.filter((post) => {
return post._id !== _id
})
})
}
const removeFirstPost = () => {
setList((list) => {
return list.slice(1)
})
}
const onLoadMore = () => {
const newList = new Array(20).fill(0).map(() => generateRandomData())
setList((list) => {
return [...list, ...newList]
})
}
useCenteredContainer()
useHacks({
appendPost: appendPost,
remove: removePost,
deleteFirst: removeFirstPost,
addRandom: () => {
appendPost(generateRandomData())
},
})
return <div
ref={listRef}
className="list"
>
<ViewportList
viewportRef={listRef}
items={list}
>
{(item) => <PostCard
key={item._id}
data={item}
/>}
</ViewportList>
<button
onClick={onLoadMore}
>
Load more
</button>
</div>
}

View File

@ -1,23 +0,0 @@
.list {
display: flex;
flex-direction: column;
width: 100%;
align-items: center;
.postCard {
&:first-child {
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
&:last-child {
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
border-bottom: none;
padding-bottom: 0;
}
}
}