feat: add View Hierarchy and Replies state management screens

- Introduced `ViewHierarchyScreen` and `RepliesStateScreen` for managing respective states.
- Updated `HomeStack` to include new screens in navigation.
- Enhanced `BugReportingScreen` with options to navigate to the new screens and manage their states.
- Added state management for enabling/disabling View Hierarchy and Replies features.

Author: MoKamall

examples/default/src/navigation/HomeStack.tsx

@@ -23,6 +23,14 @@ import {
   InvocationOptionsScreen,
   type InvocationOptionsScreenProp,
 } from '../screens/bug-reporting/InvocationOptionsScreen';
+import {
+  ViewHierarchyScreen,
+  type ViewHierarchyScreenProp,
+} from '../screens/bug-reporting/ViewHierarchyScreen';
+import {
+  RepliesStateScreen,
+  type RepliesStateScreenProp,
+} from '../screens/bug-reporting/RepliesStateScreen';
 import { CrashReportingScreen } from '../screens/CrashReportingScreen';
 import { FeatureRequestsScreen } from '../screens/FeatureRequestsScreen';
 import { HomeScreen } from '../screens/HomeScreen';
@@ -72,6 +80,8 @@ export type HomeStackParamList = {
   InvocationEvents: InvocationEventsScreenProp;
   SessionProfiler: SessionProfilerScreenProp;
   InvocationOptions: InvocationOptionsScreenProp;
+  ViewHierarchy: ViewHierarchyScreenProp;
+  RepliesState: RepliesStateScreenProp;
 
   CrashReporting: undefined;
   FeatureRequests: undefined;
@@ -149,6 +159,16 @@ export const HomeStackNavigator: React.FC = () => {
         component={InvocationOptionsScreen}
         options={{ title: 'Invocation Options' }}
       />
+      <HomeStack.Screen
+        name="ViewHierarchy"
+        component={ViewHierarchyScreen}
+        options={{ title: 'View Hierarchy' }}
+      />
+      <HomeStack.Screen
+        name="RepliesState"
+        component={RepliesStateScreen}
+        options={{ title: 'Replies State' }}
+      />
 
       <HomeStack.Screen
         name="CrashReporting"

examples/default/src/screens/bug-reporting/BugReportingScreen.tsx

@@ -7,6 +7,7 @@ import Instabug, {
   ExtendedBugReportMode,
   WelcomeMessageMode,
   InvocationEvent,
+  Replies,
 } from 'instabug-reactnative';
 
 import { ListTile } from '../../components/ListTile';
@@ -35,6 +36,8 @@ export const BugReportingScreen: React.FC<
   );
   const [disclaimerText, setDisclaimerText] = useState<string>('');
   const [isSessionProfilerEnabled, setIsSessionProfilerEnabled] = useState<boolean>(true);
+  const [isViewHierarchyEnabled, setIsViewHierarchyEnabled] = useState<boolean>(false);
+  const [isRepliesEnabled, setIsRepliesEnabled] = useState<boolean>(true);
 
   return (
     <ScrollView flex={1} bg="gray.100">
@@ -193,6 +196,38 @@ export const BugReportingScreen: React.FC<
           testID="id_session_profiler"
         />
 
+        <ListTile
+          title="View Hierarchy"
+          subtitle={isViewHierarchyEnabled ? 'Enabled' : 'Disabled'}
+          onPress={() => {
+            navigation.navigate('ViewHierarchy', {
+              isEnabled: isViewHierarchyEnabled,
+              setIsEnabled: (enabled: boolean) => {
+                setIsViewHierarchyEnabled(enabled);
+                BugReporting.setViewHierarchyEnabled(enabled);
+                navigation.goBack();
+              },
+            });
+          }}
+          testID="id_view_hierarchy"
+        />
+
+        <ListTile
+          title="Replies"
+          subtitle={isRepliesEnabled ? 'Enabled' : 'Disabled'}
+          onPress={() => {
+            navigation.navigate('RepliesState', {
+              isEnabled: isRepliesEnabled,
+              setIsEnabled: (enabled: boolean) => {
+                setIsRepliesEnabled(enabled);
+                Replies.setEnabled(enabled);
+                navigation.goBack();
+              },
+            });
+          }}
+          testID="id_replies"
+        />
+
         <Divider my={5} />
 
         <ListTile title="Show" onPress={() => Instabug.show()} testID="id_show_button" />
@@ -214,8 +249,6 @@ export const BugReportingScreen: React.FC<
           testID="id_send_question"
         />
 
-        <Divider my={5} />
-
         <ListTile
           title="Welcome message Beta"
           onPress={() => Instabug.showWelcomeMessage(WelcomeMessageMode.beta)}

examples/default/src/screens/bug-reporting/RepliesStateScreen.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Screen } from '../../components/Screen';
+import { ListTile } from '../../components/ListTile';
+import type { NativeStackScreenProps } from '@react-navigation/native-stack';
+import type { HomeStackParamList } from '../../navigation/HomeStack';
+
+export interface RepliesStateScreenProp {
+  isEnabled: boolean;
+  setIsEnabled: (enabled: boolean) => void;
+}
+
+export const RepliesStateScreen: React.FC<
+  NativeStackScreenProps<HomeStackParamList, 'RepliesState'>
+> = ({ navigation, route }) => {
+  const { isEnabled, setIsEnabled } = route.params;
+
+  return (
+    <Screen>
+      <ListTile
+        title="Enabled"
+        onPress={() => setIsEnabled(true)}
+        testID="id_enabled"
+        subtitle={isEnabled ? 'Selected' : undefined}
+      />
+      <ListTile
+        title="Disabled"
+        onPress={() => setIsEnabled(false)}
+        testID="id_disabled"
+        subtitle={!isEnabled ? 'Selected' : undefined}
+      />
+    </Screen>
+  );
+};

examples/default/src/screens/bug-reporting/ViewHierarchyScreen.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Screen } from '../../components/Screen';
+import { ListTile } from '../../components/ListTile';
+import type { NativeStackScreenProps } from '@react-navigation/native-stack';
+import type { HomeStackParamList } from '../../navigation/HomeStack';
+
+export interface ViewHierarchyScreenProp {
+  isEnabled: boolean;
+  setIsEnabled: (enabled: boolean) => void;
+}
+
+export const ViewHierarchyScreen: React.FC<
+  NativeStackScreenProps<HomeStackParamList, 'ViewHierarchy'>
+> = ({ navigation, route }) => {
+  const { isEnabled, setIsEnabled } = route.params;
+
+  return (
+    <Screen>
+      <ListTile
+        title="Enabled"
+        onPress={() => setIsEnabled(true)}
+        testID="id_enabled"
+        subtitle={isEnabled ? 'Selected' : undefined}
+      />
+      <ListTile
+        title="Disabled"
+        onPress={() => setIsEnabled(false)}
+        testID="id_disabled"
+        subtitle={!isEnabled ? 'Selected' : undefined}
+      />
+    </Screen>
+  );
+};