Change-type: minor
Changelog-entry: Added React component for the Flash Results button
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
Change-type: patch
Changelog-entry: Added React component for the Flash Another button
Signed-off-by: Lorenzo Alberto Maria Ambrosi <lorenzoa@balena.io>
This refactors the experimental file picker to avoid fs i/o
in as many places as possible to improve performance.
Further, rendering performance is improved by avoiding unnecessary
element state changes invalidating components.
Also, recent files & favorites have been temporarily disabled
due to lack of need for Etcher Pro.
Change-Type: patch
- Replace onClick arrow functions in all components that use them for
efficiency reasons: 300-500% speed-up
- Sort by folders and ignore case for better UX
- Remove use of `rendition.Button` in files, leading to a 10-20%
performance increase when browsing files
- Proper sidebar width and spacing
- Recents and favorites are now filtered by existence async for a tiny
performance improvement
- Make Breadcrumbs and Icon pure components to stop frequent re-rendering
- Initial support for array constraints
- Use first constraint as initial path instead of homedir if a
constraint is set
- Use correct design height on modal, `calc(100vh - 20px)`
- Reset scroll position when browsing a new folder
- Fuse Bluebird `.map()` and `.reduce()` in
`files.getAllFilesMetadataAsync`.
- Use `localeCompare`'s own case-insensitive option instead of calling
`.toLowerCase()` twice on `n-2` files compared.
- Use 16px font sizes in sidebar and files to match design.
- Disable `$locationProvider.html5Mode.rewriteLinks`, which seemed to
take 50ms of the directory changing time.
- Leave file extension as-is in `files.getFileMetadataSync` and the
async counterpart for a very minor performance improvement.
Change-Type: patch
We ensure that the `-webkit-app-region` attribute is only set to `drag`
on the header element and we explicitly disable it on modals, as this
has unintended behaviour on a non-draggable window with touch-screens.
Change-Type: patch
We pave way for different sizes of Etcher windows by dynamically
centering the content with flexbox.
Connects-To: #2263Closes: #2241
Change-Type: patch
Changelog-Entry: Center content independent to window resolution.
We add a file-picker written with Rendition/React. It is activated with
the `ETCHER_EXPERIMENTAL_FILE_PICKER` environment variable. Further
customisation can be done with the `ETCHER_FILE_BROWSER_CONSTRAIN_FOLDER`
variable that takes a path and allows one to constrain the file-picker to
a folder.
Related: https://github.com/resin-io/etcher/issues/2238
Related: https://github.com/resin-io/etcher/issues/2285
Change-Type: patch
Changelog-Entry: Add electron-native file-picker component.
We use the new design background color, and order the drive step size in
accordance with the new design as well.
Related: https://github.com/resin-io/etcher/issues/2310
Change-Type: patch
Changelog-Entry: Use new design background color and drive step size
ordering.
We introduce an environment variable
`ETCHER_DISABLE_EXPLICIT_DRIVE_SELECTION` that both enables
autoselection of drives and disables explicit drive selection by hiding
the buttons allowing this. All valid drives are autoselected, i.e. any
drive-image pair that does not result in an error, however warnings are
accepted.
Closes: https://github.com/resin-io/etcher/issues/2262
Change-Type: patch
Changelog-Entry: Introduce env var to toggle autoselection of all
drives.
We add a list of selected drives below the drive selection step, able to
accommodate four lines of drives before scrolling occurs.
Closes: https://github.com/resin-io/etcher/issues/2263
Change-Type: patch
Changelog-Entry: Show selected drives below drive selection step.
We display the quantity of succeeded and failed devices using status
dots on the finish screen.
Change-Type: patch
Changelog-Entry: Display succeeded and failed device quantities on the
finish screen.
We remove usage of the status dots except when failed devices occur, in
which case we still display the red failed dot and quantity. We also use
singular and plural depending on the quantity of failed devices.
Change-Type: patch
We move the drive selector warning to the flash step, and concatenate
warning messages when more than one needs to be displayed at once.
Change-Type: patch
Changelog-Entry: Move the drive selector warning dialog to the flash step.
We line wrap the main-page image and drive size labels as a whole
instead of partially, if the drive or image title is long enough for a
line wrap.
Change-Type: patch
Changelog-Entry: Line wrap selector size subtitles wholly
We ensure the status dots don't move about and stick to their position
by using absolute positioning relative to its parent element.
Change-Type: patch
Changelog-Entry: Fix status dots to their position.
We add some preparatory changes including new utility functions, as well
as changes throughout the codebase that reflect the change from single
drives to a list of drives, given multi-writes is coming.
Change-Type: patch
Changelog-Entry: Various preparatory changes to account for
multi-writes.
We add colorised progress status dots with quantities of `flashing`,
`validating`, `succeeded`, and `failed` devices.
Change-Type: patch
Changelog-Entry: Add colorised multi-writes progress status dots.
We add a right margin to the drive-selector labels so they look nicer
when there are multiple.
Change-Type: patch
Changelog-Entry: Add spacing to the drive-selector warning/error labels.
We make all tags with `.label` have bold text and remove the need for
`<b>` tags.
Change-Type: patch
Changelog-Entry: Make all `.label` tags' text bold and remove need for `<b>` tags.
We make the drive-selector button orange when there is a warning attached
to the image-drive pair.
Change-Type: patch
Changelog-Entry: Make the drive-selector button orange on warnings.
* feat(GUI): use tabindex and focus to navigate
We make navigating with the tab key easier by highlighting focused
elements more visibly, adding `tabindex` attributes to elements, and
making `open-external` links respond to keyboard events.
Change-Type: minor
Changelog-Entry: Improve tab-key navigation through tabindex and visual improvements.
Connects-To: https://github.com/resin-io/etcher/issues/1734
* outline with 10s timeout
* use orange "warning colour" as outline
* smaller outline on settings buttons, fix order on settings page
* allow selection in drive-selector
* fix typo, better tabindexes
We show a progress bar for any drive objects with a `progress` field
that isn't falsy, e.g. `undefined` or `0`.
Changelog-Type: minor
Changelog-Entry: Add optional progress bars to drive-selector drives.
At the moment the progress button which has slightly rounded corners
allows the "__bar" to overflow. This causes the corners to become
angular again which looks weird. I set the button's "overflow" to
"hidden" to fix this issue.
Changelog-Entry: Make sure the progress button is always rounded.
Change-Type: patch
- Add a nice icon in the drive selector dialog when a device has been
discovered through usbboot
- Change the name of usbboot-initialized devices to "Compute Module"
Change-Type: minor
Changelog-Entry: Add eye candy to usbboot initialized devices.
Signed-off-by: Juan Cruz Viotti <jv@jviotti.com>
We make the svg-icon component accept XML in its path argument to handle
archive-embedded SVG icons.
Changelog-Entry: Make archive-embedded SVG icons work again.
Fixes: https://github.com/resin-io/etcher/issues/1636
