{
>
{/* SIDEBAR */}
@@ -209,19 +166,8 @@ export const EntityExplorerSidebar = memo((props: Props) => {
{/* Popover that contains the bindings info */}
- {/* SWITCHER */}
-
-
-
-
+ {/* Contains entity explorer & widgets library along with a switcher*/}
+
{/* RESIZER */}
diff --git a/app/client/src/constants/Explorer.ts b/app/client/src/constants/Explorer.ts
index 94f482e1a5..3fa4f47fa3 100644
--- a/app/client/src/constants/Explorer.ts
+++ b/app/client/src/constants/Explorer.ts
@@ -1,2 +1,3 @@
export const ENTITY_EXPLORER_SEARCH_ID = "entity-explorer-search";
export const WIDGETS_SEARCH_ID = "#widgets-search";
+export const SEARCH_ENTITY = "search-entity";
diff --git a/app/client/src/pages/Editor/Explorer/Entity/index.tsx b/app/client/src/pages/Editor/Explorer/Entity/index.tsx
index d1a460c1b9..431504df46 100644
--- a/app/client/src/pages/Editor/Explorer/Entity/index.tsx
+++ b/app/client/src/pages/Editor/Explorer/Entity/index.tsx
@@ -220,11 +220,11 @@ export const Entity = forwardRef(
/* eslint-disable react-hooks/exhaustive-deps */
useEffect(() => {
- if (props.isDefaultExpanded) {
+ if (props.isDefaultExpanded || props.searchKeyword) {
open(true);
props.onToggle && props.onToggle(true);
}
- }, [props.isDefaultExpanded]);
+ }, [props.isDefaultExpanded, props.searchKeyword]);
useEffect(() => {
if (!props.searchKeyword && !props.isDefaultExpanded) {
open(false);
diff --git a/app/client/src/pages/Editor/Explorer/EntityExplorer.tsx b/app/client/src/pages/Editor/Explorer/EntityExplorer.tsx
index f0fe15aa49..c1d8059bb9 100644
--- a/app/client/src/pages/Editor/Explorer/EntityExplorer.tsx
+++ b/app/client/src/pages/Editor/Explorer/EntityExplorer.tsx
@@ -8,9 +8,7 @@ import React, {
import styled from "styled-components";
import Divider from "components/editorComponents/Divider";
import Search from "./ExplorerSearch";
-import { NonIdealState, Classes, IPanelProps } from "@blueprintjs/core";
-import WidgetSidebar from "../WidgetSidebar";
-import history from "utils/history";
+import { NonIdealState, Classes } from "@blueprintjs/core";
import JSDependencies from "./JSDependencies";
import PerformanceTracker, {
PerformanceTransactionName,
@@ -29,6 +27,8 @@ import Datasources from "./Datasources";
import Files from "./Files";
import ExplorerWidgetGroup from "./Widgets/WidgetGroup";
import { builderURL } from "RouteBuilder";
+import history from "utils/history";
+import { SEARCH_ENTITY } from "constants/Explorer";
const Wrapper = styled.div`
height: 100%;
@@ -71,7 +71,7 @@ const StyledDivider = styled(Divider)`
border-bottom-color: #f0f0f0;
`;
-function EntityExplorer(props: IPanelProps) {
+function EntityExplorer({ isActive }: { isActive: boolean }) {
const dispatch = useDispatch();
const [searchKeyword, setSearchKeyword] = useState("");
const searchInputRef: MutableRefObject
= useRef(
@@ -86,15 +86,13 @@ function EntityExplorer(props: IPanelProps) {
getIsFirstTimeUserOnboardingEnabled,
);
const noResults = false;
- const { openPanel } = props;
const showWidgetsSidebar = useCallback(() => {
history.push(builderURL());
- openPanel({ component: WidgetSidebar });
dispatch(forceOpenWidgetPanel(true));
if (isFirstTimeUserOnboardingEnabled) {
dispatch(toggleInOnboardingWidgetSelection(true));
}
- }, [openPanel, isFirstTimeUserOnboardingEnabled]);
+ }, [isFirstTimeUserOnboardingEnabled]);
/**
* filter entitites
@@ -112,10 +110,14 @@ function EntityExplorer(props: IPanelProps) {
};
return (
-
+
{/* SEARCH */}
void;
+ id?: string;
},
ref: Ref,
) => {
@@ -62,7 +63,7 @@ export const ExplorerSearch = forwardRef(
autoComplete="off"
autoFocus
className="flex-grow py-2 text-gray-800 bg-transparent placeholder-trueGray-500"
- id={ENTITY_EXPLORER_SEARCH_ID}
+ id={props.id || ENTITY_EXPLORER_SEARCH_ID}
onBlur={() => setFocussed(false)}
onChange={onChange}
onFocus={() => setFocussed(true)}
@@ -78,8 +79,7 @@ export const ExplorerSearch = forwardRef(