From 1a048587d9add8d1ed26807f4b16de35142604ed Mon Sep 17 00:00:00 2001
From: Eric Tuvesson <eric.tuvesson@gmail.com>
Date: Fri, 31 May 2024 08:58:17 +0200
Subject: [PATCH] feat(editor): Tooltip support multiple fineTypes (#28)

---
 .../src/components/popups/Tooltip/Tooltip.tsx    | 16 ++++++++++++----
 .../CloudServiceCard/CloudServiceCard.tsx        |  5 ++++-
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/packages/noodl-core-ui/src/components/popups/Tooltip/Tooltip.tsx b/packages/noodl-core-ui/src/components/popups/Tooltip/Tooltip.tsx
index 798153e..5ed516f 100644
--- a/packages/noodl-core-ui/src/components/popups/Tooltip/Tooltip.tsx
+++ b/packages/noodl-core-ui/src/components/popups/Tooltip/Tooltip.tsx
@@ -11,7 +11,7 @@ import css from './Tooltip.module.scss';
 
 export interface TooltipProps extends UnsafeStyleProps {
   content: SingleSlot;
-  fineType?: string;
+  fineType?: string | string[];
   children: Slot;
   showAfterMs?: number;
 
@@ -79,9 +79,17 @@ export function Tooltip({
 
         {fineType && (
           <div className={css['FineType']}>
-            <Label size={LabelSize.Small} variant={TextType.Secondary}>
-              {fineType}
-            </Label>
+            {Array.isArray(fineType) ? (
+              fineType.map((x) => (
+                <Label size={LabelSize.Small} variant={TextType.Secondary}>
+                  {x}
+                </Label>
+              ))
+            ) : (
+              <Label size={LabelSize.Small} variant={TextType.Secondary}>
+                {fineType}
+              </Label>
+            )}
           </div>
         )}
       </BaseDialog>
diff --git a/packages/noodl-editor/src/editor/src/views/panels/CloudServicePanel/CloudServiceCard/CloudServiceCard.tsx b/packages/noodl-editor/src/editor/src/views/panels/CloudServicePanel/CloudServiceCard/CloudServiceCard.tsx
index 307f335..22903ff 100644
--- a/packages/noodl-editor/src/editor/src/views/panels/CloudServicePanel/CloudServiceCard/CloudServiceCard.tsx
+++ b/packages/noodl-editor/src/editor/src/views/panels/CloudServicePanel/CloudServiceCard/CloudServiceCard.tsx
@@ -123,7 +123,10 @@ export function CloudServiceCard({
           {isEditorEnvironment && (
             <Tooltip
               content="Open the Parse Dashboard"
-              fineType={`${Keybindings.CLOUD_SERVICE_OPEN_DASHBOARD.label} in window or ${Keybindings.CLOUD_SERVICE_OPEN_DASHBOARD_BROWSER.label} to open in browsers`}
+              fineType={[
+                `In Window: ${Keybindings.CLOUD_SERVICE_OPEN_DASHBOARD.label}`,
+                `In Browser: ${Keybindings.CLOUD_SERVICE_OPEN_DASHBOARD_BROWSER.label}`
+              ]}
               renderDirection={DialogRenderDirection.Below}
             >
               <PrimaryButton