Share.shareSingle's Twitter popup cuts off profile picture and message

[cooperwalter]

Steps to reproduce

1. Call await Share.shareSingle({ social: Share.Social.TWITTER, message: "I'm a test message. I'm getting cut off at the top. This annoys users quite a bit." })

Expected behaviour

The entire message and the user's profile picture show at the top of the screen below the header.

Actual behaviour

The profile picture is mostly cut off and the first line of the message is hidden. Swiping down reveals the full profile picture and message.

Environment

• React Native version: 0.63.2
• React Native platform + platform version: iOS 14.3

react-native-share

Version: ^4.1.0

Screenshot

[kaioduarte]

@cooperwalter I can't see how this lib is causing this bug. Can you reproduce this behavior by sharing content from another app? You could try to share an Instagram post, for example.

[kenmarshall]

I am having this same issue with Twitter

[liushijie686]

@cooperwalter我看不到这个库是怎么引起这个错误的。您可以通过共享其他应用程序的内容来重现此行为吗？例如，您可以尝试分享Instagram帖子。

你好就是图片和文子被遮挡一半求解决方案

[liushijie686]

@cooperwalter 我遇到了同样的问题

[mjgerace]

I have this bug as well. It's valid, cannot tell if it is a twitter issue or a library issue here.

[clevadani]

I've been experiencing this same error. Is this library related?

[kaioduarte]

it's working fine for me, check the video below.

video_2021-02-15_20-43-54.mp4

Code used (styles omitted):

import React, {useState} from 'react';
import {View, Button, Text} from 'react-native';

import Share from 'react-native-share';

const App = () => {
  const [result, setResult] = useState('');

  const shareTweet = async () => {
    const options = {
      social: Share.Social.TWITTER,
      message:
        "I'm a test message. I'm getting cut off at the top. This annoys users quite a bit.",
    };

    try {
      const ShareResponse = await Share.shareSingle(options);
      setResult(JSON.stringify(ShareResponse, null, 2));
    } catch (error) {
      setResult('error: '.concat(getErrorString(error)));
    }
  };

  function getErrorString(error, defaultValue) {
    let e = defaultValue || 'Something went wrong. Please try again';
    if (typeof error === 'string') {
      e = error;
    } else if (error && error.message) {
      e = error.message;
    } else if (error && error.props) {
      e = error.props;
    }
    return e;
  }

  return (
    <View style={styles.container}>
      <View style={styles.buttonContainer}>
        <Button title="Share" onPress={shareTweet} />
      </View>
      <Text style={styles.resultTitle}>Result</Text>
      <Text style={styles.result}>{result}</Text>
    </View>
  );
};
export default App;

My device info:

• Xiaomi Redmi Note 9S
• Android 10 (MIUI 12)
• Twitter version 8.80.0-release.00

[mjgerace]

@kaioduarte I believe this is an ios-specific issue.

[kaioduarte]

@kaioduarte I believe this is an ios-specific issue.

I see, I'd suggest to check some Flutter libs with the same purpose to check if the issue persist, if not you can check the implementation :)

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. You may also mark this issue as a "discussion" and i will leave this open.

[stale]

Closing this issue after a prolonged period of inactivity. Fell free to reopen this issue, if this still affecting you.

[oamado]

I got this issue on iOS, any ideas on how to proceed here?

[mikehardy]

DIg into the code in node_modules however you are comfortable (with a debugger or with console output) and consult the instagram API documentation, verify all the inputs and outputs and see what's going on

[xieguanghui200888]

I also encountered this problem, and finally applied a patch. The specific adjustments to the GenericShare.m file that were repaired by modifying the contents of the GenericShare.m file are as follows.

[ctrl presentViewController:composeController animated:YES completion:Nil];
resolve(@[@true, @""]);

Change to:

__weak SLComposeViewController* weakShareController = composeController;
composeController.completionHandler = ^(SLComposeViewControllerResult result) {
    
    // always dismiss since this may be called from cancelled shares
    // but the share menu would remain open, and our callback would fire again on close
    if(weakShareController){
        // closing activity view controller
        [weakShareController dismissViewControllerAnimated:true completion:nil];
    } else {
        [ctrl dismissViewControllerAnimated:true completion:nil];
    }

    
    if (result == SLComposeViewControllerResultCancelled) {
        NSString *errorMessage = @"cancel share";
        NSDictionary *userInfo = @{NSLocalizedFailureReasonErrorKey: NSLocalizedString(errorMessage, nil)};
        NSError *error = [NSError errorWithDomain:@"com.rnshare" code:1 userInfo:userInfo];
        reject(@"error",@"cancel share",error);
    } else {
        resolve(@{
            @"success": @(true),
            @"message": @"share success"
        });
    }
    
    // clear the completion handler to prevent cycles
    if(weakShareController){
        weakShareController.completionHandler = nil;
    }
};
composeController.modalPresentationStyle = UIModalPresentationFullScreen;
UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:composeController];
nav.navigationBarHidden = true;
[ctrl presentViewController:nav animated:YES completion:nil];