import user						from '/user/user.js';

import username					from './user.userList.item.username.js';

import actions					from './user.userList.item.actions.js';

import groups					from '/user/group/user.group.permission.js';

import gridViewRow				from '/elements/gridView/gridView.body.row.js';



export default class userListItem extends user, gridViewRow { 

	username			= new username();

	actions				= new actions();

	cursor				= "pointer";

	background;

	#ifdef MACOS

		fontSize	= 14;

	#endif


	#ifdef DARK

		mouseHoverColor	= "#363333";

	#endif

	#ifdef LIGHT

		mouseHoverColor	= "rgb(255 255 255 / 95%)";

	#endif

	async click() {

		this.stateMachine.composeState( "User", this.id );

		await this.loadPage( this.id );

	}

	state async loadPage( id ) {

		var rightSide 	= this.parents("rightSide");

		rightSide.hideChildren();

		var editUser = rightSide.editUser;

		editUser.id = this.id;

		editUser.show();

		await editUser.sync();

	}

	mouseover() {

		this.background	= this.mouseHoverColor;

	}

	mouseleave() {

		this.background	= "none";

	}

	enableDELETE() {

		this.actions.show();

	}

	disableDELETE() {

		this.actions.hide();

	}

	permission() {

		this.allow( groups.admin, "DELETE" );
		
	}

}