Merge branch 'main' of github.com:wpilibsuite/systemcore-blocks-interface into pr_mrc_port

Author: lizlooney

src/App.tsx

@@ -38,6 +38,7 @@ import { MUTATOR_BLOCK_NAME, PARAM_CONTAINER_BLOCK_NAME, MethodMutatorArgBlock }
 export const BLOCK_NAME = 'mrc_class_method_def';
 
 export const FIELD_METHOD_NAME = 'NAME';
+export const RETURN_VALUE = 'RETURN';
 
 type Parameter = {
     name: string,
@@ -54,6 +55,7 @@ interface ClassMethodDefMixin extends ClassMethodDefMixinType {
     mrcParameters: Parameter[],
     mrcPythonMethodName: string,
     mrcFuncName: string | null,
+    mrcUpdateReturnInput(): void,
 }
 type ClassMethodDefMixinType = typeof CLASS_METHOD_DEF;
 
@@ -179,6 +181,7 @@ const CLASS_METHOD_DEF = {
             (this as Blockly.BlockSvg).setMutator(null);
         }
         this.mrcUpdateParams();
+        this.mrcUpdateReturnInput();
     },
     compose: function (this: ClassMethodDefBlock, containerBlock: any) {
         // Parameter list.
@@ -250,6 +253,21 @@ const CLASS_METHOD_DEF = {
             }
         }
     },
+    mrcUpdateReturnInput: function (this: ClassMethodDefBlock) {
+        // Remove existing return input if it exists
+        if (this.getInput(RETURN_VALUE)) {
+            this.removeInput(RETURN_VALUE);
+        }
+        
+        // Add return input if return type is not 'None'
+        if (this.mrcReturnType && this.mrcReturnType !== 'None') {
+            this.appendValueInput(RETURN_VALUE)
+                .setAlign(Blockly.inputs.Align.RIGHT)
+                .appendField(Blockly.Msg.PROCEDURES_DEFRETURN_RETURN);
+            // Move the return input to be after the statement input
+            this.moveInputBefore('STACK', RETURN_VALUE);
+        }
+    },
     removeParameterFields: function (input: Blockly.Input) {
         const fieldsToRemove = input.fieldRow
             .filter(field => field.name?.startsWith('PARAM_'))
@@ -502,6 +520,23 @@ export function createCustomMethodBlock(): toolboxItems.Block {
   return new toolboxItems.Block(BLOCK_NAME, extraState, fields, null);
 }
 
+export function createCustomMethodBlockWithReturn(): toolboxItems.Block {
+    const extraState: ClassMethodDefExtraState = {
+        canChangeSignature: true,
+        canBeCalledWithinClass: true,
+        canBeCalledOutsideClass: true,
+        returnType: 'Any',
+        params: [],
+    };
+    const fields: {[key: string]: any} = {};
+    fields[FIELD_METHOD_NAME] = 'my_method_with_return';
+    const inputs: {[key: string]: any} = {};
+    inputs[RETURN_VALUE] = {
+        'type': 'input_value',
+    };
+    return new toolboxItems.Block(BLOCK_NAME, extraState, fields, inputs);
+}
+
 export function getBaseClassBlocks(
     baseClassName: string): toolboxItems.Block[] {
   const blocks: toolboxItems.Block[] = [];

src/blocks/mrc_class_method_def.ts

@@ -43,6 +43,8 @@
     "BLOCKS": "Blocks",
     "CODE": "Code",
     "COPY": "Copy",
+    "COLLAPSE": "Collapse",
+    "EXPAND": "Expand",
     "FAILED_TO_RENAME_PROJECT": "Failed to rename project",
     "FAILED_TO_COPY_PROJECT": "Failed to copy project",
     "FAILED_TO_CREATE_PROJECT": "Failed to create a new project.",

src/i18n/locales/en/translation.json

@@ -40,6 +40,8 @@
     "BLOCKS": "Bloques",
     "CODE": "Código",
     "COPY": "Copiar",
+    "COLLAPSE": "Colapsar",
+    "EXPAND": "Expandir",
     "FAILED_TO_RENAME_PROJECT": "Error al renombrar proyecto",
     "FAILED_TO_COPY_PROJECT": "Error al copiar proyecto",
     "FAILED_TO_CREATE_PROJECT": "Error al crear un nuevo proyecto.",

src/i18n/locales/es/translation.json

@@ -43,6 +43,8 @@
   "BLOCKS": "בלוקים",
   "CODE": "קוד",
   "COPY": "העתק",
+  "COLLAPSE": "כווץ",
+  "EXPAND": "הרחב",
     "FAILED_TO_RENAME_PROJECT": "נכשל בשינוי שם הפרויקט",
     "FAILED_TO_COPY_PROJECT": "נכשל בהעתקת הפרויקט",
     "FAILED_TO_CREATE_PROJECT": "נכשל ביצירת פרויקט חדש.",

src/i18n/locales/he/translation.json

@@ -22,6 +22,7 @@ import * as Antd from 'antd';
 import * as React from 'react';
 import { CopyOutlined as CopyIcon } from '@ant-design/icons';
 import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
+import SiderCollapseTrigger from './SiderCollapseTrigger';
 import { dracula, oneLight } from 'react-syntax-highlighter/dist/esm/styles/prism';
 
 import type { MessageInstance } from 'antd/es/message/interface';
@@ -36,6 +37,8 @@ interface CodeDisplayProps {
   theme: string;
   messageApi: MessageInstance;
   setAlertErrorMessage: StringFunction;
+  isCollapsed?: boolean;
+  onToggleCollapse?: () => void;
 }
 
 /** Success message for copy operation. */
@@ -110,10 +113,26 @@ export default function CodeDisplay(props: CodeDisplayProps): React.JSX.Element
     </SyntaxHighlighter>
   );
 
+  /** Renders the collapse/expand trigger at the bottom center of the panel. */
+  const renderCollapseTrigger = (): React.JSX.Element | null => {
+    if (!props.onToggleCollapse) return null;
+    
+    return (
+      <SiderCollapseTrigger
+        collapsed={props.isCollapsed || false}
+        onToggle={props.onToggleCollapse}
+        isRightPanel={true}
+      />
+    );
+  };
+
   return (
-    <Antd.Flex vertical gap="small" style={{ height: '100%' }}>
-      {renderHeader()}
-      {renderCodeBlock()}
-    </Antd.Flex>
+    <div style={{ height: '100%', position: 'relative' }}>
+      <Antd.Flex vertical gap="small" style={{ height: '100%' }}>
+        {renderHeader()}
+        {renderCodeBlock()}
+      </Antd.Flex>
+      {renderCollapseTrigger()}
+    </div>
   );
 }

src/reactComponents/CodeDisplay.tsx

@@ -0,0 +1,82 @@
+/**
+ * @license
+ * Copyright 2025 Porpoiseful LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @author [email protected] (Alan Smith)
+ */
+import * as React from 'react';
+import * as Antd from 'antd';
+import { LeftOutlined, RightOutlined } from '@ant-design/icons';
+import { useTranslation } from 'react-i18next';
+
+/** Props for the SiderCollapseTrigger component. */
+interface SiderCollapseTriggerProps {
+  collapsed: boolean;
+  onToggle: () => void;
+  isRightPanel?: boolean;
+}
+
+/**
+ * Custom collapse trigger for Sider that matches the right panel's appearance.
+ */
+export default function SiderCollapseTrigger(props: SiderCollapseTriggerProps): React.JSX.Element {
+  const { token } = Antd.theme.useToken();
+  const { t } = useTranslation();
+  const [isHovered, setIsHovered] = React.useState(false);
+
+  return (
+    <div
+      style={{
+        position: 'absolute',
+        bottom: 0,
+        left: '50%',
+        transform: 'translateX(-50%)',
+        backgroundColor: isHovered ? token.colorBgTextHover : token.colorBgContainer,
+        border: `1px solid ${token.colorBorder}`,
+        borderBottom: 'none',
+        borderRadius: '6px 6px 0 0',
+        padding: '2px 6px',
+        cursor: 'pointer',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        minWidth: '24px',
+        height: '22px',
+        color: isHovered ? token.colorText : token.colorTextSecondary,
+        transition: 'all 0.2s',
+        zIndex: 1,
+      }}
+      onClick={props.onToggle}
+      onMouseEnter={() => setIsHovered(true)}
+      onMouseLeave={() => setIsHovered(false)}
+    >
+      <Antd.Tooltip title={props.collapsed ? t("EXPAND") : t("COLLAPSE")}>
+        {props.isRightPanel ? (
+          // Right panel: reversed arrows
+          props.collapsed ? 
+            <LeftOutlined style={{ fontSize: '12px', color: 'inherit' }} /> : 
+            <RightOutlined style={{ fontSize: '12px', color: 'inherit' }} />
+        ) : (
+          // Left panel: normal arrows
+          props.collapsed ? 
+            <RightOutlined style={{ fontSize: '12px', color: 'inherit' }} /> : 
+            <LeftOutlined style={{ fontSize: '12px', color: 'inherit' }} />
+        )}
+      </Antd.Tooltip>
+    </div>
+  );
+}

src/reactComponents/SiderCollapseTrigger.tsx

@@ -31,6 +31,9 @@ const USER_THEME_KEY = 'userTheme';
 const DEFAULT_LANGUAGE = 'en';
 const DEFAULT_THEME = 'dark';
 
+/** Helper function to generate project-specific storage key for open tabs. */
+const getUserOptionsKey = (projectName: string): string => `user_options_${projectName}`;
+
 /** User settings interface. */
 export interface UserSettings {
   language: string;
@@ -42,6 +45,8 @@ export interface UserSettingsContextType {
   settings: UserSettings;
   updateLanguage: (language: string) => Promise<void>;
   updateTheme: (theme: string) => Promise<void>;
+  updateOpenTabs: (projectName: string, tabPaths: string[]) => Promise<void>;
+  getOpenTabs: (projectName: string) => Promise<string[]>;
   isLoading: boolean;
   error: string | null;
   storage: Storage | null;
@@ -134,10 +139,52 @@ export const UserSettingsProvider: React.FC<UserSettingsProviderProps> = ({
     }
   };
 
+  /** Update open tabs for a specific project. */
+  const updateOpenTabs = async (projectName: string, tabPaths: string[]): Promise<void> => {
+    try {
+      setError(null);
+      
+      if (storage) {
+        const storageKey = getUserOptionsKey(projectName);
+        await storage.saveEntry(storageKey, JSON.stringify(tabPaths));
+      } else {
+        console.warn('No storage available, cannot save open tabs');
+      }
+    } catch (err) {
+      setError(`Failed to save open tabs: ${err}`);
+      console.error('Error saving open tabs:', err);
+      throw err;
+    }
+  };
+
+  /** Get open tabs for a specific project. */
+  const getOpenTabs = async (projectName: string): Promise<string[]> => {
+    try {
+      if (!storage) {
+        return [];
+      }
+      
+      const storageKey = getUserOptionsKey(projectName);
+      const tabsJson = await storage.fetchEntry(storageKey, JSON.stringify([]));
+      
+      try {
+        return JSON.parse(tabsJson);
+      } catch (error) {
+        console.warn(`Failed to parse open tabs for project ${projectName}, using default:`, error);
+        return [];
+      }
+    } catch (err) {
+      console.error(`Error loading open tabs for project ${projectName}:`, err);
+      return [];
+    }
+  };
+
   const contextValue: UserSettingsContextType = {
     settings,
     updateLanguage,
     updateTheme,
+    updateOpenTabs,
+    getOpenTabs,
     isLoading,
     error,
     storage: storage || null,
@@ -149,3 +196,12 @@ export const UserSettingsProvider: React.FC<UserSettingsProviderProps> = ({
     </UserSettingsContext.Provider>
   );
 };
+
+/** Custom hook to use user settings context. */
+export const useUserSettings = (): UserSettingsContextType => {
+  const context = React.useContext(UserSettingsContext);
+  if (!context) {
+    throw new Error('useUserSettings must be used within a UserSettingsProvider');
+  }
+  return context;
+};

src/reactComponents/UserSettingsProvider.tsx

@@ -26,7 +26,7 @@ import * as storageModule from '../storage/module';
 import { MRC_CATEGORY_STYLE_METHODS } from '../themes/styles';
 import { CLASS_NAME_ROBOT_BASE, CLASS_NAME_OPMODE, CLASS_NAME_MECHANISM } from '../blocks/utils/python';
 import { addInstanceWithinBlocks } from '../blocks/mrc_call_python_function';
-import { createCustomMethodBlock, getBaseClassBlocks, FIELD_METHOD_NAME } from '../blocks/mrc_class_method_def';
+import { createCustomMethodBlock, getBaseClassBlocks, FIELD_METHOD_NAME, createCustomMethodBlockWithReturn } from '../blocks/mrc_class_method_def';
 import { Editor } from '../editor/editor';
 
 
@@ -113,6 +113,7 @@ class MethodsCategory {
         text: 'Custom Methods',
       },
       createCustomMethodBlock(),
+      createCustomMethodBlockWithReturn()
     );
 
     // Get blocks for calling methods defined in the current workspace.