hunk.code_window: import com.appsmith.external.models.ActionConfiguration;
   import com.appsmith.external.models.BaseDomain;
   import com.appsmith.external.models.Property;
   import com.fasterxml.jackson.annotation.JsonProperty;
   import lombok.Getter;
   import lombok.NoArgsConstructor;
   import lombok.Setter;
   import lombok.ToString;
  
hunk.labels: keep keep add keep keep keep keep keep
hunk.after_edit: import com.fasterxml.jackson.annotation.JsonIgnore;
  
hunk.file_path: app/server/appsmith-server/src/main/java/com/appsmith/server/domains/Action.java
hunk.type: add
file: import React from "react";
  import { useParams } from "react-router-dom";
  import styled from "styled-components";
  import SidebarComponent from "components/editorComponents/Sidebar";
  import NavBarItem from "components/editorComponents/NavBarItem";
  import {
    BuilderRouteParams,
    BUILDER_PAGE_URL,
    WIDGETS_URL,
  } from "constants/routes";
  import { Colors } from "constants/Colors";
  import { MenuIcons } from "icons/MenuIcons";
  
  const Wrapper = styled.div`
    display: grid;
    grid-template-columns: 1fr 5fr;
    width: ${props => props.theme.sidebarWidth};
    box-shadow: 0px 1px 3px ${Colors.MINE_SHAFT};
    background-color: ${Colors.MINE_SHAFT};
    z-index: 3;
  `;
  
  const NavBar = styled.div`
    background-color: ${Colors.MINE_SHAFT};
    color: ${props => props.theme.colors.textOnDarkBG};
    display: flex;
    flex-direction: column;
    box-shadow: 0px 0px 4px ${Colors.CODE_GRAY};
  `;
  
  const Navbar = () => {
    const params = useParams<BuilderRouteParams>();
  
    return (
      <Wrapper>
        <NavBar>
          <NavBarItem
            icon={MenuIcons.EXPLORER_ICON}
            path={BUILDER_PAGE_URL(params.applicationId, params.pageId)}
            width={16}
            height={16}
            className="t--nav-link-entity-explorer"
            title="Explorer"
            isActive={(expected: string, current: string) => {
              // Currently, the explorer shows on all paths except for the
              // WIDGETS_URL path
  
              // get the applicationId and pageId from the current location pathname
              const found = current.match(
                /^\/applications\/(?<applicationId>\w+)\/pages\/(?<pageId>\w+)\//,
              );
              // In this case: expected = BUILDER_PAGE_URL(applicationId, pageId)
              // If current url begins with expected url AND
              // If the current url isn't the WIDGETS_URL THEN
              // this is an explorer sidebar path
              return (
                current.indexOf(expected) === 0 &&
                current !==
                  WIDGETS_URL(found?.groups?.applicationId, found?.groups?.pageId)
              );
            }}
          />
          <NavBarItem
            icon={MenuIcons.WIDGETS_ICON}
            path={WIDGETS_URL(params.applicationId, params.pageId)}
            width={16}
            height={16}
            className="t--nav-link-widgets-editor"
            title="Widgets"
            exact
            isActive={(expected: string, current: string) => expected === current}
          />
        </NavBar>
        <SidebarComponent />
      </Wrapper>
    );
  };
  Navbar.displayName = "Navbar";
  
  Navbar.whyDidYouRender = {
    logOnDifferentValues: false,
    customName: "MainSidebar",
  };
  
  export default Navbar;
  