1.1.2 • Published 9 months ago

@espresso-lab/mantine-cognito v1.1.2

Weekly downloads
-
License
MIT
Repository
github
Last release
9 months ago

Mantine meets AWS Cognito 🚀

This is a simple wrapper for the Mantine UI library to work with AWS Cognito.

License NPM Version NPM Downloads

image

Installation

npm i @espresso-lab/mantine-cognito

Usage

<MantineAuth>-Provider

import { MantineAuth, MFASetup } from "@espresso-lab/mantine-cognito";

function App() {
  return (
    <MantineAuth
      cognitoUserPoolId="<cognito-user-pool-id>"
      cognitoClientId="<cognito-client-id>"
      language="en"
    >
      <p>You are logged in!</p>
      <MFASetup mfaAppName="Test" />
    </MantineAuth>
  );
}

export default App;

In the example above, the MantineAuth component will handle the authentication flow with AWS Cognito. The MFASetup component will handle the MFA setup flow.

useAuth()-Hook

import { Button, Paper, Title } from "@mantine/core";
import { useAuth } from "@espresso-lab/mantine-cognito";

export function AnyComponent() {
  const { logout, userAttributes } = useAuth();
  const { given_name } = userAttributes || {};

  return (
    <Paper>
      <Title>Hello {given_name}</Title>
      <Button onClick={logout}>Logout</Button>
    </Paper>
  );
}

In the example above, the useAuth hook is used to get the user attributes and the logout function. The useAuth hook works only inside the MantineAuth-Provider.

Backend authorization

import { getIdToken, getAccessToken } from "@espresso-lab/mantine-cognito";

export async function myApiCall() {
  fetch("https://example.com/api", {
      method: "GET",
      headers: {
          "Authorization": await getIdToken() ?? ""
      }
  });
}
1.1.2

9 months ago

1.1.1

9 months ago

1.1.0

9 months ago

1.0.2

9 months ago

1.0.1

9 months ago

1.0.0

9 months ago

0.0.18

9 months ago

0.0.17

9 months ago

0.0.16

9 months ago

0.0.15

9 months ago

0.0.14

9 months ago

0.0.13

9 months ago

0.0.12

9 months ago

0.0.11

9 months ago

0.0.10

9 months ago

0.0.9

9 months ago

0.0.8

9 months ago

0.0.7

9 months ago

0.0.6

9 months ago

0.0.4

9 months ago

0.0.3

9 months ago

0.0.2

9 months ago

0.0.1

9 months ago