Skip to main content

​
User Preferences

Save user preferences including theme customization, parental controls, and other personalization settings.

​
Endpoint

POST /api/saveUserPreferences

​
Authentication

Authentication RequiredThis endpoint requires a valid user session. Include session cookies with your request.

​
Request Body

​
enfasiscolor
string
User’s preferred accent/emphasis color in hexadecimal format.Used to customize the theme and UI elements throughout the application.Example: "#FF5733", "#3498db"
​
parentalControl
boolean
Enable or disable parental control features.
  • true: Enable content filtering for family-friendly viewing
  • false: Disable parental controls
When enabled, adult content and mature-rated anime will be filtered from search results and recommendations.

​
Response

​
Success Response

Status Code: 200 OK
​
success
boolean
Always true for successful requests.
​
data
object
Updated user preferences object containing the saved settings.
{
  "success": true,
  "data": {
    "user_id": "550e8400-e29b-41d4-a716-446655440000",
    "enfasiscolor": "#FF5733",
    "parentalControl": true,
    "updated_at": "2026-03-11T10:30:00Z"
  }
}

​
Error Response

Status Code: 401 Unauthorized or 500 Internal Server Error 
{
  "error": "Unauthorized",
  "status": 401
}

​
Examples

async function saveUserPreferences(accentColor, parentalControl) {
  const response = await fetch('/api/saveUserPreferences', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    credentials: 'include',
    body: JSON.stringify({
      enfasiscolor: accentColor,
      parentalControl: parentalControl
    })
  });
  
  if (!response.ok) {
    throw new Error('Failed to save preferences');
  }
  
  return await response.json();
}

// Usage
await saveUserPreferences('#3498db', false);

​
Preference Details

​
Accent Color (enfasiscolor)

The accent color is used throughout the application to personalize the user interface:
  • Navigation highlights
  • Button colors
  • Link colors
  • Progress indicators
  • Interactive elements
The accent color should be provided in hexadecimal format (e.g., #FF5733). The application automatically adjusts contrast and generates complementary colors for optimal readability.

​
Parental Control

When parental control is enabled:
  • Content Filtering: Mature-rated anime (R-17+, R+, Rx) are filtered from:
    • Search results
    • Homepage recommendations
    • Trending lists
    • Genre browsing
  • Visual Indicators: Family-friendly content is prioritized
  • Safe Browsing: Explicit content warnings are enforced
// Applying saved preferences to UI
const applyUserTheme = (enfasiscolor) => {
  // Set CSS custom property
  document.documentElement.style.setProperty(
    '--accent-color',
    enfasiscolor
  );
  
  // Generate complementary colors
  const lighter = adjustColorBrightness(enfasiscolor, 20);
  const darker = adjustColorBrightness(enfasiscolor, -20);
  
  document.documentElement.style.setProperty(
    '--accent-color-light',
    lighter
  );
  document.documentElement.style.setProperty(
    '--accent-color-dark',
    darker
  );
};

function adjustColorBrightness(hex, percent) {
  // Color adjustment logic
  const num = parseInt(hex.replace('#', ''), 16);
  const amt = Math.round(2.55 * percent);
  const R = (num >> 16) + amt;
  const G = (num >> 8 & 0x00FF) + amt;
  const B = (num & 0x0000FF) + amt;
  return '#' + (
    0x1000000 +
    (R < 255 ? (R < 1 ? 0 : R) : 255) * 0x10000 +
    (G < 255 ? (G < 1 ? 0 : G) : 255) * 0x100 +
    (B < 255 ? (B < 1 ? 0 : B) : 255)
  ).toString(16).slice(1);
}

​
State Management Integration

import { create } from 'zustand';

const useGlobalUserPreferences = create((set) => ({
  enfasis: '#FF5733',
  parentalControl: false,
  
  setEnfasis: (color) => {
    set({ enfasis: color });
    // Persist to backend
    fetch('/api/saveUserPreferences', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      credentials: 'include',
      body: JSON.stringify({ enfasiscolor: color })
    });
  },
  
  setParentalControl: (enabled) => {
    set({ parentalControl: enabled });
    // Persist to backend
    fetch('/api/saveUserPreferences', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      credentials: 'include',
      body: JSON.stringify({ parentalControl: enabled })
    });
  }
}));

export default useGlobalUserPreferences;

​
Best Practices

  1. Debounce Updates: When updating colors with a color picker, debounce API calls to avoid excessive requests
  2. Optimistic Updates: Update UI immediately, then sync with backend
  3. Error Handling: Provide clear feedback when preference updates fail
  4. Validation: Validate hex colors client-side before sending to API
  5. Persistence: Store preferences in local state management for immediate access

Build docs developers (and LLMs) love

Get started for freeTalk to us