make part of text2 clickable!

[hamzafarooq-10P]

I have encountered a problem where i want to make some part of text2 prop pressable, like a hyperlink.

I was wondering if there is any way to achieve?

[bvechiato]

You can do this by creating your custom toast.

For example,

export const toastConfig = {
	clickableToast: ({ text1, text2, props }) => (
	    <View>
	      <Text>{text1}</Text>
	      <Text onPress={props.onPressText2}>{text2}</Text>
	    </View>
	  )
}

Or

export const toastConfig = {
	clickableToast: ({ text1, text2, props }) => (
	    <View>
	      <Text>{text1}</Text>
	      <Text>{text2}</Text>
	
	      {props.buttonText && props.handleClick && (
	        <TouchableOpacity onPress={props.handleClick}>
	          <Text>{props.buttonText}</Text>
	        </TouchableOpacity>
	      )}
	    </View>
	  )
}

Then, when you want to show it

Toast.show({
	type: "clickableToast",
	text1: "",
	text2: "",
	props: {
		// onPressText2: () => {}
		buttonText: "",
		handleClick: () => {},
	}
})