From 72a3a3dbb9b9f4100f632afe7bf2bdaa6aba2f22 Mon Sep 17 00:00:00 2001 From: Dessalines Date: Mon, 29 Jul 2024 11:10:21 -0400 Subject: [PATCH] Remove trending communities card from home. (#2639) * Remove trending communities card from home. - This proved after time to be pointless. I thought about keeping the create and explore communities buttons, but these are already in the navbar, and so just take up more pointless space. - Fixes #2027 - Fixes #2007 * Forgot to remove trending loading skeleton. --- .../components/common/loading-skeleton.tsx | 34 ----- src/shared/components/home/home.tsx | 126 +----------------- src/shared/components/post/post-form.tsx | 4 +- src/shared/config.ts | 2 +- 4 files changed, 7 insertions(+), 159 deletions(-) diff --git a/src/shared/components/common/loading-skeleton.tsx b/src/shared/components/common/loading-skeleton.tsx index ab146b8a..78051a6d 100644 --- a/src/shared/components/common/loading-skeleton.tsx +++ b/src/shared/components/common/loading-skeleton.tsx @@ -58,40 +58,6 @@ class PostsLoadingSkeletonItem extends Component { } } -export class TrendingCommunitiesLoadingSkeleton extends Component< - LoadingSkeletonProps, - any -> { - render() { - return ( -
- {Array.from({ length: this.props.itemCount ?? 10 }, (_, index) => ( - - ))} -
- ); - } -} - -class TrendingCommunitiesLoadingSkeletonItem extends Component { - render() { - return ( -
-
-
-
- -
-
-
- -
-
-
- ); - } -} - export class CommentsLoadingSkeleton extends Component { render() { return Array.from({ length: this.props.itemCount ?? 10 }, (_, index) => ( diff --git a/src/shared/components/home/home.tsx b/src/shared/components/home/home.tsx index 84aa97a8..52ec91a4 100644 --- a/src/shared/components/home/home.tsx +++ b/src/shared/components/home/home.tsx @@ -18,10 +18,8 @@ import { getQueryString, getRandomFromList, resourcesSettled, - bareRoutePush, } from "@utils/helpers"; import { scrollMixin } from "../mixins/scroll-mixin"; -import { canCreateCommunity } from "@utils/roles"; import type { QueryParams, StringBoolean } from "@utils/types"; import { RouteDataResponse } from "@utils/types"; import { NoOptionI18nKeys } from "i18next"; @@ -56,8 +54,6 @@ import { GetSiteResponse, HidePost, LemmyHttp, - ListCommunities, - ListCommunitiesResponse, ListingType, LockPost, MarkCommentReplyAsRead, @@ -75,7 +71,7 @@ import { SuccessResponse, TransferCommunity, } from "lemmy-js-client"; -import { fetchLimit, relTags, trendingFetchLimit } from "../../config"; +import { fetchLimit, relTags } from "../../config"; import { CommentViewType, DataType, @@ -106,7 +102,6 @@ import { getHttpBaseInternal } from "../../utils/env"; import { CommentsLoadingSkeleton, PostsLoadingSkeleton, - TrendingCommunitiesLoadingSkeleton, } from "../common/loading-skeleton"; import { RouteComponentProps } from "inferno-router/dist/Route"; import { IRoutePropsWithFetch } from "../../routes"; @@ -116,9 +111,7 @@ import { isBrowser, snapToTop } from "@utils/browser"; interface HomeState { postsRes: RequestState; commentsRes: RequestState; - trendingCommunitiesRes: RequestState; showSubscribedMobile: boolean; - showTrendingMobile: boolean; showSidebarMobile: boolean; subscribedCollapsed: boolean; tagline?: string; @@ -137,7 +130,6 @@ interface HomeProps { type HomeData = RouteDataResponse<{ postsRes: GetPostsResponse; commentsRes: GetCommentsResponse; - trendingCommunitiesRes: ListCommunitiesResponse; }>; function getRss(listingType: ListingType, sort: SortType) { @@ -238,18 +230,6 @@ const MobileButton = ({ ); -const LinkButton = ({ - path, - translationKey, -}: { - path: string; - translationKey: NoOptionI18nKeys; -}) => ( - - {I18NextService.i18n.t(translationKey)} - -); - type HomePathProps = Record; type HomeRouteProps = RouteComponentProps & HomeProps; export type HomeFetchConfig = IRoutePropsWithFetch< @@ -265,10 +245,8 @@ export class Home extends Component { state: HomeState = { postsRes: EMPTY_REQUEST, commentsRes: EMPTY_REQUEST, - trendingCommunitiesRes: EMPTY_REQUEST, siteRes: this.isoData.site_res, showSubscribedMobile: false, - showTrendingMobile: false, showSidebarMobile: false, subscribedCollapsed: false, isIsomorphic: false, @@ -276,7 +254,6 @@ export class Home extends Component { loadingSettled(): boolean { return resourcesSettled([ - this.state.trendingCommunitiesRes, this.props.dataType === DataType.Post ? this.state.postsRes : this.state.commentsRes, @@ -324,12 +301,10 @@ export class Home extends Component { // Only fetch the data if coming from another route if (FirstLoadService.isFirstLoad) { - const { trendingCommunitiesRes, commentsRes, postsRes } = - this.isoData.routeData; + const { commentsRes, postsRes } = this.isoData.routeData; this.state = { ...this.state, - trendingCommunitiesRes, commentsRes, postsRes, isIsomorphic: true, @@ -349,10 +324,7 @@ export class Home extends Component { )) && isBrowser() ) { - await Promise.all([ - this.fetchTrendingCommunities(), - this.fetchData(this.props), - ]); + await this.fetchData(this.props); } } @@ -360,10 +332,6 @@ export class Home extends Component { nextProps: HomeRouteProps & { children?: InfernoNode }, ) { this.fetchData(nextProps); - - if (bareRoutePush(this.props, nextProps)) { - this.fetchTrendingCommunities(); - } } static async fetchInitialData({ @@ -401,24 +369,12 @@ export class Home extends Component { commentsFetch = client.getComments(getCommentsForm); } - const trendingCommunitiesForm: ListCommunities = { - type_: "Local", - sort: "Hot", - limit: trendingFetchLimit, - }; - - const trendingCommunitiesFetch = client.listCommunities( - trendingCommunitiesForm, - ); - - const [postsRes, commentsRes, trendingCommunitiesRes] = await Promise.all([ + const [postsRes, commentsRes] = await Promise.all([ postsFetch, commentsFetch, - trendingCommunitiesFetch, ]); return { - trendingCommunitiesRes, commentsRes, postsRes, }; @@ -481,7 +437,6 @@ export class Home extends Component { admins, }, showSubscribedMobile, - showTrendingMobile, showSidebarMobile, } = this.state; @@ -495,11 +450,6 @@ export class Home extends Component { onClick={linkEvent(this, this.handleShowSubscribedMobile)} /> )} - { isMobile={true} /> )} - {showTrendingMobile && ( -
- {this.trendingCommunities()} -
- )} {showSubscribedMobile && (
{this.subscribedCommunities(true)} @@ -539,9 +484,6 @@ export class Home extends Component { return (
-
- {this.trendingCommunities()} -
{ ); } - trendingCommunities() { - switch (this.state.trendingCommunitiesRes?.state) { - case "loading": - return ; - case "success": { - const trending = this.state.trendingCommunitiesRes.data.communities; - return ( - <> -
-
- - # - - # - - -
-
-
- {trending.length > 0 && ( -
    - {trending.map(cv => ( -
  • - -
    • - ))} -
- )} - {canCreateCommunity(this.state.siteRes) && ( - - )} - -
- - ); - } - } - } - subscribedCommunities(isMobile = false) { const { subscribedCollapsed } = this.state; @@ -842,17 +739,6 @@ export class Home extends Component { ); } - async fetchTrendingCommunities() { - this.setState({ trendingCommunitiesRes: LOADING_REQUEST }); - this.setState({ - trendingCommunitiesRes: await HttpService.client.listCommunities({ - type_: "Local", - sort: "Hot", - limit: trendingFetchLimit, - }), - }); - } - fetchDataToken?: symbol; async fetchData({ dataType, @@ -893,10 +779,6 @@ export class Home extends Component { i.setState({ showSubscribedMobile: !i.state.showSubscribedMobile }); } - handleShowTrendingMobile(i: Home) { - i.setState({ showTrendingMobile: !i.state.showTrendingMobile }); - } - handleShowSidebarMobile(i: Home) { i.setState({ showSidebarMobile: !i.state.showSidebarMobile }); } diff --git a/src/shared/components/post/post-form.tsx b/src/shared/components/post/post-form.tsx index 0670dc08..15a9c81d 100644 --- a/src/shared/components/post/post-form.tsx +++ b/src/shared/components/post/post-form.tsx @@ -27,7 +27,7 @@ import { ghostArchiveUrl, postMarkdownFieldCharacterLimit, relTags, - trendingFetchLimit, + similarPostFetchLimit, webArchiveUrl, } from "../../config"; import { PostFormParams } from "../../interfaces"; @@ -825,7 +825,7 @@ export class PostForm extends Component { listing_type: "All", community_id: this.state.form.community_id, page: 1, - limit: trendingFetchLimit, + limit: similarPostFetchLimit, }), }); } diff --git a/src/shared/config.ts b/src/shared/config.ts index 37800dd6..b6313917 100644 --- a/src/shared/config.ts +++ b/src/shared/config.ts @@ -16,7 +16,6 @@ export const webArchiveUrl = "https://web.archive.org"; export const elementUrl = "https://element.io"; export const postRefetchSeconds: number = 60 * 1000; -export const trendingFetchLimit = 6; export const mentionDropdownFetchLimit = 10; export const commentTreeMaxDepth = 8; export const postMarkdownFieldCharacterLimit = 50000; @@ -25,6 +24,7 @@ export const maxUploadImages = 20; export const concurrentImageUpload = 4; export const updateUnreadCountsInterval = 30000; export const fetchLimit = 20; +export const similarPostFetchLimit = 6; export const relTags = "noopener nofollow"; export const emDash = "\u2014"; export const authCookieName = "jwt";