jeans/etcher
jeans/etcher
1
0
Fork 0
mirror of https://github.com/balena-io/etcher.git synced 2025-07-23 11:16:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove font awesome unused icons from the generated bundle

Browse Source 
Changelog-entry: Remove font awesome unused icons from the generated bundle
Change-type: patch
This commit is contained in:
Alexis Svinartchouk 2020-07-15 15:20:01 +02:00
parent 170126a490
commit e72049d6e8
9 changed files with 40 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
lib/gui/app/components/flash-results/flash-results.tsx
View File

@ -14,8 +14,8 @@
* limitations under the License.
*/
import { faCheckCircle, faCircle } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import CircleSvg from '@fortawesome/fontawesome-free/svgs/solid/circle.svg';
import CheckCircleSvg from '@fortawesome/fontawesome-free/svgs/solid/check-circle.svg';
import * as _ from 'lodash';
import outdent from 'outdent';
import * as React from 'react';
@ -59,12 +59,10 @@ export function FlashResults({
}}
>
<Flex alignItems="center">
<FontAwesomeIcon
icon={faCheckCircle}
color={allDevicesFailed ? '#c6c8c9' : '#1ac135'}
<CheckCircleSvg
width="24px"
fill={allDevicesFailed ? '#c6c8c9' : '#1ac135'}
style={{
width: '24px',
height: '24px',
margin: '0 15px 0 0',
}}
/>
@ -79,9 +77,9 @@ export function FlashResults({
alignItems="center"
tooltip={type === 'failed' ? errors : undefined}
>
<FontAwesomeIcon
color={type === 'failed' ? '#ff4444' : '#1ac135'}
icon={faCircle}
<CircleSvg
width="14px"
fill={type === 'failed' ? '#ff4444' : '#1ac135'}
/>
<Txt ml={10}>{quantity}</Txt>
<Txt ml={10}>{progress[type](quantity)}</Txt>

9
lib/gui/app/components/settings/settings.tsx
View File

@ -14,8 +14,7 @@
* limitations under the License.
*/
import { faGithub } from '@fortawesome/free-brands-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import GithubSvg from '@fortawesome/fontawesome-free/svgs/brands/github.svg';
import * as _ from 'lodash';
import * as os from 'os';
import * as React from 'react';
@ -151,7 +150,11 @@ export function SettingsModal({ toggleModal }: SettingsModalProps) {
)
}
>
<FontAwesomeIcon icon={faGithub} style={{ marginRight: 8 }} />
<GithubSvg
height="1em"
fill="currentColor"
style={{ marginRight: 8 }}
/>
<Txt style={{ borderBottom: '1px solid #00aeef' }}>{version}</Txt>
</Flex>
</Flex>

18
lib/gui/app/components/source-selector/source-selector.tsx
View File

@ -14,12 +14,9 @@
* limitations under the License.
*/
import {
faFile,
faLink,
faExclamationTriangle,
} from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import FileSvg from '@fortawesome/fontawesome-free/svgs/solid/file.svg';
import LinkSvg from '@fortawesome/fontawesome-free/svgs/solid/link.svg';
import ExclamationTriangleSvg from '@fortawesome/fontawesome-free/svgs/solid/exclamation-triangle.svg';
import { sourceDestination } from 'etcher-sdk';
import { ipcRenderer, IpcRendererEvent } from 'electron';
import * as _ from 'lodash';
@ -526,7 +523,7 @@ export class SourceSelector extends React.Component<
flow={{
onClick: this.openImageSelector,
label: 'Flash from file',
icon: <FontAwesomeIcon icon={faFile} />,
icon: <FileSvg height="1em" fill="currentColor" />,
}}
/>
<FlowSelector
@ -534,7 +531,7 @@ export class SourceSelector extends React.Component<
flow={{
onClick: this.openURLSelector,
label: 'Flash from URL',
icon: <FontAwesomeIcon icon={faLink} />,
icon: <LinkSvg height="1em" fill="currentColor" />,
}}
/>
</>
@ -545,10 +542,7 @@ export class SourceSelector extends React.Component<
<SmallModal
titleElement={
<span>
<FontAwesomeIcon
style={{ color: '#fca321' }}
icon={faExclamationTriangle}
/>{' '}
<ExclamationTriangleSvg fill="#fca321" height="1em" />{' '}
<span>{this.state.warning.title}</span>
</span>
}

5
lib/gui/app/components/target-selector/target-selector-button.tsx
View File

@ -14,6 +14,7 @@
* limitations under the License.
*/
import ExclamationTriangleSvg from '@fortawesome/fontawesome-free/svgs/solid/exclamation-triangle.svg';
import { Drive as DrivelistDrive } from 'drivelist';
import * as React from 'react';
import { Flex, FlexProps } from 'rendition/dist_esm5/components/Flex';
@ -32,8 +33,6 @@ import {
StepNameButton,
} from '../../styled-components';
import { middleEllipsis } from '../../utils/middle-ellipsis';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faExclamationTriangle } from '@fortawesome/free-solid-svg-icons';
interface TargetSelectorProps {
targets: any[];
@ -64,7 +63,7 @@ function DriveCompatibilityWarning({
const messages = compatibilityWarnings.map((warning) => warning.message);
return (
<Flex tooltip={messages.join(', ')} {...props}>
<FontAwesomeIcon icon={faExclamationTriangle} />
<ExclamationTriangleSvg fill="currentColor" height="1em" />
</Flex>
);
}

14
lib/gui/app/components/target-selector/target-selector-modal.tsx
View File

@ -14,11 +14,8 @@
* limitations under the License.
*/
import {
faChevronDown,
faExclamationTriangle,
} from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import ExclamationTriangleSvg from '@fortawesome/fontawesome-free/svgs/solid/exclamation-triangle.svg';
import ChevronDownSvg from '@fortawesome/fontawesome-free/svgs/solid/chevron-down.svg';
import { scanner, sourceDestination } from 'etcher-sdk';
import * as React from 'react';
import { Flex } from 'rendition/dist_esm5/components/Flex';
@ -185,10 +182,7 @@ export class TargetSelectorModal extends React.Component<
render: (description: string, drive: Target) => {
return isDrivelistDrive(drive) && drive.isSystem ? (
<Flex alignItems="center">
<FontAwesomeIcon
style={{ color: '#fca321' }}
icon={faExclamationTriangle}
/>
<ExclamationTriangleSvg height="1em" fill="#fca321" />
<Txt ml={8}>{description}</Txt>
</Flex>
) : (
@ -424,7 +418,7 @@ export class TargetSelectorModal extends React.Component<
onClick={() => this.setState({ showSystemDrives: true })}
>
<Flex alignItems="center">
<FontAwesomeIcon icon={faChevronDown} />
<ChevronDownSvg height="1em" fill="currentColor" />
<Txt ml={8}>Show {numberOfHiddenSystemDrives} hidden</Txt>
</Flex>
</Link>

5
lib/gui/app/pages/main/Flash.tsx
View File

@ -14,6 +14,7 @@
* limitations under the License.
*/
import CircleSvg from '@fortawesome/fontawesome-free/svgs/solid/circle.svg';
import * as _ from 'lodash';
import * as path from 'path';
import * as React from 'react';
@ -36,8 +37,6 @@ import * as notification from '../../os/notification';
import { selectAllTargets } from './DriveSelector';
import FlashSvg from '../../../assets/flash.svg';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faCircle } from '@fortawesome/free-solid-svg-icons';
const COMPLETED_PERCENTAGE = 100;
const SPEED_PRECISION = 2;
@ -288,7 +287,7 @@ export class FlashStep extends React.PureComponent<
{Boolean(this.props.failed) && (
<Flex color="#fff" alignItems="center" mt={35}>
<FontAwesomeIcon color="#ff4444" icon={faCircle} />
<CircleSvg height="1em" fill="#ff4444" />
<Txt ml={10}>{this.props.failed}</Txt>
<Txt ml={10}>{messages.progress.failed(this.props.failed)}</Txt>
</Flex>

9
lib/gui/app/pages/main/MainPage.tsx
View File

@ -14,8 +14,9 @@
* limitations under the License.
*/
import { faCog, faQuestionCircle } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import CogSvg from '@fortawesome/fontawesome-free/svgs/solid/cog.svg';
import QuestionCircleSvg from '@fortawesome/fontawesome-free/svgs/solid/question-circle.svg';
import { sourceDestination } from 'etcher-sdk';
import * as _ from 'lodash';
import * as path from 'path';
@ -193,14 +194,14 @@ export class MainPage extends React.Component<
}}
>
<Icon
icon={<FontAwesomeIcon icon={faCog} />}
icon={<CogSvg height="1em" fill="currentColor" />}
plain
tabIndex={5}
onClick={() => this.setState({ hideSettings: false })}
/>
{!settings.getSync('disableExternalLinks') && (
<Icon
icon={<FontAwesomeIcon icon={faQuestionCircle} />}
icon={<QuestionCircleSvg height="1em" fill="currentColor" />}
onClick={() =>
openExternal(
selectionState.getImageSupportUrl() ||

15
npm-shrinkwrap.json generated
View File

@ -2847,6 +2847,12 @@
"integrity": "sha512-gtis2/5yLdfI6n0ia0jH7NJs5i/Z/8M/ZbQL6jXQhCthEOe5Cr5NcQPhgTvFxNOtURE03/ZqUcEskdn2M+QaBg==",
"dev": true
},
"@fortawesome/fontawesome-free": {
"version": "5.13.1",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-5.13.1.tgz",
"integrity": "sha512-D819f34FLHeBN/4xvw0HR0u7U2G7RqjPSggXqf7LktsxWQ48VAfGwvMrhcVuaZV2fF069c/619RdgCCms0DHhw==",
"dev": true
},
"@fortawesome/fontawesome-svg-core": {
"version": "1.2.29",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.29.tgz",
@ -2864,15 +2870,6 @@
}
}
},
"@fortawesome/free-brands-svg-icons": {
"version": "5.13.0",
"resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.13.0.tgz",
"integrity": "sha512-/6xXiJFCMEQxqxXbL0FPJpwq5Cv6MRrjsbJEmH/t5vOvB4dILDpnY0f7zZSlA8+TG7jwlt12miF/yZpZkykucA==",
"dev": true,
"requires": {
"@fortawesome/fontawesome-common-types": "^0.2.28"
}
},
"@fortawesome/free-regular-svg-icons": {
"version": "5.13.1",
"resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.13.1.tgz",

4
package.json
View File

@ -47,9 +47,7 @@
],
"devDependencies": {
"@balena/lint": "^5.0.4",
"@fortawesome/free-brands-svg-icons": "^5.11.2",
"@fortawesome/free-solid-svg-icons": "^5.11.2",
"@fortawesome/react-fontawesome": "^0.1.7",
"@fortawesome/fontawesome-free": "^5.13.1",
"@svgr/webpack": "^5.4.0",
"@types/bluebird": "^3.5.30",
"@types/chai": "^4.2.7",