Browse Source

Adding inferno-helmet to fix page titles. Fixes #1028 (#1030)

post_thumbnail_url_fixes
Dessalines 1 year ago
committed by GitHub
parent
commit
6e4599411b
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 14
      server/src/apub/post.rs
  2. 1
      ui/package.json
  3. 13
      ui/src/components/admin-settings.tsx
  4. 16
      ui/src/components/communities.tsx
  5. 11
      ui/src/components/community.tsx
  6. 33
      ui/src/components/create-community.tsx
  7. 11
      ui/src/components/create-post.tsx
  8. 29
      ui/src/components/create-private-message.tsx
  9. 41
      ui/src/components/inbox.tsx
  10. 33
      ui/src/components/login.tsx
  11. 11
      ui/src/components/main.tsx
  12. 16
      ui/src/components/modlog.tsx
  13. 16
      ui/src/components/password_change.tsx
  14. 11
      ui/src/components/post.tsx
  15. 21
      ui/src/components/search.tsx
  16. 6
      ui/src/components/setup.tsx
  17. 24
      ui/src/components/sponsors.tsx
  18. 11
      ui/src/components/user.tsx
  19. 2
      ui/src/services/UserService.ts
  20. 2844
      ui/yarn.lock

14
server/src/apub/post.rs

@ -1,14 +1,22 @@
use crate::{
apub::{
activities::send_activity_to_community,
create_apub_response, create_apub_tombstone_response, create_tombstone,
create_apub_response,
create_apub_tombstone_response,
create_tombstone,
extensions::page_extension::PageExtension,
fetcher::{get_or_fetch_and_upsert_remote_community, get_or_fetch_and_upsert_remote_user},
ActorType, ApubLikeableType, ApubObjectType, FromApub, PageExt, ToApub,
ActorType,
ApubLikeableType,
ApubObjectType,
FromApub,
PageExt,
ToApub,
},
blocking,
routes::DbPoolParam,
DbPool, LemmyError,
DbPool,
LemmyError,
};
use activitystreams_ext::Ext1;
use activitystreams_new::{

1
ui/package.json

@ -32,6 +32,7 @@
"husky": "^4.2.5",
"i18next": "^19.4.1",
"inferno": "^7.4.2",
"inferno-helmet": "^5.2.1",
"inferno-i18next": "nimbusec-oss/inferno-i18next",
"inferno-router": "^7.4.2",
"js-cookie": "^2.2.0",

13
ui/src/components/admin-settings.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -80,9 +81,18 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.siteRes.site.name) {
return `${i18n.t('admin_settings')} - ${this.state.siteRes.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
{this.state.loading ? (
<h5>
<svg class="icon icon-spinner spin">
@ -220,9 +230,6 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
}
this.state.siteRes = data;
this.setState(this.state);
document.title = `${i18n.t('admin_settings')} - ${
this.state.siteRes.site.name
}`;
} else if (res.op == UserOperation.EditSite) {
let data = res.data as SiteResponse;
this.state.siteRes.site = data.site;

16
ui/src/components/communities.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -11,6 +12,7 @@ import {
SortType,
WebSocketJsonResponse,
GetSiteResponse,
Site,
} from '../interfaces';
import { WebSocketService } from '../services';
import { wsJsonToRes, toast, getPageFromProps } from '../utils';
@ -25,6 +27,7 @@ interface CommunitiesState {
communities: Array<Community>;
page: number;
loading: boolean;
site: Site;
}
interface CommunitiesProps {
@ -37,6 +40,7 @@ export class Communities extends Component<any, CommunitiesState> {
communities: [],
loading: true,
page: getPageFromProps(this.props),
site: undefined,
};
constructor(props: any, context: any) {
@ -71,9 +75,18 @@ export class Communities extends Component<any, CommunitiesState> {
}
}
get documentTitle(): string {
if (this.state.site) {
return `${i18n.t('communities')} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
{this.state.loading ? (
<h5 class="">
<svg class="icon icon-spinner spin">
@ -240,7 +253,8 @@ export class Communities extends Component<any, CommunitiesState> {
this.setState(this.state);
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
document.title = `${i18n.t('communities')} - ${data.site.name}`;
this.state.site = data.site;
this.setState(this.state);
}
}
}

11
ui/src/components/community.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -174,9 +175,18 @@ export class Community extends Component<any, State> {
}
}
get documentTitle(): string {
if (this.state.community.name) {
return `/c/${this.state.community.name} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
{this.selects()}
{this.state.loading ? (
<h5>
@ -356,7 +366,6 @@ export class Community extends Component<any, State> {
this.state.community = data.community;
this.state.moderators = data.moderators;
this.state.online = data.online;
document.title = `/c/${this.state.community.name} - ${this.state.site.name}`;
this.setState(this.state);
this.fetchData();
} else if (

33
ui/src/components/create-community.tsx

@ -1,4 +1,5 @@
import { Component } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import { CommunityForm } from './community-form';
@ -7,19 +8,33 @@ import {
UserOperation,
WebSocketJsonResponse,
GetSiteResponse,
Site,
} from '../interfaces';
import { toast, wsJsonToRes } from '../utils';
import { WebSocketService, UserService } from '../services';
import { i18n } from '../i18next';
interface CreateCommunityState {
enableNsfw: boolean;
site: Site;
}
export class CreateCommunity extends Component<any, CreateCommunityState> {
private subscription: Subscription;
private emptyState: CreateCommunityState = {
enableNsfw: null,
site: {
id: undefined,
name: undefined,
creator_id: undefined,
published: undefined,
creator_name: undefined,
number_of_users: undefined,
number_of_posts: undefined,
number_of_comments: undefined,
number_of_communities: undefined,
enable_downvotes: undefined,
open_registration: undefined,
enable_nsfw: undefined,
},
};
constructor(props: any, context: any) {
super(props, context);
@ -46,15 +61,24 @@ export class CreateCommunity extends Component<any, CreateCommunityState> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.site.name) {
return `${i18n.t('create_community')} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12 col-lg-6 offset-lg-3 mb-4">
<h5>{i18n.t('create_community')}</h5>
<CommunityForm
onCreate={this.handleCommunityCreate}
enableNsfw={this.state.enableNsfw}
enableNsfw={this.state.site.enable_nsfw}
/>
</div>
</div>
@ -74,9 +98,8 @@ export class CreateCommunity extends Component<any, CreateCommunityState> {
return;
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
this.state.enableNsfw = data.site.enable_nsfw;
this.state.site = data.site;
this.setState(this.state);
document.title = `${i18n.t('create_community')} - ${data.site.name}`;
}
}
}

11
ui/src/components/create-post.tsx

@ -1,4 +1,5 @@
import { Component } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import { PostForm } from './post-form';
@ -61,9 +62,18 @@ export class CreatePost extends Component<any, CreatePostState> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.site.name) {
return `${i18n.t('create_post')} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12 col-lg-6 offset-lg-3 mb-4">
<h5>{i18n.t('create_post')}</h5>
@ -117,7 +127,6 @@ export class CreatePost extends Component<any, CreatePostState> {
let data = res.data as GetSiteResponse;
this.state.site = data.site;
this.setState(this.state);
document.title = `${i18n.t('create_post')} - ${data.site.name}`;
}
}
}

29
ui/src/components/create-private-message.tsx

@ -1,4 +1,5 @@
import { Component } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import { PrivateMessageForm } from './private-message-form';
@ -7,15 +8,27 @@ import {
UserOperation,
WebSocketJsonResponse,
GetSiteResponse,
Site,
PrivateMessageFormParams,
} from '../interfaces';
import { toast, wsJsonToRes } from '../utils';
import { i18n } from '../i18next';
export class CreatePrivateMessage extends Component<any, any> {
interface CreatePrivateMessageState {
site: Site;
}
export class CreatePrivateMessage extends Component<
any,
CreatePrivateMessageState
> {
private subscription: Subscription;
private emptyState: CreatePrivateMessageState = {
site: undefined,
};
constructor(props: any, context: any) {
super(props, context);
this.state = this.emptyState;
this.handlePrivateMessageCreate = this.handlePrivateMessageCreate.bind(
this
);
@ -40,9 +53,18 @@ export class CreatePrivateMessage extends Component<any, any> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.site) {
return `${i18n.t('create_private_message')} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12 col-lg-6 offset-lg-3 mb-4">
<h5>{i18n.t('create_private_message')}</h5>
@ -80,9 +102,8 @@ export class CreatePrivateMessage extends Component<any, any> {
return;
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
document.title = `${i18n.t('create_private_message')} - ${
data.site.name
}`;
this.state.site = data.site;
this.setState(this.state);
}
}
}

41
ui/src/components/inbox.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -17,6 +18,7 @@ import {
PrivateMessagesResponse,
PrivateMessageResponse,
GetSiteResponse,
Site,
} from '../interfaces';
import { WebSocketService, UserService } from '../services';
import {
@ -57,7 +59,7 @@ interface InboxState {
messages: Array<PrivateMessageI>;
sort: SortType;
page: number;
enableDownvotes: boolean;
site: Site;
}
export class Inbox extends Component<any, InboxState> {
@ -70,7 +72,20 @@ export class Inbox extends Component<any, InboxState> {
messages: [],
sort: SortType.New,
page: 1,
enableDownvotes: undefined,
site: {
id: undefined,
name: undefined,
creator_id: undefined,
published: undefined,
creator_name: undefined,
number_of_users: undefined,
number_of_posts: undefined,
number_of_comments: undefined,
number_of_communities: undefined,
enable_downvotes: undefined,
open_registration: undefined,
enable_nsfw: undefined,
},
};
constructor(props: any, context: any) {
@ -95,9 +110,20 @@ export class Inbox extends Component<any, InboxState> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.site.name) {
return `/u/${UserService.Instance.user.name} ${i18n.t('inbox')} - ${
this.state.site.name
}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12">
<h5 class="mb-1">
@ -269,7 +295,7 @@ export class Inbox extends Component<any, InboxState> {
markable
showCommunity
showContext
enableDownvotes={this.state.enableDownvotes}
enableDownvotes={this.state.site.enable_downvotes}
/>
) : (
<PrivateMessage privateMessage={i} />
@ -288,7 +314,7 @@ export class Inbox extends Component<any, InboxState> {
markable
showCommunity
showContext
enableDownvotes={this.state.enableDownvotes}
enableDownvotes={this.state.site.enable_downvotes}
/>
</div>
);
@ -304,7 +330,7 @@ export class Inbox extends Component<any, InboxState> {
markable
showCommunity
showContext
enableDownvotes={this.state.enableDownvotes}
enableDownvotes={this.state.site.enable_downvotes}
/>
))}
</div>
@ -557,11 +583,8 @@ export class Inbox extends Component<any, InboxState> {
this.setState(this.state);
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
this.state.enableDownvotes = data.site.enable_downvotes;
this.state.site = data.site;
this.setState(this.state);
document.title = `/u/${UserService.Instance.user.name} ${i18n.t(
'inbox'
)} - ${data.site.name}`;
}
}

33
ui/src/components/login.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -9,6 +10,7 @@ import {
PasswordResetForm,
GetSiteResponse,
WebSocketJsonResponse,
Site,
} from '../interfaces';
import { WebSocketService, UserService } from '../services';
import { wsJsonToRes, validEmail, toast } from '../utils';
@ -19,12 +21,12 @@ interface State {
registerForm: RegisterForm;
loginLoading: boolean;
registerLoading: boolean;
enable_nsfw: boolean;
mathQuestion: {
a: number;
b: number;
answer: number;
};
site: Site;
}
export class Login extends Component<any, State> {
@ -44,12 +46,25 @@ export class Login extends Component<any, State> {
},
loginLoading: false,
registerLoading: false,
enable_nsfw: undefined,
mathQuestion: {
a: Math.floor(Math.random() * 10) + 1,
b: Math.floor(Math.random() * 10) + 1,
answer: undefined,
},
site: {
id: undefined,
name: undefined,
creator_id: undefined,
published: undefined,
creator_name: undefined,
number_of_users: undefined,
number_of_posts: undefined,
number_of_comments: undefined,
number_of_communities: undefined,
enable_downvotes: undefined,
open_registration: undefined,
enable_nsfw: undefined,
},
};
constructor(props: any, context: any) {
@ -72,9 +87,18 @@ export class Login extends Component<any, State> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.site.name) {
return `${i18n.t('login')} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12 col-lg-6 mb-4">{this.loginForm()}</div>
<div class="col-12 col-lg-6">{this.registerForm()}</div>
@ -251,7 +275,7 @@ export class Login extends Component<any, State> {
/>
</div>
</div>
{this.state.enable_nsfw && (
{this.state.site.enable_nsfw && (
<div class="form-group row">
<div class="col-sm-10">
<div class="form-check">
@ -392,9 +416,8 @@ export class Login extends Component<any, State> {
toast(i18n.t('reset_password_mail_sent'));
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
this.state.enable_nsfw = data.site.enable_nsfw;
this.state.site = data.site;
this.setState(this.state);
document.title = `${i18n.t('login')} - ${data.site.name}`;
}
}
}

11
ui/src/components/main.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Link } from 'inferno-router';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
@ -177,9 +178,18 @@ export class Main extends Component<any, MainState> {
}
}
get documentTitle(): string {
if (this.state.siteRes.site.name) {
return `${this.state.siteRes.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<main role="main" class="col-12 col-md-8">
{this.posts()}
@ -627,7 +637,6 @@ export class Main extends Component<any, MainState> {
this.state.siteRes.banned = data.banned;
this.state.siteRes.online = data.online;
this.setState(this.state);
document.title = `${this.state.siteRes.site.name}`;
} else if (res.op == UserOperation.EditSite) {
let data = res.data as SiteResponse;
this.state.siteRes.site = data.site;

16
ui/src/components/modlog.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Link } from 'inferno-router';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
@ -17,6 +18,7 @@ import {
ModAdd,
WebSocketJsonResponse,
GetSiteResponse,
Site,
} from '../interfaces';
import { WebSocketService } from '../services';
import { wsJsonToRes, addTypeInfo, fetchLimit, toast } from '../utils';
@ -38,6 +40,7 @@ interface ModlogState {
communityId?: number;
communityName?: string;
page: number;
site: Site;
loading: boolean;
}
@ -47,6 +50,7 @@ export class Modlog extends Component<any, ModlogState> {
combined: [],
page: 1,
loading: true,
site: undefined,
};
constructor(props: any, context: any) {
@ -338,9 +342,18 @@ export class Modlog extends Component<any, ModlogState> {
);
}
get documentTitle(): string {
if (this.state.site) {
return `Modlog - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
{this.state.loading ? (
<h5 class="">
<svg class="icon icon-spinner spin">
@ -434,7 +447,8 @@ export class Modlog extends Component<any, ModlogState> {
this.setCombined(data);
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
document.title = `Modlog - ${data.site.name}`;
this.state.site = data.site;
this.setState(this.state);
}
}
}

16
ui/src/components/password_change.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -7,6 +8,7 @@ import {
PasswordChangeForm,
WebSocketJsonResponse,
GetSiteResponse,
Site,
} from '../interfaces';
import { WebSocketService, UserService } from '../services';
import { wsJsonToRes, capitalizeFirstLetter, toast } from '../utils';
@ -15,6 +17,7 @@ import { i18n } from '../i18next';
interface State {
passwordChangeForm: PasswordChangeForm;
loading: boolean;
site: Site;
}
export class PasswordChange extends Component<any, State> {
@ -27,6 +30,7 @@ export class PasswordChange extends Component<any, State> {
password_verify: undefined,
},
loading: false,
site: undefined,
};
constructor(props: any, context: any) {
@ -48,9 +52,18 @@ export class PasswordChange extends Component<any, State> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.site) {
return `${i18n.t('password_change')} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12 col-lg-6 offset-lg-3 mb-4">
<h5>{i18n.t('password_change')}</h5>
@ -142,7 +155,8 @@ export class PasswordChange extends Component<any, State> {
this.props.history.push('/');
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
document.title = `${i18n.t('password_change')} - ${data.site.name}`;
this.state.site = data.site;
this.setState(this.state);
}
}
}

11
ui/src/components/post.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -180,9 +181,18 @@ export class Post extends Component<any, PostState> {
}
}
get documentTitle(): string {
if (this.state.post) {
return `${this.state.post.name} - ${this.state.siteRes.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
{this.state.loading ? (
<h5>
<svg class="icon icon-spinner spin">
@ -406,7 +416,6 @@ export class Post extends Component<any, PostState> {
this.state.moderators = data.moderators;
this.state.online = data.online;
this.state.loading = false;
document.title = `${this.state.post.name} - ${this.state.siteRes.site.name}`;
// Get cross-posts
if (this.state.post.url) {

21
ui/src/components/search.tsx

@ -1,5 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Link } from 'inferno-router';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -156,9 +156,24 @@ export class Search extends Component<any, SearchState> {
}
}
get documentTitle(): string {
if (this.state.site.name) {
if (this.state.q) {
return `${i18n.t('search')} - ${this.state.q} - ${
this.state.site.name
}`;
} else {
return `${i18n.t('search')} - ${this.state.site.name}`;
}
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<h5>{i18n.t('search')}</h5>
{this.selects()}
{this.searchForm()}
@ -500,9 +515,6 @@ export class Search extends Component<any, SearchState> {
let data = res.data as SearchResponse;
this.state.searchResponse = data;
this.state.loading = false;
document.title = `${i18n.t('search')} - ${this.state.q} - ${
this.state.site.name
}`;
window.scrollTo(0, 0);
this.setState(this.state);
} else if (res.op == UserOperation.CreateCommentLike) {
@ -517,7 +529,6 @@ export class Search extends Component<any, SearchState> {
let data = res.data as GetSiteResponse;
this.state.site = data.site;
this.setState(this.state);
document.title = `${i18n.t('search')} - ${data.site.name}`;
}
}
}

6
ui/src/components/setup.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import {
@ -51,13 +52,14 @@ export class Setup extends Component<any, State> {
this.subscription.unsubscribe();
}
componentDidMount() {
document.title = `${i18n.t('setup')} - Lemmy`;
get documentTitle(): string {
return `${i18n.t('setup')} - Lemmy`;
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12 offset-lg-3 col-lg-6">
<h3>{i18n.t('lemmy_instance_setup')}</h3>

24
ui/src/components/sponsors.tsx

@ -1,9 +1,11 @@
import { Component } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import { WebSocketService } from '../services';
import {
GetSiteResponse,
Site,
WebSocketJsonResponse,
UserOperation,
} from '../interfaces';
@ -42,10 +44,18 @@ let silver: Array<SilverUser> = [
// let gold = [];
// let latinum = [];
export class Sponsors extends Component<any, any> {
interface SponsorsState {
site: Site;
}
export class Sponsors extends Component<any, SponsorsState> {
private subscription: Subscription;
private emptyState: SponsorsState = {
site: undefined,
};
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(
@ -65,9 +75,18 @@ export class Sponsors extends Component<any, any> {
this.subscription.unsubscribe();
}
get documentTitle(): string {
if (this.state.site) {
return `${i18n.t('sponsors')} - ${this.state.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container text-center">
<Helmet title={this.documentTitle} />
{this.topMessage()}
<hr />
{this.sponsors()}
@ -183,7 +202,8 @@ export class Sponsors extends Component<any, any> {
return;
} else if (res.op == UserOperation.GetSite) {
let data = res.data as GetSiteResponse;
document.title = `${i18n.t('sponsors')} - ${data.site.name}`;
this.state.site = data.site;
this.setState(this.state);
}
}
}

11
ui/src/components/user.tsx

@ -1,4 +1,5 @@
import { Component, linkEvent } from 'inferno';
import { Helmet } from 'inferno-helmet';
import { Link } from 'inferno-router';
import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
@ -207,13 +208,21 @@ export class User extends Component<any, UserState> {
// Couldnt get a refresh working. This does for now.
location.reload();
}
document.title = `/u/${this.state.username} - ${this.state.siteRes.site.name}`;
setupTippy();
}
get documentTitle(): string {
if (this.state.siteRes.site.name) {
return `/u/${this.state.username} - ${this.state.siteRes.site.name}`;
} else {
return 'Lemmy';
}
}
render() {
return (
<div class="container">
<Helmet title={this.documentTitle} />
<div class="row">
<div class="col-12 col-md-8">
<h5>

2
ui/src/services/UserService.ts

@ -34,7 +34,7 @@ export class UserService {
this.user = undefined;
Cookies.remove('jwt');
setTheme();
this.jwtSub.next(undefined);
this.jwtSub.next();
console.log('Logged out.');
}

2844
ui/yarn.lock

File diff suppressed because it is too large
Loading…
Cancel
Save