diff --git a/packages/app/src/pages/home/components/savedPosts/index.jsx b/packages/app/src/pages/home/components/savedPosts/index.jsx
index dce63b11..291075cf 100644
--- a/packages/app/src/pages/home/components/savedPosts/index.jsx
+++ b/packages/app/src/pages/home/components/savedPosts/index.jsx
@@ -1,7 +1,91 @@
import React from "react"
+import { Skeleton } from "antd"
+import { Icons } from "components/Icons"
-import { PostsFeed } from "components"
+import { PostsList } from "components"
+import Post from "models/post"
-export default () => {
- return
+import "./index.less"
+
+const emptyListRender = () => {
+ return
+
+ You dont have any saved posts.
+
+
+}
+
+export default class SavedPosts extends React.Component {
+ state = {
+ loading: true,
+ initialLoading: true,
+ hasMorePosts: true,
+ posts: [],
+ }
+
+ loadData = async ({
+ trim,
+ replace = false
+ } = {}) => {
+ await this.setState({
+ loading: true,
+ })
+
+ const result = await Post.getSavedPosts({
+ trim: trim ?? this.state.posts.length,
+ })
+
+ console.log("Loaded data => \n", result)
+
+ if (result) {
+ if (result.length === 0) {
+ await this.setState({
+ hasMorePosts: false,
+ loading: false,
+ initialLoading: false,
+ })
+
+ return false
+ }
+
+ await this.setState({
+ posts: replace ? result : [...this.state.posts, ...result],
+ })
+ }
+
+ await this.setState({
+ loading: false,
+ })
+
+ if (this.state.initialLoading) {
+ await this.setState({
+ initialLoading: false,
+ })
+ }
+ }
+
+ componentDidMount() {
+ this.loadData()
+ }
+
+ render() {
+ return
+
+
+
+ Saved Posts
+
+
+
+ {
+ this.state.initialLoading ?
:
+ }
+
+ }
}
\ No newline at end of file
diff --git a/packages/app/src/pages/home/components/savedPosts/index.less b/packages/app/src/pages/home/components/savedPosts/index.less
new file mode 100644
index 00000000..0c36f204
--- /dev/null
+++ b/packages/app/src/pages/home/components/savedPosts/index.less
@@ -0,0 +1,7 @@
+.savedPosts {
+ width: 100%;
+
+ .savedPosts_header {
+ font-size: 1.3rem;
+ }
+}
\ No newline at end of file