Home Reference Source

src/views/journal/components/NotificationText.js

import React from 'react';
import {StyleSheet, Text} from 'react-native';

import {NotificationType} from '../../../utils/NotificationConstants';
import {UIColors} from '../../../utils/ColorConstants';

/**
 * Component displaying a notification message. The style (color) depends on
 * the type of notification.
 * @param {Object} props - Properties
 * @param {string} props.value - Text of the notification
 * @param {NotificationType} props.type - Type of notification
 * @returns {Object}
 */
export default function NotificationText(props) {
    // Retrieve props
    const value = props.value;
    const type = props.type;

    // Set style
    let style = [styles.notification];
    switch (type) {
        case NotificationType.CONFIRMATION:
            style.push(styles.confirmation);
            break;
        case NotificationType.ERROR:
            style.push(styles.error);
            break;
        default:
            style.push[styles.default];
    }

    return <Text style={style}>{value}</Text>;
}

/** Local styles */
const styles = StyleSheet.create({
    notification: {
        width: '100%',
        lineHeight: 20,
        fontSize: 15,
        textAlign: 'center',
    },
    default: {
        color: UIColors.NORMAL,
    },
    confirmation: {
        marginTop: 2,
        color: UIColors.CONFIRMATION,
    },
    error: {
        color: UIColors.ERROR,
    },
    confirmation: {
        marginTop: 2,
        color: UIColors.CONFIRMATION,
    },
});