feat: enhance AddressBar and Toolbar components with new props for improved functionality

Author: afnx

src/features/browser/screens/BrowserScreen/AddressBar.tsx

@@ -8,9 +8,15 @@ import { formatUrlForDisplay } from "../../utils/urlUtils";
 
 interface AddressBarProps {
   onFocusChange?: (isFocused: boolean) => void;
+  onReload: () => void;
+  onStop: () => void;
 }
 
-export default function AddressBar({ onFocusChange }: AddressBarProps) {
+export default function AddressBar({
+  onFocusChange,
+  onReload,
+  onStop,
+}: AddressBarProps) {
   const theme = useTheme();
   const { activeTab, navigateTab, activeTabId } = useBrowser();
 
@@ -74,13 +80,21 @@ export default function AddressBar({ onFocusChange }: AddressBarProps) {
       />
       <View style={[styles.iconRight]}>
         <IconButton
-          icon={activeTab?.url && !isFocused ? Icons.refresh : Icons.microphone}
+          icon={
+            activeTab?.isLoading
+              ? Icons.stop
+              : activeTab?.url && !isFocused
+              ? Icons.refresh
+              : Icons.microphone
+          }
           color={theme.colors.textSecondary}
           size={26}
           accessibilityLabel={activeTab?.url ? "Reload" : "Start voice search"}
           onPress={() => {
-            if (activeTabId && activeTab?.url) {
-              navigateTab(activeTabId, activeTab.url);
+            if (activeTab?.isLoading) {
+              onStop();
+            } else if (activeTabId && activeTab?.url) {
+              onReload();
             }
           }}
         />

src/features/browser/screens/BrowserScreen/Toolbar.tsx

@@ -6,7 +6,13 @@ import { StyleSheet } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 import { useBrowser } from "../../hooks/useBrowser";
 
-export default function Toolbar() {
+type ToolbarProps = {
+  onBack: () => void;
+  onForward: () => void;
+  onShare?: () => void;
+};
+
+export default function Toolbar({ onBack, onForward, onShare }: ToolbarProps) {
   const theme = useTheme();
   const {
     activeTab,
@@ -25,28 +31,22 @@ export default function Toolbar() {
         size={26}
         disabled={!activeTab?.canGoBack}
         accessibilityLabel="Back"
-        onPress={() => {
-          // WebView navigation logic will go here
-        }}
+        onPress={onBack}
       />
       <IconButton
         icon={Icons.forward}
         color={theme.colors.textPrimary}
         size={26}
         disabled={!activeTab?.canGoForward}
         accessibilityLabel="Forward"
-        onPress={() => {
-          // WebView navigation logic will go here
-        }}
+        onPress={onForward}
       />
       <IconButton
         icon={Icons.share}
         color={theme.colors.textPrimary}
         size={26}
         accessibilityLabel="Share"
-        onPress={() => {
-          // More actions (settings, share, etc.)
-        }}
+        onPress={onShare}
       />
       <IconButton
         icon={