[NEW] Warning Popup reinforcing Zapier deprecation on Integrations Admin settings

apps/meteor/client/views/admin/integrations/new/NewZapier.js

@@ -1,4 +1,4 @@
-import { Box, Skeleton, Margins } from '@rocket.chat/fuselage';
+import { Box, Skeleton, Margins, Banner, Icon } from '@rocket.chat/fuselage';
 import { useTranslation } from '@rocket.chat/ui-contexts';
 import React, { useEffect, useState } from 'react';
 
@@ -16,8 +16,8 @@ const blogSpotStyleScriptImport = (src) =>
 	});
 
 export default function NewZapier({ ...props }) {
-	const t = useTranslation();
 	const [script, setScript] = useState();
+	const t = useTranslation();
 	useEffect(() => {
 		const importZapier = async () => {
 			const scriptEl = await blogSpotStyleScriptImport(
@@ -33,7 +33,14 @@ export default function NewZapier({ ...props }) {
 
 	return (
 		<>
-			<Box pb='x20' fontScale='h4' dangerouslySetInnerHTML={{ __html: t('additional_integrations_Zapier') }} />
+			<Banner
+				icon={<Icon name='warning' />}
+				title={t('This_is_a_deprecated_feature_alert')}
+				variant='warning'
+				style={{ marginInline: '-1.5rem' }}
+			>
+				{t('Install_Zapier_from_marketplace')}
+			</Banner>
 			{!script && (
 				<Box display='flex' flexDirection='column' alignItems='stretch' mbs={10}>
 					<Margins blockEnd={14}>

apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json

@@ -4763,6 +4763,7 @@
   "This_feature_is_currently_in_alpha": "This feature is currently in alpha!",
   "This_is_a_desktop_notification": "This is a desktop notification",
   "This_is_a_deprecated_feature_alert": "This is a deprecated feature. It may not work as expected and will not get new updates.",
+  "Install_Zapier_from_marketplace": "Install the Zapier app from Marketplace to avoid disruptions.",
   "This_is_a_push_test_messsage": "This is a push test message",
   "This_message_was_rejected_by__peer__peer": "This message was rejected by <em>__peer__</em> peer.",
   "This_monitor_was_already_selected": "This monitor was already selected",