adding currentDropInItemAtom back as removing it broke the drop on functionality

Author: Jakub007d

src/Components/DnDLayout/ConvertWidgetMapping.tsx

@@ -5,6 +5,7 @@ import { WidgetMapping } from '@patternfly/widgetized-dashboard';
 import { ScalprumComponent } from '@scalprum/react-core';
 import { WidgetMapping as ScalprumWidgetMapping } from '../../api/dashboard-templates';
 import HeaderIcon from '../Icons/HeaderIcon';
+import './WidgetSkeleton.scss';
 
 /**
  * Adapter to convert Scalprum WidgetMapping to PatternFly WidgetMapping.
@@ -28,7 +29,7 @@ const convertWidgetMapping = (scalprumMapping: ScalprumWidgetMapping): WidgetMap
       },
       renderWidget: (_widgetId: string) => (
         <ScalprumComponent
-          fallback={<Skeleton style={{ borderRadius: 0 }} shape="square" width="100%" height="100%" />}
+          fallback={<Skeleton shape="square" width="100%" height="100%" />}
           scope={scalprumWidget.scope}
           module={scalprumWidget.module}
           importName={scalprumWidget.importName}

src/Components/DnDLayout/GridLayout.tsx

@@ -8,6 +8,7 @@ import ResizeHandleSVG from './resize-handle.svg';
 import { widgetMappingAtom } from '../../state/widgetMappingAtom';
 import { layoutVariantAtom } from '../../state/layoutAtom';
 import { templateAtom, templateIdAtom } from '../../state/templateAtom';
+import { currentDropInItemAtom } from '../../state/currentDropInItemAtom';
 import DebouncePromise from 'awesome-debounce-promise';
 import {
   LayoutTypes,
@@ -59,8 +60,8 @@ const debouncedPatchDashboardTemplate = DebouncePromise(patchDashboardTemplate,
   onlyResolvesLast: true,
 });
 
-const getResizeHandle = (resizeHandleAxis: string, ref: React.Ref<HTMLElement>) => (
-  <div ref={ref as React.Ref<HTMLDivElement>} className={`react-resizable-handle react-resizable-handle-${resizeHandleAxis}`}>
+const getResizeHandle = (resizeHandleAxis: string, ref: React.Ref<HTMLDivElement>) => (
+  <div ref={ref} className={`react-resizable-handle react-resizable-handle-${resizeHandleAxis}`}>
     <img src={ResizeHandleSVG} alt="" aria-hidden="true" />
   </div>
 );
@@ -76,6 +77,7 @@ const GridLayout = ({ isLayoutLocked = false, layoutType = 'landingPage' }: { is
   const addNotification = useAddNotification();
   const setCurrentlyUsedWidgets = useSetAtom(currentlyUsedWidgetsAtom);
   const setDrawerExpanded = useSetAtom(drawerExpandedAtom);
+  const currentDropInItem = useAtomValue(currentDropInItemAtom);
   const { analytics } = useChrome();
 
   // Convert Scalprum mapping to PatternFly mapping
@@ -199,6 +201,7 @@ const GridLayout = ({ isLayoutLocked = false, layoutType = 'landingPage' }: { is
           showEmptyState={!isLoaded}
           onDrawerExpandChange={handleDrawerExpandChange}
           onActiveWidgetsChange={handleActiveWidgetsChange}
+          droppingWidgetType={currentDropInItem}
         />
       )}
     </div>

src/Components/DnDLayout/WidgetSkeleton.scss

@@ -0,0 +1,5 @@
+// Widget loading skeleton styles
+// Target skeletons inside the widget layout container
+#widget-layout-container .pf-v6-c-skeleton {
+  border-radius: 0;
+}