diff options
| author | Abdullah Ahmed <abdullah_ahmed@brown.edu> | 2019-10-19 14:41:16 -0400 |
|---|---|---|
| committer | Abdullah Ahmed <abdullah_ahmed@brown.edu> | 2019-10-19 14:41:16 -0400 |
| commit | 1a8292f7588880718a657a5fca5c32f1a5975205 (patch) | |
| tree | 216639d9d5387ba2563b37b169c678301d671b15 /src/client/views/MainViewNotifs.tsx | |
| parent | 5e04d7f94d180dc984e48eca888ac2cedfd0c7a3 (diff) | |
| parent | 3d910bae8771e67cabc1500c49b77d425fdf62e9 (diff) | |
merged
Diffstat (limited to 'src/client/views/MainViewNotifs.tsx')
| -rw-r--r-- | src/client/views/MainViewNotifs.tsx | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/src/client/views/MainViewNotifs.tsx b/src/client/views/MainViewNotifs.tsx new file mode 100644 index 000000000..09fa1cb0c --- /dev/null +++ b/src/client/views/MainViewNotifs.tsx @@ -0,0 +1,32 @@ +import { action, computed, observable } from 'mobx'; +import { observer } from 'mobx-react'; +import "normalize.css"; +import * as React from 'react'; +import { Doc, DocListCast, Opt } from '../../new_fields/Doc'; +import { emptyFunction } from '../../Utils'; +import { SetupDrag } from '../util/DragManager'; +import "./MainViewNotifs.scss"; +import { CollectionDockingView } from './collections/CollectionDockingView'; + + +@observer +export class MainViewNotifs extends React.Component { + + @observable static NotifsCol: Opt<Doc>; + openNotifsCol = () => { + if (MainViewNotifs.NotifsCol) { + CollectionDockingView.AddRightSplit(MainViewNotifs.NotifsCol, undefined); + } + } + render() { + const length = MainViewNotifs.NotifsCol ? DocListCast(MainViewNotifs.NotifsCol.data).length : 0; + const notifsRef = React.createRef<HTMLDivElement>(); + const dragNotifs = action(() => MainViewNotifs.NotifsCol!); + return <div className="mainNotifs-container" ref={notifsRef}> + <button className="mainNotifs-badge" style={length > 0 ? { "display": "initial" } : { "display": "none" }} + onClick={this.openNotifsCol} onPointerDown={MainViewNotifs.NotifsCol ? SetupDrag(notifsRef, dragNotifs) : emptyFunction}> + {length} + </button> + </div>; + } +} |
