feat(home): integrate PagerView for tab navigation and add verification redirect
Replace custom gesture handling with PagerView component for smoother tab switching on home screen. Add verification required redirects in API and WebSocket services that automatically navigate users to the verification guide when receiving VERIFICATION_REQUIRED error codes. BREAKING CHANGE: API and WS services now require router to be set via setExpoRouter/setRouter for navigation to work properly
This commit is contained in:
31
src/components/common/PagerView.tsx
Normal file
31
src/components/common/PagerView.tsx
Normal file
@@ -0,0 +1,31 @@
|
||||
import React from 'react';
|
||||
import { ViewStyle } from 'react-native';
|
||||
import PagerViewNative from 'react-native-pager-view';
|
||||
|
||||
type PagerViewProps = {
|
||||
style?: ViewStyle;
|
||||
initialPage?: number;
|
||||
onPageSelected?: (e: { nativeEvent: { position: number } }) => void;
|
||||
overdrag?: boolean;
|
||||
children: React.ReactNode;
|
||||
};
|
||||
|
||||
export const PagerView = React.forwardRef<PagerViewNative, PagerViewProps>(
|
||||
({ style, initialPage, onPageSelected, overdrag, children }, ref) => {
|
||||
return (
|
||||
<PagerViewNative
|
||||
ref={ref}
|
||||
style={style}
|
||||
initialPage={initialPage}
|
||||
onPageSelected={onPageSelected}
|
||||
overdrag={overdrag}
|
||||
>
|
||||
{children}
|
||||
</PagerViewNative>
|
||||
);
|
||||
}
|
||||
);
|
||||
|
||||
PagerView.displayName = 'PagerView';
|
||||
|
||||
export default PagerView;
|
||||
27
src/components/common/PagerView.web.tsx
Normal file
27
src/components/common/PagerView.web.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
import React, { ForwardedRef } from 'react';
|
||||
import { View, ViewStyle } from 'react-native';
|
||||
|
||||
type PagerViewProps = {
|
||||
style?: ViewStyle;
|
||||
initialPage?: number;
|
||||
onPageSelected?: (e: { nativeEvent: { position: number } }) => void;
|
||||
overdrag?: boolean;
|
||||
children: React.ReactNode;
|
||||
};
|
||||
|
||||
function PagerViewInternal(
|
||||
{ style, children }: PagerViewProps,
|
||||
_ref: ForwardedRef<{ setPage: (page: number) => void }>
|
||||
) {
|
||||
const childrenArray = React.Children.toArray(children);
|
||||
return (
|
||||
<View style={style}>
|
||||
{childrenArray[0]}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
export const PagerView = React.forwardRef(PagerViewInternal);
|
||||
PagerView.displayName = 'PagerView';
|
||||
|
||||
export default PagerView;
|
||||
@@ -17,6 +17,7 @@ export { default as ResponsiveGrid } from './ResponsiveGrid';
|
||||
export { default as ResponsiveStack, HStack, VStack } from './ResponsiveStack';
|
||||
export { default as AdaptiveLayout, SidebarLayout } from './AdaptiveLayout';
|
||||
export { default as AppBackButton } from './AppBackButton';
|
||||
export { default as PagerView } from './PagerView';
|
||||
|
||||
// 图片相关组件
|
||||
export { default as SmartImage } from './SmartImage';
|
||||
|
||||
Reference in New Issue
Block a user