From 6db0172a5001642c17fe76252d02789a308d073f Mon Sep 17 00:00:00 2001
From: Alexis Svinartchouk <alexis@resin.io>
Date: Thu, 28 May 2020 13:04:35 +0200
Subject: [PATCH] Remove useless StepSelection component

Change-type: patch
---
 lib/gui/app/pages/main/Flash.tsx  | 51 +++++++++++++++----------------
 lib/gui/app/styled-components.tsx |  4 ---
 2 files changed, 24 insertions(+), 31 deletions(-)

diff --git a/lib/gui/app/pages/main/Flash.tsx b/lib/gui/app/pages/main/Flash.tsx
index 1c58431c..d88024aa 100644
--- a/lib/gui/app/pages/main/Flash.tsx
+++ b/lib/gui/app/pages/main/Flash.tsx
@@ -36,7 +36,6 @@ import { scanner as driveScanner } from '../../modules/drive-scanner';
 import * as imageWriter from '../../modules/image-writer';
 import * as progressStatus from '../../modules/progress-status';
 import * as notification from '../../os/notification';
-import { StepSelection } from '../../styled-components';
 
 const COMPLETED_PERCENTAGE = 100;
 const SPEED_PRECISION = 2;
@@ -261,33 +260,31 @@ export class FlashStep extends React.PureComponent<
 						/>
 					</div>
 
-					<div className="space-vertical-large">
-						<StepSelection>
-							<ProgressButton
-								type={this.props.step}
-								active={this.props.isFlashing}
-								percentage={this.props.percentage}
-								label={getProgressButtonLabel(
-									this.props.isFlashing,
-									this.props.step,
-									this.props.position,
-									this.props.percentage,
-								)}
-								disabled={this.props.shouldFlashStepBeDisabled}
-								callback={() => {
-									this.tryFlash();
-								}}
-							/>
-							{this.props.isFlashing && (
-								<IconButton
-									icon={<FontAwesomeIcon icon={faTimes} />}
-									plain
-									onClick={imageWriter.cancel}
-									color="#fff"
-									hoverIndicator={{ dark: true }}
-								/>
+					<div className="space-vertical-large" style={{ display: 'flex' }}>
+						<ProgressButton
+							type={this.props.step}
+							active={this.props.isFlashing}
+							percentage={this.props.percentage}
+							label={getProgressButtonLabel(
+								this.props.isFlashing,
+								this.props.step,
+								this.props.position,
+								this.props.percentage,
 							)}
-						</StepSelection>
+							disabled={this.props.shouldFlashStepBeDisabled}
+							callback={() => {
+								this.tryFlash();
+							}}
+						/>
+						{this.props.isFlashing && (
+							<IconButton
+								icon={<FontAwesomeIcon icon={faTimes} />}
+								plain
+								onClick={imageWriter.cancel}
+								color="#fff"
+								hoverIndicator={{ dark: true }}
+							/>
+						)}
 
 						{!_.isNil(this.props.speed) &&
 							this.props.percentage !== COMPLETED_PERCENTAGE && (
diff --git a/lib/gui/app/styled-components.tsx b/lib/gui/app/styled-components.tsx
index fb55cf84..fd7ddd09 100644
--- a/lib/gui/app/styled-components.tsx
+++ b/lib/gui/app/styled-components.tsx
@@ -123,10 +123,6 @@ export const StepNameButton = styled(Button)`
 		}
 	}
 `;
-export const StepSelection = styled(Flex)`
-	flex-wrap: wrap;
-	justify-content: center;
-`;
 export const Footer = styled(Txt)`
 	margin-top: 10px;
 	color: ${colors.dark.disabled.foreground};