Sandbox: Fix panel custom editors not working inside the sandbox (#74589)

* Sandbox: Fix panel custom editors not working inside the sandbox

* Use the plugin-id in the specific rendering category

public/app/features/dashboard/components/PanelEditor/OptionsPaneCategory.tsx

@@ -19,6 +19,7 @@ export interface OptionsPaneCategoryProps {
   className?: string;
   isNested?: boolean;
   children: ReactNode;
+  sandboxId?: string;
 }
 
 const CATEGORY_PARAM_NAME = 'showCategory';
@@ -34,6 +35,7 @@ export const OptionsPaneCategory = React.memo(
     className,
     itemsCount,
     isNested = false,
+    sandboxId,
   }: OptionsPaneCategoryProps) => {
     const initialIsExpanded = isOpenDefault !== false;
     const [savedState, setSavedState] = useLocalStorage(getOptionGroupStorageKey(id), {
@@ -112,6 +114,7 @@ export const OptionsPaneCategory = React.memo(
       <div
         className={boxStyles}
         data-testid="options-category"
+        data-plugin-sandbox={sandboxId}
         aria-label={selectors.components.OptionsGroup.group(id)}
         ref={ref}
       >

public/app/features/dashboard/components/PanelEditor/OptionsPaneCategoryDescriptor.tsx

@@ -13,6 +13,7 @@ export interface OptionsPaneCategoryDescriptorProps {
   isNested?: boolean;
   itemsCount?: number;
   customRender?: () => React.ReactNode;
+  sandboxId?: string;
 }
 /**
  * This is not a real React component but an intermediary to enable deep option search without traversing a React node tree.

public/app/features/dashboard/components/PanelEditor/getVisualizationOptions.tsx

@@ -78,6 +78,7 @@ export function getVisualizationOptions(props: OptionPaneRenderProps): OptionsPa
     return (categoryIndex[categoryName] = new OptionsPaneCategoryDescriptor({
       title: categoryName,
       id: categoryName,
+      sandboxId: plugin.meta.id,
     }));
   };