/
MosaicZeroState.tsx
58 lines (51 loc) · 1.88 KB
/
MosaicZeroState.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
import classNames from 'classnames';
import noop from 'lodash/noop';
import React from 'react';
import { MosaicActionsPropType, MosaicContext } from './contextTypes';
import { CreateNode, MosaicKey } from './types';
import { OptionalBlueprint } from './util/OptionalBlueprint';
export interface MosaicZeroStateProps<T extends MosaicKey> {
createNode?: CreateNode<T>;
}
export class MosaicZeroState<T extends MosaicKey> extends React.PureComponent<MosaicZeroStateProps<T>> {
context!: MosaicContext<T>;
static contextTypes = {
mosaicActions: MosaicActionsPropType,
};
render() {
return (
<div className={classNames('mosaic-zero-state', OptionalBlueprint.getClasses('NON_IDEAL_STATE'))}>
<div className={OptionalBlueprint.getClasses('NON_IDEAL_STATE_VISUAL')}>
<OptionalBlueprint.Icon iconSize={120} icon="applications" />
</div>
<h4 className={OptionalBlueprint.getClasses('HEADING')}>No Windows Present</h4>
<div>
{this.props.createNode && (
<button
className={classNames(OptionalBlueprint.getClasses('BUTTON'), OptionalBlueprint.getIconClass('ADD'))}
onClick={this.replace}
>
Add New Window
</button>
)}
</div>
</div>
);
}
private replace = () =>
Promise.resolve(this.props.createNode!())
.then((node) => this.context.mosaicActions.replaceWith([], node))
.catch(noop); // Swallow rejections (i.e. on user cancel)
}
// Factory that works with generics
export function MosaicZeroStateFactory<T extends MosaicKey>(
props?: MosaicZeroStateProps<T> & React.Attributes,
...children: React.ReactNode[]
) {
const element: React.ReactElement<MosaicZeroStateProps<T>> = React.createElement(
MosaicZeroState as React.ComponentClass<MosaicZeroStateProps<T>>,
props,
...children,
);
return element;
}