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

Merge branch 'fix/widget-loading' into 'release'

Browse Source 
Fix components for widget update

See merge request theappsmith/internal-tools-client!275
This commit is contained in:
Hetu Nandu 2020-01-31 11:13:16 +00:00
commit e0aa13b35e
6 changed files with 75 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/client/src/components/designSystems/blueprint/DatePickerComponent.tsx
View File

@ -25,7 +25,13 @@ class DatePickerComponent extends React.Component<DatePickerComponentProps> {
return (
<StyledControlGroup fill>
{this.props.label && (
<Label className={Classes.TEXT_OVERFLOW_ELLIPSIS}>
<Label
className={
this.props.isLoading
? Classes.SKELETON
: Classes.TEXT_OVERFLOW_ELLIPSIS
}
>
{this.props.label}
</Label>
)}

8
app/client/src/components/designSystems/blueprint/DropdownComponent.tsx
View File

@ -74,7 +74,13 @@ class DropDownComponent extends React.Component<DropDownComponentProps> {
<DropdownContainer>
<StyledControlGroup fill>
{this.props.label && (
<Label className={Classes.TEXT_OVERFLOW_ELLIPSIS}>
<Label
className={
this.props.isLoading
? Classes.SKELETON
: Classes.TEXT_OVERFLOW_ELLIPSIS
}
>
{this.props.label}
</Label>
)}

12
app/client/src/components/designSystems/blueprint/InputComponent.tsx
View File

@ -105,10 +105,14 @@ class InputComponent extends React.Component<
return (
<InputComponentWrapper fill>
{this.props.label && (
<Label className={Classes.TEXT_OVERFLOW_ELLIPSIS}>
<span className={this.props.isLoading ? "bp3-skeleton" : ""}>
{this.props.label}
</span>
<Label
className={
this.props.isLoading
? Classes.SKELETON
: Classes.TEXT_OVERFLOW_ELLIPSIS
}
>
{this.props.label}
</Label>
)}

8
app/client/src/components/designSystems/blueprint/RadioGroupComponent.tsx
View File

@ -31,7 +31,13 @@ class RadioGroupComponent extends React.Component<RadioGroupComponentProps> {
return (
<StyledControlGroup fill>
{this.props.label && (
<Label className={Classes.TEXT_OVERFLOW_ELLIPSIS}>
<Label
className={
this.props.isLoading
? Classes.SKELETON
: Classes.TEXT_OVERFLOW_ELLIPSIS
}
>
{this.props.label}
</Label>
)}

67
app/client/src/components/designSystems/syncfusion/TableComponent.tsx
View File

@ -20,6 +20,7 @@ import React, { useRef, MutableRefObject, useEffect, memo } from "react";
import styled from "constants/DefaultTheme";
import { ColumnAction } from "components/propertyControls/ColumnActionSelectorControl";
import { ActionPayload } from "constants/ActionConstants";
import { Classes } from "@blueprintjs/core";
export interface TableComponentProps {
data: object[];
@ -163,38 +164,48 @@ const TableComponent = memo(
}
return (
<StyledGridComponent
selectionSettings={settings}
dataSource={props.data}
rowSelected={rowSelected}
ref={grid}
width={"100%"}
height={"100%"}
allowPaging={true}
allowReordering={true}
allowResizing={true}
showColumnMenu={true}
columnDragStart={columnDragStart}
columnDrop={columnDrop}
commandClick={onCommandClick}
columnMenuOpen={columnMenuOpen}
>
<Inject services={[Resize, Page, Reorder, ColumnMenu, CommandColumn]} />
<ColumnsDirective>
{props.columns.map(col => {
return (
<ColumnDirective key={col.field} field={col.field} width={200} />
);
})}
{commands.length > 0 && (
<ColumnDirective headerText="Actions" commands={commands} />
)}
</ColumnsDirective>
</StyledGridComponent>
<div className={props.isLoading ? Classes.SKELETON : ""}>
<StyledGridComponent
selectionSettings={settings}
dataSource={props.data}
rowSelected={rowSelected}
ref={grid}
width={"100%"}
height={"100%"}
allowPaging={true}
allowReordering={true}
allowResizing={true}
showColumnMenu={true}
columnDragStart={columnDragStart}
columnDrop={columnDrop}
commandClick={onCommandClick}
columnMenuOpen={columnMenuOpen}
// queryCellInfo={customizeCell}
>
<Inject
services={[Resize, Page, Reorder, ColumnMenu, CommandColumn]}
/>
<ColumnsDirective>
{props.columns.map(col => {
return (
<ColumnDirective
key={col.field}
field={col.field}
width={200}
/>
);
})}
{commands.length > 0 && (
<ColumnDirective headerText="Actions" commands={commands} />
)}
</ColumnsDirective>
</StyledGridComponent>
</div>
);
},
(prevProps, nextProps) => {
const propsNotEqual =
nextProps.isLoading !== prevProps.isLoading ||
JSON.stringify(nextProps.data) !== JSON.stringify(prevProps.data) ||
nextProps.height !== prevProps.height ||
JSON.stringify(nextProps.columnActions) !==

10
app/client/src/sagas/ActionSagas.ts
View File

@ -11,6 +11,7 @@ import {
put,
takeEvery,
takeLatest,
take,
} from "redux-saga/effects";
import {
ActionPayload,
@ -382,7 +383,6 @@ export function* runApiActionSaga(action: ReduxAction<string>) {
function* executePageLoadActionsSaga(action: ReduxAction<PageAction[][]>) {
const pageActions = action.payload;
const apiResponses = yield select(getActionResponses);
const actionPayloads: ActionPayload[][] = pageActions.map(actionSet =>
actionSet.map(action => ({
actionId: action.id,
@ -392,10 +392,14 @@ function* executePageLoadActionsSaga(action: ReduxAction<PageAction[][]>) {
})),
);
for (const actionSet of actionPayloads) {
const apiResponses = yield select(getActionResponses);
const filteredSet = actionSet.filter(
action => !(action.actionId in apiResponses),
action => !apiResponses[action.actionId],
);
yield* executeReduxActionSaga(executeAction(filteredSet));
yield put(executeAction(filteredSet));
for (const {} of filteredSet) {
yield take(ReduxActionTypes.EXECUTE_ACTION_SUCCESS);
}
}
}