[FIX] AccountBox checks for condition (#25708)

<!-- This is a pull request template, you do not need to uncomment or remove the comments, they won't show up in the PR text. -->

<!-- Your Pull Request name should start with one of the following tags
  [NEW] For new features
  [IMPROVE] For an improvement (performance or little improvements) in existing features
  [FIX] For bug fixes that affect the end-user
  [BREAK] For pull requests including breaking changes
  Chore: For small tasks
  Doc: For documentation
-->

<!-- Checklist!!! If you're unsure about any of them, don't hesitate to ask. We're here to help! This is simply a reminder of what we are going to look for before merging your code. 
  - I have read the Contributing Guide - https://github.com/RocketChat/Rocket.Chat/blob/develop/.github/CONTRIBUTING.md#contributing-to-rocketchat doc
  - I have signed the CLA - https://cla-assistant.io/RocketChat/Rocket.Chat
  - Lint and unit tests pass locally with my changes
  - I have added tests that prove my fix is effective or that my feature works (if applicable)
  - I have added necessary documentation (if applicable)
  - Any dependent changes have been merged and published in downstream modules
-->

## Proposed changes (including videos or screenshots)
<!-- CHANGELOG -->
<!--
  Describe the big picture of your changes here to communicate to the maintainers why we should accept this pull request.
  If it fixes a bug or resolves a feature request, be sure to link to that issue below.
  This description will appear in the release notes if we accept the contribution.
-->

<!-- END CHANGELOG -->

## Issue(s)
<!-- Link the issues being closed by or related to this PR. For example, you can use #594 if this PR closes issue number 594 -->
Close: #25704

## Steps to test or reproduce
<!-- Mention how you would reproduce the bug if not mentioned on the issue page already. Also mention which screens are going to have the changes if applicable -->

## Further comments
<!-- If this is a relatively large or complex change, kick off the discussion by explaining why you chose the solution you did and what alternatives you considered, etc... -->
Fixes #25704

apps/meteor/app/ui-utils/client/lib/AccountBox.ts

@@ -1,23 +1,33 @@
-import { IUActionButtonWhen, IUIActionButton } from '@rocket.chat/apps-engine/definition/ui/IUIActionButtonDescriptor';
+import { IUIActionButton, IUActionButtonWhen } from '@rocket.chat/apps-engine/definition/ui/IUIActionButtonDescriptor';
 import { ReactiveVar } from 'meteor/reactive-var';
 import { Tracker } from 'meteor/tracker';
 import { Meteor } from 'meteor/meteor';
 
 import { SideNav } from './SideNav';
 import { applyDropdownActionButtonFilters } from '../../../ui-message/client/actionButtons/lib/applyButtonFilters';
 
-export interface IAccountBoxItem extends Omit<IUIActionButton, 'when'> {
+export interface IAppAccountBoxItem extends IUIActionButton {
 	name: string;
 	icon?: string;
 	href?: string;
 	sideNav?: string;
 	isAppButtonItem?: boolean;
-	subItems?: [IAccountBoxItem];
+	subItems?: [IAppAccountBoxItem];
 	when?: Omit<IUActionButtonWhen, 'roomTypes' | 'messageActionContext'>;
 }
 
+type AccountBoxItem = {
+	name: string;
+	icon: string;
+	href: string;
+	sideNav?: string;
+	condition: () => boolean;
+};
+
+export const isAppAccountBoxItem = (item: IAppAccountBoxItem | AccountBoxItem): item is IAppAccountBoxItem => 'isAppButtonItem' in item;
+
 export class AccountBoxBase {
-	private items = new ReactiveVar([]);
+	private items = new ReactiveVar<IAppAccountBoxItem[]>([]);
 
 	private status = 0;
 
@@ -48,25 +58,31 @@ export class AccountBoxBase {
 		this.status = 0;
 	}
 
-	public async addItem(newItem: IAccountBoxItem): Promise<void> {
+	public async addItem(newItem: IAppAccountBoxItem): Promise<void> {
 		Tracker.nonreactive(() => {
 			const actual = this.items.get();
-			actual.push(newItem as never);
+			actual.push(newItem);
 			this.items.set(actual);
 		});
 	}
 
-	public async deleteItem(item: IAccountBoxItem): Promise<void> {
+	public async deleteItem(item: IAppAccountBoxItem): Promise<void> {
 		Tracker.nonreactive(() => {
 			const actual = this.items.get();
-			const itemIndex = actual.findIndex((actualItem: IAccountBoxItem) => actualItem.appId === item.appId);
+			const itemIndex = actual.findIndex((actualItem: IAppAccountBoxItem) => actualItem.appId === item.appId);
 			actual.splice(itemIndex, 1);
 			this.items.set(actual);
 		});
 	}
 
-	public getItems(): IAccountBoxItem[] {
-		return this.items.get().filter((item: IAccountBoxItem) => applyDropdownActionButtonFilters(item));
+	public getItems(): (IAppAccountBoxItem | AccountBoxItem)[] {
+		return this.items.get().filter((item: IAppAccountBoxItem | AccountBoxItem) => {
+			if ('condition' in item) {
+				return item.condition();
+			}
+
+			return applyDropdownActionButtonFilters(item);
+		});
 	}
 }
 

apps/meteor/client/sidebar/header/UserDropdown.tsx

@@ -8,7 +8,7 @@ import React, { ReactElement } from 'react';
 
 import { triggerActionButtonAction } from '../../../app/ui-message/client/ActionManager';
 import { AccountBox, SideNav } from '../../../app/ui-utils/client';
-import { IAccountBoxItem } from '../../../app/ui-utils/client/lib/AccountBox';
+import { IAppAccountBoxItem, isAppAccountBoxItem } from '../../../app/ui-utils/client/lib/AccountBox';
 import { userStatus } from '../../../app/user-status/client';
 import { callbacks } from '../../../lib/callbacks';
 import MarkdownText from '../../components/MarkdownText';
@@ -105,7 +105,7 @@ const UserDropdown = ({ user, onClose }: UserDropdownProps): ReactElement => {
 
 	const accountBoxItems = useReactiveValue(getItems);
 
-	const appBoxItems = (): IAccountBoxItem[] => accountBoxItems.filter((item) => item.isAppButtonItem);
+	const appBoxItems = (): IAppAccountBoxItem[] => accountBoxItems.filter((item): item is IAppAccountBoxItem => isAppAccountBoxItem(item));
 
 	return (
 		<Box display='flex' flexDirection='column' w={!isMobile ? '244px' : undefined}>
@@ -176,7 +176,7 @@ const UserDropdown = ({ user, onClose }: UserDropdownProps): ReactElement => {
 					<Option.Divider />
 					{showAdmin && <Option icon={'customize'} label={t('Administration')} onClick={handleAdmin}></Option>}
 					{accountBoxItems
-						.filter((item) => !item.isAppButtonItem)
+						.filter((item) => !isAppAccountBoxItem(item))
 						.map((item, i) => {
 							const action = (): void => {
 								if (item.href) {