import { GenericPageData } from '../../pageInterface';
import { FaCog } from 'react-icons/fa';
import { createSettingsHook } from '../../../../hooks/useSettings';

export const settingsPageData: GenericPageData = {
    id: 'settings',
    path: 'settings',
    name: 'Settings',
    description: 'Manage your account settings and preferences',
    
    // Visual
    icon: FaCog,
    title: 'settings.title',
    subtitle: 'Manage your account settings and preferences',
    
    // Page behavior
    persistent: false,
    preserveState: false,
    preload: true,
    moduleEnabled: true,
    
    // Sidebar
    showInSidebar: true,
    order: 999, // Put at the end
    
    // Content sections
    content: [
        {
            id: 'settings-content',
            type: 'settings',
            settingsConfig: {
                sections: [
                    {
                        id: 'user-info',
                        sectionId: 'user-info',
                        title: 'settings.userinfo',
                        description: 'settings.userinfo.description',
                        saveButtonLabel: 'settings.userinfo.save',
                        saveButtonVariant: 'primary',
                        saveButtonSize: 'md',
                        // Static fields for user information
                        staticFields: [
                            {
                                id: 'username',
                                type: 'text',
                                label: 'settings.userinfo.username',
                                description: 'settings.userinfo.username.description',
                                dataKey: 'username',
                                required: true,
                                placeholder: 'settings.userinfo.username'
                            },
                            {
                                id: 'fullName',
                                type: 'text',
                                label: 'settings.userinfo.fullname',
                                description: 'settings.userinfo.fullname.description',
                                dataKey: 'fullName',
                                required: false,
                                placeholder: 'settings.userinfo.fullname'
                            },
                            {
                                id: 'email',
                                type: 'text',
                                inputType: 'email',
                                label: 'settings.userinfo.email',
                                description: 'settings.userinfo.email.description',
                                dataKey: 'email',
                                required: true,
                                placeholder: 'settings.userinfo.email'
                            },
                            {
                                id: 'language',
                                type: 'select',
                                label: 'settings.userinfo.language',
                                description: 'settings.userinfo.language.description',
                                dataKey: 'language',
                                required: false,
                                options: [
                                    { id: 'en', label: 'English', value: 'en' },
                                    { id: 'de', label: 'Deutsch', value: 'de' },
                                    { id: 'fr', label: 'Français', value: 'fr' },
                                    { id: 'it', label: 'Italiano', value: 'it' }
                                ]
                            },
                            {
                                id: 'phone-name',
                                type: 'text',
                                label: 'settings.userinfo.phone_name',
                                description: 'settings.userinfo.phone_name.description',
                                dataKey: 'phoneName',
                                required: false,
                                placeholder: 'settings.userinfo.phone_name'
                            }
                        ]
                    },
                    {
                        id: 'theme',
                        title: '',
                        sectionId: 'theme',
                        saveButtonLabel: 'settings.save',
                        saveButtonVariant: 'primary',
                        saveButtonSize: 'md',
                        staticFields: [
                            {
                                id: 'theme-select',
                                type: 'select',
                                label: 'settings.theme',
                                dataKey: 'theme',
                                required: false,
                                options: [
                                    { id: 'light', label: 'settings.theme.light', value: 'light' },
                                    { id: 'dark', label: 'settings.theme.dark', value: 'dark' }
                                ]
                            }
                        ]
                    }
                ],
                hookFactory: createSettingsHook
            }
        }
    ],
    
    // Lifecycle hooks
    onActivate: async () => {
        if (import.meta.env.DEV) console.log('Settings page activated');
    }
};