From e02cf1596339bbe45ce49ed92f55f54ce2620fd3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Diana=20L=C3=B3pez=20Alvas?= <dlopezalvas@gmail.com>
Date: Mon, 2 Dec 2024 16:20:45 -0300
Subject: [PATCH] removing toolboxPreview flag

---
 .../ToolBoxEditor/ToolBoxEditor.tsx           | 20 ++++++++-----------
 .../ToolBoxEditor/ToolboxPreview.tsx          |  2 +-
 2 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolBoxEditor.tsx b/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolBoxEditor.tsx
index a4629cfa..094b59bc 100644
--- a/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolBoxEditor.tsx
+++ b/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolBoxEditor.tsx
@@ -14,9 +14,7 @@ import { useThemeContext } from "../../../../../theme/ThemeContext";
 
 export const ToolBoxEditor = () => {
 
-    const shouldShow = process.env.NODE_ENV !== 'production'
-
-    const [contentHeight,] = useState(window.innerHeight*0.7)
+    const [contentHeight,] = useState(window.innerHeight * 0.7)
 
     const { t } = useTranslation('creator');
     const { isSmallScreen } = useThemeContext()
@@ -63,17 +61,15 @@ export const ToolBoxEditor = () => {
             onCancel={handleOnCancel}
             title={`${t('toolbox.title')}${t(`selection.cards.${challenge.scene.type}.name`)}`}
             noScrollable={true}
-            dialogProps={{ maxWidth: "md"}}>
+            dialogProps={{ maxWidth: "md" }}>
             <Stack direction="row">
-                <PBCard sx={{display:"flex", maxWidth: isSmallScreen ? '50%' : 'inherit', flexDirection:"column", padding:"5px", maxHeight:`${contentHeight}px`}}> 
-                    <CategorizedToggle toolboxState={toolboxState} isCategorized={isCategorized} setIsCategorized={setIsCategorized}/>
-                    <BlocksSelector toolboxState={toolboxState} setToolBoxItems={setToolBoxItems} toolBoxItems={toolBoxItems} availableBlocks={availableBlocksFor(challenge!.scene.type)}/>
+                <PBCard sx={{ display: "flex", maxWidth: isSmallScreen ? '50%' : 'inherit', flexDirection: "column", padding: "5px", maxHeight: `${contentHeight}px` }}>
+                    <CategorizedToggle toolboxState={toolboxState} isCategorized={isCategorized} setIsCategorized={setIsCategorized} />
+                    <BlocksSelector toolboxState={toolboxState} setToolBoxItems={setToolBoxItems} toolBoxItems={toolBoxItems} availableBlocks={availableBlocksFor(challenge!.scene.type)} />
                 </PBCard>
-                {shouldShow ? <ToolboxPreview 
+                <ToolboxPreview
                     blockIds={toolBoxItems}
-                    categorized={isCategorized || toolboxState.categorizationShouldBeForced()}/>
-                    :<></>
-                }
+                    categorized={isCategorized || toolboxState.categorizationShouldBeForced()} />
             </Stack>
         </GenericModalDialog>
     </>
@@ -108,7 +104,7 @@ export class ToolboxState {
         return this.categories.find(category => category.id === categoryId)!.isSelected()
     }
 
-    categorizationShouldBeForced() { 
+    categorizationShouldBeForced() {
         return this.isCategorySelected(PROCEDURE_CATEGORY) //If this category is selected, the categorization should always be enabled
     }
 }
diff --git a/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolboxPreview.tsx b/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolboxPreview.tsx
index 01977dff..15674fbf 100644
--- a/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolboxPreview.tsx
+++ b/src/components/creator/Editor/ChallengeDetailsEdition/ToolBoxEditor/ToolboxPreview.tsx
@@ -18,7 +18,7 @@ export const ToolboxPreview = ({ categorized, blockIds }: ToolboxPreviewProps) =
   } : {} // used only in toolboxpreview to show blocks under the categories
 
   return <PBBlocklyWorkspace
-    sx={{ minWidth: isSmallScreen ? "auto" : "50%", padding: "5px", display: "flex", flexDirection: "column", ...sx }}
+    sx={{ minWidth: isSmallScreen ? "auto" : "58%", padding: "5px", display: "flex", flexDirection: "column", ...sx }}
     title
     blockIds={blockIds}
     categorized={categorized}