From ff1e62aaeabd532d453e90123341f15827bdbba4 Mon Sep 17 00:00:00 2001 From: Ankita Kinger Date: Tue, 26 Nov 2024 17:57:35 +0530 Subject: [PATCH 1/3] removing global add in segmented header and updating the UI for new query tab --- .../src/Templates/EntityExplorer/styles.ts | 4 --- .../src/IDE/Components/FileTab/FileTab.tsx | 6 ++-- .../src/IDE/Components/FileTab/styles.tsx | 5 ++++ app/client/src/ce/entities/FeatureFlag.ts | 2 -- .../PartialExportModal/unitTestUtils.ts | 1 - .../pages/Editor/Explorer/Entity/index.tsx | 4 +++ .../EditorPane/components/SegmentedHeader.tsx | 30 +------------------ .../pages/Editor/IDE/EditorTabs/AddTab.tsx | 3 +- 8 files changed, 16 insertions(+), 39 deletions(-) diff --git a/app/client/packages/design-system/ads/src/Templates/EntityExplorer/styles.ts b/app/client/packages/design-system/ads/src/Templates/EntityExplorer/styles.ts index df4b639c91ec..96172a7dc55b 100644 --- a/app/client/packages/design-system/ads/src/Templates/EntityExplorer/styles.ts +++ b/app/client/packages/design-system/ads/src/Templates/EntityExplorer/styles.ts @@ -6,10 +6,6 @@ export const ListItemContainer = styled.div` & .t--entity-item { grid-template-columns: 0 auto 1fr auto auto auto auto auto; height: 32px; - - & .t--entity-name { - padding-left: var(--ads-v2-spaces-3); - } } `; diff --git a/app/client/src/IDE/Components/FileTab/FileTab.tsx b/app/client/src/IDE/Components/FileTab/FileTab.tsx index 193b5323b5bd..10aa84b11a8a 100644 --- a/app/client/src/IDE/Components/FileTab/FileTab.tsx +++ b/app/client/src/IDE/Components/FileTab/FileTab.tsx @@ -25,10 +25,12 @@ export const FileTab = ({ onDoubleClick, title, }: FileTabProps) => { + const identifier = `t--ide-tab-${sanitizeString(title)}`; + return ( diff --git a/app/client/src/IDE/Components/FileTab/styles.tsx b/app/client/src/IDE/Components/FileTab/styles.tsx index 7fd681a6ce74..7c6bc5d91260 100644 --- a/app/client/src/IDE/Components/FileTab/styles.tsx +++ b/app/client/src/IDE/Components/FileTab/styles.tsx @@ -38,6 +38,11 @@ export const Tab = styled.div` &.active > .tab-close { visibility: visible; } + + &.t--ide-tab-new_query, + &.t--ide-tab-new_js { + flex-shrink: 0; + } `; export const IconContainer = styled.div` diff --git a/app/client/src/ce/entities/FeatureFlag.ts b/app/client/src/ce/entities/FeatureFlag.ts index 413547130dc4..15a6e6bb6a1e 100644 --- a/app/client/src/ce/entities/FeatureFlag.ts +++ b/app/client/src/ce/entities/FeatureFlag.ts @@ -25,7 +25,6 @@ export const FEATURE_FLAG = { ab_one_click_learning_popover_enabled: "ab_one_click_learning_popover_enabled", release_side_by_side_ide_enabled: "release_side_by_side_ide_enabled", - release_global_add_pane_enabled: "release_global_add_pane_enabled", ab_appsmith_ai_query: "ab_appsmith_ai_query", release_actions_redesign_enabled: "release_actions_redesign_enabled", rollout_remove_feature_walkthrough_enabled: @@ -68,7 +67,6 @@ export const DEFAULT_FEATURE_FLAG_VALUE: FeatureFlags = { license_widget_rtl_support_enabled: false, ab_one_click_learning_popover_enabled: false, release_side_by_side_ide_enabled: false, - release_global_add_pane_enabled: false, ab_appsmith_ai_query: false, release_actions_redesign_enabled: false, rollout_remove_feature_walkthrough_enabled: true, diff --git a/app/client/src/components/editorComponents/PartialImportExport/PartialExportModal/unitTestUtils.ts b/app/client/src/components/editorComponents/PartialImportExport/PartialExportModal/unitTestUtils.ts index 05b046f51f09..9f1c5a7f4d55 100644 --- a/app/client/src/components/editorComponents/PartialImportExport/PartialExportModal/unitTestUtils.ts +++ b/app/client/src/components/editorComponents/PartialImportExport/PartialExportModal/unitTestUtils.ts @@ -12765,7 +12765,6 @@ export const defaultAppState = { rollout_app_sidebar_enabled: false, ab_one_click_learning_popover_enabled: false, release_side_by_side_ide_enabled: false, - release_global_add_pane_enabled: false, license_git_unlimited_repo_enabled: false, ask_ai_js: false, license_connection_pool_size_enabled: false, diff --git a/app/client/src/pages/Editor/Explorer/Entity/index.tsx b/app/client/src/pages/Editor/Explorer/Entity/index.tsx index 89bbf3ed4ab3..4b3b43d68172 100644 --- a/app/client/src/pages/Editor/Explorer/Entity/index.tsx +++ b/app/client/src/pages/Editor/Explorer/Entity/index.tsx @@ -149,6 +149,10 @@ export const EntityItem = styled.div<{ height: 36px; } + & .t--entity-name { + padding-left: var(--ads-v2-spaces-3); + } + & .${EntityClassNames.COLLAPSE_TOGGLE} { svg { path { diff --git a/app/client/src/pages/Editor/IDE/EditorPane/components/SegmentedHeader.tsx b/app/client/src/pages/Editor/IDE/EditorPane/components/SegmentedHeader.tsx index 0d0154a11930..1242d5c3da2d 100644 --- a/app/client/src/pages/Editor/IDE/EditorPane/components/SegmentedHeader.tsx +++ b/app/client/src/pages/Editor/IDE/EditorPane/components/SegmentedHeader.tsx @@ -1,35 +1,17 @@ import React from "react"; -import { Button, Flex, SegmentedControl } from "@appsmith/ads"; +import { Flex, SegmentedControl } from "@appsmith/ads"; import { createMessage, EDITOR_PANE_TEXTS } from "ee/constants/messages"; import { EditorEntityTab } from "ee/entities/IDE/constants"; -import history from "utils/history"; -import { globalAddURL } from "ee/RouteBuilder"; -import { useSelector } from "react-redux"; import { useCurrentEditorState, useSegmentNavigation } from "../../hooks"; import styled from "styled-components"; -import { useFeatureFlag } from "utils/hooks/useFeatureFlag"; -import { FEATURE_FLAG } from "ee/entities/FeatureFlag"; -import { getCurrentBasePageId } from "selectors/editorSelectors"; const Container = styled(Flex)` #editor-pane-segment-control { max-width: 247px; } - - button { - flex-shrink: 0; - flex-basis: auto; - } `; const SegmentedHeader = () => { - const isGlobalAddPaneEnabled = useFeatureFlag( - FEATURE_FLAG.release_global_add_pane_enabled, - ); - const basePageId = useSelector(getCurrentBasePageId); - const onAddButtonClick = () => { - history.push(globalAddURL({ basePageId })); - }; const { segment } = useCurrentEditorState(); const { onSegmentChange } = useSegmentNavigation(); @@ -61,16 +43,6 @@ const SegmentedHeader = () => { ]} value={segment} /> - {isGlobalAddPaneEnabled ? ( -