Skip to content

Commit

Permalink
fix: Airgap: search bar UI was not matching with release
Browse files Browse the repository at this point in the history
  • Loading branch information
albinAppsmith committed Oct 9, 2024
1 parent 85ba0b8 commit 79fc34f
Showing 1 changed file with 7 additions and 18 deletions.
Original file line number Diff line number Diff line change
@@ -1,18 +1,16 @@
import React from "react";
import styled from "styled-components";
import { connect, useSelector } from "react-redux";
import { connect } from "react-redux";
import { getTypographyByKey, Text, TextType } from "@appsmith/ads-old";
import { Icon } from "@appsmith/ads";
import { setGlobalSearchCategory } from "actions/globalSearchActions";
import { HELPBAR_PLACEHOLDER } from "ee/constants/messages";
import AnalyticsUtil from "ee/utils/AnalyticsUtil";
import { modText } from "utils/helpers";
import { filterCategories, SEARCH_CATEGORY_ID } from "./utils";
import { protectedModeSelector } from "selectors/gitSyncSelectors";
import type { AppState } from "ee/reducers";
import { getIsSideBySideEnabled } from "selectors/ideSelectors";

const StyledHelpBar = styled.button<{ isSideBySideFlagEnabled?: boolean }>`
const StyledHelpBar = styled.button`
padding: 0 var(--ads-v2-spaces-3);
margin: var(--ads-v2-spaces-2);
.placeholder-text {
Expand All @@ -30,6 +28,10 @@ const StyledHelpBar = styled.button<{ isSideBySideFlagEnabled?: boolean }>`
font-family: var(--ads-v2-font-family);
font-size: var(--ads-v2-font-size-4);
color: var(--ads-v2-color-fg);
flex-grow: 0;
gap: 8px;
min-width: fit-content;
&:hover {
border: 1px solid var(--ads-v2-color-border-emphasis-plus);
}
Expand All @@ -38,13 +40,6 @@ const StyledHelpBar = styled.button<{ isSideBySideFlagEnabled?: boolean }>`
&[disabled] {
cursor: not-allowed;
}
${({ isSideBySideFlagEnabled }) =>
isSideBySideFlagEnabled &&
`
flex-grow: 0;
gap: 8px;
min-width: fit-content;
`}
`;

interface Props {
Expand All @@ -53,20 +48,14 @@ interface Props {
}

function HelpBar({ isProtectedMode, toggleShowModal }: Props) {
const isSideBySideFlagEnabled = useSelector(getIsSideBySideEnabled);

return (
<StyledHelpBar
className="t--global-search-modal-trigger"
data-testid="global-search-modal-trigger"
disabled={isProtectedMode}
isSideBySideFlagEnabled={isSideBySideFlagEnabled}
onClick={toggleShowModal}
>
{!isSideBySideFlagEnabled && (
<Text type={TextType.P2}>{HELPBAR_PLACEHOLDER()}</Text>
)}
{isSideBySideFlagEnabled && <Icon name={"search-line"} size={"md"} />}
<Icon name={"search-line"} size={"md"} />
<Text italic type={TextType.P3}>
{modText()} K
</Text>
Expand Down

0 comments on commit 79fc34f

Please sign in to comment.