LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-26 14:21:13 +00:00
Code Issues Projects Releases Wiki Activity

Merge pull request #1670 from LemmyNet/bugfix/fix-subscribe-button-layout

Browse source 
Make community sidebar "Subscribe"/"Joined"/"Pending" button consistent
This commit is contained in:
SleeplessOne1917 2023-06-28 13:51:36 -04:00 committed by GitHub
commit 0e9faf75da
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 39 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
src/shared/components/community/sidebar.tsx
View file

@ -166,7 +166,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
communityTitle() { communityTitle() {
const community = this.props.community_view.community; const community = this.props.community_view.community;
const subscribed = this.props.community_view.subscribed;
return ( return (
<div> <div>
<h5 className="mb-0"> <h5 className="mb-0">
@ -176,33 +176,6 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
<span className="me-2"> <span className="me-2">
<CommunityLink community={community} hideAvatar /> <CommunityLink community={community} hideAvatar />
</span> </span>
{subscribed === "Subscribed" && (
<button
className="btn btn-secondary btn-sm me-2"
onClick={linkEvent(this, this.handleUnfollowCommunity)}
>
{this.state.followCommunityLoading ? (
<Spinner />
) : (
<>
<Icon icon="check" classes="icon-inline text-success me-1" />
{I18NextService.i18n.t("joined")}
</>
)}
</button>
)}
{subscribed === "Pending" && (
<button
className="btn btn-warning me-2"
onClick={linkEvent(this, this.handleUnfollowCommunity)}
>
{this.state.followCommunityLoading ? (
<Spinner />
) : (
I18NextService.i18n.t("subscribe_pending")
)}
</button>
)}
{community.removed && ( {community.removed && (
<small className="me-2 text-muted fst-italic"> <small className="me-2 text-muted fst-italic">
{I18NextService.i18n.t("removed")} {I18NextService.i18n.t("removed")}
@ -259,8 +232,9 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
subscribe() { subscribe() {
const community_view = this.props.community_view; const community_view = this.props.community_view;
if (community_view.subscribed === "NotSubscribed") {
return ( return (
community_view.subscribed === "NotSubscribed" && (
<button <button
className="btn btn-secondary d-block mb-2 w-100" className="btn btn-secondary d-block mb-2 w-100"
onClick={linkEvent(this, this.handleFollowCommunity)} onClick={linkEvent(this, this.handleFollowCommunity)}
@ -271,10 +245,43 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
I18NextService.i18n.t("subscribe") I18NextService.i18n.t("subscribe")
)} )}
</button> </button>
)
); );
} }
if (community_view.subscribed === "Subscribed") {
return (
<button
className="btn btn-secondary d-block mb-2 w-100"
onClick={linkEvent(this, this.handleUnfollowCommunity)}
>
{this.state.followCommunityLoading ? (
<Spinner />
) : (
<>
<Icon icon="check" classes="icon-inline text-success me-1" />
{I18NextService.i18n.t("joined")}
</>
)}
</button>
);
}
if (community_view.subscribed === "Pending") {
return (
<button
className="btn btn-warning d-block mb-2 w-100"
onClick={linkEvent(this, this.handleUnfollowCommunity)}
>
{this.state.followCommunityLoading ? (
<Spinner />
) : (
I18NextService.i18n.t("subscribe_pending")
)}
</button>
);
}
}
blockCommunity() { blockCommunity() {
const { subscribed, blocked } = this.props.community_view; const { subscribed, blocked } = this.props.community_view;