Skipped status check is shown as pending (#3005)

Fixes #2580

Author: burkeholland

Diff for: resources/icons/skip.svg

@@ -14,6 +14,7 @@ export default Icon;
 
 export const alertIcon = <Icon src={require('../../resources/icons/alert.svg')} />;
 export const checkIcon = <Icon src={require('../../resources/icons/check.svg')} />;
+export const skipIcon = <Icon src={require('../../resources/icons/skip.svg')} />;
 export const chevronIcon = <Icon src={require('../../resources/icons/chevron.svg')} />;
 export const commentIcon = <Icon src={require('../../resources/icons/comment.svg')} />;
 export const commitIcon = <Icon src={require('../../resources/icons/commit_icon.svg')} />;

Diff for: webviews/components/icon.tsx

@@ -10,7 +10,7 @@ import { PullRequest } from '../common/cache';
 import PullRequestContext from '../common/context';
 import { Reviewer } from '../components/reviewer';
 import { Dropdown } from './dropdown';
-import { alertIcon, checkIcon, deleteIcon, mergeIcon, pendingIcon } from './icon';
+import { alertIcon, checkIcon, deleteIcon, mergeIcon, pendingIcon, skipIcon } from './icon';
 import { nbsp } from './space';
 import { Avatar } from './user';
 
@@ -51,7 +51,7 @@ const StatusChecks = ({ pr }: { pr: PullRequest }) => {
 			<div className="status-section">
 				<div className="status-item">
 					<StateIcon state={status.state} />
-					<div>{getSummaryLabel(status.statuses)}</div>
+					 <div>{getSummaryLabel(status.statuses)}</div>
 					<a href="javascript:void(0)" aria-role="button" onClick={toggleDetails}>
 						{showDetails ? 'Hide' : 'Show'}
 					</a>
@@ -375,14 +375,16 @@ function getSummaryLabel(statuses: any[]) {
 	for (const statusType of Object.keys(statusTypes)) {
 		const numOfType = statusTypes[statusType].length;
 		let statusAdjective = '';
-
 		switch (statusType) {
 			case 'success':
 				statusAdjective = 'successful';
 				break;
 			case 'failure':
 				statusAdjective = 'failed';
 				break;
+			case 'neutral':
+				statusAdjective = 'skipped';
+				break;
 			default:
 				statusAdjective = 'pending';
 		}
@@ -398,6 +400,8 @@ function getSummaryLabel(statuses: any[]) {
 
 function StateIcon({ state }: { state: string }) {
 	switch (state) {
+		case 'neutral':
+			return skipIcon;
 		case 'success':
 			return checkIcon;
 		case 'failure':