From 8bf82c1cf3456287c3d0141b84b14ed2ef02d46d Mon Sep 17 00:00:00 2001
From: csuadev <72958726+csuadev@users.noreply.github.com>
Date: Tue, 21 Mar 2023 14:52:19 -0500
Subject: [PATCH] fix: Offline register option (#28467)

* Chore: bring back the register on cloud option to CS

* refactor: move top option buttons to avoid repeat code

---------

Co-authored-by: Gabriel Casals <83978645+casalsgh@users.noreply.github.com>
---
 ...s => ManualWorkspaceRegistrationModal.tsx} |  8 +++--
 .../views/admin/cloud/RegisterWorkspace.tsx   | 10 ++++++
 .../components/RegisterWorkspaceMenu.tsx      | 34 +++++++++++++------
 .../rocketchat-i18n/i18n/en.i18n.json         |  2 +-
 4 files changed, 40 insertions(+), 14 deletions(-)
 rename apps/meteor/client/views/admin/cloud/{ManualWorkspaceRegistrationModal.js => ManualWorkspaceRegistrationModal.tsx} (83%)

diff --git a/apps/meteor/client/views/admin/cloud/ManualWorkspaceRegistrationModal.js b/apps/meteor/client/views/admin/cloud/ManualWorkspaceRegistrationModal.tsx
similarity index 83%
rename from apps/meteor/client/views/admin/cloud/ManualWorkspaceRegistrationModal.js
rename to apps/meteor/client/views/admin/cloud/ManualWorkspaceRegistrationModal.tsx
index 8b8c8d4bc6a..44e5e9f436a 100644
--- a/apps/meteor/client/views/admin/cloud/ManualWorkspaceRegistrationModal.js
+++ b/apps/meteor/client/views/admin/cloud/ManualWorkspaceRegistrationModal.tsx
@@ -10,7 +10,11 @@ const Steps = {
 	PASTE: 'paste',
 };
 
-function ManualWorkspaceRegistrationModal({ onClose, ...props }) {
+type ManualWorkspaceRegistrationModalProps = {
+	onClose: () => void;
+};
+
+const ManualWorkspaceRegistrationModal = ({ onClose, ...props }: ManualWorkspaceRegistrationModalProps) => {
 	const t = useTranslation();
 
 	const [step, setStep] = useState(Steps.COPY);
@@ -33,6 +37,6 @@ function ManualWorkspaceRegistrationModal({ onClose, ...props }) {
 				(step === Steps.PASTE && <PasteStep onBackButtonClick={handleBackButtonClick} onFinish={onClose} />)}
 		</Modal>
 	);
-}
+};
 
 export default ManualWorkspaceRegistrationModal;
diff --git a/apps/meteor/client/views/admin/cloud/RegisterWorkspace.tsx b/apps/meteor/client/views/admin/cloud/RegisterWorkspace.tsx
index 242e23e38bf..392a656d43e 100644
--- a/apps/meteor/client/views/admin/cloud/RegisterWorkspace.tsx
+++ b/apps/meteor/client/views/admin/cloud/RegisterWorkspace.tsx
@@ -6,6 +6,7 @@ import type { ReactNode } from 'react';
 import React from 'react';
 
 import Page from '../../../components/Page';
+import ManualWorkspaceRegistrationModal from './ManualWorkspaceRegistrationModal';
 import RegisterWorkspaceCards from './components/RegisterWorkspaceCards';
 import RegisterWorkspaceMenu from './components/RegisterWorkspaceMenu';
 import ConnectWorkspaceModal from './modals/ConnectWorkspaceModal';
@@ -35,6 +36,14 @@ const RegisterWorkspace = (): ReactNode => {
 		} else setModal(<RegisterWorkspaceModal onClose={handleModalClose} onStatusChange={reload} />);
 	};
 
+	const handleManualWorkspaceRegistrationButton = (): void => {
+		const handleModalClose = (): void => {
+			setModal(null);
+			reload();
+		};
+		setModal(<ManualWorkspaceRegistrationModal onClose={handleModalClose} />);
+	};
+
 	const handleRegistrationTag = () => {
 		if (!isWorkspaceRegistered && !isConnectedToCloud) {
 			return <Tag variant='secondary-danger'>{t('RegisterWorkspace_NotRegistered_Title')}</Tag>;
@@ -63,6 +72,7 @@ const RegisterWorkspace = (): ReactNode => {
 					isConnectedToCloud={isConnectedToCloud}
 					onClick={handleRegisterWorkspaceClick}
 					onStatusChange={reload}
+					onClickOfflineRegistration={handleManualWorkspaceRegistrationButton}
 				/>
 			</Page.Header>
 
diff --git a/apps/meteor/client/views/admin/cloud/components/RegisterWorkspaceMenu.tsx b/apps/meteor/client/views/admin/cloud/components/RegisterWorkspaceMenu.tsx
index ce14fc3016c..3b41630afb2 100644
--- a/apps/meteor/client/views/admin/cloud/components/RegisterWorkspaceMenu.tsx
+++ b/apps/meteor/client/views/admin/cloud/components/RegisterWorkspaceMenu.tsx
@@ -9,10 +9,17 @@ type RegisterWorkspaceMenuProps = {
 	isWorkspaceRegistered: boolean | string;
 	isConnectedToCloud: boolean | string;
 	onClick: () => void;
+	onClickOfflineRegistration: () => void;
 	onStatusChange?: () => void;
 };
 
-const RegisterWorkspaceMenu = ({ isWorkspaceRegistered, isConnectedToCloud, onClick, onStatusChange }: RegisterWorkspaceMenuProps) => {
+const RegisterWorkspaceMenu = ({
+	isWorkspaceRegistered,
+	isConnectedToCloud,
+	onClick,
+	onClickOfflineRegistration,
+	onStatusChange,
+}: RegisterWorkspaceMenuProps) => {
 	const t = useTranslation();
 	const setModal = useSetModal();
 
@@ -21,6 +28,19 @@ const RegisterWorkspaceMenu = ({ isWorkspaceRegistered, isConnectedToCloud, onCl
 		setModal(<RegisteredWorkspaceModal onClose={handleModalClose} onStatusChange={onStatusChange} />);
 	};
 
+	const renderTopOptionButtons = () => {
+		const title = isWorkspaceRegistered ? t('ConnectWorkspace_Button') : t('RegisterWorkspace_Button');
+
+		return (
+			<ButtonGroup>
+				<Button onClick={onClickOfflineRegistration}>{t('Cloud_Register_manually')}</Button>
+				<Button primary onClick={onClick}>
+					{title}
+				</Button>
+			</ButtonGroup>
+		);
+	};
+
 	return (
 		<ButtonGroup>
 			{isWorkspaceRegistered && isConnectedToCloud && (
@@ -35,16 +55,8 @@ const RegisterWorkspaceMenu = ({ isWorkspaceRegistered, isConnectedToCloud, onCl
 					</Button>
 				</>
 			)}
-			{isWorkspaceRegistered && !isConnectedToCloud && (
-				<Button primary onClick={onClick}>
-					{t('ConnectWorkspace_Button')}
-				</Button>
-			)}
-			{!isWorkspaceRegistered && (
-				<Button primary onClick={onClick}>
-					{t('RegisterWorkspace_Button')}
-				</Button>
-			)}
+			{isWorkspaceRegistered && !isConnectedToCloud && renderTopOptionButtons()}
+			{!isWorkspaceRegistered && renderTopOptionButtons()}
 		</ButtonGroup>
 	);
 };
diff --git a/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json b/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json
index 736ce48a4c0..70821c3cc79 100644
--- a/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json
+++ b/apps/meteor/packages/rocketchat-i18n/i18n/en.i18n.json
@@ -990,7 +990,7 @@
   "Cloud_Apply_license": "Apply license",
   "Cloud_connectivity": "Cloud Connectivity",
   "Cloud_address_to_send_registration_to": "The address to send your Cloud registration email to.",
-  "Cloud_click_here": "After copy the text, go to [cloud console (click here)](__cloudConsoleUrl__).",
+  "Cloud_click_here": "After copying the text, go to [cloud console (click here)](__cloudConsoleUrl__).",
   "Cloud_console": "Cloud Console",
   "Cloud_error_code": "Code:  __errorCode__",
   "Cloud_error_in_authenticating": "Error received while authenticating",