19231: Add smaller page sizes (10 and 20 items) to load faster
[arvados-workbench2.git] / src / store / subprocess-panel / subprocess-panel-middleware-service.ts
1 // Copyright (C) The Arvados Authors. All rights reserved.
2 //
3 // SPDX-License-Identifier: AGPL-3.0
4
5 import { ServiceRepository } from 'services/services';
6 import { MiddlewareAPI, Dispatch } from 'redux';
7 import {
8     DataExplorerMiddlewareService, dataExplorerToListParams, listResultsToDataExplorerItemsMeta, getDataExplorerColumnFilters
9 } from 'store/data-explorer/data-explorer-middleware-service';
10 import { RootState } from 'store/store';
11 import { snackbarActions, SnackbarKind } from 'store/snackbar/snackbar-actions';
12 import { DataExplorer, getDataExplorer } from 'store/data-explorer/data-explorer-reducer';
13 import { updateResources } from 'store/resources/resources-actions';
14 import { SortDirection } from 'components/data-table/data-column';
15 import { OrderDirection, OrderBuilder } from 'services/api/order-builder';
16 import { ListResults } from 'services/common-service/common-service';
17 import { getSortColumn } from "store/data-explorer/data-explorer-reducer";
18 import { ProcessResource } from 'models/process';
19 import { SubprocessPanelColumnNames } from 'views/subprocess-panel/subprocess-panel-root';
20 import { FilterBuilder, joinFilters } from 'services/api/filter-builder';
21 import { subprocessPanelActions } from './subprocess-panel-actions';
22 import { DataColumns } from 'components/data-table/data-table';
23 import { ProcessStatusFilter, buildProcessStatusFilters } from '../resource-type-filters/resource-type-filters';
24 import { ContainerRequestResource } from 'models/container-request';
25 import { progressIndicatorActions } from '../progress-indicator/progress-indicator-actions';
26 import { loadMissingProcessesInformation } from '../project-panel/project-panel-middleware-service';
27
28 export class SubprocessMiddlewareService extends DataExplorerMiddlewareService {
29     constructor(private services: ServiceRepository, id: string) {
30         super(id);
31     }
32
33     async requestItems(api: MiddlewareAPI<Dispatch, RootState>) {
34         const state = api.getState();
35         const parentContainerRequestUuid = state.processPanel.containerRequestUuid;
36         if (parentContainerRequestUuid === "") { return; }
37         const dataExplorer = getDataExplorer(state.dataExplorer, this.getId());
38
39         try {
40             api.dispatch(progressIndicatorActions.START_WORKING(this.getId()));
41             const parentContainerRequest = await this.services.containerRequestService.get(parentContainerRequestUuid);
42             const containerRequests = await this.services.containerRequestService.list(
43                 { ...getParams(dataExplorer, parentContainerRequest) });
44
45             api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId()));
46             api.dispatch(updateResources(containerRequests.items));
47             await api.dispatch<any>(loadMissingProcessesInformation(containerRequests.items));
48             // Populate the actual user view
49             api.dispatch(setItems(containerRequests));
50         } catch {
51             api.dispatch(progressIndicatorActions.PERSIST_STOP_WORKING(this.getId()));
52             api.dispatch(couldNotFetchSubprocesses());
53         }
54     }
55 }
56
57 export const getParams = (
58     dataExplorer: DataExplorer,
59     parentContainerRequest: ContainerRequestResource) => ({
60         ...dataExplorerToListParams(dataExplorer),
61         order: getOrder(dataExplorer),
62         filters: getFilters(dataExplorer, parentContainerRequest)
63     });
64
65 const getOrder = (dataExplorer: DataExplorer) => {
66     const sortColumn = getSortColumn(dataExplorer);
67     const order = new OrderBuilder<ProcessResource>();
68     if (sortColumn) {
69         const sortDirection = sortColumn && sortColumn.sortDirection === SortDirection.ASC
70             ? OrderDirection.ASC
71             : OrderDirection.DESC;
72
73         const columnName = sortColumn && sortColumn.name === SubprocessPanelColumnNames.NAME ? "name" : "modifiedAt";
74         return order
75             .addOrder(sortDirection, columnName)
76             .getOrder();
77     } else {
78         return order.getOrder();
79     }
80 };
81
82 export const getFilters = (
83     dataExplorer: DataExplorer,
84     parentContainerRequest: ContainerRequestResource) => {
85         const columns = dataExplorer.columns as DataColumns<string>;
86         const statusColumnFilters = getDataExplorerColumnFilters(columns, 'Status');
87         const activeStatusFilter = Object.keys(statusColumnFilters).find(
88             filterName => statusColumnFilters[filterName].selected
89         ) || ProcessStatusFilter.ALL;
90
91         // Get all the subprocess' container requests and containers.
92         const fb = new FilterBuilder().addEqual('requesting_container_uuid', parentContainerRequest.containerUuid);
93         const statusFilters = buildProcessStatusFilters(fb, activeStatusFilter).getFilters();
94
95         const nameFilters = dataExplorer.searchValue
96             ? new FilterBuilder()
97                 .addILike("name", dataExplorer.searchValue)
98                 .getFilters()
99             : '';
100
101         return joinFilters(
102             nameFilters,
103             statusFilters
104         );
105     };
106
107 export const setItems = (listResults: ListResults<ProcessResource>) =>
108     subprocessPanelActions.SET_ITEMS({
109         ...listResultsToDataExplorerItemsMeta(listResults),
110         items: listResults.items.map(resource => resource.uuid),
111     });
112
113 const couldNotFetchSubprocesses = () =>
114     snackbarActions.OPEN_SNACKBAR({
115         message: 'Could not fetch subprocesses.',
116         kind: SnackbarKind.ERROR
117     });