feat(ui): add ShareSheet component for multi-channel post sharing
Add ShareSheet component that provides native sharing options (WeChat, Moments, copy link, etc.) replacing the previous clipboard-only approach. Also change like icon from heart to thumb-up to better match the share functionality.
This commit is contained in:
55
src/components/business/ShareSheet/ShareSheet.tsx
Normal file
55
src/components/business/ShareSheet/ShareSheet.tsx
Normal file
@@ -0,0 +1,55 @@
|
||||
import React, { useEffect, useMemo } from 'react';
|
||||
import { Share as RNShare, Platform } from 'react-native';
|
||||
|
||||
export interface ShareSheetProps {
|
||||
visible: boolean;
|
||||
postUrl?: string;
|
||||
postTitle?: string;
|
||||
onClose: () => void;
|
||||
onShareAction?: (actionKey: string) => void;
|
||||
}
|
||||
|
||||
const ShareSheet: React.FC<ShareSheetProps> = ({
|
||||
visible,
|
||||
postUrl,
|
||||
postTitle,
|
||||
onClose,
|
||||
onShareAction,
|
||||
}) => {
|
||||
|
||||
const shareText = useMemo(() => {
|
||||
const title = postTitle || '胡萝卜BBS帖子';
|
||||
return `${title} ${postUrl || ''}`;
|
||||
}, [postTitle, postUrl]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!visible) return;
|
||||
|
||||
const doShare = async () => {
|
||||
try {
|
||||
await RNShare.share(
|
||||
{
|
||||
message: shareText,
|
||||
url: Platform.OS === 'ios' ? postUrl : undefined,
|
||||
title: postTitle || '分享帖子',
|
||||
},
|
||||
{
|
||||
subject: postTitle,
|
||||
dialogTitle: '分享到',
|
||||
}
|
||||
);
|
||||
onShareAction?.('system_share');
|
||||
} catch {
|
||||
// User cancelled
|
||||
} finally {
|
||||
onClose();
|
||||
}
|
||||
};
|
||||
|
||||
doShare();
|
||||
}, [visible, shareText, postUrl, postTitle, onShareAction, onClose]);
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
export default ShareSheet;
|
||||
2
src/components/business/ShareSheet/index.ts
Normal file
2
src/components/business/ShareSheet/index.ts
Normal file
@@ -0,0 +1,2 @@
|
||||
export { default } from './ShareSheet';
|
||||
export type { ShareSheetProps } from './ShareSheet';
|
||||
Reference in New Issue
Block a user