Skip to content

Commit

Permalink
feat: merge devmain into master (flyteorg#632)
Browse files Browse the repository at this point in the history
* fix: merge devmain into master

Signed-off-by: Olga Nad <[email protected]>

* fix: clean-up

Signed-off-by: Olga Nad <[email protected]>

Signed-off-by: Olga Nad <[email protected]>
  • Loading branch information
olga-union authored Nov 2, 2022
1 parent b06cc84 commit ab19c54
Show file tree
Hide file tree
Showing 110 changed files with 3,467 additions and 2,160 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ For help with installing dependencies look into
```
2. Now, export the following env variables:

` export ADMIN_API_URL=http://localhost:30080 export DISABLE_AUTH=1 `
`export ADMIN_API_URL=http://localhost:30080 export DISABLE_AUTH=1`

> You can persist these environment variables either in the current shell or in a `.env` file at the root
> of the repository. A `.env` file will persist the settings across multiple terminal
Expand Down
2 changes: 1 addition & 1 deletion packages/zapp/console/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@
"@commitlint/cli": "^8.3.5",
"@commitlint/config-conventional": "^8.3.4",
"@date-io/moment": "1.3.9",
"@flyteorg/flyteidl": "1.1.4",
"@flyteorg/flyteidl": "1.2.2",
"@material-ui/core": "^4.0.0",
"@material-ui/icons": "^4.0.0",
"@material-ui/pickers": "^3.2.2",
Expand Down
37 changes: 4 additions & 33 deletions packages/zapp/console/src/components/Entities/EntityInputs.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import { FilterOperationName } from 'models/AdminEntity/types';
import { ResourceIdentifier } from 'models/Common/types';
import { LaunchPlanClosure, LaunchPlanSpec } from 'models/Launch/types';
import * as React from 'react';
import { useMemo } from 'react';
import t from './strings';
import { transformLiterals } from '../Literals/helpers';

Expand Down Expand Up @@ -104,8 +105,8 @@ export const EntityInputs: React.FC<{
? launchPlanState.value[0].spec
: ({} as LaunchPlanSpec);

const expectedInputs = React.useMemo<Input[]>(() => {
const results = [] as Input[];
const expectedInputs = useMemo<Input[]>(() => {
const results: Input[] = [];
Object.keys(closure?.expectedInputs?.parameters ?? {}).forEach((name) => {
const parameter = closure?.expectedInputs.parameters[name];
if (parameter?.var?.type) {
Expand All @@ -121,25 +122,11 @@ export const EntityInputs: React.FC<{
return results;
}, [closure]);

const fixedInputs = React.useMemo<Input[]>(() => {
const fixedInputs = useMemo<Input[]>(() => {
const inputsMap = transformLiterals(spec?.fixedInputs?.literals ?? {});
return Object.keys(inputsMap).map((name) => ({ name, defaultValue: inputsMap[name] }));
}, [spec]);

const configs = React.useMemo(
() => [
{ name: t('configType'), value: 'single (csv)' },
{
name: t('configUrl'),
value:
'https://raw.githubusercontent.com/jbrownlee/Datasets/master/pima-indians-diabetes.data.csv',
},
{ name: t('configSeed'), value: '7' },
{ name: t('configTestSplitRatio'), value: '0.33' },
],
[],
);

return (
<>
<Typography className={styles.header} variant="h3">
Expand Down Expand Up @@ -232,22 +219,6 @@ export const EntityInputs: React.FC<{
)}
</div>
</div>
{/* <div className={styles.rowContainer}>
<div className={styles.firstColumnContainer}>
<Typography className={styles.header} variant="h4">
{t('configuration')}
</Typography>
<ul className={styles.configs}>
{configs.map(({ name, value }) => (
<li className={styles.config} key={name}>
<span className={styles.configName}><Typography variant="body">{name}:</Typography></span>
<span className={styles.configValue}><Typography variant="body">{value}</Typography></span>
</li>
))}
</ul>
</div>
<div className={styles.secondColumnContainer}></div>
</div> */}
</>
);
};
116 changes: 116 additions & 0 deletions packages/zapp/console/src/components/Executions/CacheStatus.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,116 @@
import { SvgIconProps, Tooltip, Typography } from '@material-ui/core';
import { makeStyles, Theme } from '@material-ui/core/styles';
import CachedOutlined from '@material-ui/icons/CachedOutlined';
import ErrorOutlined from '@material-ui/icons/ErrorOutlined';
import InfoOutlined from '@material-ui/icons/InfoOutlined';
import classnames from 'classnames';
import { assertNever } from 'common/utils';
import { PublishedWithChangesOutlined } from 'components/common/PublishedWithChanges';
import { useCommonStyles } from 'components/common/styles';
import { CatalogCacheStatus } from 'models/Execution/enums';
import { TaskExecutionIdentifier } from 'models/Execution/types';
import { MapCacheIcon } from '@flyteconsole/ui-atoms';
import * as React from 'react';
import { Link as RouterLink } from 'react-router-dom';
import { Routes } from 'routes/routes';
import {
cacheStatusMessages,
unknownCacheStatusString,
viewSourceExecutionString,
} from './constants';

const useStyles = makeStyles((theme: Theme) => ({
cacheStatus: {
alignItems: 'center',
display: 'flex',
marginTop: theme.spacing(1),
},
sourceExecutionLink: {
fontWeight: 'normal',
},
}));

/** Renders the appropriate icon for a given CatalogCacheStatus */
const NodeExecutionCacheStatusIcon: React.FC<
SvgIconProps & {
status: CatalogCacheStatus;
}
> = React.forwardRef(({ status, ...props }, ref) => {
switch (status) {
case CatalogCacheStatus.CACHE_DISABLED:
case CatalogCacheStatus.CACHE_MISS: {
return <InfoOutlined {...props} ref={ref} data-testid="cache-icon" />;
}
case CatalogCacheStatus.CACHE_HIT: {
return <CachedOutlined {...props} ref={ref} data-testid="cache-icon" />;
}
case CatalogCacheStatus.CACHE_POPULATED: {
return <PublishedWithChangesOutlined {...props} ref={ref} data-testid="cache-icon" />;
}
case CatalogCacheStatus.CACHE_LOOKUP_FAILURE:
case CatalogCacheStatus.CACHE_PUT_FAILURE: {
return <ErrorOutlined {...props} ref={ref} data-testid="cache-icon" />;
}
case CatalogCacheStatus.MAP_CACHE: {
return <MapCacheIcon {...props} ref={ref} data-testid="cache-icon" />;
}
default: {
assertNever(status);
return null;
}
}
});

export interface CacheStatusProps {
cacheStatus: CatalogCacheStatus | null | undefined;
/** `normal` will render an icon with description message beside it
* `iconOnly` will render just the icon with the description as a tooltip
*/
variant?: 'normal' | 'iconOnly';
sourceTaskExecutionId?: TaskExecutionIdentifier;
iconStyles?: React.CSSProperties;
}

export const CacheStatus: React.FC<CacheStatusProps> = ({
cacheStatus,
sourceTaskExecutionId,
variant = 'normal',
iconStyles,
}) => {
const commonStyles = useCommonStyles();
const styles = useStyles();

if (cacheStatus == null) {
return null;
}

const message = cacheStatusMessages[cacheStatus] || unknownCacheStatusString;

return variant === 'iconOnly' ? (
<Tooltip title={message}>
<NodeExecutionCacheStatusIcon
className={classnames(commonStyles.iconRight, commonStyles.iconSecondary)}
style={iconStyles}
status={cacheStatus}
/>
</Tooltip>
) : (
<>
<Typography className={styles.cacheStatus} variant="subtitle1" color="textSecondary">
<NodeExecutionCacheStatusIcon
status={cacheStatus}
className={classnames(commonStyles.iconSecondary, commonStyles.iconLeft)}
/>
{message}
</Typography>
{sourceTaskExecutionId && (
<RouterLink
className={classnames(commonStyles.primaryLink, styles.sourceExecutionLink)}
to={Routes.ExecutionDetails.makeUrl(sourceTaskExecutionId.nodeExecutionId.executionId)}
>
{viewSourceExecutionString}
</RouterLink>
)}
</>
);
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { NodeExecutionIdentifier } from 'models/Execution/types';
import { createContext } from 'react';

export interface DetailsPanelContextData {
selectedExecution?: NodeExecutionIdentifier | null;
setSelectedExecution: (selectedExecutionId: NodeExecutionIdentifier | null) => void;
}

export const DetailsPanelContext = createContext<DetailsPanelContextData>(
{} as DetailsPanelContextData,
);
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,11 @@ import { literalsToLiteralValueMap } from 'components/Launch/LaunchForm/utils';
import { TaskInitialLaunchParameters } from 'components/Launch/LaunchForm/types';
import { NodeExecutionPhase } from 'models/Execution/enums';
import Close from '@material-ui/icons/Close';
import { useEffect, useState } from 'react';
import { NodeExecutionDetails } from '../types';
import t from './strings';
import { ExecutionNodeDeck } from './ExecutionNodeDeck';
import { useNodeExecutionContext } from '../contextProvider/NodeExecutionDetails';

const useStyles = makeStyles((theme: Theme) => {
return {
Expand Down Expand Up @@ -57,26 +59,34 @@ const useStyles = makeStyles((theme: Theme) => {
});

interface ExecutionDetailsActionsProps {
details: NodeExecutionDetails;
details?: NodeExecutionDetails;
nodeExecutionId: NodeExecutionIdentifier;
phase?: NodeExecutionPhase;
phase: NodeExecutionPhase;
}

export const ExecutionDetailsActions = (props: ExecutionDetailsActionsProps): JSX.Element => {
const { details, nodeExecutionId, phase } = props;
export const ExecutionDetailsActions = ({
details,
nodeExecutionId,
phase,
}: ExecutionDetailsActionsProps): JSX.Element => {
const styles = useStyles();

const [showLaunchForm, setShowLaunchForm] = React.useState<boolean>(false);
const [showLaunchForm, setShowLaunchForm] = useState<boolean>(false);
const [showResumeForm, setShowResumeForm] = useState<boolean>(false);

const [initialParameters, setInitialParameters] = React.useState<
const [initialParameters, setInitialParameters] = useState<
TaskInitialLaunchParameters | undefined
>(undefined);

const executionData = useNodeExecutionData(nodeExecutionId);
const execution = useNodeExecution(nodeExecutionId);
const id = details.taskTemplate?.id;
const { compiledWorkflowClosure } = useNodeExecutionContext();
const id = details?.taskTemplate?.id;
const compiledNode = (compiledWorkflowClosure?.primary.template.nodes ?? []).find(
(node) => node.id === nodeExecutionId.nodeId,
);

React.useEffect(() => {
useEffect(() => {
if (!id) {
return;
}
Expand All @@ -99,15 +109,16 @@ export const ExecutionDetailsActions = (props: ExecutionDetailsActionsProps): JS
const [showDeck, setShowDeck] = React.useState(false);
const onCloseDeck = () => setShowDeck(false);

if (!id || !initialParameters) {
return <></>;
}

const rerunOnClick = (e: React.MouseEvent<HTMLElement>) => {
e.stopPropagation();
setShowLaunchForm(true);
};

const onResumeClick = (e: React.MouseEvent<HTMLElement>) => {
e.stopPropagation();
setShowResumeForm(true);
};

return (
<>
<div className={styles.actionsContainer}>
Expand All @@ -121,17 +132,35 @@ export const ExecutionDetailsActions = (props: ExecutionDetailsActionsProps): JS
{t('flyteDeck')}
</Button>
)}
<Button variant="outlined" color="primary" onClick={rerunOnClick}>
{t('rerun')}
</Button>
{id && initialParameters && details && (
<Button variant="outlined" color="primary" onClick={rerunOnClick}>
{t('rerun')}
</Button>
)}
{phase === NodeExecutionPhase.PAUSED && (
<Button variant="outlined" color="primary" onClick={onResumeClick}>
{t('resume')}
</Button>
)}
</div>
<LaunchFormDialog
id={id as ResourceIdentifier}
initialParameters={initialParameters}
showLaunchForm={showLaunchForm}
setShowLaunchForm={setShowLaunchForm}
/>
{execution?.value?.closure?.deckUri ? (
{id && initialParameters && (
<LaunchFormDialog
id={id as ResourceIdentifier}
initialParameters={initialParameters}
showLaunchForm={showLaunchForm}
setShowLaunchForm={setShowLaunchForm}
/>
)}
{compiledNode && (
<LaunchFormDialog
compiledNode={compiledNode}
initialParameters={initialParameters}
nodeId={nodeExecutionId.nodeId}
showLaunchForm={showResumeForm}
setShowLaunchForm={setShowResumeForm}
/>
)}
{execution?.value?.closure?.deckUri && (
<Dialog PaperProps={{ className: styles.dialog }} maxWidth={false} open={showDeck}>
<div className={styles.dialogTitle}>
<h2 className={styles.deckTitle}>{t('flyteDeck')}</h2>
Expand All @@ -141,7 +170,7 @@ export const ExecutionDetailsActions = (props: ExecutionDetailsActionsProps): JS
</div>
<ExecutionNodeDeck deckUri={execution.value.closure.deckUri} />
</Dialog>
) : null}
)}
</>
);
};
Loading

0 comments on commit ab19c54

Please sign in to comment.