jeans/etcher
jeans/etcher
1
0
Fork 0
mirror of https://github.com/balena-io/etcher.git synced 2025-07-19 17:26:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Convert FlashAnother & FlashResults to typescript

Browse Source 
Change-type: patch
Changelog-entry: Convert FlashAnother & FlashResults to typescript
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzothunder.ambrosi@gmail.com>
This commit is contained in:
Lorenzo Alberto Maria Ambrosi 2019-12-03 17:44:12 +01:00
parent c9c9c50d6c
commit 68d9542816
9 changed files with 129 additions and 219 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
lib/gui/app/components/finish/finish.tsx
View File

@ -23,8 +23,8 @@ import * as selectionState from '../../models/selection-state';
import * as store from '../../models/store';
import * as analytics from '../../modules/analytics';
import * as updateLock from '../../modules/update-lock';
import * as FlashAnother from '../flash-another/flash-another';
import * as FlashResults from '../flash-results/flash-results';
import FlashAnother from '../flash-another/flash-another';
import FlashResults from '../flash-results/flash-results';
import * as SVGIcon from '../svg-icon/svg-icon';
const restart = (options: any, $state: any) => {

49
lib/gui/app/components/flash-another/flash-another.jsx
View File

@ -1,49 +0,0 @@
/*
* Copyright 2018 resin.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
'use strict'
// eslint-disable-next-line no-unused-vars
const React = require('react')
const PropTypes = require('prop-types')
const styled = require('styled-components').default
const { position, right } = require('styled-system')
const { BaseButton, ThemedProvider } = require('../../styled-components')
const Div = styled.div `
${position}
${right}
`
const FlashAnother = (props) => {
return (
<ThemedProvider>
<Div position='absolute' right='152px'>
<BaseButton
primary
onClick={props.onClick.bind(null, { preserveImage: true })}>
Flash Another
</BaseButton>
</Div>
</ThemedProvider>
)
}
FlashAnother.propTypes = {
onClick: PropTypes.func
}
module.exports = FlashAnother

47
lib/gui/app/components/flash-another/flash-another.tsx Normal file
View File

@ -0,0 +1,47 @@
/*
* Copyright 2019 balena.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import * as PropTypes from 'prop-types';
import * as React from 'react';
import styled from 'styled-components';
import { position, right } from 'styled-system';
import { BaseButton, ThemedProvider } from '../../styled-components';
const Div = styled.div<any>`
${position}
${right}
`;
const FlashAnother = (props: any) => {
return (
<ThemedProvider>
<Div position="absolute" right="152px">
<BaseButton
primary
onClick={props.onClick.bind(null, { preserveImage: true })}
>
Flash Another
</BaseButton>
</Div>
</ThemedProvider>
);
};
FlashAnother.propTypes = {
onClick: PropTypes.func,
};
export default FlashAnother;

8
lib/gui/app/components/flash-another/index.ts
View File

@ -1,5 +1,5 @@
/*
* Copyright 2018 resin.io
* Copyright 2019 balena.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
@ -14,13 +14,9 @@
* limitations under the License.
*/
/**
* @module Etcher.Components.FlashAnother
*/
import * as angular from 'angular';
import { react2angular } from 'react2angular';
import * as FlashAnother from './flash-another';
import FlashAnother from './flash-another';
export const MODULE_NAME = 'Etcher.Components.FlashAnother';
const FlashAnotherModule = angular.module(MODULE_NAME, []);

88
lib/gui/app/components/flash-results/flash-results.jsx
View File

@ -1,88 +0,0 @@
/*
* Copyright 2018 resin.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/*
* Copyright 2018 resin.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
'use strict'
// eslint-disable-next-line no-unused-vars
const React = require('react')
const PropTypes = require('prop-types')
const _ = require('lodash')
const styled = require('styled-components').default
const {
position,
left,
top,
space
} = require('styled-system')
const { Underline } = require('./../../styled-components')
const Div = styled.div `
${position}
${top}
${left}
${space}
`
/* eslint-disable no-inline-comments */
const FlashResults = (props) => {
return (
<Div position='absolute' left='153px' top='66px'>
<div className="inline-flex title">
<span className="tick tick--success space-right-medium"></span>
<h3>Flash Complete!</h3>
</div>
<Div className="results" mt='11px' mr='0' mb='0' ml='40px'>
<Underline
tooltip={props.errors()}>
{_.map(props.results.devices, (quantity, type) => {
return (quantity) ? (
<div key={type} className={`target-status-line target-status-${type}`}>
<span className="target-status-dot"></span>
<span className="target-status-quantity">{ quantity }</span>
<span className="target-status-message">{ props.message[type](quantity) }</span>
</div>
) : null
})}
</Underline>
</Div>
</Div>
)
}
FlashResults.propTypes = {
results: PropTypes.object,
message: PropTypes.object,
errors: PropTypes.func
}
module.exports = FlashResults

74
lib/gui/app/components/flash-results/flash-results.tsx Normal file
View File

@ -0,0 +1,74 @@
/*
* Copyright 2019 balena.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import * as _ from 'lodash';
import * as PropTypes from 'prop-types';
import * as React from 'react';
import styled from 'styled-components';
import { left, position, space, top } from 'styled-system';
import { Underline } from '../../styled-components';
const Div: any = styled.div<any>`
${position}
${top}
${left}
${space}
`;
const FlashResults: any = ({
errors,
results,
message,
}: {
errors: () => string;
results: any;
message: any;
}) => {
return (
<Div position="absolute" left="153px" top="66px">
<div className="inline-flex title">
<span className="tick tick--success space-right-medium"></span>
<h3>Flash Complete!</h3>
</div>
<Div className="results" mt="11px" mr="0" mb="0" ml="40px">
<Underline tooltip={errors()}>
{_.map(results.devices, (quantity, type) => {
return quantity ? (
<div
key={type}
className={`target-status-line target-status-${type}`}
>
<span className="target-status-dot"></span>
<span className="target-status-quantity">{quantity}</span>
<span className="target-status-message">
{message[type](quantity)}
</span>
</div>
) : null;
})}
</Underline>
</Div>
</Div>
);
};
FlashResults.propTypes = {
results: PropTypes.object,
message: PropTypes.object,
errors: PropTypes.func,
};
export default FlashResults;

4
lib/gui/app/components/flash-results/index.ts
View File

@ -1,5 +1,5 @@
/*
* Copyright 2018 resin.io
* Copyright 2019 balena.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
@ -20,7 +20,7 @@
import * as angular from 'angular';
import { react2angular } from 'react2angular';
import * as FlashResults from './flash-results';
import FlashResults from './flash-results';
export const MODULE_NAME = 'Etcher.Components.FlashResults';
const FlashResultsModule = angular.module(MODULE_NAME, []);

70
lib/gui/app/pages/main/main.js
View File

@ -1,70 +0,0 @@
/*
* Copyright 2016 resin.io
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
'use strict'
/**
* This page represents the application main page.
*
* @module Etcher.Pages.Main
*/
const angular = require('angular')
const MODULE_NAME = 'Etcher.Pages.Main'
require('angular-moment')
const MainPage = angular.module(MODULE_NAME, [
'angularMoment',
require('angular-ui-router'),
require('angular-seconds-to-date'),
require('../../components/drive-selector/drive-selector'),
require('../../components/tooltip-modal/tooltip-modal'),
require('../../components/flash-error-modal/flash-error-modal'),
require('../../components/progress-button'),
require('../../components/image-selector'),
require('../../components/warning-modal/warning-modal'),
require('../../components/file-selector'),
require('../../components/featured-project'),
require('../../components/reduced-flashing-infos'),
require('../../components/flash-another/index.ts').MODULE_NAME,
require('../../components/flash-results/index.ts').MODULE_NAME,
require('../../components/drive-selector'),
require('../../os/open-external/open-external'),
require('../../os/dropzone/dropzone'),
require('../../utils/byte-size/byte-size'),
require('../../utils/middle-ellipsis/filter')
])
MainPage.controller('MainController', require('./controllers/main'))
MainPage.controller('ImageSelectionController', require('./controllers/image-selection'))
MainPage.controller('DriveSelectionController', require('./controllers/drive-selection'))
MainPage.controller('FlashController', require('./controllers/flash'))
MainPage.config(($stateProvider) => {
$stateProvider
.state('main', {
url: '/main',
controller: 'MainController as main',
template: require('./templates/main.tpl.html')
})
})
module.exports = MODULE_NAME

4
lib/gui/app/pages/main/main.ts
View File

@ -30,8 +30,8 @@ import MainPage from './MainPage';
import * as driveSelector from '../../components/drive-selector';
import * as driveSelectorService from '../../components/drive-selector/drive-selector';
import * as flashAnother from '../../components/flash-another';
import * as flashResults from '../../components/flash-results';
import { MODULE_NAME as flashAnother } from '../../components/flash-another';
import { MODULE_NAME as flashResults } from '../../components/flash-results';
import * as openExternal from '../../os/open-external/open-external';
import * as byteSize from '../../utils/byte-size/byte-size';