diff --git a/app/client/cypress/e2e/Regression/ClientSide/BugTests/DS_Bug25148_Spec.ts b/app/client/cypress/e2e/Regression/ClientSide/BugTests/DS_Bug25148_Spec.ts index a2c5228fa9dc..83fc9d8a7955 100644 --- a/app/client/cypress/e2e/Regression/ClientSide/BugTests/DS_Bug25148_Spec.ts +++ b/app/client/cypress/e2e/Regression/ClientSide/BugTests/DS_Bug25148_Spec.ts @@ -17,10 +17,10 @@ describe( dataSources.FillAuthAPIUrl(); dataSources.SaveDatasource(); apiPage.CreateApi("API" + uid, "GET", true); + agHelper.AssertElementAbsence(apiPage._saveAsDS); apiPage.SelectPaneTab("Authentication"); - agHelper.AssertElementEnabledDisabled(apiPage._saveAsDS, 0, false); // Last one if present on the authentication tab. - agHelper.AssertElementEnabledDisabled(apiPage._saveAsDS, 1, false); + agHelper.AssertElementEnabledDisabled(apiPage._saveAsDS, 0, false); }); }); }, diff --git a/app/client/cypress/e2e/Sanity/Datasources/GraphQL_spec.ts b/app/client/cypress/e2e/Sanity/Datasources/GraphQL_spec.ts index 33dd9ba475ab..b20e8f054b70 100644 --- a/app/client/cypress/e2e/Sanity/Datasources/GraphQL_spec.ts +++ b/app/client/cypress/e2e/Sanity/Datasources/GraphQL_spec.ts @@ -305,6 +305,7 @@ describe( variable: GRAPHQL_VARIABLES, }); apiPage.RunAPI(); + apiPage.SelectPaneTab("Authentication"); agHelper.GetNClick(locators._saveDatasource); dataSources.AssertDataSourceInfo([ dataManager.dsValues[ diff --git a/app/client/cypress/support/Pages/DataSources.ts b/app/client/cypress/support/Pages/DataSources.ts index 58a3099f2b49..85ad360fb8fa 100644 --- a/app/client/cypress/support/Pages/DataSources.ts +++ b/app/client/cypress/support/Pages/DataSources.ts @@ -206,7 +206,7 @@ export class DataSources { ".t--datasource-name:contains('" + dsName + "')"; _mandatoryMark = "//span[text()='*']"; _deleteDSHostPort = ".t--delete-field"; - _dsTabSchema = "[data-testid='t--tab-SCHEMA_TAB']"; + _dsTabSchema = "[data-testid='t--tab-DATASOURCE_TAB']"; private _pageSelectionMenu = "[data-testid='t--page-selection']"; private _pageSelectMenuItem = ".ads-v2-menu__menu-item"; @@ -1891,7 +1891,9 @@ export class DataSources { cy.intercept("GET", "/api/v1/datasources/*/structure?ignoreCache=*").as( `getDatasourceStructureUpdated_${ds_entity_name}`, ); - cy.get("[data-testid=t--tab-SCHEMA_TAB]").first().click({ force: true }); + cy.get("[data-testid=t--tab-DATASOURCE_TAB]") + .first() + .click({ force: true }); this.RefreshDatasourceSchema(); this.assertHelper .WaitForNetworkCall(`@getDatasourceStructureUpdated_${ds_entity_name}`) diff --git a/app/client/packages/design-system/ads/src/Icon/Icon.provider.tsx b/app/client/packages/design-system/ads/src/Icon/Icon.provider.tsx index 5a5ff05eb1e0..bf7406c6ee75 100644 --- a/app/client/packages/design-system/ads/src/Icon/Icon.provider.tsx +++ b/app/client/packages/design-system/ads/src/Icon/Icon.provider.tsx @@ -1033,6 +1033,10 @@ const DashboardLineIcon = importSvg( async () => import("../__assets__/icons/ads/dashboard-line.svg"), ); +const DatasourceConfigIcon = importSvg( + async () => import("../__assets__/icons/ads/datasource-config.svg"), +); + // v3 icons const JsSquareV3Icon = importSvg( async () => import("../__assets__/icons/ads/js-square-v3-icon.svg"), @@ -1173,6 +1177,7 @@ const ICON_LOOKUP = { "cut-control": CutIcon, "dashboard-line": DashboardLineIcon, "database-2-line": Database2Line, + "datasource-config": DatasourceConfigIcon, "datasource-v3": DatasourceV3Icon, "datasources-2": Datasources2, "decrease-control": DecreaseIcon, diff --git a/app/client/packages/design-system/ads/src/Switch/Switch.styles.tsx b/app/client/packages/design-system/ads/src/Switch/Switch.styles.tsx index 96b9bee34147..2b0358ffeee2 100644 --- a/app/client/packages/design-system/ads/src/Switch/Switch.styles.tsx +++ b/app/client/packages/design-system/ads/src/Switch/Switch.styles.tsx @@ -31,6 +31,7 @@ export const StyledSwitchLabel = styled(Text)<{ justify-content: space-between; min-width: 9rem; cursor: pointer; + word-break: break-all; ${({ isDisabled }) => isDisabled && diff --git a/app/client/packages/design-system/ads/src/__assets__/icons/ads/datasource-config.svg b/app/client/packages/design-system/ads/src/__assets__/icons/ads/datasource-config.svg new file mode 100644 index 000000000000..dbc7387c46f7 --- /dev/null +++ b/app/client/packages/design-system/ads/src/__assets__/icons/ads/datasource-config.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/app/client/src/PluginActionEditor/components/PluginActionForm/components/CommonEditorForm/components/EmbeddedDatasourcePathField.tsx b/app/client/src/PluginActionEditor/components/PluginActionForm/components/CommonEditorForm/components/EmbeddedDatasourcePathField.tsx index 87615cbf7f2f..55511f3b9710 100644 --- a/app/client/src/PluginActionEditor/components/PluginActionForm/components/CommonEditorForm/components/EmbeddedDatasourcePathField.tsx +++ b/app/client/src/PluginActionEditor/components/PluginActionForm/components/CommonEditorForm/components/EmbeddedDatasourcePathField.tsx @@ -593,7 +593,7 @@ class EmbeddedDatasourcePathComponent extends React.Component< )} - {displayValue && ( + {displayValue && shouldSave && ( { +const Datasource = (props: Props) => { const dispatch = useDispatch(); const datasourceStructure = useSelector((state) => @@ -44,7 +45,8 @@ const Schema = (props: Props) => { getPluginIdFromDatasourceId(state, props.datasourceId), ); - const currentPageId = useSelector(getCurrentPageId); + const editorType = useEditorType(location.pathname); + const { parentEntityId } = useParentEntityInfo(editorType); const [selectedTable, setSelectedTable] = useState(); @@ -107,7 +109,7 @@ const Schema = (props: Props) => { }); const url = datasourcesEditorIdURL({ - basePageId: currentPageId, + baseParentEntityId: parentEntityId, datasourceId: props.datasourceId, params: { ...omit(getQueryParams(), "viewMode"), viewMode: false }, generateEditorPath: true, @@ -137,13 +139,12 @@ const Schema = (props: Props) => { } return ( - <> - - - + + { } state={statusState} /> - + ); }; @@ -164,7 +165,7 @@ const Schema = (props: Props) => { return ( - { ); }; -export { Schema }; +export { Datasource }; diff --git a/app/client/src/PluginActionEditor/components/PluginActionResponse/components/DatasourceTab/DatasourceInfo.tsx b/app/client/src/PluginActionEditor/components/PluginActionResponse/components/DatasourceTab/DatasourceInfo.tsx new file mode 100644 index 000000000000..e671e70d4afc --- /dev/null +++ b/app/client/src/PluginActionEditor/components/PluginActionResponse/components/DatasourceTab/DatasourceInfo.tsx @@ -0,0 +1,69 @@ +import React from "react"; +import { Button, Flex, Tooltip } from "@appsmith/ads"; +import DatasourceSelector from "./DatasourceSelector"; +import { createMessage, EDIT_DS_CONFIG } from "ee/constants/messages"; +import { DatasourceEditEntryPoints } from "constants/Datasource"; +import AnalyticsUtil from "ee/utils/AnalyticsUtil"; +import { datasourcesEditorIdURL } from "ee/RouteBuilder"; +import { omit } from "lodash"; +import { getQueryParams } from "utils/URLUtils"; +import history from "utils/history"; +import { useEditorType } from "ee/hooks"; +import { useParentEntityInfo } from "ee/hooks/datasourceEditorHooks"; + +interface Props { + datasourceId: string; + datasourceName: string; + showEditButton: boolean; +} + +const DatasourceInfo = ({ + datasourceId, + datasourceName, + showEditButton, +}: Props) => { + const editorType = useEditorType(location.pathname); + const { parentEntityId } = useParentEntityInfo(editorType); + + // eslint-disable-next-line react-perf/jsx-no-new-function-as-prop + const editDatasource = () => { + const entryPoint = DatasourceEditEntryPoints.QUERY_EDITOR_DATASOURCE_SCHEMA; + + AnalyticsUtil.logEvent("EDIT_DATASOURCE_CLICK", { + datasourceId: datasourceId, + pluginName: "", + entryPoint: entryPoint, + }); + + const url = datasourcesEditorIdURL({ + baseParentEntityId: parentEntityId, + datasourceId: datasourceId, + params: { ...omit(getQueryParams(), "viewMode"), viewMode: false }, + generateEditorPath: true, + }); + + history.push(url); + }; + + return ( + + + {showEditButton && ( + +