Skip to main content
To implement the Propaga Button in the file header, you’ll need to import the global hook.
import { usePropaga } from '@propaga/react-native-sdk';
And here’s how you can use the hook:
const MyAwesomeComponent = () => {
 const { ... } = usePropaga();
 return ( ... );
}

Working with Propaga button

You can easily implement a ready-to-use checkout button like this:
Button example
With the following snippet, implementing the button becomes straightforward:
import { useState } from 'react';
import { View, Button } from 'react-native';
import { usePropaga } from '@propaga/react-native-sdk';

export default function App() {
  const [isPropagaActive, setIsPropagaActive] = useState(false);
  const { PropagaButton } = usePropaga();

  return (
    <View style={styles.container}>
      <PropagaButton
          totalAmount={2000}
          isActive={isPropagaActive}
          cornerStoreId="...."
          token={'...'}
          onPress={() => {
            setIsPropagaActive(!isPropagaActive);
        }} />
    </View>
  );
}
This button is designed to display a checked state, ideal for use as a component on your check-out screen.