/**
 * @fileoverview Profile Page Component for Rantii
 * @author retoor <retoor@molodetz.nl>
 * @description User profile view page
 * @keywords profile, page, user, view, account
 */

import { BaseComponent } from '../components/base-component.js';

class ProfilePage extends BaseComponent {
    static get observedAttributes() {
        return ['username'];
    }

    init() {
        this.render();
    }

    render() {
        const username = this.getAttr('username');

        this.addClass('page', 'profile-page');

        this.setHtml(`
            <user-profile username="${username || ''}"></user-profile>
        `);

        if (username) {
            this.load(username);
        }
    }

    async load(username) {
        const profile = this.$('user-profile');
        if (profile) {
            await profile.load(username);
        }
    }

    onAttributeChanged(name, oldValue, newValue) {
        if (name === 'username' && newValue) {
            this.load(newValue);
        }
    }
}

customElements.define('profile-page', ProfilePage);

export { ProfilePage };