Changing from forum to community

- Fixes #121

ui/src/components/communities.tsx

@@ -45,7 +45,7 @@ export class Communities extends Component<any, CommunitiesState> {
   }
 
   componentDidMount() {
-    document.title = "Forums - Lemmy";
+    document.title = "Communities - Lemmy";
     let table = document.querySelector('#community_table');
     Sortable.initTable(table);
   }
@@ -56,7 +56,7 @@ export class Communities extends Component<any, CommunitiesState> {
         {this.state.loading ? 
         <h5 class=""><svg class="icon icon-spinner spin"><use xlinkHref="#icon-spinner"></use></svg></h5> : 
         <div>
-          <h5>Forums</h5>
+          <h5>Communities</h5>
           <div class="table-responsive">
             <table id="community_table" class="table table-sm table-hover">
               <thead class="pointer">
@@ -73,7 +73,7 @@ export class Communities extends Component<any, CommunitiesState> {
               <tbody>
                 {this.state.communities.map(community =>
                   <tr>
-                    <td><Link to={`/f/${community.name}`}>{community.name}</Link></td>
+                    <td><Link to={`/c/${community.name}`}>{community.name}</Link></td>
                     <td>{community.title}</td>
                     <td>{community.category_name}</td>
                     <td class="text-right d-none d-md-table-cell">{community.number_of_subscribers}</td>

ui/src/components/community-form.tsx

@@ -120,10 +120,7 @@ export class CommunityForm extends Component<CommunityFormProps, CommunityFormSt
     if (i.props.community) {
       WebSocketService.Instance.editCommunity(i.state.communityForm);
     } else {
-
+      WebSocketService.Instance.createCommunity(i.state.communityForm);
-      setTimeout(function(){
-        WebSocketService.Instance.createCommunity(i.state.communityForm);
-      }, 10000);
     }
     i.setState(i.state);
   }

ui/src/components/community.tsx

@@ -174,7 +174,7 @@ export class Community extends Component<any, State> {
 
   updateUrl() {
     let sortStr = SortType[this.state.sort].toLowerCase();
-    this.props.history.push(`/f/${this.state.community.name}/sort/${sortStr}/page/${this.state.page}`);
+    this.props.history.push(`/c/${this.state.community.name}/sort/${sortStr}/page/${this.state.page}`);
   }
 
   fetchPosts() {
@@ -199,7 +199,7 @@ export class Community extends Component<any, State> {
       this.state.community = res.community;
       this.state.moderators = res.moderators;
       this.state.admins = res.admins;
-      document.title = `/f/${this.state.community.name} - Lemmy`;
+      document.title = `/c/${this.state.community.name} - Lemmy`;
       this.setState(this.state);
       this.fetchPosts();
     } else if (op == UserOperation.EditCommunity) {

ui/src/components/create-community.tsx

@@ -10,7 +10,7 @@ export class CreateCommunity extends Component<any, any> {
   }
 
   componentDidMount() {
-    document.title = "Create Forum - Lemmy";
+    document.title = "Create Community - Lemmy";
   }
 
   render() {
@@ -18,7 +18,7 @@ export class CreateCommunity extends Component<any, any> {
       <div class="container">
         <div class="row">
           <div class="col-12 col-lg-6 mb-4">
-            <h5>Create Forum</h5>
+            <h5>Create Community</h5>
             <CommunityForm onCreate={this.handleCommunityCreate}/>
           </div>
         </div>
@@ -27,7 +27,7 @@ export class CreateCommunity extends Component<any, any> {
   }
 
   handleCommunityCreate(community: Community) {
-    this.props.history.push(`/f/${community.name}`);
+    this.props.history.push(`/c/${community.name}`);
   }
 }
 

ui/src/components/main.tsx

@@ -128,10 +128,10 @@ export class Main extends Component<any, MainState> {
                 {this.trendingCommunities()}
                 {UserService.Instance.user && this.state.subscribedCommunities.length > 0 && 
                   <div>
-                    <h5>Subscribed forums</h5>
+                    <h5>Subscribed communities</h5>
                     <ul class="list-inline"> 
                       {this.state.subscribedCommunities.map(community =>
-                        <li class="list-inline-item"><Link to={`/f/${community.community_name}`}>{community.community_name}</Link></li>
+                        <li class="list-inline-item"><Link to={`/c/${community.community_name}`}>{community.community_name}</Link></li>
                       )}
                     </ul>
                   </div>
@@ -148,10 +148,10 @@ export class Main extends Component<any, MainState> {
   trendingCommunities() {
     return (
       <div>
-        <h5>Trending <Link class="text-white" to="/communities">forums</Link></h5> 
+        <h5>Trending <Link class="text-white" to="/communities">communities</Link></h5> 
         <ul class="list-inline"> 
           {this.state.trendingCommunities.map(community =>
-            <li class="list-inline-item"><Link to={`/f/${community.name}`}>{community.name}</Link></li>
+            <li class="list-inline-item"><Link to={`/c/${community.name}`}>{community.name}</Link></li>
           )}
         </ul>
       </div>

ui/src/components/modlog.tsx

@@ -110,7 +110,7 @@ export class Modlog extends Component<any, ModlogState> {
               {i.type_ == 'removed_communities' && 
                 <>
                   {(i.data as ModRemoveCommunity).removed ? 'Removed' : 'Restored'} 
-                  <span> Community <Link to={`/f/${(i.data as ModRemoveCommunity).community_name}`}>{(i.data as ModRemoveCommunity).community_name}</Link></span>
+                  <span> Community <Link to={`/c/${(i.data as ModRemoveCommunity).community_name}`}>{(i.data as ModRemoveCommunity).community_name}</Link></span>
                   <div>{(i.data as ModRemoveCommunity).reason && ` reason: ${(i.data as ModRemoveCommunity).reason}`}</div>
                   <div>{(i.data as ModRemoveCommunity).expires && ` expires: ${moment.utc((i.data as ModRemoveCommunity).expires).fromNow()}`}</div>
                 </>
@@ -120,7 +120,7 @@ export class Modlog extends Component<any, ModlogState> {
                   <span>{(i.data as ModBanFromCommunity).banned ? 'Banned ' : 'Unbanned '} </span>
                   <span><Link to={`/u/${(i.data as ModBanFromCommunity).other_user_name}`}>{(i.data as ModBanFromCommunity).other_user_name}</Link></span>
                   <span> from the community </span>
-                  <span><Link to={`/f/${(i.data as ModBanFromCommunity).community_name}`}>{(i.data as ModBanFromCommunity).community_name}</Link></span>
+                  <span><Link to={`/c/${(i.data as ModBanFromCommunity).community_name}`}>{(i.data as ModBanFromCommunity).community_name}</Link></span>
                   <div>{(i.data as ModBanFromCommunity).reason && ` reason: ${(i.data as ModBanFromCommunity).reason}`}</div>
                   <div>{(i.data as ModBanFromCommunity).expires && ` expires: ${moment.utc((i.data as ModBanFromCommunity).expires).fromNow()}`}</div>
                 </>
@@ -130,7 +130,7 @@ export class Modlog extends Component<any, ModlogState> {
                   <span>{(i.data as ModAddCommunity).removed ? 'Removed ' : 'Appointed '} </span>
                   <span><Link to={`/u/${(i.data as ModAddCommunity).other_user_name}`}>{(i.data as ModAddCommunity).other_user_name}</Link></span>
                   <span> as a mod to the community </span>
-                  <span><Link to={`/f/${(i.data as ModAddCommunity).community_name}`}>{(i.data as ModAddCommunity).community_name}</Link></span>
+                  <span><Link to={`/c/${(i.data as ModAddCommunity).community_name}`}>{(i.data as ModAddCommunity).community_name}</Link></span>
                 </>
               }
               {i.type_ == 'banned' && 
@@ -165,7 +165,7 @@ export class Modlog extends Component<any, ModlogState> {
         <h5 class=""><svg class="icon icon-spinner spin"><use xlinkHref="#icon-spinner"></use></svg></h5> : 
         <div>
           <h5>
-            {this.state.communityName && <Link className="text-white" to={`/f/${this.state.communityName}`}>/f/{this.state.communityName} </Link>}
+            {this.state.communityName && <Link className="text-white" to={`/c/${this.state.communityName}`}>/c/{this.state.communityName} </Link>}
             <span>Modlog</span>
           </h5>
           <div class="table-responsive">

ui/src/components/navbar.tsx

@@ -64,7 +64,7 @@ export class Navbar extends Component<any, NavbarState> {
     return (
       <nav class="container navbar navbar-expand-md navbar-light navbar-bg p-0 px-3">
         <Link title={version} class="navbar-brand" to="/">
-          <svg class="icon mr-2"><use xlinkHref="#icon-mouse"></use></svg>
+          <svg class="icon mr-2 mouse-icon"><use xlinkHref="#icon-mouse"></use></svg>
           Lemmy
         </Link>
         <button class="navbar-toggler" type="button" onClick={linkEvent(this, this.expandNavbar)}>
@@ -73,7 +73,7 @@ export class Navbar extends Component<any, NavbarState> {
         <div className={`${!this.state.expanded && 'collapse'} navbar-collapse`}>
           <ul class="navbar-nav mr-auto">
             <li class="nav-item">
-              <Link class="nav-link" to="/communities">Forums</Link>
+              <Link class="nav-link" to="/communities">Communities</Link>
             </li>
             <li class="nav-item">
               <Link class="nav-link" to="/search">Search</Link>
@@ -82,7 +82,7 @@ export class Navbar extends Component<any, NavbarState> {
               <Link class="nav-link" to="/create_post">Create Post</Link>
             </li>
             <li class="nav-item">
-              <Link class="nav-link" to="/create_community">Create Forum</Link>
+              <Link class="nav-link" to="/create_community">Create Community</Link>
             </li>
           </ul>
           <ul class="navbar-nav ml-auto mr-2">

ui/src/components/post-form.tsx

@@ -99,7 +99,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
           {/* Cant change a community from an edit */}
           {!this.props.post &&
             <div class="form-group row">
-            <label class="col-sm-2 col-form-label">Forum</label>
+            <label class="col-sm-2 col-form-label">Community</label>
             <div class="col-sm-10">
               <select class="form-control" value={this.state.postForm.community_id} onInput={linkEvent(this, this.handlePostCommunityChange)}>
                 {this.state.communities.map(community =>

ui/src/components/post-listing.tsx

@@ -118,7 +118,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
               {this.props.showCommunity && 
                 <span>
                   <span> to </span>
-                  <Link to={`/f/${post.community_name}`}>{post.community_name}</Link>
+                  <Link to={`/c/${post.community_name}`}>{post.community_name}</Link>
                 </span>
               }
             </li>

ui/src/components/post-listings.tsx

@@ -19,7 +19,7 @@ export class PostListings extends Component<PostListingsProps, any> {
       <div>
         {this.props.posts.length > 0 ? this.props.posts.map(post => 
           <PostListing post={post} showCommunity={this.props.showCommunity} />) : 
-          <div>No Listings. {!this.props.showCommunity && <span>Subscribe to some <Link to="/communities">forums</Link>.</span>}
+          <div>No posts. {this.props.showCommunity !== undefined  && <span>Subscribe to some <Link to="/communities">communities</Link>.</span>}
         </div>
         }
       </div>

ui/src/components/sidebar.tsx

@@ -57,7 +57,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
           <small className="ml-2 text-muted font-italic">removed</small>
         }
       </h5>
-      <Link className="text-muted" to={`/f/${community.name}`}>/f/{community.name}</Link>
+      <Link className="text-muted" to={`/c/${community.name}`}>/c/{community.name}</Link>
       <ul class="list-inline mb-1 text-muted small font-weight-bold"> 
         {this.canMod && 
           <>

ui/src/components/user.tsx

@@ -241,7 +241,7 @@ export class User extends Component<any, UserState> {
             <h5>Moderates</h5>
             <ul class="list-unstyled"> 
               {this.state.moderates.map(community =>
-                <li><Link to={`/f/${community.community_name}`}>{community.community_name}</Link></li>
+                <li><Link to={`/c/${community.community_name}`}>{community.community_name}</Link></li>
               )}
             </ul>
           </div>
@@ -259,7 +259,7 @@ export class User extends Component<any, UserState> {
             <h5>Subscribed</h5>
             <ul class="list-unstyled"> 
               {this.state.follows.map(community =>
-                <li><Link to={`/f/${community.community_name}`}>{community.community_name}</Link></li>
+                <li><Link to={`/c/${community.community_name}`}>{community.community_name}</Link></li>
               )}
             </ul>
           </div>

ui/src/css/main.css

@@ -87,6 +87,10 @@ blockquote {
   margin-top: 6px;
 }
 
+.mouse-icon {
+  margin-top: -4px;
+}
+
 .new-comments {
   max-height: 100vh;
   overflow: hidden;

ui/src/index.tsx

@@ -46,9 +46,9 @@ class Index extends Component<any, any> {
             <Route path={`/communities`} component={Communities} />
             <Route path={`/post/:id/comment/:comment_id`} component={Post} />
             <Route path={`/post/:id`} component={Post} />
-            <Route path={`/f/:name/sort/:sort/page/:page`} component={Community} />
+            <Route path={`/c/:name/sort/:sort/page/:page`} component={Community} />
             <Route path={`/community/:id`} component={Community} />
-            <Route path={`/f/:name`} component={Community} />
+            <Route path={`/c/:name`} component={Community} />
             <Route path={`/u/:username/view/:view/sort/:sort/page/:page`} component={User} />
             <Route path={`/user/:id`} component={User} />
             <Route path={`/u/:username`} component={User} />