You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

AbstractNotification.js 4.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. // @flow
  2. import { Component } from 'react';
  3. import { NOTIFICATION_TYPE } from '../constants';
  4. export type Props = {
  5. /**
  6. * Display appearance for the component, passed directly to the
  7. * notification.
  8. */
  9. appearance: string,
  10. /**
  11. * Whether or not the title and description should be concatenated.
  12. */
  13. concatText?: boolean,
  14. /**
  15. * Callback invoked when the custom button is clicked.
  16. */
  17. customActionHandler: Function[],
  18. /**
  19. * The text to display as button in the notification for the custom action.
  20. */
  21. customActionNameKey: string[],
  22. /**
  23. * The type of button.
  24. */
  25. customActionType: ?string[],
  26. /**
  27. * The text to display in the body of the notification. If not passed
  28. * in, the passed in descriptionKey will be used.
  29. */
  30. defaultTitleKey: string,
  31. /**
  32. * A description string that can be used in addition to the prop
  33. * descriptionKey.
  34. */
  35. description: string,
  36. /**
  37. * The translation arguments that may be necessary for the description.
  38. */
  39. descriptionArguments: Object,
  40. /**
  41. * The translation key to use as the body of the notification.
  42. */
  43. descriptionKey: string,
  44. /**
  45. * Whether the support link should be hidden in the case of an error
  46. * message.
  47. */
  48. hideErrorSupportLink: boolean,
  49. /**
  50. * The type of icon to be displayed. If not passed in, the appearance
  51. * type will be used.
  52. */
  53. icon?: String,
  54. /**
  55. * Maximum lines of the description.
  56. */
  57. maxLines: ?number,
  58. /**
  59. * Callback invoked when the user clicks to dismiss the notification.
  60. */
  61. onDismissed: Function,
  62. /**
  63. * Invoked to obtain translated strings.
  64. */
  65. t: Function,
  66. /**
  67. * The text to display at the top of the notification. If not passed in,
  68. * the passed in titleKey will be used.
  69. */
  70. title: string,
  71. /**
  72. * The translation arguments that may be necessary for the title.
  73. */
  74. titleArguments: Object,
  75. /**
  76. * The translation key to display as the title of the notification if
  77. * no title is provided.
  78. */
  79. titleKey: string,
  80. /**
  81. * The unique identifier for the notification.
  82. */
  83. uid: string
  84. };
  85. /**
  86. * Abstract class for {@code Notification} component.
  87. *
  88. * @augments Component
  89. */
  90. export default class AbstractNotification<P: Props> extends Component<P> {
  91. /**
  92. * Default values for {@code Notification} component's properties.
  93. *
  94. * @static
  95. */
  96. static defaultProps = {
  97. appearance: NOTIFICATION_TYPE.NORMAL
  98. };
  99. /**
  100. * Initializes a new {@code Notification} instance.
  101. *
  102. * @param {Object} props - The read-only properties with which the new
  103. * instance is to be initialized.
  104. */
  105. constructor(props: P) {
  106. super(props);
  107. // Bind event handler so it is only bound once for every instance.
  108. this._onDismissed = this._onDismissed.bind(this);
  109. }
  110. _getDescription: () => Array<string>;
  111. /**
  112. * Returns the description array to be displayed.
  113. *
  114. * @protected
  115. * @returns {Array<string>}
  116. */
  117. _getDescription() {
  118. const {
  119. description,
  120. descriptionArguments,
  121. descriptionKey,
  122. t
  123. } = this.props;
  124. const descriptionArray = [];
  125. descriptionKey
  126. && descriptionArray.push(t(descriptionKey, descriptionArguments));
  127. description && descriptionArray.push(description);
  128. return descriptionArray;
  129. }
  130. _getDescriptionKey: () => string;
  131. /**
  132. * Returns the description key that was used if any.
  133. *
  134. * @protected
  135. * @returns {string}
  136. */
  137. _getDescriptionKey() {
  138. return this.props.descriptionKey;
  139. }
  140. _onDismissed: () => void;
  141. /**
  142. * Callback to dismiss the notification.
  143. *
  144. * @private
  145. * @returns {void}
  146. */
  147. _onDismissed() {
  148. this.props.onDismissed(this.props.uid);
  149. }
  150. }