chore: UI package main pane relevant ce changes

app/client/src/ce/IDE/Interfaces/IDETypes.ts

@@ -1,6 +1,7 @@
 export const IDE_TYPE = {
   None: "None",
   App: "App",
+  UIPackage: "UIPackage",
 } as const;
 
 export type IDEType = keyof typeof IDE_TYPE;

app/client/src/ce/IDE/constants/routes.ts

@@ -41,4 +41,5 @@ export const EntityPaths: string[] = [
 export const IDEBasePaths: Readonly<Record<IDEType, string[]>> = {
   [IDE_TYPE.None]: [],
   [IDE_TYPE.App]: [BUILDER_PATH, BUILDER_PATH_DEPRECATED, BUILDER_CUSTOM_PATH],
+  [IDE_TYPE.UIPackage]: [],
 };

app/client/src/ce/pages/Editor/Explorer/helpers.tsx

@@ -116,6 +116,12 @@ export const isViewerPath = (path: string) => {
   return !!matchViewerPath(path);
 };
 
+// Extended in EE
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export const isUIPackageEditorPath = (path: string) => {
+  return false;
+};
+
 export const getJSCollectionIdFromURL = () => {
   const baseMatch = matchBasePath(window.location.pathname);
 

app/client/src/ce/sagas/NavigationSagas.ts

@@ -137,7 +137,7 @@ function* logNavigationAnalytics(payload: RouteChangeActionPayload) {
   });
 }
 
-function* setSelectedWidgetsSaga(invokedBy?: NavigationMethod) {
+export function* setSelectedWidgetsSaga(invokedBy?: NavigationMethod) {
   const pathname = window.location.pathname;
   const entityInfo = identifyEntityFromPath(pathname);
   let widgets: string[] = [];

app/client/src/ce/sagas/moduleInterfaceSagas.ts

@@ -7,7 +7,9 @@
  * between core widget operations and module-specific features available in the enterprise version.
  */
 import type { WidgetAddChild } from "actions/pageActions";
+import type { ReduxAction } from "actions/ReduxActionTypes";
 import type { CanvasWidgetsReduxState } from "ee/reducers/entityReducers/canvasWidgetsReducer";
+import type { Saga } from "redux-saga";
 
 export interface HandleModuleWidgetCreationSagaPayload {
   addChildPayload: WidgetAddChild;
@@ -19,3 +21,10 @@ export function* handleModuleWidgetCreationSaga(
 ) {
   return props.widgets;
 }
+
+export function* waitForPackageInitialization(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  saga: Saga,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  action: ReduxAction<unknown>,
+) {}

app/client/src/pages/Editor/PropertyPane/PropertyPaneView.tsx

@@ -216,7 +216,7 @@ function PropertyPaneView(
     tooltipContent: string;
     icon: ReactElement;
   }> => {
-    return [
+    const widgetActions = [
       {
         tooltipContent: createMessage(CONTEXT_INSPECT_STATE),
         icon: (
@@ -237,7 +237,10 @@ function PropertyPaneView(
           />
         ),
       },
-      {
+    ];
+
+    if (widgetProperties?.isDeletable !== false) {
+      widgetActions.push({
         tooltipContent: "Delete widget",
         icon: (
           <Button
@@ -248,9 +251,16 @@ function PropertyPaneView(
             startIcon="delete-bin-line"
           />
         ),
-      },
-    ];
-  }, [onCopy, onDelete, widgetProperties?.widgetId]);
+      });
+    }
+
+    return widgetActions;
+  }, [
+    onCopy,
+    onDelete,
+    widgetProperties?.isDeletable,
+    widgetProperties?.widgetId,
+  ]);
 
   useEffect(() => {
     setSearchText("");

app/client/src/sagas/WidgetDeletionSagas.ts

@@ -386,10 +386,14 @@ function* deleteAllSelectedWidgetsSaga(
     const widgets = { ...stateWidgets };
     const selectedWidgets: string[] = yield select(getSelectedWidgets);
 
-    if (!(selectedWidgets && selectedWidgets.length !== 1)) return;
+    const deletableWidgets = selectedWidgets.filter(
+      (widgetId) => widgets[widgetId]?.isDeletable !== false,
+    );
+
+    if (!(deletableWidgets && deletableWidgets.length !== 1)) return;
 
     const widgetsToBeDeleted: WidgetsInTree = yield all(
-      selectedWidgets.map((eachId) => {
+      deletableWidgets.map((eachId) => {
         return call(getAllWidgetsInTree, eachId, widgets);
       }),
     );

app/client/src/sagas/WidgetSelectionSagas.ts

@@ -54,9 +54,16 @@ import {
 } from "./selectors";
 import { getModalWidgetType } from "selectors/widgetSelectors";
 import { getWidgetSelectorByWidgetId } from "selectors/layoutSystemSelectors";
-import { getAppViewerPageIdFromPath } from "ee/pages/Editor/Explorer/helpers";
+import {
+  isUIPackageEditorPath,
+  isEditorPath,
+} from "ee/pages/Editor/Explorer/helpers";
 import AnalyticsUtil from "ee/utils/AnalyticsUtil";
 import { getIsAnvilLayout } from "layoutSystems/anvil/integrations/selectors";
+import type { Saga } from "redux-saga";
+import { getIDETypeByUrl } from "ee/entities/IDE/utils";
+import { IDE_TYPE } from "ee/IDE/Interfaces/IDETypes";
+import { waitForPackageInitialization } from "ee/sagas/moduleInterfaceSaga";
 
 // The following is computed to be used in the entity explorer
 // Every time a widget is selected, we need to expand widget entities
@@ -77,9 +84,9 @@ function* selectWidgetSaga(action: ReduxAction<WidgetSelectionRequestPayload>) {
      * This also safeguards against the case where the selection process is triggered by a non-canvas click where user moves out of editor.
      * */
 
-    const isOnEditorURL = !!getAppViewerPageIdFromPath(
-      window.location.pathname,
-    );
+    const isOnEditorURL =
+      isEditorPath(window.location.pathname) ||
+      isUIPackageEditorPath(window.location.pathname);
 
     if (payload.some(isInvalidSelectionRequest) || !isOnEditorURL) {
       // Throw error
@@ -270,9 +277,17 @@ function* appendSelectedWidgetToUrlSaga(
   }
 }
 
-// TODO: Fix this the next time the file is edited
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function* waitForInitialization(saga: any, action: ReduxAction<unknown>) {
+function* waitForInitialization(saga: Saga, action: ReduxAction<unknown>) {
+  const ideType = getIDETypeByUrl(window.location.pathname);
+
+  if (ideType === IDE_TYPE.UIPackage) {
+    yield call(waitForPackageInitialization, saga, action);
+  } else {
+    yield call(waitForAppInitialization, saga, action);
+  }
+}
+
+function* waitForAppInitialization(saga: Saga, action: ReduxAction<unknown>) {
   const isEditorInitialized: boolean = yield select(getIsEditorInitialized);
   const appMode: APP_MODE = yield select(getAppMode);
   const isViewMode = appMode === APP_MODE.PUBLISHED;

app/client/src/utils/canvasStructureHelpers.ts

@@ -27,7 +27,7 @@ export const compareAndGenerateImmutableCanvasStructure = (
   return newStructure;
 };
 
-const getCanvasStructureFromDSL = (dsl: DSL): CanvasStructure => {
+export const getCanvasStructureFromDSL = (dsl: DSL): CanvasStructure => {
   let children = dsl.children;
   let structureChildren: CanvasStructure[] | undefined = undefined;
 

app/client/src/widgets/BaseWidget.tsx

@@ -527,6 +527,7 @@ export interface WidgetPositionProps extends WidgetRowCols {
 
 export interface WidgetCanvasProps {
   isWidgetSelected?: boolean;
+  isDeletable?: boolean;
 }
 
 export const WIDGET_DISPLAY_PROPS = {