45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import { observer } from 'mobx-react-lite'
|
|
import { AppState } from '@/UIModels/AppState'
|
|
import { WebApplication } from '@/UIModels/Application'
|
|
import { User as UserType } from '@standardnotes/snjs'
|
|
|
|
type Props = {
|
|
appState: AppState
|
|
application: WebApplication
|
|
}
|
|
|
|
const User = ({ appState, application }: Props) => {
|
|
const { server } = appState.accountMenu
|
|
const user = application.getUser() as UserType
|
|
|
|
return (
|
|
<div className="sk-panel-section">
|
|
{appState.sync.errorMessage && (
|
|
<div className="sk-notification danger">
|
|
<div className="sk-notification-title">Sync Unreachable</div>
|
|
<div className="sk-notification-text">
|
|
Hmm...we can't seem to sync your account. The reason: {appState.sync.errorMessage}
|
|
</div>
|
|
<a
|
|
className="sk-a info-contrast sk-bold sk-panel-row"
|
|
href="https://standardnotes.com/help"
|
|
rel="noopener"
|
|
target="_blank"
|
|
>
|
|
Need help?
|
|
</a>
|
|
</div>
|
|
)}
|
|
<div className="sk-panel-row">
|
|
<div className="sk-panel-column">
|
|
<div className="sk-h1 sk-bold wrap">{user.email}</div>
|
|
<div className="sk-subtitle neutral">{server}</div>
|
|
</div>
|
|
</div>
|
|
<div className="sk-panel-row" />
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default observer(User)
|