Example of an Alert/Prompt like component for React Native

reactNativeAlert.js

import * as React from 'react';
import {View} from "react-native";
import {Text, IconButton} from "react-native-paper";

const Alert = ({severity, message}) => {

  let msg = message === undefined || message === null ? 'undefined' : message;
  let svt;
  let icon;
  let border;
  switch (severity) {
    case 'error':
      svt = 'mistyrose';
      icon = 'alert-circle-outline';
      border = 'darkred'
      break;
    case 'warning':
      svt = 'lightyellow';
      icon = 'alert-outline';
      border = 'goldenrod'
      break;
    case 'info':
      svt = 'lightcyan';
      icon = 'information-outline';
      border = 'darkblue'
      break;
    case 'success':
      svt = 'honeydew';
      icon = 'checkbox-marked-circle-outline';
      border = 'green'
      break;
    default:
      svt = 'papayawhip';
      icon = 'help-circle-outline';
      border = 'darkorange';
  }

  return(
    <View style={{flex: 1, flexDirection: 'row', alignItems: 'center', justifyContent: 'center'}}>
      <View style={{flex: 0.7, flexDirection: 'row', alignItems:'center', backgroundColor: 'white', borderColor: border, borderWidth: 1, padding:5, borderRadius:10}}>
        <IconButton icon={icon} color={border} disabled={true} style={{flex: 0.1}}/>
        <Text style={{flex: 0.9, color:'gray'}}>{msg}</Text>
      </View>
    </View>
  )
}

const MyComponent = () => {
  return (
    <View style={{flex:1}}>
      <Alert severity={'error'} message={'Aenean ullamcorper placerat sapien, vitae tempor eros euismod eget.'}/>
      <Alert severity={''} message={'In sodales metus dictum felis facilisis elementum.'}/>
      <Alert severity={'warning'} message={'Morbi metus enim, sodales quis sem quis, finibus blandit ipsum.'}/>
      <Alert severity={'success'} message={'Pellentesque eget lacus a sapien imperdiet porta.'}/>
      <Alert severity={'info'} message={'Nulla facilisi.'}/>
    </View>
  )
}

export default MyComponent;