1import * as React from 'react'
2import * as Kb from '../../../../common-adapters'
3import * as Container from '../../../../util/container'
4import * as Styles from '../../../../styles'
5import {RetentionPolicy} from '../../../../constants/types/retention-policy'
6
7export type Props = {
8  canChange: boolean
9  explanation?: string
10  measure?: () => void
11  onChange: () => void
12  policy: RetentionPolicy
13  teamPolicy: RetentionPolicy
14}
15
16const RetentionNotice = (props: Props) => {
17  Container.useDepChangeEffect(() => {
18    props.measure && props.measure()
19  }, [props.canChange, props.policy, props.teamPolicy])
20
21  const iconType =
22    props.policy.type === 'explode' ||
23    (props.policy.type === 'inherit' && props.teamPolicy.type === 'explode')
24      ? 'iconfont-bomb-solid'
25      : 'iconfont-timer-solid'
26
27  return (
28    <Kb.Box style={styles.container}>
29      <Kb.Box style={styles.iconBox}>
30        <Kb.Icon color={Styles.globalColors.black_20} fontSize={20} type={iconType} />
31      </Kb.Box>
32      {!!props.explanation && (
33        <Kb.Text center={true} type="BodySmallSemibold">
34          {props.explanation}
35        </Kb.Text>
36      )}
37      {props.canChange && (
38        <Kb.Text
39          type="BodySmallSemiboldPrimaryLink"
40          style={{color: Styles.globalColors.blueDark}}
41          onClick={props.onChange}
42        >
43          Change this
44        </Kb.Text>
45      )}
46    </Kb.Box>
47  )
48}
49export default RetentionNotice
50
51const styles = Styles.styleSheetCreate(
52  () =>
53    ({
54      container: {
55        ...Styles.globalStyles.flexBoxColumn,
56        alignItems: 'center',
57        backgroundColor: Styles.globalColors.blueLighter3,
58        paddingBottom: Styles.globalMargins.small,
59        paddingLeft: Styles.globalMargins.medium,
60        paddingRight: Styles.globalMargins.medium,
61        paddingTop: Styles.globalMargins.small,
62        width: '100%',
63      },
64      iconBox: {
65        marginBottom: Styles.globalMargins.xtiny,
66      },
67    } as const)
68)
69