routes.api: fix get_captcha endpoint (#1135)

[lemmy.git] / ui / src / components / community.tsx

diff --git a/ui/src/components/community.tsx b/ui/src/components/community.tsx
index 76e6450e20235f43e6c3e55d3d42535df675b792..f86562f8c23286fe84bb38f92b5a708fb8d028eb 100644 (file)
--- a/ui/src/components/community.tsx
+++ b/ui/src/components/community.tsx
@@ -2,6 +2,7 @@ import { Component, linkEvent } from 'inferno';
 import { Helmet } from 'inferno-helmet';
 import { Subscription } from 'rxjs';
 import { retryWhen, delay, take } from 'rxjs/operators';
+import { DataType } from '../interfaces';
 import {
   UserOperation,
   Community as CommunityI,
@@ -14,7 +15,6 @@ import {
   GetPostsForm,
   GetCommunityForm,
   ListingType,
-  DataType,
   GetPostsResponse,
   PostResponse,
   AddModToCommunityResponse,
@@ -26,13 +26,15 @@ import {
   WebSocketJsonResponse,
   GetSiteResponse,
   Site,
-} from '../interfaces';
+} from 'lemmy-js-client';
 import { WebSocketService } from '../services';
 import { PostListings } from './post-listings';
 import { CommentNodes } from './comment-nodes';
 import { SortSelect } from './sort-select';
 import { DataTypeSelect } from './data-type-select';
 import { Sidebar } from './sidebar';
+import { CommunityLink } from './community-link';
+import { BannerIconHeader } from './banner-icon-header';
 import {
   wsJsonToRes,
   fetchLimit,
@@ -47,6 +49,8 @@ import {
   editPostFindRes,
   commentsToFlatNodes,
   setupTippy,
+  favIconUrl,
+  notifyPost,
 } from '../utils';
 import { i18n } from '../i18next';
 
@@ -74,7 +78,7 @@ interface CommunityProps {
 
 interface UrlParams {
   dataType?: string;
-  sort?: string;
+  sort?: SortType;
   page?: number;
 }
 
@@ -126,6 +130,9 @@ export class Community extends Component<any, State> {
       enable_downvotes: undefined,
       open_registration: undefined,
       enable_nsfw: undefined,
+      icon: undefined,
+      banner: undefined,
+      creator_preferred_username: undefined,
     },
   };
 
@@ -176,17 +183,28 @@ export class Community extends Component<any, State> {
   }
 
   get documentTitle(): string {
-    if (this.state.community.name) {
-      return `!${this.state.community.name} - ${this.state.site.name}`;
+    if (this.state.community.title) {
+      return `${this.state.community.title} - ${this.state.site.name}`;
     } else {
       return 'Lemmy';
     }
   }
 
+  get favIcon(): string {
+    return this.state.site.icon ? this.state.site.icon : favIconUrl;
+  }
+
   render() {
     return (
       <div class="container">
-        <Helmet title={this.documentTitle} />
+        <Helmet title={this.documentTitle}>
+          <link
+            id="favicon"
+            rel="icon"
+            type="image/x-icon"
+            href={this.favIcon}
+          />
+        </Helmet>
         {this.state.loading ? (
           <h5>
             <svg class="icon icon-spinner spin">
@@ -196,6 +214,7 @@ export class Community extends Component<any, State> {
         ) : (
           <div class="row">
             <div class="col-12 col-md-8">
+              {this.communityInfo()}
               {this.selects()}
               {this.listings()}
               {this.paginator()}
@@ -235,6 +254,26 @@ export class Community extends Component<any, State> {
     );
   }
 
+  communityInfo() {
+    return (
+      <div>
+        <BannerIconHeader
+          banner={this.state.community.banner}
+          icon={this.state.community.icon}
+        />
+        <h5 class="mb-0">{this.state.community.title}</h5>
+        <CommunityLink
+          community={this.state.community}
+          realLink
+          useApubName
+          muted
+          hideAvatar
+        />
+        <hr />
+      </div>
+    );
+  }
+
   selects() {
     return (
       <div class="mb-3">
@@ -248,9 +287,7 @@ export class Community extends Component<any, State> {
           <SortSelect sort={this.state.sort} onChange={this.handleSortChange} />
         </span>
         <a
-          href={`/feeds/c/${this.state.communityName}.xml?sort=${
-            SortType[this.state.sort]
-          }`}
+          href={`/feeds/c/${this.state.communityName}.xml?sort=${this.state.sort}`}
           target="_blank"
           title="RSS"
           rel="noopener"
@@ -297,20 +334,18 @@ export class Community extends Component<any, State> {
   }
 
   handleSortChange(val: SortType) {
-    this.updateUrl({ sort: SortType[val].toLowerCase(), page: 1 });
+    this.updateUrl({ sort: val, page: 1 });
     window.scrollTo(0, 0);
   }
 
   handleDataTypeChange(val: DataType) {
-    this.updateUrl({ dataType: DataType[val].toLowerCase(), page: 1 });
+    this.updateUrl({ dataType: DataType[val], page: 1 });
     window.scrollTo(0, 0);
   }
 
   updateUrl(paramUpdates: UrlParams) {
-    const dataTypeStr =
-      paramUpdates.dataType || DataType[this.state.dataType].toLowerCase();
-    const sortStr =
-      paramUpdates.sort || SortType[this.state.sort].toLowerCase();
+    const dataTypeStr = paramUpdates.dataType || DataType[this.state.dataType];
+    const sortStr = paramUpdates.sort || this.state.sort;
     const page = paramUpdates.page || this.state.page;
     this.props.history.push(
       `/c/${this.state.community.name}/data_type/${dataTypeStr}/sort/${sortStr}/page/${page}`
@@ -322,8 +357,8 @@ export class Community extends Component<any, State> {
       let getPostsForm: GetPostsForm = {
         page: this.state.page,
         limit: fetchLimit,
-        sort: SortType[this.state.sort],
-        type_: ListingType[ListingType.Community],
+        sort: this.state.sort,
+        type_: ListingType.Community,
         community_id: this.state.community.id,
       };
       WebSocketService.Instance.getPosts(getPostsForm);
@@ -331,8 +366,8 @@ export class Community extends Component<any, State> {
       let getCommentsForm: GetCommentsForm = {
         page: this.state.page,
         limit: fetchLimit,
-        sort: SortType[this.state.sort],
-        type_: ListingType[ListingType.Community],
+        sort: this.state.sort,
+        type_: ListingType.Community,
         community_id: this.state.community.id,
       };
       WebSocketService.Instance.getComments(getCommentsForm);
@@ -388,6 +423,7 @@ export class Community extends Component<any, State> {
     } else if (res.op == UserOperation.CreatePost) {
       let data = res.data as PostResponse;
       this.state.posts.unshift(data.post);
+      notifyPost(data.post, this.context.router);
       this.setState(this.state);
     } else if (res.op == UserOperation.CreatePostLike) {
       let data = res.data as PostResponse;