pro/im_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

things seem to work

Browse Source
This commit is contained in:
or-else
2018-10-26 14:45:50 +03:00
parent 3e3dbd7fdb
commit 25021a866d
19 changed files with 272 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/contacts-view.jsx
+12 -2
View File
@@ -1,9 +1,18 @@
/* ContactsView holds all contacts-related stuff */
import React from 'react';
import { defineMessages } from 'react-intl';
import ContactList from '../widgets/contact-list.jsx';
// Panel titles for translation.
const messages = defineMessages({
'contacts_not_found': {
id: 'contacts_not_found',
description: 'HTML message shown in ContactList when no contacts are found',
defaultMessage: 'You have no chats<br />¯\\\\_(ツ)_/¯'
}
});
export default class ContactsView extends React.Component {
constructor(props) {
super(props);
@@ -28,11 +37,12 @@ export default class ContactsView extends React.Component {
}
render() {
const {formatMessage} = this.props.intl;
return (
<ContactList
connected={this.props.connected}
contacts={this.state.contactList}
emptyListMessage={<span>You have no chats<br />¯\_(ツ)_/¯</span>}
emptyListMessage={<span>{formatHTMLMessage(messages.contacts_not_found)}</span>}
topicSelected={this.props.topicSelected}
myUserId={this.props.myUserId}
showOnline={true}
src/views/create-account-view.jsx
+25 -9
View File
@@ -1,11 +1,24 @@
/* Account registration */
// Account registration.
import React from 'react';
import { FormattedMessage, defineMessages } from 'react-intl';
import AvatarUpload from '../widgets/avatar-upload.jsx';
import CheckBox from '../widgets/checkbox.jsx';
import VisiblePassword from '../widgets/visible-password.jsx';
const messages = defineMessages({
'email_prompt': {
id: 'email_prompt',
description: 'Input placeholder for email entry',
defaultMessage: 'Email, e.g. jdoe@example.com'
},
'full_name_prompt': {
id: 'full_name_prompt',
description: 'Input placeholder for person\'s full name',
defaultMessage: 'Full name, e.g. John Doe'
}
});
export default class CreateAccountView extends React.PureComponent {
constructor(props) {
super(props);
@@ -66,17 +79,18 @@ export default class CreateAccountView extends React.PureComponent {
}
render() {
var submitClasses = 'blue';
let submitClasses = 'blue';
if (this.props.disabled) {
submitClasses += ' disabled';
}
const {formatMessage} = this.props.intl;
return (
<form className="panel-form-column" onSubmit={this.handleSubmit}>
<div className="panel-form-row">
<div className="panel-form-column">
<input type="text" placeholder="Login" autoComplete="user-name"
<input type="text" placeholder="{formatMessage({id: 'login_prompt'})}" autoComplete="user-name"
value={this.state.login} onChange={this.handleLoginChange} required autoFocus />
<VisiblePassword placeholder="Password" autoComplete="new-password"
<VisiblePassword placeholder="{formatMessage({id: 'password_prompt'})}" autoComplete="new-password"
value={this.state.password} onFinished={this.handlePasswordChange}
required={true} />
</div>
@@ -85,20 +99,22 @@ export default class CreateAccountView extends React.PureComponent {
onError={this.props.onError} />
</div>
<div className="panel-form-row">
<input type="text" placeholder="Full name, e.g. John Doe" autoComplete="name"
<input type="text" placeholder="{formatMessage(messages.full_name_prompt)}" autoComplete="name"
value={this.state.fn} onChange={this.handleFnChange} required/>
</div>
<div className="panel-form-row">
<input type="email" placeholder="Email, e.g john.doe@example.com"
<input type="email" placeholder="{formatMessage(messages.email_prompt)}"
autoComplete="email" value={this.state.email} onChange={this.handleEmailChange} required/>
</div>
<div className="panel-form-row">
<CheckBox id="save-token" name="save-token" checked={this.state.saveToken}
onChange={this.handleToggleSaveToken} />
<label htmlFor="save-token">&nbsp;Stay logged in</label>
<label htmlFor="save-token">&nbsp;{formatMessage({id: 'stay_logged_in'})}</label>
</div>
<div className="dialog-buttons">
<button className={submitClasses} type="submit">Sign up</button>
<button className={submitClasses} type="submit">
<FormattedMessage id="sign_up_button" defaultMessage="Sign up" />
</button>
</div>
</form>
);
src/views/sidepanel-view.jsx
+57 -38
View File
@@ -1,4 +1,5 @@
import React from 'react';
import { defineMessages } from 'react-intl';
import SideNavbar from '../widgets/side-navbar.jsx';
import ErrorPanel from '../widgets/error-panel.jsx';
@@ -12,6 +13,45 @@ import PasswordResetView from './password-reset-view.jsx';
import SettingsView from './settings-view.jsx';
import ValidationView from './validation-view.jsx';
// Panel titles for translation.
const messages = defineMessages({
'login': {
id: 'sidepanel_title_login',
description: 'Sidepanel title for LoginView.',
defaultMessage: 'Sign In'
},
'register': {
id: 'sidepanel_title_register',
description: 'Sidepanel title for CreateAccountView.',
defaultMessage: 'Create Account'
},
'settings': {
id: 'sidepanel_title_settings',
description: 'Sidepanel title for SettingsView.',
defaultMessage: 'Settings'
},
'edit': {
id: 'sidepanel_title_edit_account',
description: 'Sidepanel title for EditAccountView.',
defaultMessage: 'Edit Account'
},
'newtpk': {
id: 'sidepanel_title_newtpk',
description: 'Sidepanel title for NewTopicView.',
defaultMessage: 'Start New Chat'
},
'cred': {
id: 'sidepanel_title_cred',
description: 'Sidepanel title for ValidationView.',
defaultMessage: 'Confirm Credentials'
},
'reset': {
id: 'sidepanel_title_reset',
description: 'Sidepanel title for PasswordResetView.',
defaultMessage: 'Reset Password'
}
});
export default class SidepanelView extends React.Component {
constructor(props) {
super(props);
@@ -24,44 +64,23 @@ export default class SidepanelView extends React.Component {
}
render() {
var title = null;
var avatar = false;
var onCancel = undefined;
var view = this.props.state || (this.props.myUserId ? 'contacts' : 'login');
switch (view) {
case 'login':
title = "Sign In";
break;
case 'register':
title = "Create Account";
onCancel = this.props.onCancel;
break;
case 'settings':
title = "Settings";
onCancel = this.props.onCancel;
break;
case 'edit':
title = "Edit Account";
onCancel = this.props.onCancel;
break;
case 'contacts':
title = this.props.title;
avatar = this.props.avatar ? this.props.avatar : true;
break;
case 'newtpk':
title = "Start New Chat";
onCancel = this.props.onCancel;
break;
case 'cred':
title = "Confirm Credentials";
onCancel = this.props.onCancel;
break;
case 'reset':
title = "Reset Password";
onCancel = this.props.onCancel;
break;
default:;
};
const {formatMessage} = this.props.intl;
const view = this.props.state || (this.props.myUserId ? 'contacts' : 'login');
let title, avatar;
if (view == 'contacts') {
title = this.props.title;
avatar = this.props.avatar ? this.props.avatar : true;
} else {
title = formatMessage(messages[view]);
avatar = false;
}
let onCancel;
if (view != 'login') {
onCancel = this.props.onCancel;
}
return (
<div id="sidepanel" className={this.props.hideSelf ? 'nodisplay' : null}>
<SideNavbar
src/views/tinode-web.jsx
-1
View File
@@ -3,7 +3,6 @@ import React from 'react';
import 'firebase/app';
import 'firebase/messaging';
import { FIREBASE_INIT } from '../firebase-init.json';
import Tinode from 'tinode-sdk';
src/views/validation-view.jsx
+1 -1
View File
@@ -32,7 +32,7 @@ export default class ValidationView extends React.PureComponent {
}
render() {
var methods = {'email': 'email', 'tel': 'phone'};
var methods = {'email': "email", 'tel': "phone"};
var method = methods[this.props.credMethod] || this.props.credMethod;
return (
<div className="panel-form">