diff --git a/src/components/attachment.jsx b/src/components/attachment.jsx
index 83de0a8c..1ee0331b 100644
--- a/src/components/attachment.jsx
+++ b/src/components/attachment.jsx
@@ -1,4 +1,5 @@
import React from 'react';
+
import FileProgress from './file-progress.jsx';
export default class Attachment extends React.Component {
diff --git a/src/components/avatar-upload.jsx b/src/components/avatar-upload.jsx
index 470b5059..2f3c8be2 100644
--- a/src/components/avatar-upload.jsx
+++ b/src/components/avatar-upload.jsx
@@ -1,4 +1,5 @@
import React from 'react';
+
import LetterTile from './letter-tile.jsx';
export default class AvatarUpload extends React.Component {
diff --git a/src/components/chat-message.jsx b/src/components/chat-message.jsx
index 62902ec5..fa186554 100644
--- a/src/components/chat-message.jsx
+++ b/src/components/chat-message.jsx
@@ -1,7 +1,8 @@
import React from 'react';
import {Drafty} from 'tinode-sdk'
-import LetterTile from './letter-tile.jsx'
+import Attachment from './attachment.jsx';
+import LetterTile from './letter-tile.jsx';
import ReceivedMarker from './received-marker.jsx'
/* Single message, sent or received. */
diff --git a/src/components/chip-input.jsx b/src/components/chip-input.jsx
index 9463ef29..70382cbd 100644
--- a/src/components/chip-input.jsx
+++ b/src/components/chip-input.jsx
@@ -1,5 +1,7 @@
import React from 'react';
+import Chip from './chip.jsx';
+
/* BEGIN ChipInput: group membership widget */
export default class ChipInput extends React.Component {
constructor(props) {
diff --git a/src/components/chip.jsx b/src/components/chip.jsx
index 8cb63899..0465600f 100644
--- a/src/components/chip.jsx
+++ b/src/components/chip.jsx
@@ -1,5 +1,7 @@
import React from 'react';
+import LetterTile from './letter-tile.jsx';
+
export default class Chip extends React.PureComponent {
constructor(props) {
super(props);
diff --git a/src/components/contact-list.jsx b/src/components/contact-list.jsx
index 1c7ea4de..903f98a0 100644
--- a/src/components/contact-list.jsx
+++ b/src/components/contact-list.jsx
@@ -1,4 +1,5 @@
import React from 'react';
+
import Contact from './contact.jsx';
/* ContactList: component for showing a list of contacts,
diff --git a/src/components/contacts-view.jsx b/src/components/contacts-view.jsx
index 33a37242..7d7769f0 100644
--- a/src/components/contacts-view.jsx
+++ b/src/components/contacts-view.jsx
@@ -1,6 +1,8 @@
+/* ContactsView holds all contacts-related stuff */
+
import React from 'react';
-/* ContactsView holds all contacts-related stuff */
+import ContactList from './contact-list.jsx';
export default class ContactsView extends React.Component {
constructor(props) {
diff --git a/src/components/context-menu.jsx b/src/components/context-menu.jsx
index 31485d05..e3e29772 100644
--- a/src/components/context-menu.jsx
+++ b/src/components/context-menu.jsx
@@ -1,6 +1,7 @@
+/* Context Menu: popup/dropdown menu */
+
import React from 'react';
-/* Context Menu: popup/dropdown menu */
export default class ContextMenu extends React.Component {
constructor(props) {
diff --git a/src/components/create-account-view.jsx b/src/components/create-account-view.jsx
index adb1b837..7a21c3a3 100644
--- a/src/components/create-account-view.jsx
+++ b/src/components/create-account-view.jsx
@@ -1,6 +1,10 @@
+/* Account registration */
+
import React from 'react';
-/* Account registration */
+import AvatarUpload from './avatar-upload.jsx';
+import CheckBox './checkbox.jsx';
+import VisiblePassword './visible-password.jsx';
export default class CreateAccountView extends React.PureComponent {
constructor(props) {
diff --git a/src/components/group-manager.jsx b/src/components/group-manager.jsx
index b5f5ddde..5a9272a3 100644
--- a/src/components/group-manager.jsx
+++ b/src/components/group-manager.jsx
@@ -1,6 +1,10 @@
+/* GroupMembers: control for managing a list of group members */
+
import React from 'react';
-/* GroupMembers: control for managing a list of group members */
+import ChipInput from './chip-input.jsx';
+import ContactList from './contact-list.jsx';
+
export default class GroupManager extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/group-subs.jsx b/src/components/group-subs.jsx
index bc16ddda..ef9bdd1e 100644
--- a/src/components/group-subs.jsx
+++ b/src/components/group-subs.jsx
@@ -1,6 +1,9 @@
+/* GroupSubs: a list of group subscribers currently online */
+
import React from 'react';
-/* GroupSubs: a list of group subscribers currently online */
+import LetterTile from './letter-tile.jsx';
+
export default class GroupSubs extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/in-place-edit.jsx b/src/components/in-place-edit.jsx
index bd84136f..6e63649e 100644
--- a/src/components/in-place-edit.jsx
+++ b/src/components/in-place-edit.jsx
@@ -1,7 +1,10 @@
+/* In-place text editor. Shows text with an icon
+ * which toggles it into an input field */
+
import React from 'react';
-/* BEGIN In-place text editor. Shows text with an icon
- * which toggles it into an input field */
+import VisiblePassword from './visible-password.jsx';
+
export default class InPlaceEdit extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/info-view.jsx b/src/components/info-view.jsx
index af233670..d34aac8d 100644
--- a/src/components/info-view.jsx
+++ b/src/components/info-view.jsx
@@ -1,6 +1,17 @@
+/* InfoView: panel with topic/user info */
+
import React from 'react';
-/* InfoView: panel with topic/user info */
+import AvatarUpload from './avatar-upload.jsx';
+import ContactList from './contact-list.jsx';
+import GroupManager from './group-manager.jsx';
+import InPlaceEdit from './in-place-edit.jsx';
+import MenuCancel from './menu-cancel.jsx';
+import MoreButton from './more-button.jsx';
+import PermissionsEditor from './permissions-editor.jsx';
+import TagManager from './tag-manager.jsx';
+
+
export default class InfoView extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/letter-tile.jsx b/src/components/letter-tile.jsx
index d8b53439..0facdf53 100644
--- a/src/components/letter-tile.jsx
+++ b/src/components/letter-tile.jsx
@@ -1,5 +1,7 @@
import React from 'react';
+import Tinode from 'tinode-sdk';
+
export default class LetterTile extends React.PureComponent {
render() {
let avatar;
diff --git a/src/components/login-view.jsx b/src/components/login-view.jsx
index ff13b9b3..9f28696e 100644
--- a/src/components/login-view.jsx
+++ b/src/components/login-view.jsx
@@ -1,6 +1,11 @@
+// Login form
+
import React from 'react';
+import {FormattedMessage} from 'react-intl';
+
+import CheckBox from './checkbox.jsx';
+import VisiblePassword from './visible-password.jsx';
-/* BEGIN Login: a login form */
export default class LoginView extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/logo-view.jsx b/src/components/logo-view.jsx
index d284f968..ac7c37bb 100644
--- a/src/components/logo-view.jsx
+++ b/src/components/logo-view.jsx
@@ -1,6 +1,7 @@
+/* This is just a static page to display when no conversation is selected. */
+
import React from 'react';
-/* This is just a static page to display when no conversation is selected. */
export default class LogoView extends React.PureComponent {
render() {
var version = APP_NAME + ' (' + Tinode.getLibrary() + ')';
diff --git a/src/components/menu-cancel.jsx b/src/components/menu-cancel.jsx
index f2309d70..d4f59003 100644
--- a/src/components/menu-cancel.jsx
+++ b/src/components/menu-cancel.jsx
@@ -1,6 +1,7 @@
+// The X menu to be displayed in title bars.
+
import React from 'react';
-/* The X menu to be displayed in title bars */
export default class MenuCancel extends React.PureComponent {
constructor(props) {
super(props);
diff --git a/src/components/messages-view.jsx b/src/components/messages-view.jsx
index 74701b14..d09dc48f 100644
--- a/src/components/messages-view.jsx
+++ b/src/components/messages-view.jsx
@@ -1,5 +1,14 @@
import React from 'react';
+import ChatMessage from './chat-message.jsx';
+import ErrorPanel from './error-panel.jsx';
+import GroupSubs from './group-subs.jsx';
+import ImagePreview from './image-preview.jsx';
+import LetterTile from './letter-tile.jsx';
+import LoadSpinner from './load-spinner.jsx';
+import LogoView from './logo-view.jsx';
+import SendMessage from './send-message.jsx';
+
const NOT_FOUND_TOPIC_TITLE = "Not found";
export default class MessagesView extends React.Component {
diff --git a/src/components/more-button.jsx b/src/components/more-button.jsx
index 0487e270..38668f0d 100644
--- a/src/components/more-button.jsx
+++ b/src/components/more-button.jsx
@@ -1,6 +1,7 @@
+// Toggle [Title text >] -> [Title text v]
+
import React from 'react';
-// Toggle [Title text >] -> [Title text v]
export default class MoreButton extends React.PureComponent {
constructor(props) {
super(props);
diff --git a/src/components/new-topic-group.jsx b/src/components/new-topic-group.jsx
index 1baf9840..59fa1043 100644
--- a/src/components/new-topic-group.jsx
+++ b/src/components/new-topic-group.jsx
@@ -1,5 +1,8 @@
import React from 'react';
+import AvatarUpload from './avatar-upload.jsx';
+import TagManager from './tag-manager.jsx';
+
export default class NewTopicGroup extends React.PureComponent {
constructor(props) {
super(props);
diff --git a/src/components/new-topic-view.jsx b/src/components/new-topic-view.jsx
index b0656c52..9a684ff4 100644
--- a/src/components/new-topic-view.jsx
+++ b/src/components/new-topic-view.jsx
@@ -1,6 +1,11 @@
+/* Create new topic and invite users or send an invite */
+
import React from 'react';
-/* Create new topic and invite users or send an invite */
+import ContactList from './contact-list.jsx';
+import NewTopicById from './new-topic-by-id.jsx';
+import NewTopicGroup from './new-topic-group.jsx';
+import SearchContacts from './search-contacts.jsx';
export default class NewTopicView extends React.Component {
constructor(props) {
diff --git a/src/components/permissions-editor.jsx b/src/components/permissions-editor.jsx
index 4a68d52a..601293d0 100644
--- a/src/components/permissions-editor.jsx
+++ b/src/components/permissions-editor.jsx
@@ -1,7 +1,10 @@
+// PermissionsEditor: Component for editing permissions
+//
+
import React from 'react';
-/* BEGIN PermissionsEditor: Component for editing permissions */
-//
+import CheckBox from './checkbox.jsx';
+
export default class PermissionsEditor extends React.Component {
constructor(props) {
super(props);
@@ -105,4 +108,3 @@ export default class PermissionsEditor extends React.Component {
);
}
};
-/* END PermissionsEditor */
diff --git a/src/components/received-marker.jsx b/src/components/received-marker.jsx
index 807888d8..aa235aa8 100644
--- a/src/components/received-marker.jsx
+++ b/src/components/received-marker.jsx
@@ -1,6 +1,9 @@
+// Received/read indicator.
+
import React from 'react';
-/* Received/read indicator */
+import Tinode from 'tinode-sdk';
+
export default class ReceivedMarker extends React.PureComponent {
render() {
let timestamp;
diff --git a/src/components/send-message.jsx b/src/components/send-message.jsx
index 164c637d..a82acf66 100644
--- a/src/components/send-message.jsx
+++ b/src/components/send-message.jsx
@@ -1,6 +1,7 @@
+// Send message form.
+
import React from 'react';
-/* Send message form */
export default class SendMessage extends React.PureComponent {
constructor(props) {
super(props);
diff --git a/src/components/settings-view.jsx b/src/components/settings-view.jsx
index 8bc07d5e..491a0da8 100644
--- a/src/components/settings-view.jsx
+++ b/src/components/settings-view.jsx
@@ -1,6 +1,8 @@
+// Tinode config panel.
import React from 'react';
-/* Tinode config panel */
+import HostSelector from './host-selector.jsx';
+
export default class SettingsView extends React.PureComponent {
constructor(props) {
super(props);
diff --git a/src/components/side-navbar.jsx b/src/components/side-navbar.jsx
index 677e9aa3..444f5d8a 100644
--- a/src/components/side-navbar.jsx
+++ b/src/components/side-navbar.jsx
@@ -1,5 +1,9 @@
import React from 'react';
+import LetterTile from './letter-tile.jsx';
+import MenuCancel from './menu-cancel.jsx';
+import MenuContacts from './menu-contacts.jsx';
+import MenuStart from './menu-start.jsx';
export default class SideNavbar extends React.PureComponent {
render() {
diff --git a/src/components/sidepanel-view.jsx b/src/components/sidepanel-view.jsx
index 5e4b9a0d..6783c883 100644
--- a/src/components/sidepanel-view.jsx
+++ b/src/components/sidepanel-view.jsx
@@ -1,5 +1,16 @@
import React from 'react';
+import ContactsView from './contacts-view.jsx';
+import CreateAccountView from './create-account-view.jsx';
+import EditAccountView from './edit-account-view.jsx';
+import ErrorPanel from './error-panel.jsx';
+import LoginView from './login-view.jsx';
+import NewTopicView from './new-topic-view.jsx';
+import PasswordResetView from './password-reset-view.jsx';
+import SettingsView from './settings-view.jsx';
+import SideNavbar from './side-navbar.jsx';
+import ValidationView from './validation-view.jsx';
+
export default class SidepanelView extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/tag-manager.jsx b/src/components/tag-manager.jsx
index 75eeec8e..d1c47346 100644
--- a/src/components/tag-manager.jsx
+++ b/src/components/tag-manager.jsx
@@ -1,7 +1,8 @@
+// TagManager: edit topic or user tags.
import React from 'react';
+import ChipInput from './chip-input.jsx';
-/* TagManager: edit topic or user tags */
export default class TagManager extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/tinode-web.jsx b/src/components/tinode-web.jsx
index 5adcbc9a..f61d0de2 100644
--- a/src/components/tinode-web.jsx
+++ b/src/components/tinode-web.jsx
@@ -1,6 +1,11 @@
+// The top-level class to hold all functionality together.
import React from 'react';
-/* The top-level class to hold all functionality together */
+import ContextMenu from './context-menu.jsx';
+import InfoView from './info-view.jsx';
+import MessagesView from './messages-view.jsx';
+import SidepanelView from './sidepanel-view.jsx';
+
export default class TinodeWeb extends React.Component {
constructor(props) {
super(props);
diff --git a/src/components/unread-badge.jsx b/src/components/unread-badge.jsx
index e7f5d767..4a0043a6 100644
--- a/src/components/unread-badge.jsx
+++ b/src/components/unread-badge.jsx
@@ -1,6 +1,7 @@
+// The counter of unread messages in the topic.
+
import React from 'react';
-/* The counter of unread messages in the topic */
export default class UnreadBadge extends React.PureComponent {
render() {
var showUnreadBadge = null;
diff --git a/src/components/validation-view.jsx b/src/components/validation-view.jsx
index c223dd94..7948a571 100644
--- a/src/components/validation-view.jsx
+++ b/src/components/validation-view.jsx
@@ -1,6 +1,6 @@
+// ValidationView: panel for confirming credentials, like email or phone.
import React from 'react';
-/* ValidationView: panel for confirming credentials, like email or phone */
export default class ValidationView extends React.PureComponent {
constructor(props) {
super(props);
diff --git a/src/components/visible-password.jsx b/src/components/visible-password.jsx
index f5289612..e7fa139c 100644
--- a/src/components/visible-password.jsx
+++ b/src/components/visible-password.jsx
@@ -1,6 +1,6 @@
+// Password with a visiblity toggle.
import React from 'react';
-// Password with a visiblity toggle
export default class VisiblePassword extends React.PureComponent {
constructor(props) {
super(props);