0.0.1 • Published 4 years ago

react-native-socials-offline v0.0.1

Weekly downloads
1
License
MIT
Repository
github
Last release
4 years ago

React Native Socials

Install

The library is still in version 0, be cautious when you upgrade it! 🚧

yarn add react-native-socials

It is also needed to add react-native-video in your project because social components usually contains embeded videos. See react-native-video library for more information about the installation.

Finally, it is recommended to wrap those components into PureComponent because some of them can be costly to rerender (videos for instance).

Instagram

LightDark
import {Instagram} from "react-native-socials";

<Instagram id="B8U12TXAmK-" >

Props:

NameTypeDefaultDescription
idstringRequiredInstagram post id
darkModeboolfalseToggle dark mode
languagestring enum"en" - "de" - "fr" - "es" - "pt" - "it" -"ru"Pick language for metadata of the post
containerBorderRadiusnumber0Border radius of the container of the UI element

Twitter

LightDark
import {Twitter} from "react-native-socials";

<Twitter
consumerKey=""
consumerSecret=""
id="1251870993628434433"
>

Unlike Instagram, the Twitter API is not open. It is needed that you register your app (free version) to the Twitter portal to be able to fetch Twitter posts.

Props:

NameTypeDefaultDescription
idstringRequiredTwitter post id
consumerKeystringRequiredOAuth 1.0 Twitter key that is granted when you register your app on Twitter Portal
consumerSecretstringRequiredOAuth 1.0 Twitter secret that is granted when you register your app on Twitter Portal
darkModeboolfalseToggle dark mode
languagestring enum"en"Pick language for metadata of the post
onHashTagPress(hashtag:string) => voidRedirect to webpageOverrides default behavior when pressing an hashtag in a Tweet
onUserMentionPress(userMention:string) => voidRedirect to webpageOverrides default behavior when pressing a user mention in a Tweet
onLinkPress(link:string) => voidRedirect to webpageOverrides default behavior when pressing a link in a Tweet
cornerRadiusstring enum"small"Chose the corner radius of UI elements in a post. Typically a post taking the whole width of the screen should have "big" whereas a post in a card should use the "small" value
containerBorderRadiusnumber0Border radius of the container of the UI element
onTweetPress(tweetId:string) => voidRedirect to webpageOverrides default behavior when pressing the tweet