Skip to main content

Account

Components

The Account component family provides the following components:

AccountStatus

Displays a badge for the account status you pass it

You can import the AccountStatus component from the account component family in the @freesewing/react package:

Javascript
import { AccountStatus } from "@freesewing/react/components/Account"

Apikeys

A component to mange the user's API keys

You can import the Apikeys component from the account component family in the @freesewing/react package:

Javascript
import { Apikeys } from "@freesewing/react/components/Account"

Avatar

Component to manage the user's Avatar

You can import the Avatar component from the account component family in the @freesewing/react package:

Javascript
import { Avatar } from "@freesewing/react/components/Account"

Bio

Component to manage the user's Bio

You can import the Bio component from the account component family in the @freesewing/react package:

Javascript
import { Bio } from "@freesewing/react/components/Account"

BookmarkButton

Component to add a bookmark to the user's account

You can import the BookmarkButton component from the account component family in the @freesewing/react package:

Javascript
import { BookmarkButton } from "@freesewing/react/components/Account"

Bookmarks

A component to manage the user's bookmarks

You can import the Bookmarks component from the account component family in the @freesewing/react package:

Javascript
import { Bookmarks } from "@freesewing/react/components/Account"

Compare

A component to manage the user's compare setting

You can import the Compare component from the account component family in the @freesewing/react package:

Javascript
import { Compare } from "@freesewing/react/components/Account"

A component to manage the user's consent setting

You can import the Consent component from the account component family in the @freesewing/react package:

Javascript
import { Consent } from "@freesewing/react/components/Account"

Control

A component to manage the user's control/UX setting

You can import the Control component from the account component family in the @freesewing/react package:

Javascript
import { Control } from "@freesewing/react/components/Account"

Email

A component to manage the user's email address

You can import the Email component from the account component family in the @freesewing/react package:

Javascript
import { Email } from "@freesewing/react/components/Account"

EmailChangeConfirmation

Requires a valid callback URL This component will not work without the proper id

and check URL parameters that come from a email confirmation link sent out from the FreeSewing backend.

A component to render the confirmation after changing the user's email

You can import the EmailChangeConfirmation component from the account component family in the @freesewing/react package:

Javascript
import { EmailChangeConfirmation } from "@freesewing/react/components/Account"

Export

A component to manage the user's export account data action

You can import the Export component from the account component family in the @freesewing/react package:

Javascript
import { Export } from "@freesewing/react/components/Account"

Github

A component to manage the user's Github handle in their account data

You can import the Github component from the account component family in the @freesewing/react package:

Javascript
import { Github } from "@freesewing/react/components/Account"

ImportSet

A component to manage the importing of a measurements set into a user's account data

You can import the ImportSet component from the account component family in the @freesewing/react package:

Javascript
import { ImportSet } from "@freesewing/react/components/Account"

Instagram

A component to manage the user's Instagram handle in their account data

You can import the Instagram component from the account component family in the @freesewing/react package:

Javascript
import { Instagram } from "@freesewing/react/components/Account"

A component to manage the user's Instagram handle in their account data

You can import the Links component from the account component family in the @freesewing/react package:

Javascript
import { Links } from "@freesewing/react/components/Account"

Mastodon

A component to manage the user's Mastodon handle in their account data

You can import the Mastodon component from the account component family in the @freesewing/react package:

Javascript
import { Mastodon } from "@freesewing/react/components/Account"

Mfa

A component to manage the user's MFA settings

You can import the Mfa component from the account component family in the @freesewing/react package:

Javascript
import { Mfa } from "@freesewing/react/components/Account"

MsetCard

A component to render a card of a single measurements set. This is a pure render component, you need to pass in the data.

You can import the MsetCard component from the account component family in the @freesewing/react package:

Javascript
import { MsetCard } from "@freesewing/react/components/Account"

NewSet

A component to create a new measurements set.

You can import the NewSet component from the account component family in the @freesewing/react package:

Javascript
import { NewSet } from "@freesewing/react/components/Account"

Newsletter

A component to manage the user's newsletter subscription in their account data

You can import the Newsletter component from the account component family in the @freesewing/react package:

Javascript
import { Newsletter } from "@freesewing/react/components/Account"

Password

A component to manage the user's password

You can import the Password component from the account component family in the @freesewing/react package:

Javascript
import { Password } from "@freesewing/react/components/Account"

Pattern

A component to manage a pattern in the user's account data

You can import the Pattern component from the account component family in the @freesewing/react package:

Javascript
import { Pattern } from "@freesewing/react/components/Account"

PatternCard

A component to display a card representing a pattern in the user's account data. This is a pure render component, you have to pass in the data.

You can import the PatternCard component from the account component family in the @freesewing/react package:

Javascript
import { PatternCard } from "@freesewing/react/components/Account"

Patterns

A component to display and manage the list of patterns in the user's account

You can import the Patterns component from the account component family in the @freesewing/react package:

Javascript
import { Patterns } from "@freesewing/react/components/Account"

Reddit

A component to manage the user's Reddit handle in their account data

You can import the Reddit component from the account component family in the @freesewing/react package:

Javascript
import { Reddit } from "@freesewing/react/components/Account"

Reload

A component handle a reload of the account data

You can import the Reload component from the account component family in the @freesewing/react package:

Javascript
import { Reload } from "@freesewing/react/components/Account"

Remove

A component to handle the removal of a user's account

You can import the Remove component from the account component family in the @freesewing/react package:

Javascript
import { Remove } from "@freesewing/react/components/Account"

Restrict

A component to manage the user's options to restrict processing of their data

You can import the Restrict component from the account component family in the @freesewing/react package:

Javascript
import { Restrict } from "@freesewing/react/components/Account"

Set

Component to show an individual measurements set

You can import the Set component from the account component family in the @freesewing/react package:

Javascript
import { Set } from "@freesewing/react/components/Account"

Sets

The component for the measurements sets in the user's account.

You can import the Sets component from the account component family in the @freesewing/react package:

Javascript
import { Sets } from "@freesewing/react/components/Account"

Tiktok

A component to manage the user's Tiktok handle in their account data

You can import the Tiktok component from the account component family in the @freesewing/react package:

Javascript
import { Tiktok } from "@freesewing/react/components/Account"

Twitch

A component to manage the user's Twitch handle in their account data

You can import the Twitch component from the account component family in the @freesewing/react package:

Javascript
import { Twitch } from "@freesewing/react/components/Account"

Units

A component to manage the user's units

You can import the Units component from the account component family in the @freesewing/react package:

Javascript
import { Units } from "@freesewing/react/components/Account"

UserId

A component to display the current user's ID

You can import the UserId component from the account component family in the @freesewing/react package:

Javascript
import { UserId } from "@freesewing/react/components/Account"

Username

A component to manage the user's username

You can import the Username component from the account component family in the @freesewing/react package:

Javascript
import { Username } from "@freesewing/react/components/Account"

UserRole

A component to display the user's role

You can import the UserRole component from the account component family in the @freesewing/react package:

Javascript
import { UserRole } from "@freesewing/react/components/Account"

Website

A component to manage the user's website URL in their account data

You can import the Website component from the account component family in the @freesewing/react package:

Javascript
import { Website } from "@freesewing/react/components/Account"