RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-10 02:54:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

use api core

Browse Source
This commit is contained in:
SrGooglo 2023-02-24 14:36:54 +00:00
parent 4dccf80407
commit 0d177b1329
11 changed files with 3 additions and 428 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/app/src/components/UserRegister/index.jsx
View File

@ -90,7 +90,7 @@ const steps = [
return
}
const request = await app.api.customRequest("main", {
const request = await app.cores.api.customRequest("main", {
method: "GET",
url: "/user/username-available",
params: {
@ -308,7 +308,7 @@ const steps = [
const timer = setTimeout(async () => {
if (!validFormat) return
const request = await app.api.customRequest("main", {
const request = await app.cores.api.customRequest("main", {
method: "GET",
url: "/user/email-available",
params: {

2
packages/app/src/components/UserSelector/index.jsx
View File

@ -14,7 +14,7 @@ export default class UserSelector extends React.Component {
searchValue: null,
}
api = window.app.api.withEndpoints("main")
api = window.app.cores.api.withEndpoints("main")
componentDidMount = async () => {
this.toogleLoading(true)

126
packages/app/src/pages/home/components/explore/index.jsx
View File

@ -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>
}
}

8
packages/app/src/pages/home/components/explore/index.less
View File

@ -1,8 +0,0 @@
.postsExplore {
width: 100%;
.postsExplore_header {
font-size: 1.3rem;
margin-bottom: 20px;
}
}

118
packages/app/src/pages/home/components/feed/index.jsx
View File

@ -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>
}
}

33
packages/app/src/pages/home/components/feed/index.less
View File

@ -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;
}
}

91
packages/app/src/pages/home/components/savedPosts/index.jsx
View File

@ -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>
}
}

7
packages/app/src/pages/home/components/savedPosts/index.less
View File

@ -1,7 +0,0 @@
.savedPosts {
width: 100%;
.savedPosts_header {
font-size: 1.3rem;
}
}

14
packages/app/src/pages/home/components/trendings/index.jsx
View File

@ -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
packages/app/src/pages/home/components/trendings/index.less
View File

@ -1 +0,0 @@
.trendingsBrowser {}

27
packages/app/src/pages/home/tabs.jsx
View File

@ -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
}
}