salla-user-settings

The account settings block for a signed-in customer on the profile page. It has no props; it reads the current user from the store config. It shows (1) a "hide my name" toggle on reviews, only when the store allows customers to hide their name, (2) a toggle for receiving promotional messages, and (3) account removal. Account removal depends on the store's customer-account-deletion feature. When enabled, "Delete account" opens a popup with a confirmation step, then a one-time-code (OTP) step sent by email or mobile (the customer can switch channel or resend the code), then a success message; while a deletion request is pending, the button changes to withdraw the request. When the feature is off, a simpler "Deactivate account" popup is used that deactivates the account immediately, with no code. Toggles save immediately through salla.profile.updateSettings. Place it once on the customer profile page.

Use itCopy Anchor Link

In HTML or JSX, use the tag <salla-user-settings> with the Attribute names below. In React, the wrapper takes the Property names (camelCase).

import { SallaUserSettings } from '@salla.sa/twilight-components-react/user-settings';

Client-only. On the server this wrapper renders a placeholder (a skeleton, or nothing), and the real component mounts in the browser. Do not rely on it for content that search engines must see.

ExampleCopy Anchor Link

import { SallaUserSettings } from '@salla.sa/twilight-components-react/user-settings';

export function Example() {
  return (
    <SallaUserSettings />
  );
}

RelatedCopy Anchor Link

Renders: <salla-button>, <salla-list-tile>, <salla-modal>.