elementPath?: string;
isMSToolbarVisible: boolean;
checkedList: TCheckedList;
+ is404?: boolean;
}
interface DataExplorerActionProps<T> {
type DataExplorerState = {
prevRefresh: string;
prevRoute: string;
- notFound: boolean;
};
export const DataExplorer = withStyles(styles)(
state: DataExplorerState = {
prevRefresh: "",
prevRoute: "",
- notFound: false,
};
multiSelectToolbarInTitle = !this.props.title && !this.props.progressBar;
prevRefresh: currentRefresh,
});
}
-
- if(this.state.notFound === true && this.props.itemsAvailable > 0) {
- this.setState({
- notFound: false,
- });
- }
-
- if (prevProps.working === true && this.props.working === false) {
- this.setState({
- notFound: this.props.itemsAvailable === 0,
- });
- }
}
componentDidMount() {
setCheckedListOnStore={setCheckedListOnStore}
checkedList={checkedList}
working={working}
- notFound={this.state.notFound}
+ is404={this.props.is404}
/>
</Grid>
<Grid
toggleMSToolbar: (isVisible: boolean) => void;
setCheckedListOnStore: (checkedList: TCheckedList) => void;
checkedList: TCheckedList;
- notFound?: boolean;
+ is404?: boolean;
}
type CssRules =
type DataTableState = {
isSelected: boolean;
+ isLoaded: boolean;
};
type DataTableProps<T> = DataTableDataProps<T> & WithStyles<CssRules>;
class Component<T> extends React.Component<DataTableProps<T>> {
state: DataTableState = {
isSelected: false,
+ isLoaded: false,
};
componentDidMount(): void {
if (prevProps.currentRoute !== this.props.currentRoute) {
this.initializeCheckedList([])
}
+ if(prevProps.working === true && this.props.working === false) {
+ this.setState({ isLoaded: true });
+ }
}
componentWillUnmount(): void {
};
render() {
- const { items, classes, working, columns, notFound } = this.props;
+ const { items, classes, working, columns, is404 } = this.props;
+ const { isLoaded } = this.state;
if (columns[0].name === this.checkBoxColumn.name) columns.shift();
columns.unshift(this.checkBoxColumn);
return (
<TableHead>
<TableRow>{this.mapVisibleColumns(this.renderHeadCell)}</TableRow>
</TableHead>
- <TableBody className={classes.tableBody}>{(!working && !notFound) && items.map(this.renderBodyRow)}</TableBody>
+ <TableBody className={classes.tableBody}>{(isLoaded && !is404) && items.map(this.renderBodyRow)}</TableBody>
</Table>
- {(working || notFound) && this.renderNoItemsPlaceholder(this.props.columns)}
+ {(!isLoaded || is404 || items.length === 0) && this.renderNoItemsPlaceholder(this.props.columns)}
</div>
</div>
);
}
renderNoItemsPlaceholder = (columns: DataColumns<T, any>) => {
- const { working, notFound } = this.props;
const dirty = columns.some(column => getTreeDirty("")(column.filters));
- if (working) {
+ if (this.state.isLoaded === false) {
return (
<DataTableDefaultView
icon={this.props.defaultViewIcon}
messages={["Loading data, please wait"]}
/>
);
- } else if (notFound) {
+ } else if (this.props.is404) {
return (
<DataTableDefaultView
icon={this.props.defaultViewIcon}
SET_EXPLORER_SEARCH_VALUE: ofType<{ id: string; searchValue: string }>(),
RESET_EXPLORER_SEARCH_VALUE: ofType<{ id: string }>(),
SET_REQUEST_STATE: ofType<{ id: string; requestState: DataTableRequestState }>(),
+ SET_IS_RESPONSE_404: ofType<{ id: string; isResponse404: boolean }>(),
});
export type DataExplorerAction = UnionOf<typeof dataExplorerActions>;
SET_EXPLORER_SEARCH_VALUE: (payload: { searchValue: string }) => dataExplorerActions.SET_EXPLORER_SEARCH_VALUE({ ...payload, id }),
RESET_EXPLORER_SEARCH_VALUE: () => dataExplorerActions.RESET_EXPLORER_SEARCH_VALUE({ id }),
SET_REQUEST_STATE: (payload: { requestState: DataTableRequestState }) => dataExplorerActions.SET_REQUEST_STATE({ ...payload, id }),
+ SET_IS_RESPONSE_404: (payload: { isResponse404: boolean }) => dataExplorerActions.SET_IS_RESPONSE_404({ ...payload, id }),
});
searchValue: string;
working?: boolean;
requestState: DataTableRequestState;
+ isResponse404: boolean;
}
export const initialDataExplorer: DataExplorer = {
rowsPerPageOptions: [10, 20, 50, 100, 200, 500],
searchValue: '',
requestState: DataTableRequestState.IDLE,
+ isResponse404: false,
};
export type DataExplorerState = Record<string, DataExplorer>;
TOGGLE_COLUMN: ({ id, columnName }) =>
update(state, id, mapColumns(toggleColumn(columnName))),
+ SET_IS_RESPONSE_404: ({ id, isResponse404 }) =>
+ update(state, id, (explorer) => ({ ...explorer, isResponse404 })),
+
default: () => state,
});
};
import { containerRequestFieldsNoMounts } from "models/container-request";
import { MultiSelectMenuActionNames } from "views-components/multiselect-toolbar/ms-menu-actions";
import { removeDisabledButton } from "store/multiselect/multiselect-actions";
+import { dataExplorerActions } from "store/data-explorer/data-explorer-action";
export class ProjectPanelMiddlewareService extends DataExplorerMiddlewareService {
constructor(private services: ServiceRepository, id: string) {
api.dispatch(projectPanelDataExplorerIsNotSet());
} else {
try {
+ api.dispatch<any>(dataExplorerActions.SET_IS_RESPONSE_404({ id: this.id, isResponse404: false }));
if (!background) { api.dispatch(progressIndicatorActions.START_WORKING(this.getId())); }
const response = await this.services.groupsService.contents(projectUuid, getParams(dataExplorer, !!isProjectTrashed));
const resourceUuids = response.items.map(item => item.uuid);
})
);
if (e.status === 404) {
- // It'll just show up as not found
+ api.dispatch<any>(dataExplorerActions.SET_IS_RESPONSE_404({ id: this.id, isResponse404: true}));
}
else {
api.dispatch(couldNotFetchProjectContents());
});
}).catch(() => {
api.dispatch(couldNotFetchSearchResults(session.clusterId));
- api.dispatch(progressIndicatorActions.STOP_WORKING(this.id))
+ api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.id))
});
}
);
onRowDoubleClick: (item: any) => void;
extractKey?: (item: any) => React.Key;
working?: boolean;
+ is404?: boolean;
}
const mapStateToProps = ({ progressIndicator, dataExplorer, router, multiselect, detailsPanel, properties}: RootState, { id }: Props) => {
userUuid: string;
dataExplorerItems: any;
working: boolean;
+ is404: boolean;
}
type ProjectPanelProps = ProjectPanelDataProps & DispatchProp & WithStyles<CssRules> & RouteComponentProps<{ id: string }>;
const currentItemId = getProperty<string>(PROJECT_PANEL_CURRENT_UUID)(state.properties);
const project = getResource<GroupResource>(currentItemId || "")(state.resources);
const working = !!state.progressIndicator.some(p => p.id === PROJECT_PANEL_ID && p.working);
+ const is404 = state.dataExplorer[PROJECT_PANEL_ID].isResponse404;
return {
working,
currentItemId,
project,
+ is404,
resources: state.resources,
userUuid: state.auth.user!.uuid,
};
defaultViewIcon={ProjectIcon}
defaultViewMessages={DEFAULT_VIEW_MESSAGES}
working={this.props.working}
+ is404={this.props.is404}
/>
</div>
}
projects / arvados.git / commitdiff