fix: Migrate to render-html package

.gitignore

@@ -29,7 +29,7 @@ yarn-error.*
 *.pem
 
 # local env files
-.env*.local
+.env*
 
 # typescript
 *.tsbuildinfo

package.json

@@ -24,10 +24,10 @@
     "native-base": "^3.4.28",
     "react": "18.2.0",
     "react-hook-form": "^7.45.2",
-    "react-native": "0.72.3",
+    "react-native": "0.72.4",
     "react-native-confetti": "^0.1.0",
     "react-native-gesture-handler": "~2.12.0",
-    "react-native-htmlview": "^0.16.0",
+    "react-native-render-html": "^6.3.4",
     "react-native-safe-area-context": "4.6.3",
     "react-native-screens": "~3.22.0",
     "react-native-svg": "13.9.0",

src/modules/events/EventDetail.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Linking, StyleSheet, ScrollView, Text, Platform, View, Image, TouchableOpacity } from 'react-native';
-import HTMLView from 'react-native-htmlview';
+import { Linking, StyleSheet, ScrollView, Text, Platform, View, Image, TouchableOpacity, useWindowDimensions } from 'react-native';
+import RenderHtml from 'react-native-render-html';
 import moment from 'moment';
 import { Icon } from 'native-base';
 
@@ -147,7 +147,9 @@ const EventDetail = ({
   route: {
     params: { event },
   },
-}) => (
+}) => {
+  const { width } = useWindowDimensions();
+  return (
   <ScrollView>
     {event.thumbnail.medium_large && <Image source={{ uri: event.thumbnail.medium_large }} style={styles.image} />}
     <View style={styles.card}>
@@ -190,10 +192,10 @@ const EventDetail = ({
       </TouchableOpacity>
       <PriceAndTicket event={event} />
       <FaceButton event={event} />
-      <HTMLView style={styles.content} stylesheet={HTMLStyles} value={event.content.rendered} />
+      <RenderHtml contentWidth={width} source={{html:event.content.rendered}} />
     </View>
-  </ScrollView>
-);
+  </ScrollView>)
+};
 
 export default EventDetail;