import { Component, linkEvent } from 'inferno'; import { Link } from 'inferno-router'; import { Subscription } from "rxjs"; import { retryWhen, delay, take } from 'rxjs/operators'; import { UserOperation, CommunityUser, GetFollowedCommunitiesResponse, ListCommunitiesForm, ListCommunitiesResponse, Community, SortType, GetSiteResponse, ListingType, SiteResponse, GetPostsResponse, CreatePostLikeResponse, Post, GetPostsForm } from '../interfaces'; import { WebSocketService, UserService } from '../services'; import { PostListings } from './post-listings'; import { SiteForm } from './site-form'; import { msgOp, repoUrl, mdToHtml, fetchLimit, routeSortTypeToEnum, routeListingTypeToEnum } from '../utils'; interface MainState { subscribedCommunities: Array; trendingCommunities: Array; site: GetSiteResponse; showEditSite: boolean; loading: boolean; posts: Array; type_: ListingType; sort: SortType; page: number; } export class Main extends Component { private subscription: Subscription; private emptyState: MainState = { subscribedCommunities: [], trendingCommunities: [], site: { op: null, site: { id: null, name: null, creator_id: null, creator_name: null, published: null, number_of_users: null, number_of_posts: null, number_of_comments: null, }, admins: [], banned: [], }, showEditSite: false, loading: true, posts: [], type_: this.getListingTypeFromProps(this.props), sort: this.getSortTypeFromProps(this.props), page: this.getPageFromProps(this.props), } getListingTypeFromProps(props: any): ListingType { return (props.match.params.type) ? routeListingTypeToEnum(props.match.params.type) : UserService.Instance.user ? ListingType.Subscribed : ListingType.All; } getSortTypeFromProps(props: any): SortType { return (props.match.params.sort) ? routeSortTypeToEnum(props.match.params.sort) : SortType.Hot; } getPageFromProps(props: any): number { return (props.match.params.page) ? Number(props.match.params.page) : 1; } constructor(props: any, context: any) { super(props, context); this.state = this.emptyState; this.subscription = WebSocketService.Instance.subject .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10)))) .subscribe( (msg) => this.parseMessage(msg), (err) => console.error(err), () => console.log('complete') ); WebSocketService.Instance.getSite(); if (UserService.Instance.user) { WebSocketService.Instance.getFollowedCommunities(); } let listCommunitiesForm: ListCommunitiesForm = { sort: SortType[SortType.Hot], limit: 6 } WebSocketService.Instance.listCommunities(listCommunitiesForm); this.fetchPosts(); } componentWillUnmount() { this.subscription.unsubscribe(); } componentDidMount() { document.title = "Lemmy"; } // Necessary for back button for some reason componentWillReceiveProps(nextProps: any) { if (nextProps.history.action == 'POP') { this.state = this.emptyState; this.state.type_ = this.getListingTypeFromProps(nextProps); this.state.sort = this.getSortTypeFromProps(nextProps); this.state.page = this.getPageFromProps(nextProps); this.fetchPosts(); } } render() { return (
{this.posts()}
{!this.state.loading &&
{this.trendingCommunities()} {UserService.Instance.user && this.state.subscribedCommunities.length > 0 &&
Subscribed communities
    {this.state.subscribedCommunities.map(community =>
  • {community.community_name}
  • )}
} {this.sidebar()}
}
) } trendingCommunities() { return (
Trending communities
    {this.state.trendingCommunities.map(community =>
  • {community.name}
  • )}
) } sidebar() { return (
{!this.state.showEditSite ? this.siteInfo() : } {this.landing()}
) } updateUrl() { let typeStr = ListingType[this.state.type_].toLowerCase(); let sortStr = SortType[this.state.sort].toLowerCase(); this.props.history.push(`/home/type/${typeStr}/sort/${sortStr}/page/${this.state.page}`); } siteInfo() { return (
{`${this.state.site.site.name}`}
{this.canAdmin &&
  • edit
}
  • {this.state.site.site.number_of_users} Users
  • {this.state.site.site.number_of_posts} Posts
  • {this.state.site.site.number_of_comments} Comments
  • Modlog
  • admins:
  • {this.state.site.admins.map(admin =>
  • {admin.name}
  • )}
{this.state.site.site.description &&


}
) } landing() { return (
Powered by LemmyBeta

Lemmy is a link aggregator / reddit alternative, intended to work in the fediverse.

Its self-hostable, has live-updating comment threads, and is tiny (~80kB). Federation into the ActivityPub network is on the roadmap.

This is a very early beta version, and a lot of features are currently broken or missing.

Suggest new features or report bugs here.

Made with Rust, Actix, Inferno, Typescript.

) } posts() { return (
{this.state.loading ?
:
{this.selects()} {this.paginator()}
}
) } selects() { return (
) } paginator() { return (
{this.state.page > 1 && }
); } get canAdmin(): boolean { return UserService.Instance.user && this.state.site.admins.map(a => a.id).includes(UserService.Instance.user.id); } handleEditClick(i: Main) { i.state.showEditSite = true; i.setState(i.state); } handleEditCancel() { this.state.showEditSite = false; this.setState(this.state); } nextPage(i: Main) { i.state.page++; i.setState(i.state); i.updateUrl(); i.fetchPosts(); } prevPage(i: Main) { i.state.page--; i.setState(i.state); i.updateUrl(); i.fetchPosts(); } handleSortChange(i: Main, event: any) { i.state.sort = Number(event.target.value); i.state.page = 1; i.setState(i.state); i.updateUrl(); i.fetchPosts(); } handleTypeChange(i: Main, event: any) { i.state.type_ = Number(event.target.value); i.state.page = 1; i.setState(i.state); i.updateUrl(); i.fetchPosts(); } fetchPosts() { let getPostsForm: GetPostsForm = { page: this.state.page, limit: fetchLimit, sort: SortType[this.state.sort], type_: ListingType[this.state.type_] } WebSocketService.Instance.getPosts(getPostsForm); } parseMessage(msg: any) { console.log(msg); let op: UserOperation = msgOp(msg); if (msg.error) { alert(msg.error); return; } else if (op == UserOperation.GetFollowedCommunities) { let res: GetFollowedCommunitiesResponse = msg; this.state.subscribedCommunities = res.communities; this.setState(this.state); } else if (op == UserOperation.ListCommunities) { let res: ListCommunitiesResponse = msg; this.state.trendingCommunities = res.communities; this.setState(this.state); } else if (op == UserOperation.GetSite) { let res: GetSiteResponse = msg; // This means it hasn't been set up yet if (!res.site) { this.context.router.history.push("/setup"); } this.state.site.admins = res.admins; this.state.site.site = res.site; this.state.site.banned = res.banned; this.setState(this.state); } else if (op == UserOperation.EditSite) { let res: SiteResponse = msg; this.state.site.site = res.site; this.state.showEditSite = false; this.setState(this.state); } else if (op == UserOperation.GetPosts) { let res: GetPostsResponse = msg; this.state.posts = res.posts; this.state.loading = false; this.setState(this.state); } else if (op == UserOperation.CreatePostLike) { let res: CreatePostLikeResponse = msg; let found = this.state.posts.find(c => c.id == res.post.id); found.my_vote = res.post.my_vote; found.score = res.post.score; found.upvotes = res.post.upvotes; found.downvotes = res.post.downvotes; this.setState(this.state); } } }