RocketChat · ggazzo · Feb 18, 2023 · Nov 25, 2022 · Nov 28, 2022 · Nov 29, 2022
@@ -9,7 +9,7 @@ import { Meteor } from 'meteor/meteor';
 import { Tracker } from 'meteor/tracker';
 import type { AppScreenshot, Serialized } from '@rocket.chat/core-typings';
 
-import type { App } from '../../../client/views/admin/apps/types';
+import type { App } from '../../../client/views/marketplace/types';
 import { dispatchToastMessage } from '../../../client/lib/toast';
 import { settings } from '../../settings/client';
 import { CachedCollectionManager } from '../../ui-cached-collection';

@@ -15,7 +15,7 @@ type AppsModelListProps = {
 
 const AppsModelList = ({ appBoxItems, appsManagementAllowed, onDismiss }: AppsModelListProps): ReactElement => {
 	const t = useTranslation();
-	const marketplaceRoute = useRoute('admin-marketplace');
+	const marketplaceRoute = useRoute('marketplace');
 	const page = 'list';
 
 	return (
@@ -28,7 +28,7 @@ const AppsModelList = ({ appBoxItems, appsManagementAllowed, onDismiss }: AppsMo
 							icon='store'
 							text={t('Marketplace')}
 							action={(): void => {
-								marketplaceRoute.push({ context: 'all', page });
+								marketplaceRoute.push({ context: 'explore', page });
 								onDismiss();
 							}}
 						/>

@@ -17,6 +17,7 @@ import './methods/toggleFavorite';
 import './methods/updateMessage';
 import './startup';
 import './views/admin';
+import './views/marketplace';
 import './views/account';
 import './views/teams';
 import './templates';
@@ -22,12 +22,12 @@ import WorkspaceLoginSection from './WorkspaceLoginSection';
 import WorkspaceRegistrationSection from './WorkspaceRegistrationSection';
 import { cloudConsoleUrl } from './constants';
 
-const CloudPage = function CloudPage(): ReactNode {
+const CloudPage = (): ReactNode => {
 	const t = useTranslation();
+	const setModal = useSetModal();
 	const dispatchToastMessage = useToastMessageDispatch();
 
 	const cloudRoute = useRoute('cloud');
-
 	const page = useRouteParameter('page');
 
 	const errorCode = useQueryStringParameter('error_code');
@@ -36,13 +36,12 @@ const CloudPage = function CloudPage(): ReactNode {
 	const token = useQueryStringParameter('token');
 
 	const finishOAuthAuthorization = useMethod('cloud:finishOAuthAuthorization');
-
 	const checkCloudRegisterStatus = useMethod('cloud:checkRegisterStatus');
+	const connectWorkspace = useMethod('cloud:connectWorkspace');
+
 	const result = useQuery(['admin/cloud/register-status'], async () => checkCloudRegisterStatus());
 	const reload = useMutableCallback(() => result.refetch());
 
-	const connectWorkspace = useMethod('cloud:connectWorkspace');
-
 	useEffect(() => {
 		const acceptOAuthAuthorization = async (): Promise<void> => {
 			if (page !== 'oauth-callback') {
@@ -61,7 +60,7 @@ const CloudPage = function CloudPage(): ReactNode {
 
 			try {
 				await finishOAuthAuthorization(code, state);
-			} catch (error: unknown) {
+			} catch (error) {
 				dispatchToastMessage({ type: 'error', message: error });
 			} finally {
 				cloudRoute.push();
@@ -71,8 +70,6 @@ const CloudPage = function CloudPage(): ReactNode {
 		acceptOAuthAuthorization();
 	}, [errorCode, code, state, page, dispatchToastMessage, t, cloudRoute, finishOAuthAuthorization]);
 
-	const setModal = useSetModal();
-
 	useEffect(() => {
 		const acceptWorkspaceToken = async (): Promise<void> => {
 			try {
@@ -85,7 +82,7 @@ const CloudPage = function CloudPage(): ReactNode {
 
 					dispatchToastMessage({ type: 'success', message: t('Connected') });
 				}
-			} catch (error: unknown) {
+			} catch (error) {
 				dispatchToastMessage({ type: 'error', message: error });
 			} finally {
 				reload();

@@ -16,16 +16,6 @@ registerAdminRoute('/custom-sounds/:context?/:id?', {
 	component: lazy(() => import('./customSounds/AdminSoundsRoute')),
 });
 
-registerAdminRoute('/apps/what-is-it', {
-	name: 'admin-apps-disabled',
-	component: lazy(() => import('./apps/AppsWhatIsIt')),
-});
-
-registerAdminRoute('/marketplace/:context?/:page?/:id?/:version?/:tab?', {
-	name: 'admin-marketplace',
-	component: lazy(() => import('./apps/AppsRoute')),
-});
-
 registerAdminRoute('/info', {
 	name: 'admin-info',
 	component: lazy(() => import('./info/InformationRoute')),

@@ -61,12 +61,6 @@ export const {
 		i18nLabel: 'Federation Dashboard',
 		permissionGranted: (): boolean => hasPermission('view-federation-data'),
 	},
-	{
-		icon: 'cube',
-		href: 'admin-marketplace',
-		i18nLabel: 'Apps',
-		permissionGranted: (): boolean => hasPermission('manage-apps'),
-	},
 	{
 		icon: 'mail',
 		href: 'admin-email-inboxes',

@@ -6,9 +6,9 @@ import { useTranslation, useCurrentRoute, useRoute, useRouteParameter, useToastM
 import type { ReactElement } from 'react';
 import React, { useState, useCallback, useRef } from 'react';
 
-import type { ISettings } from '../../../../../app/apps/client/@types/IOrchestrator';
-import { Apps } from '../../../../../app/apps/client/orchestrator';
-import Page from '../../../../components/Page';
+import type { ISettings } from '../../../../app/apps/client/@types/IOrchestrator';
+import { Apps } from '../../../../app/apps/client/orchestrator';
+import Page from '../../../components/Page';
 import { handleAPIError } from '../helpers';
 import { useAppInfo } from '../hooks/useAppInfo';
 import AppDetailsPageHeader from './AppDetailsPageHeader';

@@ -5,13 +5,13 @@ import moment from 'moment';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import AppAvatar from '../../../../components/avatar/AppAvatar';
+import AppAvatar from '../../../components/avatar/AppAvatar';
 import AppMenu from '../AppMenu';
 import BundleChips from '../BundleChips';
 import { appIncompatibleStatusProps } from '../helpers';
 import AppStatus from './tabs/AppStatus';
 
-const versioni18nKey = (app: App): string => {
+const getAppVersion = (app: App): string => {
 	const { version, marketplaceVersion, marketplace } = app;
 	if (typeof marketplace === 'boolean') {
 		return marketplaceVersion;
@@ -48,9 +48,7 @@ const AppDetailsPageHeader = ({ app }: { app: App }): ReactElement => {
 					</Box>
 					<Box is='span'> | </Box>
 
-					<Box mi='x16' marginInlineEnd='x4'>
-						{t('Version_version', { version: versioni18nKey(app) })}
-					</Box>
+					<Box mi='x16'>{t('Version_version', { version: getAppVersion(app) })}</Box>
 
 					{versionIncompatible && (
 						<Box is='span' marginInlineEnd='x16' marginBlockStart='x4'>

@@ -3,7 +3,7 @@ import { useTranslation } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import { useFormatDateAndTime } from '../../../../../../hooks/useFormatDateAndTime';
+import { useFormatDateAndTime } from '../../../../../hooks/useFormatDateAndTime';
 import AccordionLoading from '../../../AccordionLoading';
 import { useLogs } from '../../../hooks/useLogs';
 import AppLogsItem from './AppLogsItem';

@@ -3,7 +3,7 @@ import { useTranslation } from '@rocket.chat/ui-contexts';
 import type { FC } from 'react';
 import React from 'react';
 
-import { useHighlightedCode } from '../../../../../../hooks/useHighlightedCode';
+import { useHighlightedCode } from '../../../../../hooks/useHighlightedCode';
 
 type AppLogsItemEntryProps = {
 	severity: string;

@@ -3,8 +3,8 @@ import { Accordion } from '@rocket.chat/fuselage';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import { useEndpointData } from '../../../../../../hooks/useEndpointData';
-import { AsyncStatePhase } from '../../../../../../lib/asyncState/AsyncStatePhase';
+import { useEndpointData } from '../../../../../hooks/useEndpointData';
+import { AsyncStatePhase } from '../../../../../lib/asyncState/AsyncStatePhase';
 import AccordionLoading from '../../../AccordionLoading';
 import AppReleasesItem from './AppReleasesItem';
 

@@ -3,7 +3,7 @@ import { useTranslation } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import { useTimeAgo } from '../../../../../../hooks/useTimeAgo';
+import { useTimeAgo } from '../../../../../hooks/useTimeAgo';
 
 type IRelease = {
 	version: string;

diff --git a/.../apps/AppDetailsPage/tabs/AppSecurity.tsx → ...place/AppDetailsPage/tabs/AppSecurity.tsx b/.../apps/AppDetailsPage/tabs/AppSecurity.tsx → ...place/AppDetailsPage/tabs/AppSecurity.tsx
@@ -4,8 +4,8 @@ import { useRouteParameter, useTranslation } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import React, { useMemo, useCallback } from 'react';
 
-import MarkdownText from '../../../../../../components/MarkdownText';
-import MemoizedSetting from '../../../../settings/MemoizedSetting';
+import MarkdownText from '../../../../../components/MarkdownText';
+import MemoizedSetting from '../../../../admin/settings/MemoizedSetting';
 
 type AppTranslationFunction = {
 	(key: string, ...replaces: unknown[]): string;

@@ -5,8 +5,8 @@ import { useTranslation } from '@rocket.chat/ui-contexts';
 import type { FC, MutableRefObject } from 'react';
 import React, { useMemo, useEffect } from 'react';
 
-import type { ISettings } from '../../../../../../../app/apps/client/@types/IOrchestrator';
-import { useForm } from '../../../../../../hooks/useForm';
+import type { ISettings } from '../../../../../../app/apps/client/@types/IOrchestrator';
+import { useForm } from '../../../../../hooks/useForm';
 import AppSettingsAssembler from './AppSettingsAssembler';
 
 type AppSettingsProps = {

@@ -4,7 +4,7 @@ import { capitalize } from '@rocket.chat/string-helpers';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import type { ISettings } from '../../../../../../../app/apps/client/@types/IOrchestrator';
+import type { ISettings } from '../../../../../../app/apps/client/@types/IOrchestrator';
 import AppSetting from './AppSetting';
 
 type AppSettingsAssemblerProps = {

@@ -6,7 +6,7 @@ import { useSetModal, useMethod, useTranslation } from '@rocket.chat/ui-contexts
 import type { ReactElement } from 'react';
 import React, { useCallback, useState, memo, Fragment } from 'react';
 
-import { Apps } from '../../../../../../../app/apps/client/orchestrator';
+import { Apps } from '../../../../../../app/apps/client/orchestrator';
 import AppPermissionsReviewModal from '../../../AppPermissionsReviewModal';
 import CloudLoginModal from '../../../CloudLoginModal';
 import IframeModal from '../../../IframeModal';

@@ -11,10 +11,10 @@ import {
 } from '@rocket.chat/ui-contexts';
 import React, { useCallback, useEffect, useState } from 'react';
 
-import { Apps } from '../../../../app/apps/client/orchestrator';
-import Page from '../../../components/Page';
-import { useFileInput } from '../../../hooks/useFileInput';
-import { useForm } from '../../../hooks/useForm';
+import { Apps } from '../../../app/apps/client/orchestrator';
+import Page from '../../components/Page';
+import { useFileInput } from '../../hooks/useFileInput';
+import { useForm } from '../../hooks/useForm';
 import AppPermissionsReviewModal from './AppPermissionsReviewModal';
 import AppUpdateModal from './AppUpdateModal';
 import { useAppsReload } from './AppsContext';

@@ -12,8 +12,8 @@ import {
 import React, { useMemo, useCallback, useState } from 'react';
 import semver from 'semver';
 
-import { Apps } from '../../../../app/apps/client/orchestrator';
-import WarningModal from '../../../components/WarningModal';
+import { Apps } from '../../../app/apps/client/orchestrator';
+import WarningModal from '../../components/WarningModal';
 import AppPermissionsReviewModal from './AppPermissionsReviewModal';
 import CloudLoginModal from './CloudLoginModal';
 import IframeModal from './IframeModal';

@@ -3,7 +3,7 @@ import { useTranslation } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import GenericModal from '../../../components/GenericModal';
+import GenericModal from '../../components/GenericModal';
 import AppPermissionsList from './components/AppPermissionsList';
 
 type AppPermissionsReviewModalProps = {

@@ -1,7 +1,7 @@
 import { createContext, useContext } from 'react';
 
-import type { AsyncState } from '../../../lib/asyncState';
-import { AsyncStatePhase } from '../../../lib/asyncState';
+import type { AsyncState } from '../../lib/asyncState';
+import { AsyncStatePhase } from '../../lib/asyncState';
 import type { App } from './types';
 
 type AppsContextValue = {

@@ -7,7 +7,7 @@ import type { KeyboardEvent, MouseEvent, ReactElement } from 'react';
 import React, { memo } from 'react';
 import semver from 'semver';
 
-import AppAvatar from '../../../../components/avatar/AppAvatar';
+import AppAvatar from '../../../components/avatar/AppAvatar';
 import AppStatus from '../AppDetailsPage/tabs/AppStatus/AppStatus';
 import AppMenu from '../AppMenu';
 import BundleChips from '../BundleChips';
@@ -34,6 +34,7 @@ const AppRow = (props: AppRowProps): ReactElement => {
 				page: 'info',
 				version: marketplaceVersion,
 				id,
+				tab: 'details',
 			});
 	};
 

@@ -3,7 +3,7 @@ import { useTranslation } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import React from 'react';
 
-import FilterByText from '../../../../components/FilterByText';
+import FilterByText from '../../../components/FilterByText';
 import CategoryDropDown from '../components/CategoryFilter/CategoryDropDown';
 import TagList from '../components/CategoryFilter/TagList';
 import RadioDropDown from '../components/RadioDropDown/RadioDropDown';

@@ -1,9 +1,9 @@
-import { Button, ButtonGroup, Icon, Skeleton, Tabs } from '@rocket.chat/fuselage';
+import { Button, ButtonGroup, Icon, Skeleton } from '@rocket.chat/fuselage';
 import { useRoute, useSetting, useMethod, useTranslation, useCurrentRoute, useRouteParameter } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import React, { useEffect, useState } from 'react';
 
-import Page from '../../../../components/Page';
+import Page from '../../../components/Page';
 import AppsPageContent from './AppsPageContent';
 
 type AppsPageProps = {
@@ -42,10 +42,6 @@ const AppsPage = ({ isMarketplace }: AppsPageProps): ReactElement => {
 		context && router.push({ context, page: 'install' });
 	};
 
-	const handleMarketplaceTabClick = (): void => router.push({ context: 'all', page: 'list' });
-
-	const handleInstalledTabClick = (): void => router.push({ context: 'installed', page: 'list' });
-
 	return (
 		<Page background='tint'>
 			<Page.Header title={t('Apps')}>
@@ -68,15 +64,7 @@ const AppsPage = ({ isMarketplace }: AppsPageProps): ReactElement => {
 					)}
 				</ButtonGroup>
 			</Page.Header>
-			<Tabs>
-				<Tabs.Item onClick={handleMarketplaceTabClick} selected={context === 'all'}>
-					{t('Marketplace')}
-				</Tabs.Item>
-				<Tabs.Item onClick={handleInstalledTabClick} selected={context === 'installed'}>
-					{t('Installed')}
-				</Tabs.Item>
-			</Tabs>
-			<Page.Content overflowY='auto'>
+			<Page.Content>
 				<AppsPageContent />
 			</Page.Content>
 		</Page>