mirror of
https://github.com/ragestudio/comty.git
synced 2025-06-11 03:24:16 +00:00
use api core
This commit is contained in:
parent
4dccf80407
commit
0d177b1329
@ -90,7 +90,7 @@ const steps = [
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
const request = await app.api.customRequest("main", {
|
const request = await app.cores.api.customRequest("main", {
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "/user/username-available",
|
url: "/user/username-available",
|
||||||
params: {
|
params: {
|
||||||
@ -308,7 +308,7 @@ const steps = [
|
|||||||
const timer = setTimeout(async () => {
|
const timer = setTimeout(async () => {
|
||||||
if (!validFormat) return
|
if (!validFormat) return
|
||||||
|
|
||||||
const request = await app.api.customRequest("main", {
|
const request = await app.cores.api.customRequest("main", {
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "/user/email-available",
|
url: "/user/email-available",
|
||||||
params: {
|
params: {
|
||||||
|
@ -14,7 +14,7 @@ export default class UserSelector extends React.Component {
|
|||||||
searchValue: null,
|
searchValue: null,
|
||||||
}
|
}
|
||||||
|
|
||||||
api = window.app.api.withEndpoints("main")
|
api = window.app.cores.api.withEndpoints("main")
|
||||||
|
|
||||||
componentDidMount = async () => {
|
componentDidMount = async () => {
|
||||||
this.toogleLoading(true)
|
this.toogleLoading(true)
|
||||||
|
@ -1,126 +0,0 @@
|
|||||||
import React from "react"
|
|
||||||
import { Skeleton } from "antd"
|
|
||||||
import { Icons } from "components/Icons"
|
|
||||||
|
|
||||||
import { PostsList, Searcher } from "components"
|
|
||||||
import Post from "models/post"
|
|
||||||
|
|
||||||
import "./index.less"
|
|
||||||
|
|
||||||
export default class ExplorePosts extends React.Component {
|
|
||||||
state = {
|
|
||||||
loading: true,
|
|
||||||
initialLoading: true,
|
|
||||||
hasMorePosts: true,
|
|
||||||
posts: [],
|
|
||||||
focusedSearcher: false,
|
|
||||||
filledSearcher: false,
|
|
||||||
}
|
|
||||||
|
|
||||||
wsEvents = {
|
|
||||||
"post.new": async (data) => {
|
|
||||||
this.setState({
|
|
||||||
posts: [data, ...this.state.posts],
|
|
||||||
})
|
|
||||||
},
|
|
||||||
"post.delete": async (id) => {
|
|
||||||
this.setState({
|
|
||||||
posts: this.state.posts.filter((post) => {
|
|
||||||
return post._id !== id
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
loadPosts = async ({
|
|
||||||
trim,
|
|
||||||
replace = false
|
|
||||||
} = {}) => {
|
|
||||||
await this.setState({
|
|
||||||
loading: true,
|
|
||||||
})
|
|
||||||
|
|
||||||
// get posts from api
|
|
||||||
const result = await Post.getExplorePosts({
|
|
||||||
trim: trim ?? this.state.posts.length,
|
|
||||||
})
|
|
||||||
|
|
||||||
console.log("Loaded posts => \n", result)
|
|
||||||
|
|
||||||
if (result) {
|
|
||||||
if (result.length === 0) {
|
|
||||||
await this.setState({
|
|
||||||
hasMorePosts: 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,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
toggleFocusSearcher = (to) => {
|
|
||||||
to = to ?? !this.state.focusedSearcher
|
|
||||||
|
|
||||||
this.setState({
|
|
||||||
focusedSearcher: to
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
toggleState = (key, to) => {
|
|
||||||
to = to ?? !this.state[key]
|
|
||||||
|
|
||||||
this.setState({
|
|
||||||
[key]: to
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
componentDidMount = async () => {
|
|
||||||
await this.loadPosts()
|
|
||||||
|
|
||||||
Object.keys(this.wsEvents).forEach((event) => {
|
|
||||||
window.app.api.namespaces["main"].listenEvent(event, this.wsEvents[event])
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
componentWillUnmount = async () => {
|
|
||||||
Object.keys(this.wsEvents).forEach((event) => {
|
|
||||||
window.app.api.namespaces["main"].unlistenEvent(event, this.wsEvents[event])
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return <div className="postsExplore">
|
|
||||||
<div className="postsExplore_header">
|
|
||||||
<Searcher
|
|
||||||
autoFocus={false}
|
|
||||||
onFocus={() => this.toggleState("focusedSearcher", true)}
|
|
||||||
onUnfocus={() => this.toggleState("focusedSearcher", false)}
|
|
||||||
onFilled={() => this.toggleState("filledSearcher", true)}
|
|
||||||
onEmpty={() => this.toggleState("filledSearcher", false)}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{
|
|
||||||
this.state.focusedSearcher || this.state.filledSearcher ? null : this.state.initialLoading ? <Skeleton active /> : <PostsList
|
|
||||||
loading={this.state.loading}
|
|
||||||
hasMorePosts={this.state.hasMorePosts}
|
|
||||||
onLoadMore={this.loadPosts}
|
|
||||||
posts={this.state.posts}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,8 +0,0 @@
|
|||||||
.postsExplore {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.postsExplore_header {
|
|
||||||
font-size: 1.3rem;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,118 +0,0 @@
|
|||||||
import React from "react"
|
|
||||||
import { Skeleton } from "antd"
|
|
||||||
|
|
||||||
import { PostsList, PostCreator } from "components"
|
|
||||||
|
|
||||||
import FeedModel from "models/feed"
|
|
||||||
|
|
||||||
import "./index.less"
|
|
||||||
|
|
||||||
const emptyListRender = () => {
|
|
||||||
return <div className="emptyFeed">
|
|
||||||
<h2>
|
|
||||||
We don't have any posts to show you.
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
Search for new people to follow on <a onClick={() => app.setLocation("/home/explore")}>explore</a> tab, to start view their posts.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
export default class Feed extends React.Component {
|
|
||||||
state = {
|
|
||||||
loading: true,
|
|
||||||
initialLoading: true,
|
|
||||||
hasMorePosts: true,
|
|
||||||
posts: [],
|
|
||||||
}
|
|
||||||
|
|
||||||
wsEvents = {
|
|
||||||
"post.new": async (data) => {
|
|
||||||
this.setState({
|
|
||||||
posts: [data, ...this.state.posts],
|
|
||||||
})
|
|
||||||
},
|
|
||||||
"post.delete": async (id) => {
|
|
||||||
this.setState({
|
|
||||||
posts: this.state.posts.filter((post) => {
|
|
||||||
return post._id !== id
|
|
||||||
}),
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
loadData = async ({
|
|
||||||
trim,
|
|
||||||
replace = false
|
|
||||||
} = {}) => {
|
|
||||||
await this.setState({
|
|
||||||
loading: true,
|
|
||||||
})
|
|
||||||
|
|
||||||
// get posts from api
|
|
||||||
const result = await FeedModel.getPostsFeed({
|
|
||||||
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 = async () => {
|
|
||||||
await this.loadData()
|
|
||||||
|
|
||||||
Object.keys(this.wsEvents).forEach((event) => {
|
|
||||||
window.app.api.namespaces["main"].listenEvent(event, this.wsEvents[event])
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
componentWillUnmount = async () => {
|
|
||||||
Object.keys(this.wsEvents).forEach((event) => {
|
|
||||||
window.app.api.namespaces["main"].unlistenEvent(event, this.wsEvents[event])
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return <div className="feed">
|
|
||||||
<div className="feed_header">
|
|
||||||
<PostCreator />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{
|
|
||||||
this.state.initialLoading ? <Skeleton active /> : <PostsList
|
|
||||||
loading={this.state.loading}
|
|
||||||
hasMorePosts={this.state.hasMorePosts}
|
|
||||||
emptyListRender={emptyListRender}
|
|
||||||
onLoadMore={this.loadData}
|
|
||||||
posts={this.state.posts}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,33 +0,0 @@
|
|||||||
.feed {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.feed_header {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.emptyFeed {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,91 +0,0 @@
|
|||||||
import React from "react"
|
|
||||||
import { Skeleton } from "antd"
|
|
||||||
import { Icons } from "components/Icons"
|
|
||||||
|
|
||||||
import { PostsList } from "components"
|
|
||||||
import Post from "models/post"
|
|
||||||
|
|
||||||
import "./index.less"
|
|
||||||
|
|
||||||
const emptyListRender = () => {
|
|
||||||
return <div className="emptyFeed">
|
|
||||||
<h2>
|
|
||||||
You dont have any saved posts.
|
|
||||||
</h2>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
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 <div className="savedPosts">
|
|
||||||
<div className="savedPosts_header">
|
|
||||||
<h1>
|
|
||||||
<Icons.Bookmark />
|
|
||||||
Saved Posts
|
|
||||||
</h1>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{
|
|
||||||
this.state.initialLoading ? <Skeleton active /> : <PostsList
|
|
||||||
loading={this.state.loading}
|
|
||||||
hasMorePosts={this.state.hasMorePosts}
|
|
||||||
emptyListRender={emptyListRender}
|
|
||||||
onLoadMore={this.loadData}
|
|
||||||
posts={this.state.posts}
|
|
||||||
/>
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,7 +0,0 @@
|
|||||||
.savedPosts {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.savedPosts_header {
|
|
||||||
font-size: 1.3rem;
|
|
||||||
}
|
|
||||||
}
|
|
@ -1,14 +0,0 @@
|
|||||||
import React from "react"
|
|
||||||
import { Result } from "antd"
|
|
||||||
|
|
||||||
import "./index.less"
|
|
||||||
|
|
||||||
export default (props) => {
|
|
||||||
return <div className="trendingsBrowser">
|
|
||||||
<Result
|
|
||||||
status="404"
|
|
||||||
title="Not implemented"
|
|
||||||
subTitle="Sorry, but this feature is not implemented yet."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
}
|
|
@ -1 +0,0 @@
|
|||||||
.trendingsBrowser {}
|
|
@ -1,27 +0,0 @@
|
|||||||
import FeedTab from "./components/feed"
|
|
||||||
import ExploreTab from "./components/explore"
|
|
||||||
import TrendingsTab from "./components/trendings"
|
|
||||||
import SavedPostsTab from "./components/savedPosts"
|
|
||||||
|
|
||||||
export default {
|
|
||||||
"feed": {
|
|
||||||
title: "Feed",
|
|
||||||
icon: "Rss",
|
|
||||||
component: FeedTab
|
|
||||||
},
|
|
||||||
"explore": {
|
|
||||||
title: "Explore",
|
|
||||||
icon: "Search",
|
|
||||||
component: ExploreTab
|
|
||||||
},
|
|
||||||
"trendings": {
|
|
||||||
title: "Trendings",
|
|
||||||
icon: "TrendingUp",
|
|
||||||
component: TrendingsTab
|
|
||||||
},
|
|
||||||
"savedPosts": {
|
|
||||||
title: "Saved posts",
|
|
||||||
icon: "Bookmark",
|
|
||||||
component: SavedPostsTab
|
|
||||||
}
|
|
||||||
}
|
|
Loading…
x
Reference in New Issue
Block a user