refactor: migrate ShareExtensionStack to React Navigation static config (#7413)

Author: diegolmello

app/definitions/navigationTypes.ts

@@ -1,11 +1,11 @@
 import { type NavigatorScreenParams } from '@react-navigation/core';
 import { type NativeStackNavigationOptions } from '@react-navigation/native-stack';
 
-import { type TSubscriptionModel } from './ISubscription';
-import { type TServerModel } from './IServer';
-import { type IAttachment } from './IAttachment';
 import { type MasterDetailInsideStackParamList } from '../stacks/MasterDetailStack/types';
 import { type OutsideParamList, type InsideStackParamList } from '../stacks/types';
+import { type ShareInsideStackParamList } from '../stacks/ShareExtensionStack';
+
+export type { ShareInsideStackParamList };
 
 interface INavigationProps {
 	route?: any;
@@ -31,17 +31,3 @@ export type StackParamList = {
 	SetUsernameStack: NavigatorScreenParams<SetUsernameStackParamList>;
 	ShareExtensionStack: NavigatorScreenParams<ShareInsideStackParamList>;
 };
-
-export type ShareInsideStackParamList = {
-	ShareListView: undefined;
-	ShareView: {
-		attachments: IAttachment[];
-		isShareView?: boolean;
-		isShareExtension: boolean;
-		serverInfo: TServerModel;
-		text: string;
-		room: TSubscriptionModel;
-		thread?: any; // TODO: Change
-	};
-	SelectServerView: undefined;
-};

app/lib/navigation/withNavigation.tsx

@@ -0,0 +1,14 @@
+import { useNavigation } from '@react-navigation/native';
+import { type ComponentType } from 'react';
+
+function withNavigation<P extends { navigation: any }>(WrappedComponent: ComponentType<P>): ComponentType<Omit<P, 'navigation'>> {
+	// Screen-registration-only bridge: static API passes only { route } to screens, so no ref forwarding needed.
+	const WithNavigation = (props: Omit<P, 'navigation'>) => {
+		const navigation = useNavigation();
+		return <WrappedComponent {...(props as P)} navigation={navigation} />;
+	};
+	WithNavigation.displayName = `WithNavigation(${WrappedComponent.displayName || WrappedComponent.name || 'Component'})`;
+	return WithNavigation;
+}
+
+export default withNavigation;

app/stacks/ShareExtensionStack.tsx

@@ -1,27 +1,38 @@
-import { useContext } from 'react';
+import { useContext, type ComponentType } from 'react';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
+import { type StaticParamList, type StaticScreenProps } from '@react-navigation/native';
 
 import { ThemeContext } from '../theme';
 import { defaultHeader, themedHeader } from '../lib/methods/helpers/navigation';
 import SelectServerView from '../views/SelectServerView';
 import ShareListView from '../views/ShareListView';
 import ShareView from '../views/ShareView';
+import withNavigation from '../lib/navigation/withNavigation';
+import { type InsideStackParamList } from './types';
+import { type Optional } from '../definitions/utils';
 
-const ShareExtension = createNativeStackNavigator<any>();
-const ShareExtensionStack = () => {
+type ShareViewParams = Optional<InsideStackParamList['ShareView'], 'thread' | 'action' | 'finishShareView' | 'startShareView'>;
+
+// Cast through `any` to break the navigation-prop type cycle; removing it reintroduces a real TS circular ref.
+const ShareListViewScreen: ComponentType<StaticScreenProps<undefined>> = withNavigation(ShareListView as any) as any;
+const ShareViewScreen: ComponentType<StaticScreenProps<ShareViewParams>> = withNavigation(ShareView as any) as any;
+
+const ShareExtension = createNativeStackNavigator({
+	screenOptions: defaultHeader,
+	screens: {
+		ShareListView: ShareListViewScreen,
+		ShareView: ShareViewScreen,
+		SelectServerView
+	}
+}).with(({ Navigator }) => {
 	'use memo';
 
 	const { theme } = useContext(ThemeContext);
+	return <Navigator screenOptions={themedHeader(theme)} />;
+});
+
+export type ShareInsideStackParamList = StaticParamList<typeof ShareExtension>;
 
-	return (
-		<ShareExtension.Navigator screenOptions={{ ...defaultHeader, ...themedHeader(theme) }}>
-			{/* @ts-ignore */}
-			<ShareExtension.Screen name='ShareListView' component={ShareListView} />
-			{/* @ts-ignore */}
-			<ShareExtension.Screen name='ShareView' component={ShareView} />
-			<ShareExtension.Screen name='SelectServerView' component={SelectServerView} />
-		</ShareExtension.Navigator>
-	);
-};
+const ShareExtensionStack = ShareExtension.getComponent();
 
 export default ShareExtensionStack;