diff --git a/app/scripts/modules/docker/src/image/DockerImageAndTagSelector.tsx b/app/scripts/modules/docker/src/image/DockerImageAndTagSelector.tsx index 2b7fede73b4..b32241163c3 100644 --- a/app/scripts/modules/docker/src/image/DockerImageAndTagSelector.tsx +++ b/app/scripts/modules/docker/src/image/DockerImageAndTagSelector.tsx @@ -39,6 +39,7 @@ export interface IDockerImageAndTagSelectorProps { export interface IDockerImageAndTagSelectorState { accountOptions: Array>; switchedManualWarning: string; + missingFields?: string[]; imagesLoaded: boolean; imagesLoading: boolean; organizationOptions: Array>; @@ -293,6 +294,7 @@ export class DockerImageAndTagSelector extends React.Component< if (!tagFound) { missingFields.push('tag'); } + newState.missingFields = missingFields; newState.switchedManualWarning = `Could not find ${missingFields.join(' or ')}, switched to manual entry`; } else if (!imageId || !imageId.includes('${')) { this.synchronizeChanges( @@ -402,7 +404,7 @@ export class DockerImageAndTagSelector extends React.Component< const newFields = DockerImageUtils.splitImageId(this.props.imageId || ''); this.props.onChange(newFields); if (this.state.switchedManualWarning) { - this.setState({ switchedManualWarning: undefined }); + this.setState({ switchedManualWarning: undefined, missingFields: undefined }); } } this.setState({ defineManually }); @@ -425,6 +427,7 @@ export class DockerImageAndTagSelector extends React.Component< const { accountOptions, switchedManualWarning, + missingFields, imagesLoading, lookupType, organizationOptions, @@ -467,7 +470,14 @@ export class DockerImageAndTagSelector extends React.Component<
-
{switchedManualWarning}
+
+ {switchedManualWarning} + {(missingFields || []).map(f => ( +
+ +
+ ))} +
@@ -638,15 +648,18 @@ export class DockerImageAndTagSelector extends React.Component< required={true} /> ) : ( - ) => this.valueChanged('tag', o ? o.value : undefined)} + options={tagOptions} + placeholder="No tag" + required={true} + /> + + )}