chore: fetch all slashcommands on startup (#34167)

apps/meteor/client/hooks/useAppSlashCommands.ts

@@ -1,6 +1,7 @@
+import type { SlashCommand } from '@rocket.chat/core-typings';
 import { useDebouncedCallback } from '@rocket.chat/fuselage-hooks';
 import { useEndpoint, useStream, useUserId } from '@rocket.chat/ui-contexts';
-import { useQuery, useQueryClient } from '@tanstack/react-query';
+import { useQueryClient, useQuery } from '@tanstack/react-query';
 import { useEffect } from 'react';
 
 import { slashCommands } from '../../app/utils/client/slashCommand';
@@ -35,10 +36,29 @@ export const useAppSlashCommands = () => {
 
 	const getSlashCommands = useEndpoint('GET', '/v1/commands.list');
 
-	useQuery(['apps', 'slashCommands'], () => getSlashCommands(), {
-		enabled: !!uid,
-		onSuccess(data) {
-			data.commands.forEach((command) => slashCommands.add(command));
+	useQuery(
+		['apps', 'slashCommands'],
+		async () => {
+			let allCommands: Pick<SlashCommand, 'clientOnly' | 'command' | 'description' | 'params' | 'providesPreview' | 'appId'>[] = [];
+			let hasMore = true;
+			let offset = 0;
+			const count = 50;
+
+			while (hasMore) {
+				// eslint-disable-next-line no-await-in-loop
+				const { commands, total } = await getSlashCommands({ offset, count });
+				allCommands = allCommands.concat(commands);
+				hasMore = allCommands.length < total;
+				offset += count;
+			}
+
+			return allCommands;
 		},
-	});
+		{
+			enabled: !!uid,
+			onSuccess(data) {
+				data.forEach((command) => slashCommands.add(command));
+			},
+		},
+	);
 };