Skip to content
This repository has been archived by the owner on May 24, 2022. It is now read-only.

Fixed window size #436

Merged
merged 30 commits into from
Feb 25, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
30 commits
Select commit Hold shift + click to select a range
a13a6da
fix size and stick footer to bottom for token list
Tbaut Feb 19, 2019
736009b
take care of token list
Tbaut Feb 19, 2019
989c19c
linting
Tbaut Feb 19, 2019
c07f750
linting
Tbaut Feb 20, 2019
42a88ce
token whitelist and account creation
Tbaut Feb 20, 2019
d1c209a
account list
Tbaut Feb 20, 2019
7030fee
tweak signer scanner
Tbaut Feb 20, 2019
51eb434
tweak import screen and signer scanner
Tbaut Feb 21, 2019
08de676
alert screen and link missalignment
Tbaut Feb 21, 2019
6a08fee
scrollbar on Terms of use
Tbaut Feb 21, 2019
8fec211
test windows
Tbaut Feb 21, 2019
339f1f5
test windows
Tbaut Feb 21, 2019
7c82702
test windows
Tbaut Feb 21, 2019
5e53102
Revert "test windows"
Tbaut Feb 21, 2019
dd3c1ef
Revert "test windows"
Tbaut Feb 21, 2019
d52c4b8
Revert "test windows"
Tbaut Feb 21, 2019
4886dd8
remove comments
Tbaut Feb 21, 2019
8098f4a
Merge branch 'master' into tbaut-fix-window-size
Tbaut Feb 21, 2019
831293c
fix terms of use
Tbaut Feb 21, 2019
6d19f2a
copy popup above alert screen
Tbaut Feb 21, 2019
a68f936
fix terms and conditions
Tbaut Feb 22, 2019
b0079b8
frameless everybody
Tbaut Feb 22, 2019
ee6e5c2
Merge branch 'master' into tbaut-fix-window-size
Tbaut Feb 22, 2019
c6b93ab
Merge branch 'master' into tbaut-fix-window-size
Tbaut Feb 25, 2019
aacf06a
fix(): address comments
Tbaut Feb 25, 2019
3798b89
Merge branch 'tbaut-fix-window-size' of github.com:paritytech/fether …
Tbaut Feb 25, 2019
4f0e389
fix(): fix conflicts
Tbaut Feb 25, 2019
aadeb9a
Merge branch 'master' into tbaut-fix-window-size
Tbaut Feb 25, 2019
6a1a3ae
Merge branch 'tbaut-fix-window-size' of github.com:paritytech/fether …
Tbaut Feb 25, 2019
d8c31de
use React.Fragment
Tbaut Feb 25, 2019
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 0 additions & 11 deletions packages/fether-electron/src/main/app/messages/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,17 +18,6 @@ export default async (fetherAppWindow, event, action, ...args) => {
return;
}
switch (action) {
case 'app-resize': {
if (!fetherAppWindow || !args[0]) {
return;
}
const [width] = fetherAppWindow.getContentSize();
// Conversion to integer is required to pass as argument to setContentSize.
// Reference: https://electronjs.org/docs/all#winsetcontentsizewidth-height-animate
const newHeight = parseInt(args[0]);
fetherAppWindow.setContentSize(width, Math.round(newHeight) + 2);
break;
}
case 'check-clock-sync': {
checkClockSync().then(t => {
event.sender.send('check-clock-sync-reply', t);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -67,10 +67,8 @@ const DEFAULT_OPTIONS = {
};

const TASKBAR_OPTIONS = {
// Do not use frame but context menu required on non-macOS.
// Without frame it causes window height to shrink upon show/hide
height: 515,
frame: false,
height: 464,
// On Linux the user must click the tray icon and then click the tooltip
// to toggle the Fether window open/close
tooltip: 'Click to toggle Fether window',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,6 @@ class AccountsList extends Component {
)}
</div>
</div>

<nav className='footer-nav'>
<div className='footer-nav_status'>
<Health />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ export const Feedback = ({ accountsListLength }) => (
href='https://github.com/paritytech/fether/issues/new'
rel='noopener noreferrer'
target='_blank'
style={{ marginBottom: accountsListLength > 1 ? '-2px' : '-10px' }}
>
Feedback
</a>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -168,7 +168,7 @@ class AccountImportOptions extends Component {
{importingFromSigner ? (
<Scanner
onScan={this.handleSignerImported}
label='Please show the QR code of the account on the webcam.'
label='Scan Parity Signer account QR code'
/>
) : (
<button
Expand Down Expand Up @@ -203,15 +203,16 @@ class AccountImportOptions extends Component {
</Card>
);

const spacer = <div style={{ height: '0.5rem' }} />;

return (
<RequireHealthOverlay require='node'>
<div className='center-md'>
{!importingFromSigner && jsonCard}
<br />
{spacer}
{signerCard}
<br />
{spacer}
{!importingFromSigner && phraseCard}
<br />
<p>{error}</p>
<nav className='form-nav -space-around'>
{currentStep > 1 && (
Expand Down
16 changes: 3 additions & 13 deletions packages/fether-react/src/Accounts/CreateAccount/CreateAccount.js
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ class CreateAccount extends Component {
const Steps = this.getSteps(isImport);

return (
<div>
<React.Fragment>
<Header
left={
// Show back button if we already have some accounts, so we can go back to AccountsList
Expand Down Expand Up @@ -98,17 +98,7 @@ class CreateAccount extends Component {
</div>
) : (
<div className='footer-nav_option'>
{isImport ? (
<p>
Need to create an account?
<button
className='button -footer'
onClick={this.handleToggleCreateImport}
>
New account
</button>
</p>
) : (
{isImport ? null : (
<p>
Already have an account?
<button
Expand All @@ -122,7 +112,7 @@ class CreateAccount extends Component {
</div>
)}
</nav>
</div>
</React.Fragment>
);
}
}
Expand Down
91 changes: 38 additions & 53 deletions packages/fether-react/src/App/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,7 @@ import {
Switch
} from 'react-router-dom';
import { inject, observer } from 'mobx-react';
import isElectron from 'is-electron';
import { Modal } from 'fether-ui';
import ReactResizeDetector from 'react-resize-detector';
import semver from 'semver';
import { version } from '../../package.json';

Expand All @@ -32,19 +30,10 @@ const currentVersion = version;
// https://github.com/facebook/create-react-app/issues/3591
const Router =
process.env.NODE_ENV === 'production' ? MemoryRouter : BrowserRouter;
const electron = isElectron() ? window.require('electron') : null;

@inject('onboardingStore', 'parityStore')
@observer
class App extends Component {
handleResize = (_, height) => {
if (!electron) {
return;
}
// Send height to main process
electron.ipcRenderer.send('asynchronous-message', 'app-resize', height);
};

state = {
newRelease: false // false | {name, url, ignore}
};
Expand Down Expand Up @@ -120,53 +109,49 @@ class App extends Component {
// the children, just a <RequireHealthOverlay />.
if (!api) {
return (
<ReactResizeDetector handleHeight onResize={this.handleResize}>
<RequireHealthOverlay fullscreen require='node'>
{/* Adding these components to have minimum height on window */}
<div className='content'>
<div className='window' />
</div>
</RequireHealthOverlay>
</ReactResizeDetector>
<RequireHealthOverlay fullscreen require='node'>
{/* Adding these components to have minimum height on window */}
<div className='content'>
<div className='window' />
</div>
</RequireHealthOverlay>
);
}

return (
<ReactResizeDetector handleHeight onResize={this.handleResize}>
<div className='content'>
<div className='window'>
<Modal
title='New version available'
description={newRelease ? `${newRelease.name} was released!` : ''}
visible={newRelease && !newRelease.ignore}
buttons={this.renderModalLinks()}
>
<Router>
<Switch>
{/* The next line is the homepage */}
<Redirect exact from='/' to='/accounts' />
<Route path='/accounts' component={Accounts} />
<Route path='/onboarding' component={Onboarding} />
<Route path='/tokens/:accountAddress' component={Tokens} />
<Route
path='/whitelist/:accountAddress'
component={Whitelist}
/>
<Route
path='/backup/:accountAddress'
component={BackupAccount}
/>
<Route
path='/send/:tokenAddress/from/:accountAddress'
component={Send}
/>
<Redirect from='*' to='/' />
</Switch>
</Router>
</Modal>
</div>
<div className='content'>
<div className='window'>
<Modal
title='New version available'
description={newRelease ? `${newRelease.name} was released!` : ''}
visible={newRelease && !newRelease.ignore}
buttons={this.renderModalLinks()}
>
<Router>
<Switch>
{/* The next line is the homepage */}
<Redirect exact from='/' to='/accounts' />
<Route path='/accounts' component={Accounts} />
<Route path='/onboarding' component={Onboarding} />
<Route path='/tokens/:accountAddress' component={Tokens} />
<Route
path='/whitelist/:accountAddress'
component={Whitelist}
/>
<Route
path='/backup/:accountAddress'
component={BackupAccount}
/>
<Route
path='/send/:tokenAddress/from/:accountAddress'
component={Send}
/>
<Redirect from='*' to='/' />
</Switch>
</Router>
</Modal>
</div>
</ReactResizeDetector>
</div>
);
}
}
Expand Down
6 changes: 3 additions & 3 deletions packages/fether-react/src/Onboarding/Onboarding.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,11 +49,11 @@ class Onboarding extends Component {

render () {
return (
<div>
<React.Fragment>
<Header title={<h1>Terms of Use</h1>} />

<div className='window_content'>
<div className='box -padded-extra'>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

consider removing -padded-extra from fether-react/src/assets/sass/shared/_box.scss if we're no longer using it

<div className='box -padded -scroller'>
<div className='terms-and-conditions-wrapper'>
<FetherForm.Field
as={ReactMarkdown}
Expand All @@ -76,7 +76,7 @@ class Onboarding extends Component {
</button>
</div>
</nav>
</div>
</React.Fragment>
);
}
}
Expand Down
5 changes: 2 additions & 3 deletions packages/fether-react/src/Scanner/Scanner.js
Original file line number Diff line number Diff line change
Expand Up @@ -73,19 +73,18 @@ export default class Scanner extends React.PureComponent {
const size = 300;

return (
<div>
<React.Fragment>
{isLoading ? (
<img alt='loading' src={loading} />
) : webcamError ? (
<p>{webcamError}</p>
) : (
<div>
<p>{label}</p>
<br />
<QrSigner scan onScan={onScan} size={size} />
</div>
)}
</div>
</React.Fragment>
);
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ class ScanSignedTx extends Component {
<Card className='-centered'>
<Scanner
onScan={this.onScanSignedTx}
label='Please show the QR code of the signed transaction on the webcam'
label='Show the signed transaction QR code'
/>

{error && <p className='text -standard'>{error}</p>}
Expand Down
4 changes: 1 addition & 3 deletions packages/fether-react/src/Send/Unlock/Unlock.js
Original file line number Diff line number Diff line change
Expand Up @@ -90,9 +90,7 @@ class Unlock extends Component {
render={({ handleSubmit, pristine, submitting }) => (
<form onSubmit={handleSubmit}>
<div className='text'>
<p>
Enter your password to confirm this transaction.
</p>
<p>Unlock account:</p>
</div>

<Field
Expand Down
57 changes: 29 additions & 28 deletions packages/fether-react/src/Tokens/Tokens.js
Original file line number Diff line number Diff line change
Expand Up @@ -66,39 +66,40 @@ class Tokens extends PureComponent {
const { isMenuOpen } = this.state;

return (
<div className='tokens'>
<div className={isMenuOpen ? 'popup-underlay' : ''} />
<AccountHeader
address={address}
copyAddress
name={name}
type={type}
left={
<Link to='/accounts' className='icon -back'>
Back
</Link>
}
right={
<MenuPopup
className='popup-menu-account'
horizontalOffset={1}
menuItems={this.menuItems()}
onClose={this.handleMenuClose}
onOpen={this.handleMenuOpen}
size='small'
trigger={<Clickable className='icon -menu' />}
/>
}
/>

<TokensList />

<React.Fragment>
<div className='tokens'>
<div className={isMenuOpen ? 'popup-underlay' : ''} />
<AccountHeader
address={address}
copyAddress
name={name}
type={type}
left={
<Link to='/accounts' className='icon -back'>
Back
</Link>
}
right={
<MenuPopup
className='popup-menu-account'
horizontalOffset={1}
menuItems={this.menuItems()}
onClose={this.handleMenuClose}
onOpen={this.handleMenuOpen}
size='small'
trigger={<Clickable className='icon -menu' />}
/>
}
/>

<TokensList />
</div>
<nav className='footer-nav'>
<div className='footer-nav_status'>
<Health />
</div>
</nav>
</div>
</React.Fragment>
);
}
}
Expand Down
Loading