Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Fix/tab widget (#233)

Browse Source 
* Added information to setup domain

* Fixed incorrect var reference

* Updated documentation message

* Updated env template

* updated template

* removed debug echo

* Updated Script

* Updated Text

* Removed option to connect to external mongo for fresh installs
Exit script of docker desktop is not installed

* Updated docker installation explanation

* added a question to skip custom domain if user is installing locally

* Inverted script question and

* Removed question to determine local installation

* Updated Popup CTA to Modal
Updated query templates to contain bindings
Added a message to display on API / Query errors

* updated styles for evaluated value
updated styles for auto complete

* added spaces to questions

* grouped data tree functions together in autocomplete

* Updated autocomplete styles

* Updated property pane styles to become more dense

* Fixed lightning menu styling

* fixed tests

* Fixed Cypress test

* added property to show / hide tabs

* fixed selected tabs not updating

* fixed cypress tests for tabs

Co-authored-by: Nikhil Nandagopal <nikhil@appsmith.com>
This commit is contained in:
Nikhil Nandagopal 2020-08-07 11:49:36 +05:30 committed by GitHub
parent 41701a9403
commit 1df7599d5e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 28 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/client/cypress/fixtures/layoutdsl.json
View File

@ -139,7 +139,7 @@
"id": "tab2" "id": "tab2"
} }
], ],
"selectedTab": "Tab 1", "defaultTab": "Tab 1",
"blueprint": { "blueprint": {
"view": [ "view": [
{ {
@ -187,6 +187,7 @@
"leftColumn": 5, "leftColumn": 5,
"rightColumn": 13, "rightColumn": 13,
"topRow": 0, "topRow": 0,
"shouldShowTabs": true,
"bottomRow": 7, "bottomRow": 7,
"parentId": "xe6a0w50jz", "parentId": "xe6a0w50jz",
"widgetId": "wuzxcyyjma", "widgetId": "wuzxcyyjma",

43
app/client/src/widgets/TabsWidget.tsx
View File

@ -6,6 +6,7 @@ import WidgetFactory from "utils/WidgetFactory";
import { generateReactKey } from "utils/generators"; import { generateReactKey } from "utils/generators";
import { WidgetPropertyValidationType } from "utils/ValidationFactory"; import { WidgetPropertyValidationType } from "utils/ValidationFactory";
import { VALIDATION_TYPES } from "constants/WidgetValidation"; import { VALIDATION_TYPES } from "constants/WidgetValidation";
import _ from "lodash";
class TabsWidget extends BaseWidget< class TabsWidget extends BaseWidget<
TabsWidgetProps<TabContainerWidgetProps>, TabsWidgetProps<TabContainerWidgetProps>,
@ -14,7 +15,7 @@ class TabsWidget extends BaseWidget<
static getPropertyValidationMap(): WidgetPropertyValidationType { static getPropertyValidationMap(): WidgetPropertyValidationType {
return { return {
tabs: VALIDATION_TYPES.TABS_DATA, tabs: VALIDATION_TYPES.TABS_DATA,
selectedTab: VALIDATION_TYPES.SELECTED_TAB, defaultTab: VALIDATION_TYPES.SELECTED_TAB,
}; };
} }
@ -22,6 +23,18 @@ class TabsWidget extends BaseWidget<
this.updateWidgetMetaProperty("selectedTabId", tabId); this.updateWidgetMetaProperty("selectedTabId", tabId);
}; };
static getDerivedPropertiesMap() {
return {
selectedTab: `{{_.find(this.tabs, { id: this.selectedTabId }).label}}`,
};
}
static getDefaultPropertiesMap(): Record<string, string> {
return {
selectedTab: "defaultTab",
};
}
getPageView() { getPageView() {
return ( return (
<TabsComponent {...this.props} onTabChange={this.onTabChange}> <TabsComponent {...this.props} onTabChange={this.onTabChange}>
@ -125,27 +138,23 @@ class TabsWidget extends BaseWidget<
} }
} }
} }
if (this.props.selectedTab) { if (this.props.defaultTab) {
if (this.props.selectedTab !== prevProps.selectedTab) { if (this.props.defaultTab !== prevProps.defaultTab) {
let selectedTabId = ""; const selectedTab = _.find(this.props.tabs, {
for (let index = 0; index < this.props.tabs.length; index++) { label: this.props.defaultTab,
if (this.props.tabs[index].label === this.props.selectedTab) { });
selectedTabId = this.props.tabs[index].id; const selectedTabId = selectedTab ? selectedTab.id : undefined;
}
}
this.updateWidgetMetaProperty("selectedTabId", selectedTabId); this.updateWidgetMetaProperty("selectedTabId", selectedTabId);
} }
} }
} }
componentDidMount() { componentDidMount() {
if (this.props.selectedTab) { if (this.props.defaultTab) {
let selectedTabId = ""; const selectedTab = _.find(this.props.tabs, {
for (let index = 0; index < this.props.tabs.length; index++) { label: this.props.defaultTab,
if (this.props.tabs[index].label === this.props.selectedTab) { });
selectedTabId = this.props.tabs[index].id; const selectedTabId = selectedTab ? selectedTab.id : undefined;
}
}
this.updateWidgetMetaProperty("selectedTabId", selectedTabId); this.updateWidgetMetaProperty("selectedTabId", selectedTabId);
} }
} }
@ -167,7 +176,7 @@ export interface TabsWidgetProps<T extends TabContainerWidgetProps>
children: T[]; children: T[];
snapColumns?: number; snapColumns?: number;
snapRows?: number; snapRows?: number;
selectedTab: string; defaultTab: string;
selectedTabId: string; selectedTabId: string;
} }