Logging in working, languages working.

This commit is contained in:
Dessalines 2020-09-09 15:33:40 -05:00
parent 06955a0e37
commit e8e3612cdb
8 changed files with 77 additions and 66 deletions

View file

@ -84,6 +84,12 @@ server.get('/*', async (req, res) => {
</head> </head>
<body> <body>
<noscript>
<nav class="navbar fixed-bottom navbar-light bg-light">
Javascript is disabled. Actions will not work.
</nav>
</noscript>
<div id='root'>${renderToString(wrapper)}</div> <div id='root'>${renderToString(wrapper)}</div>
<script src='/static/js/client.js'></script> <script src='/static/js/client.js'></script>
</body> </body>

View file

@ -99,7 +99,7 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
</svg> </svg>
<T i18nKey="must_login" class="d-inline"> <T i18nKey="must_login" class="d-inline">
# #
<Link class="alert-link" to="/login"> <Link className="alert-link" to="/login">
# #
</Link> </Link>
</T> </T>

View file

@ -43,8 +43,7 @@ export class CreateCommunity extends Component<any, CreateCommunityState> {
this.parseMessage = this.parseMessage.bind(this); this.parseMessage = this.parseMessage.bind(this);
this.subscription = wsSubscribe(this.parseMessage); this.subscription = wsSubscribe(this.parseMessage);
// TODO not sure if this works if (!UserService.Instance.user && isBrowser()) {
if (!UserService.Instance.user) {
toast(i18n.t('not_logged_in'), 'danger'); toast(i18n.t('not_logged_in'), 'danger');
this.context.router.history.push(`/login`); this.context.router.history.push(`/login`);
} }

View file

@ -44,7 +44,7 @@ export class CreatePost extends Component<any, CreatePostState> {
this.handlePostCreate = this.handlePostCreate.bind(this); this.handlePostCreate = this.handlePostCreate.bind(this);
this.state = this.emptyState; this.state = this.emptyState;
if (!UserService.Instance.user) { if (!UserService.Instance.user && isBrowser()) {
toast(i18n.t('not_logged_in'), 'danger'); toast(i18n.t('not_logged_in'), 'danger');
this.context.router.history.push(`/login`); this.context.router.history.push(`/login`);
} }

View file

@ -1,7 +1,6 @@
import { Component, linkEvent, createRef, RefObject } from 'inferno'; import { Component, linkEvent, createRef, RefObject } from 'inferno';
import { Link } from 'inferno-router'; import { Link } from 'inferno-router';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
import { retryWhen, delay, take } from 'rxjs/operators';
import { WebSocketService, UserService } from '../services'; import { WebSocketService, UserService } from '../services';
import { import {
UserOperation, UserOperation,
@ -30,6 +29,7 @@ import {
notifyComment, notifyComment,
notifyPrivateMessage, notifyPrivateMessage,
isBrowser, isBrowser,
wsSubscribe,
} from '../utils'; } from '../utils';
import { i18n } from '../i18next'; import { i18n } from '../i18next';
@ -64,56 +64,56 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
searchParam: '', searchParam: '',
toggleSearch: false, toggleSearch: false,
}; };
subscription: any;
constructor(props: any, context: any) { constructor(props: any, context: any) {
super(props, context); super(props, context);
this.state = this.emptyState; this.state = this.emptyState;
if (isBrowser()) { this.parseMessage = this.parseMessage.bind(this);
this.wsSub = WebSocketService.Instance.subject this.subscription = wsSubscribe(this.parseMessage);
.pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
.subscribe(
msg => this.parseMessage(msg),
err => console.error(err),
() => console.log('complete')
);
this.searchTextField = createRef();
}
// The login // The login
// TODO this needs some work // TODO this needs some work
if (this.props.site.my_user) { UserService.Instance.user = this.props.site.my_user;
UserService.Instance.user = this.props.site.my_user; i18n.changeLanguage(getLanguage());
// i18n.changeLanguage(getLanguage()); setTheme();
if (UserService.Instance.user) {
if (isBrowser()) {
WebSocketService.Instance.userJoin();
// On the first load, check the unreads
if (this.state.isLoggedIn == false) {
this.requestNotificationPermission();
this.fetchUnreads();
// setTheme(data.my_user.theme, true);
// i18n.changeLanguage(getLanguage());
// i18n.changeLanguage('de');
}
}
} }
// if (!!this.props.site.my_user) {
// UserService.Instance.this.props.site.my_user);
// // UserService.Instance.user = this.props.site.my_user;
// } else {
// UserService.Instance.setUser(undefined);
// }
} }
componentDidMount() { componentDidMount() {
// Subscribe to jwt changes // Subscribe to jwt changes
if (isBrowser()) { if (isBrowser()) {
this.searchTextField = createRef();
console.log(`isLoggedIn = ${this.state.isLoggedIn}`);
// On the first load, check the unreads
if (this.state.isLoggedIn == false) {
// setTheme(data.my_user.theme, true);
// i18n.changeLanguage(getLanguage());
// i18n.changeLanguage('de');
} else {
this.requestNotificationPermission();
WebSocketService.Instance.userJoin();
this.fetchUnreads();
}
this.userSub = UserService.Instance.jwtSub.subscribe(res => { this.userSub = UserService.Instance.jwtSub.subscribe(res => {
// A login // A login
if (res !== undefined) { if (res !== undefined) {
this.requestNotificationPermission(); this.requestNotificationPermission();
WebSocketService.Instance.getSite();
} else { } else {
this.state.isLoggedIn = false; this.setState({ isLoggedIn: false });
} }
console.log('a new login');
// WebSocketService.Instance.getSite();
this.setState(this.state);
}); });
// Subscribe to unread count changes // Subscribe to unread count changes
@ -415,6 +415,12 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
this.state.unreadCount = this.calculateUnreadCount(); this.state.unreadCount = this.calculateUnreadCount();
this.setState(this.state); this.setState(this.state);
this.sendUnreadCount(); this.sendUnreadCount();
} else if (res.op == UserOperation.GetSite) {
// This is only called on a successful login
let data = res.data as GetSiteResponse;
UserService.Instance.user = data.my_user;
this.state.isLoggedIn = true;
this.setState(this.state);
} else if (res.op == UserOperation.CreateComment) { } else if (res.op == UserOperation.CreateComment) {
let data = res.data as CommentResponse; let data = res.data as CommentResponse;

View file

@ -143,18 +143,16 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
this.props.post.embed_title && ( this.props.post.embed_title && (
<IFramelyCard post={this.props.post} /> <IFramelyCard post={this.props.post} />
)} )}
{this.props.showBody && this.props.post.body && ( {this.props.showBody &&
<> this.props.post.body &&
{this.state.viewSource ? ( (this.state.viewSource ? (
<pre>{this.props.post.body}</pre> <pre>{this.props.post.body}</pre>
) : ( ) : (
<div <div
className="md-div" className="md-div"
dangerouslySetInnerHTML={mdToHtml(this.props.post.body)} dangerouslySetInnerHTML={mdToHtml(this.props.post.body)}
/> />
)} ))}
</>
)}
</div> </div>
</div> </div>
); );

View file

@ -20,9 +20,8 @@ export class UserService {
); );
private constructor() { private constructor() {
let jwt = IsomorphicCookie.load('jwt'); if (this.auth) {
if (jwt) { this.setClaims(this.auth);
this.setClaims(jwt);
} else { } else {
// setTheme(); // setTheme();
console.log('No JWT cookie found.'); console.log('No JWT cookie found.');
@ -30,17 +29,17 @@ export class UserService {
} }
public login(res: LoginResponse) { public login(res: LoginResponse) {
this.setClaims(res.jwt);
let expires = new Date(); let expires = new Date();
expires.setDate(expires.getDate() + 365); expires.setDate(expires.getDate() + 365);
IsomorphicCookie.save('jwt', res.jwt, { expires }); IsomorphicCookie.save('jwt', res.jwt, { expires, secure: false });
console.log('jwt cookie set'); console.log('jwt cookie set');
this.setClaims(res.jwt);
} }
public logout() { public logout() {
IsomorphicCookie.remove('jwt', { secure: false });
this.claims = undefined; this.claims = undefined;
this.user = undefined; this.user = undefined;
IsomorphicCookie.remove('jwt');
// setTheme(); // setTheme();
this.jwtSub.next(); this.jwtSub.next();
console.log('Logged out.'); console.log('Logged out.');

View file

@ -358,15 +358,14 @@ export function debounce(
// TODO // TODO
export function getLanguage(override?: string): string { export function getLanguage(override?: string): string {
return 'en'; let user = UserService.Instance.user;
// let user = UserService.Instance.user; let lang = override || (user && user.lang ? user.lang : 'browser');
// let lang = override || (user && user.lang ? user.lang : 'browser');
// if (lang == 'browser') { if (lang == 'browser' && isBrowser()) {
// return getBrowserLanguage(); return getBrowserLanguage();
// } else { } else {
// return lang; return lang;
// } }
} }
// TODO // TODO
@ -440,6 +439,11 @@ export function getMomentLanguage(): string {
// TODO // TODO
export function setTheme(theme: string = 'darkly', loggedIn: boolean = false) { export function setTheme(theme: string = 'darkly', loggedIn: boolean = false) {
// require('../assets/css/themes/_variables.darkly.scss');
// require('../../node_modules/bootstrap/scss/bootstrap.scss');
// require('../assets/css/themes/_variables.darkly.scss');
// require('../assets/css/themes/_variables.darkly.scss');
// require('../assets/css/themes/_variables.darkly.scss');
// unload all the other themes // unload all the other themes
// for (var i = 0; i < themes.length; i++) { // for (var i = 0; i < themes.length; i++) {
// let styleSheet = document.getElementById(themes[i]); // let styleSheet = document.getElementById(themes[i]);
@ -1138,11 +1142,10 @@ export function setAuth(obj: any, auth: string) {
} }
export function setIsoData(context: any): IsoData { export function setIsoData(context: any): IsoData {
if (isBrowser()) { let isoData: IsoData = isBrowser()
return window.isoData; ? window.isoData
} else { : context.router.staticContext;
return context.router.staticContext; return isoData;
}
} }
export function wsSubscribe(parseMessage: any): Subscription { export function wsSubscribe(parseMessage: any): Subscription {