diff options
-rw-r--r-- | web/react/pages/channel.jsx | 144 | ||||
-rw-r--r-- | web/templates/channel.html | 20 |
2 files changed, 71 insertions, 93 deletions
diff --git a/web/react/pages/channel.jsx b/web/react/pages/channel.jsx index ffe232ab6..37c59b75f 100644 --- a/web/react/pages/channel.jsx +++ b/web/react/pages/channel.jsx @@ -5,6 +5,7 @@ import ChannelView from '../components/channel_view.jsx'; import ChannelLoader from '../components/channel_loader.jsx'; import ErrorBar from '../components/error_bar.jsx'; import ErrorStore from '../stores/error_store.jsx'; +import * as Client from '../utils/client.jsx'; import GetTeamInviteLinkModal from '../components/get_team_invite_link_modal.jsx'; import RenameChannelModal from '../components/rename_channel_modal.jsx'; @@ -26,13 +27,79 @@ import * as EventHelpers from '../dispatcher/event_helpers.jsx'; import Constants from '../utils/constants.jsx'; +var IntlProvider = ReactIntl.IntlProvider; + +class Root extends React.Component { + constructor() { + super(); + this.state = { + translations: null, + loaded: false + }; + } + + static propTypes() { + return { + map: React.PropTypes.object.isRequired + }; + } + + componentWillMount() { + Client.getTranslations( + this.props.map.Locale, + (data) => { + this.setState({ + translations: data, + loaded: true + }); + }, + () => { + this.setState({ + loaded: true + }); + } + ); + } + + render() { + if (!this.state.loaded) { + return <div></div>; + } + + return ( + <IntlProvider + locale={this.props.map.Locale} + messages={this.state.translations} + > + <div className='channel-view'> + <ChannelLoader/> + <ErrorBar/> + <ChannelView/> + + <GetTeamInviteLinkModal /> + <InviteMemberModal /> + <ImportThemeModal /> + <TeamSettingsModal /> + <RenameChannelModal /> + <MoreChannelsModal /> + <EditPostModal /> + <DeletePostModal /> + <PostDeletedModal /> + <RemovedFromChannelModal /> + <RegisterAppModal /> + </div> + </IntlProvider> + ); + } +} + function onPreferenceChange() { const selectedFont = PreferenceStore.get(Constants.Preferences.CATEGORY_DISPLAY_SETTINGS, 'selected_font', Constants.DEFAULT_FONT); Utils.applyFont(selectedFont); PreferenceStore.removeChangeListener(onPreferenceChange); } -function setupChannelPage(props, team, channel) { +global.window.setup_channel_page = function setup(props, team, channel) { if (props.PostId === '') { EventHelpers.emitChannelClickEvent(channel); } else { @@ -42,84 +109,13 @@ function setupChannelPage(props, team, channel) { PreferenceStore.addChangeListener(onPreferenceChange); AsyncClient.getAllPreferences(); - // ChannelLoader must be rendered first - ReactDOM.render( - <ChannelLoader/>, - document.getElementById('channel_loader') - ); - ReactDOM.render( - <ErrorBar/>, - document.getElementById('error_bar') - ); - - ReactDOM.render( - <ChannelView/>, + <Root map={props} />, document.getElementById('channel_view') ); - // - // Modals - // - ReactDOM.render( - <GetTeamInviteLinkModal />, - document.getElementById('get_team_invite_link_modal') - ); - - ReactDOM.render( - <InviteMemberModal />, - document.getElementById('invite_member_modal') - ); - - ReactDOM.render( - <ImportThemeModal />, - document.getElementById('import_theme_modal') - ); - - ReactDOM.render( - <TeamSettingsModal />, - document.getElementById('team_settings_modal') - ); - - ReactDOM.render( - <RenameChannelModal />, - document.getElementById('rename_channel_modal') - ); - - ReactDOM.render( - <MoreChannelsModal />, - document.getElementById('more_channels_modal') - ); - - ReactDOM.render( - <EditPostModal />, - document.getElementById('edit_post_modal') - ); - - ReactDOM.render( - <DeletePostModal />, - document.getElementById('delete_post_modal') - ); - - ReactDOM.render( - <PostDeletedModal />, - document.getElementById('post_deleted_modal') - ); - - ReactDOM.render( - <RemovedFromChannelModal />, - document.getElementById('removed_from_channel_modal') - ); - - ReactDOM.render( - <RegisterAppModal />, - document.getElementById('register_app_modal') - ); - if (global.window.mm_config.SendEmailNotifications === 'false') { ErrorStore.storeLastError({message: 'Preview Mode: Email notifications have not been configured'}); ErrorStore.emitChange(); } -} - -global.window.setup_channel_page = setupChannelPage; +};
\ No newline at end of file diff --git a/web/templates/channel.html b/web/templates/channel.html index 8abbe36df..dcc50115b 100644 --- a/web/templates/channel.html +++ b/web/templates/channel.html @@ -4,25 +4,7 @@ <html> {{template "head" . }} <body> - <div id="error_bar"></div> - <div id="channel_view" class="channel-view"></div> - <div id="channel_loader"></div> - <div id="post_mention_tab"></div> - <div id="reply_mention_tab"></div> - <div id="edit_mention_tab"></div> - <div id="get_team_invite_link_modal"></div> - <div id="import_theme_modal"></div> - <div id="team_settings_modal"></div> - <div id="invite_member_modal"></div> - <div id="rename_channel_modal"></div> - <div id="edit_post_modal"></div> - <div id="delete_post_modal"></div> - <div id="more_channels_modal"></div> - <div id="post_deleted_modal"></div> - <div id="channel_notifications_modal"></div> - <div id="team_members_modal"></div> - <div id="removed_from_channel_modal"></div> - <div id="register_app_modal"></div> + <div id="channel_view" class='channel-view'></div> <script> window.setup_channel_page({{ .Props }}, {{ .Team }}, {{ .Channel }}, {{ .User }}); $('body').tooltip( {selector: '[data-toggle=tooltip]'} ); |