MaxItemsPerResponse: number
},
ClusterID: string;
+ Containers: {
+ ReserveExtraRAM: number;
+ },
+ InstanceTypes?: {
+ [key: string]: {
+ AddedScratch: number;
+ CUDA?: {
+ DeviceCount: number;
+ DriverVersion: string;
+ HardwareCapability: string;
+ };
+ IncludedScratch: number;
+ Preemptible: boolean;
+ Price: number;
+ ProviderType: string;
+ RAM: number;
+ VCPUs: number;
+ };
+ };
RemoteClusters: {
[key: string]: {
ActivateUsers: boolean
MaxItemsPerResponse: 1000,
},
ClusterID: '',
+ Containers: {
+ ReserveExtraRAM: 576716800,
+ },
RemoteClusters: {},
Services: {
Controller: { ExternalURL: '' },
//
// SPDX-License-Identifier: AGPL-3.0
-import { formatUploadSpeed, formatContainerCost } from "./formatters";
+import { formatUploadSpeed, formatCost } from "./formatters";
describe('formatUploadSpeed', () => {
it('should show speed less than 1MB/s', () => {
describe('formatContainerCost', () => {
it('should correctly round to tenth of a cent', () => {
- expect(formatContainerCost(0.0)).toBe('$0');
- expect(formatContainerCost(0.125)).toBe('$0.125');
- expect(formatContainerCost(0.1254)).toBe('$0.125');
- expect(formatContainerCost(0.1255)).toBe('$0.126');
+ expect(formatCost(0.0)).toBe('$0');
+ expect(formatCost(0.125)).toBe('$0.125');
+ expect(formatCost(0.1254)).toBe('$0.125');
+ expect(formatCost(0.1255)).toBe('$0.126');
});
it('should round up any smaller value to 0.001', () => {
- expect(formatContainerCost(0.0)).toBe('$0');
- expect(formatContainerCost(0.001)).toBe('$0.001');
- expect(formatContainerCost(0.0001)).toBe('$0.001');
- expect(formatContainerCost(0.00001)).toBe('$0.001');
+ expect(formatCost(0.0)).toBe('$0');
+ expect(formatCost(0.001)).toBe('$0.001');
+ expect(formatCost(0.0001)).toBe('$0.001');
+ expect(formatCost(0.00001)).toBe('$0.001');
});
});
return '';
};
-export const formatContainerCost = (cost: number): string => {
+export const formatCost = (cost: number): string => {
const decimalPlaces = 3;
const factor = Math.pow(10, decimalPlaces);
import Image from "@material-ui/icons/Image";
import Stop from "@material-ui/icons/Stop";
import FileCopy from "@material-ui/icons/FileCopy";
+import Storage from "@material-ui/icons/Storage";
// Import FontAwesome icons
import { library } from "@fortawesome/fontawesome-svg-core";
export const StopIcon: IconType = props => <Stop {...props} />;
export const SelectAllIcon: IconType = props => <CheckboxMultipleOutline {...props} />;
export const SelectNoneIcon: IconType = props => <CheckboxMultipleBlankOutline {...props} />;
+export const InstanceTypeIcon: IconType = props => <Storage {...props} />;
const virtualMachineAdminMatch = Routes.matchAdminVirtualMachineRoute(pathname);
const sshKeysUserMatch = Routes.matchSshKeysUserRoute(pathname);
const sshKeysAdminMatch = Routes.matchSshKeysAdminRoute(pathname);
+ const instanceTypesMatch = Routes.matchInstanceTypesRoute(pathname);
const siteManagerMatch = Routes.matchSiteManagerRoute(pathname);
const keepServicesMatch = Routes.matchKeepServicesRoute(pathname);
const apiClientAuthorizationsMatch = Routes.matchApiClientAuthorizationsRoute(pathname);
store.dispatch(WorkbenchActions.loadSshKeys);
} else if (sshKeysAdminMatch) {
store.dispatch(WorkbenchActions.loadSshKeys);
+ } else if (instanceTypesMatch) {
+ store.dispatch(WorkbenchActions.loadInstanceTypes);
} else if (siteManagerMatch) {
store.dispatch(WorkbenchActions.loadSiteManager);
} else if (keepServicesMatch) {
SEARCH_RESULTS: '/search-results',
SSH_KEYS_ADMIN: `/ssh-keys-admin`,
SSH_KEYS_USER: `/ssh-keys-user`,
+ INSTANCE_TYPES: `/instance-types`,
SITE_MANAGER: `/site-manager`,
MY_ACCOUNT: '/my-account',
LINK_ACCOUNT: '/link_account',
export const matchSshKeysUserRoute = (route: string) =>
matchPath(route, { path: Routes.SSH_KEYS_USER });
-export const matchSshKeysAdminRoute = (route: string) =>
+ export const matchSshKeysAdminRoute = (route: string) =>
matchPath(route, { path: Routes.SSH_KEYS_ADMIN });
+export const matchInstanceTypesRoute = (route: string) =>
+ matchPath(route, { path: Routes.INSTANCE_TYPES });
+
export const matchSiteManagerRoute = (route: string) =>
matchPath(route, { path: Routes.SITE_MANAGER });
import { OrderBuilder } from 'services/api/order-builder';
import { Breadcrumb } from 'components/breadcrumbs/breadcrumbs';
import { ContainerRequestResource, containerRequestFieldsNoMounts } from 'models/container-request';
-import { CollectionIcon, IconType, ProcessIcon, ProjectIcon, WorkflowIcon } from 'components/icon/icon';
+import { AdminMenuIcon, CollectionIcon, IconType, InstanceTypeIcon, ProcessIcon, ProjectIcon, WorkflowIcon } from 'components/icon/icon';
import { CollectionResource } from 'models/collection';
import { getSidePanelIcon } from 'views-components/side-panel-tree/side-panel-tree';
import { WorkflowResource } from 'models/workflow';
{ label: MY_ACCOUNT_PANEL_LABEL, uuid: MY_ACCOUNT_PANEL_LABEL },
]));
};
+
+export const INSTANCE_TYPES_PANEL_LABEL = 'Instance Types';
+
+export const setInstanceTypesBreadcrumbs = () =>
+ async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ dispatch(setBreadcrumbs([
+ { label: INSTANCE_TYPES_PANEL_LABEL, uuid: INSTANCE_TYPES_PANEL_LABEL, icon: InstanceTypeIcon },
+ ]));
+ };
+
+export const VIRTUAL_MACHINES_USER_PANEL_LABEL = 'Virtual Machines';
+
+export const setVirtualMachinesBreadcrumbs = () =>
+ async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ dispatch(setBreadcrumbs([
+ { label: VIRTUAL_MACHINES_USER_PANEL_LABEL, uuid: VIRTUAL_MACHINES_USER_PANEL_LABEL },
+ ]));
+ };
+
+export const VIRTUAL_MACHINES_ADMIN_PANEL_LABEL = 'Virtual Machines Admin';
+
+export const setVirtualMachinesAdminBreadcrumbs = () =>
+ async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ dispatch(setBreadcrumbs([
+ { label: VIRTUAL_MACHINES_ADMIN_PANEL_LABEL, uuid: VIRTUAL_MACHINES_ADMIN_PANEL_LABEL, icon: AdminMenuIcon },
+ ]));
+ };
+
+export const REPOSITORIES_PANEL_LABEL = 'Repositories';
+
+export const setRepositoriesBreadcrumbs = () =>
+ async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => {
+ dispatch(setBreadcrumbs([
+ { label: REPOSITORIES_PANEL_LABEL, uuid: REPOSITORIES_PANEL_LABEL, icon: AdminMenuIcon },
+ ]));
+ };
import { ServiceRepository } from "services/services";
import { pluginConfig } from "plugins";
import { snackbarActions, SnackbarKind } from "store/snackbar/snackbar-actions";
-import { USERS_PANEL_LABEL, MY_ACCOUNT_PANEL_LABEL } from "store/breadcrumbs/breadcrumbs-actions";
+import { USERS_PANEL_LABEL, MY_ACCOUNT_PANEL_LABEL, INSTANCE_TYPES_PANEL_LABEL, VIRTUAL_MACHINES_USER_PANEL_LABEL, VIRTUAL_MACHINES_ADMIN_PANEL_LABEL, REPOSITORIES_PANEL_LABEL } from "store/breadcrumbs/breadcrumbs-actions";
export const navigationNotAvailable = (id: string) =>
snackbarActions.OPEN_SNACKBAR({
case MY_ACCOUNT_PANEL_LABEL:
dispatch(navigateToMyAccount);
return;
+ case INSTANCE_TYPES_PANEL_LABEL:
+ dispatch(navigateToInstanceTypes);
+ return;
+ case VIRTUAL_MACHINES_USER_PANEL_LABEL:
+ dispatch(navigateToUserVirtualMachines);
+ return;
+ case VIRTUAL_MACHINES_ADMIN_PANEL_LABEL:
+ dispatch(navigateToAdminVirtualMachines);
+ return;
+ case REPOSITORIES_PANEL_LABEL:
+ dispatch(navigateToRepositories);
+ return;
}
dispatch(navigationNotAvailable(uuid));
export const navigateToSshKeysUser = push(Routes.SSH_KEYS_USER);
+export const navigateToInstanceTypes = push(Routes.INSTANCE_TYPES);
+
export const navigateToSiteManager = push(Routes.SITE_MANAGER);
export const navigateToMyAccount = push(Routes.MY_ACCOUNT);
import { favoritePanelColumns } from "views/favorite-panel/favorite-panel";
import { matchRootRoute } from "routes/routes";
import {
- setBreadcrumbs,
setGroupDetailsBreadcrumbs,
setGroupsBreadcrumbs,
setProcessBreadcrumbs,
setUsersBreadcrumbs,
setMyAccountBreadcrumbs,
setUserProfileBreadcrumbs,
+ setInstanceTypesBreadcrumbs,
+ setVirtualMachinesBreadcrumbs,
+ setVirtualMachinesAdminBreadcrumbs,
+ setRepositoriesBreadcrumbs,
} from "store/breadcrumbs/breadcrumbs-actions";
import { navigateTo, navigateToRootProject } from "store/navigation/navigation-action";
import { MoveToFormDialogData } from "store/move-to-dialog/move-to-dialog";
import { subprocessPanelColumns } from "views/subprocess-panel/subprocess-panel-root";
import { loadAllProcessesPanel, allProcessesPanelActions } from "../all-processes-panel/all-processes-panel-action";
import { allProcessesPanelColumns } from "views/all-processes-panel/all-processes-panel";
-import { AdminMenuIcon } from "components/icon/icon";
import { userProfileGroupsColumns } from "views/user-profile-panel/user-profile-panel-root";
import { selectedToArray, selectedToKindSet } from "components/multiselect-toolbar/MultiselectToolbar";
import { multiselectActions } from "store/multiselect/multiselect-actions";
export const loadVirtualMachines = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
await dispatch(loadVirtualMachinesPanel());
- dispatch(setBreadcrumbs([{ label: "Virtual Machines" }]));
+ dispatch(setVirtualMachinesBreadcrumbs());
});
export const loadVirtualMachinesAdmin = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
await dispatch(loadVirtualMachinesPanel());
- dispatch(setBreadcrumbs([{ label: "Virtual Machines Admin", icon: AdminMenuIcon }]));
+ dispatch(setVirtualMachinesAdminBreadcrumbs());
});
export const loadRepositories = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
await dispatch(loadRepositoriesPanel());
- dispatch(setBreadcrumbs([{ label: "Repositories" }]));
+ dispatch(setRepositoriesBreadcrumbs());
});
export const loadSshKeys = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
await dispatch(loadSshKeysPanel());
});
+export const loadInstanceTypes = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
+ dispatch(setInstanceTypesBreadcrumbs());
+});
+
export const loadSiteManager = handleFirstTimeLoad(async (dispatch: Dispatch<any>) => {
await dispatch(loadSiteManagerPanel());
});
navigateToSiteManager,
navigateToSshKeysUser,
navigateToMyAccount,
- navigateToLinkAccount
+ navigateToLinkAccount,
+ navigateToInstanceTypes
} from 'store/navigation/navigation-action';
import { openUserVirtualMachines } from "store/virtual-machines/virtual-machines-actions";
import { pluginConfig } from 'plugins';
dispatch(openTokenDialog);
}}>Get API token</MenuItem>
<MenuItem onClick={() => dispatch(navigateToSshKeysUser)}>Ssh Keys</MenuItem>
+ <MenuItem onClick={() => dispatch(navigateToInstanceTypes)}>Instance Types</MenuItem>
<MenuItem onClick={() => dispatch(navigateToSiteManager)}>Site Manager</MenuItem>
<MenuItem onClick={() => dispatch(navigateToMyAccount)}>My account</MenuItem>
<MenuItem onClick={() => dispatch(navigateToLinkAccount)}>Link account</MenuItem>
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import React from 'react';
+import { configure, mount } from "enzyme";
+import { InstanceTypesPanel } from './instance-types-panel';
+import Adapter from "enzyme-adapter-react-16";
+import { combineReducers, createStore } from "redux";
+import { Provider } from "react-redux";
+import { formatFileSize } from 'common/formatters';
+
+configure({ adapter: new Adapter() });
+
+describe('<InstanceTypesPanel />', () => {
+
+ // let props;
+ let store;
+
+ const initialAuthState = {
+ config: {
+ clusterConfig: {
+ InstanceTypes: {
+ "normalType" : {
+ ProviderType: "provider",
+ Price: 0.123,
+ VCPUs: 6,
+ Preemptible: false,
+ IncludedScratch: 1000,
+ RAM: 5000,
+ },
+ "gpuType" : {
+ ProviderType: "gpuProvider",
+ Price: 0.456,
+ VCPUs: 8,
+ Preemptible: true,
+ IncludedScratch: 500,
+ RAM: 6000,
+ CUDA: {
+ DeviceCount: 1,
+ HardwareCapability: '8.6',
+ DriverVersion: '11.4',
+ },
+ },
+ },
+ Containers: {
+ ReserveExtraRAM: 1000,
+ }
+ }
+ }
+ }
+
+ beforeEach(() => {
+
+ store = createStore(combineReducers({
+ auth: (state: any = initialAuthState, action: any) => state,
+ }));
+ });
+
+ it('renders instance types', () => {
+ // when
+ const panel = mount(
+ <Provider store={store}>
+ <InstanceTypesPanel />
+ </Provider>);
+
+ // then
+ Object.keys(initialAuthState.config.clusterConfig.InstanceTypes).forEach((instanceKey) => {
+ const instanceType = initialAuthState.config.clusterConfig.InstanceTypes[instanceKey];
+ const item = panel.find(`Grid[data-cy="${instanceKey}"]`)
+
+ expect(item.find('h6').text()).toContain(instanceKey);
+ expect(item.text()).toContain(`Provider type: ${instanceType.ProviderType}`);
+ expect(item.text()).toContain(`Price: $${instanceType.Price}`);
+ expect(item.text()).toContain(`Cores: ${instanceType.VCPUs}`);
+ expect(item.text()).toContain(`Preemptible: ${instanceType.Preemptible.toString()}`);
+ expect(item.text()).toContain(`Max disk request: ${formatFileSize(instanceType.IncludedScratch)}`);
+ expect(item.text()).toContain(`Max ram request: ${formatFileSize(instanceType.RAM - initialAuthState.config.clusterConfig.Containers.ReserveExtraRAM)}`);
+ if (instanceType.CUDA && instanceType.CUDA.DeviceCount > 0) {
+ expect(item.text()).toContain(`CUDA GPUs: ${instanceType.CUDA.DeviceCount}`);
+ expect(item.text()).toContain(`Hardware capability: ${instanceType.CUDA.HardwareCapability}`);
+ expect(item.text()).toContain(`Driver version: ${instanceType.CUDA.DriverVersion}`);
+ }
+ });
+ });
+});
--- /dev/null
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import React from 'react';
+import { StyleRulesCallback, WithStyles, withStyles, Card, CardContent, Typography, Grid } from '@material-ui/core';
+import { ArvadosTheme } from 'common/custom-theme';
+import { InstanceTypeIcon } from 'components/icon/icon';
+import { RootState } from 'store/store';
+import { connect } from 'react-redux';
+import { ClusterConfigJSON } from 'common/config';
+import { NotFoundView } from 'views/not-found-panel/not-found-panel';
+import { formatCost, formatFileSize } from 'common/formatters';
+
+type CssRules = 'root' | 'instanceType';
+
+const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
+ root: {
+ width: '100%',
+ overflow: 'auto'
+ },
+ instanceType: {
+ padding: "10px",
+ },
+});
+
+type InstanceTypesPanelConnectedProps = {config: ClusterConfigJSON};
+
+type InstanceTypesPanelRootProps = InstanceTypesPanelConnectedProps & WithStyles<CssRules>;
+
+const mapStateToProps = ({auth}: RootState): InstanceTypesPanelConnectedProps => ({
+ config: auth.config.clusterConfig,
+});
+
+export const InstanceTypesPanel = withStyles(styles)(connect(mapStateToProps)(
+ ({ config, classes }: InstanceTypesPanelRootProps) => {
+
+ const instances = config.InstanceTypes || {};
+
+ return <Card className={classes.root}>
+ <CardContent>
+ <Grid container direction="row">
+ {Object.keys(instances).length > 0 ?
+ Object.keys(instances).map((instanceKey) => {
+ const instanceType = instances[instanceKey];
+
+ return <Grid data-cy={instanceKey} className={classes.instanceType} item sm={6} xs={12} key={instanceKey}>
+ <Card>
+ <CardContent>
+ <Typography variant="h6">
+ {instanceKey}
+ </Typography>
+ <Typography>
+ Provider type: {instanceType.ProviderType}
+ </Typography>
+ <Typography>
+ Price: {formatCost(instanceType.Price)}
+ </Typography>
+ <Typography>
+ Cores: {instanceType.VCPUs}
+ </Typography>
+ <Typography>
+ Preemptible: {instanceType.Preemptible.toString()}
+ </Typography>
+ <Typography>
+ Max disk request: {formatFileSize(instanceType.IncludedScratch)}
+ </Typography>
+ <Typography>
+ Max ram request: {formatFileSize(instanceType.RAM - config.Containers.ReserveExtraRAM)}
+ </Typography>
+ {instanceType.CUDA && instanceType.CUDA.DeviceCount > 0 ?
+ <>
+ <Typography>
+ CUDA GPUs: {instanceType.CUDA.DeviceCount}
+ </Typography>
+ <Typography>
+ Hardware capability: {instanceType.CUDA.HardwareCapability}
+ </Typography>
+ <Typography>
+ Driver version: {instanceType.CUDA.DriverVersion}
+ </Typography>
+ </> : <></>
+ }
+ </CardContent>
+ </Card>
+ </Grid>
+ }) :
+ <NotFoundView
+ icon={InstanceTypeIcon}
+ messages={["No instances found"]}
+ />
+ }
+ </Grid>
+ </CardContent>
+ </Card>
+ }
+));
import React from "react";
import { Grid, StyleRulesCallback, withStyles } from "@material-ui/core";
import { Dispatch } from 'redux';
-import { formatContainerCost, formatDate } from "common/formatters";
+import { formatCost, formatDate } from "common/formatters";
import { resourceLabel } from "common/labels";
import { DetailsAttribute } from "components/details-attribute/details-attribute";
import { ResourceKind } from "models/resource";
</Grid>
{container && <Grid item xs={12} md={mdSize}>
<DetailsAttribute label='Cost' value={
- `${hasTotalCost ? formatContainerCost(containerRequest.cumulativeCost) + ' total, ' : (totalCostNotReady ? 'total pending completion, ' : '')}${container.cost > 0 ? formatContainerCost(container.cost) : 'not available'} for this container`
+ `${hasTotalCost ? formatCost(containerRequest.cumulativeCost) + ' total, ' : (totalCostNotReady ? 'total pending completion, ' : '')}${container.cost > 0 ? formatCost(container.cost) : 'not available'} for this container`
} />
{container && workflowCollection && <Grid item xs={12} md={mdSize}>
import { ElementListReducer } from "common/plugintypes";
import { COLLAPSE_ICON_SIZE } from "views-components/side-panel-toggle/side-panel-toggle";
import { Banner } from "views-components/baner/banner";
+import { InstanceTypesPanel } from "views/instance-types-panel/instance-types-panel";
type CssRules = "root" | "container" | "splitter" | "asidePanel" | "contentWrapper" | "content";
path={Routes.SSH_KEYS_ADMIN}
component={SshKeyAdminPanel}
/>
+ <Route
+ path={Routes.INSTANCE_TYPES}
+ component={InstanceTypesPanel}
+ />
<Route
path={Routes.SITE_MANAGER}
component={SiteManagerPanel}
projects / arvados.git / commitdiff