3ae821d2e8
* Refactor websockets state and lifecycle This PR moves the state of the authentication and subscriptions to the websockets client, allowing for multiple components to communicate with it and request subscriptions independently. With this change, the lifecycle of the websockets client is now managed on a component, and a hook is provided for easy access to it from individual components. * Fix linter * Integrating the new websockets in channels integration with the RHS and board selector * Some small fixes around boards-channels relationship * Make the boards unfurl to always use the current team * Fixing weird behaviors in websockets and other small data related bugs in channel-board relationship * Only warn if withWebSockets is used without a base connection * Fix tests * Fix linter * Update snapshot * Fixing plugin tests Co-authored-by: Jesús Espino <jespinog@gmail.com>
63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
import React, {useEffect} from 'react'
|
|
import {IntlProvider} from 'react-intl'
|
|
import {DndProvider} from 'react-dnd'
|
|
import {HTML5Backend} from 'react-dnd-html5-backend'
|
|
import {TouchBackend} from 'react-dnd-touch-backend'
|
|
import {History} from 'history'
|
|
|
|
import TelemetryClient from './telemetry/telemetryClient'
|
|
|
|
import {getMessages} from './i18n'
|
|
import {FlashMessages} from './components/flashMessages'
|
|
import NewVersionBanner from './components/newVersionBanner'
|
|
import {Utils} from './utils'
|
|
import {fetchMe, getMe} from './store/users'
|
|
import {getLanguage, fetchLanguage} from './store/language'
|
|
import {useAppSelector, useAppDispatch} from './store/hooks'
|
|
import {fetchClientConfig} from './store/clientConfig'
|
|
import FocalboardRouter from './router'
|
|
|
|
import {IUser} from './user'
|
|
|
|
type Props = {
|
|
history?: History<unknown>
|
|
}
|
|
|
|
const App = (props: Props): JSX.Element => {
|
|
const language = useAppSelector<string>(getLanguage)
|
|
const me = useAppSelector<IUser|null>(getMe)
|
|
const dispatch = useAppDispatch()
|
|
|
|
useEffect(() => {
|
|
dispatch(fetchLanguage())
|
|
dispatch(fetchMe())
|
|
dispatch(fetchClientConfig())
|
|
}, [])
|
|
|
|
useEffect(() => {
|
|
if (me) {
|
|
TelemetryClient.setUser(me)
|
|
}
|
|
}, [me])
|
|
|
|
return (
|
|
<IntlProvider
|
|
locale={language.split(/[_]/)[0]}
|
|
messages={getMessages(language)}
|
|
>
|
|
<DndProvider backend={Utils.isMobile() ? TouchBackend : HTML5Backend}>
|
|
<FlashMessages milliseconds={2000}/>
|
|
<div id='frame'>
|
|
<div id='main'>
|
|
<NewVersionBanner/>
|
|
<FocalboardRouter history={props.history}/>
|
|
</div>
|
|
</div>
|
|
</DndProvider>
|
|
</IntlProvider>
|
|
)
|
|
}
|
|
|
|
export default React.memo(App)
|