mirror of
https://github.com/trezor/trezor-wallet
synced 2025-01-22 22:10:58 +00:00
Merge pull request #111 from trezor/clickable-logo
Added clickable logo
This commit is contained in:
Vladimir Volek
GitHub
commit
57430c7d76
@ -152,7 +152,7 @@ export const getValidUrl = (action: RouterAction): PayloadAction<string> => (dis
|
||||
// Disallow displaying landing page
|
||||
// redirect to previous url
|
||||
if (!shouldBeLandingPage && landingPageUrl) {
|
||||
return location.pathname;
|
||||
return dispatch(getFirstAvailableDeviceUrl()) || location.pathname;
|
||||
}
|
||||
|
||||
// Regular url change during application live cycle
|
||||
@ -170,22 +170,10 @@ export const getValidUrl = (action: RouterAction): PayloadAction<string> => (dis
|
||||
return composedUrl || location.pathname;
|
||||
};
|
||||
|
||||
|
||||
/*
|
||||
* Utility used in "selectDevice" and "selectFirstAvailableDevice"
|
||||
* sorting device array by "ts" (timestamp) field
|
||||
* Compose url from requested device object and returns url
|
||||
*/
|
||||
const sortDevices = (devices: Array<TrezorDevice>): Array<TrezorDevice> => devices.sort((a, b) => {
|
||||
if (!a.ts || !b.ts) {
|
||||
return -1;
|
||||
}
|
||||
return a.ts > b.ts ? -1 : 1;
|
||||
});
|
||||
|
||||
/*
|
||||
* Compose url from given device object and redirect
|
||||
*/
|
||||
export const selectDevice = (device: TrezorDevice | Device): ThunkAction => (dispatch: Dispatch, getState: GetState): void => {
|
||||
const getDeviceUrl = (device: TrezorDevice | Device): PayloadAction<?string> => (dispatch: Dispatch, getState: GetState): ?string => {
|
||||
let url: ?string;
|
||||
if (!device.features) {
|
||||
url = `/device/${device.path}/${device.type === 'unreadable' ? 'unreadable' : 'acquire'}`;
|
||||
@ -208,12 +196,7 @@ export const selectDevice = (device: TrezorDevice | Device): ThunkAction => (dis
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const currentParams: RouterLocationState = getState().router.location.state;
|
||||
const requestedParams = dispatch(pathToParams(url));
|
||||
if (currentParams.device !== requestedParams.device || currentParams.deviceInstance !== requestedParams.deviceInstance) {
|
||||
dispatch(goto(url));
|
||||
}
|
||||
return url;
|
||||
};
|
||||
|
||||
/*
|
||||
@ -223,17 +206,54 @@ export const selectDevice = (device: TrezorDevice | Device): ThunkAction => (dis
|
||||
* 3. Saved with latest timestamp
|
||||
* OR redirect to landing page
|
||||
*/
|
||||
export const selectFirstAvailableDevice = (): ThunkAction => (dispatch: Dispatch, getState: GetState): void => {
|
||||
export const getFirstAvailableDeviceUrl = (): PayloadAction<?string> => (dispatch: Dispatch, getState: GetState): ?string => {
|
||||
const { devices } = getState();
|
||||
let url: ?string;
|
||||
if (devices.length > 0) {
|
||||
const unacquired = devices.find(d => !d.features);
|
||||
if (unacquired) {
|
||||
dispatch(selectDevice(unacquired));
|
||||
url = dispatch(getDeviceUrl(unacquired));
|
||||
} else {
|
||||
const latest: Array<TrezorDevice> = sortDevices(devices);
|
||||
const firstConnected: ?TrezorDevice = latest.find(d => d.connected);
|
||||
dispatch(selectDevice(firstConnected || latest[0]));
|
||||
url = dispatch(getDeviceUrl(firstConnected || latest[0]));
|
||||
}
|
||||
}
|
||||
return url;
|
||||
};
|
||||
|
||||
/*
|
||||
* Utility used in "getDeviceUrl" and "getFirstAvailableDeviceUrl"
|
||||
* sorting device array by "ts" (timestamp) field
|
||||
*/
|
||||
const sortDevices = (devices: Array<TrezorDevice>): Array<TrezorDevice> => devices.sort((a, b) => {
|
||||
if (!a.ts || !b.ts) {
|
||||
return -1;
|
||||
}
|
||||
return a.ts > b.ts ? -1 : 1;
|
||||
});
|
||||
|
||||
/*
|
||||
* Redirect to requested device
|
||||
*/
|
||||
export const selectDevice = (device: TrezorDevice | Device): ThunkAction => (dispatch: Dispatch, getState: GetState): void => {
|
||||
const url: ?string = dispatch(getDeviceUrl(device));
|
||||
if (!url) return;
|
||||
|
||||
const currentParams: RouterLocationState = getState().router.location.state;
|
||||
const requestedParams = dispatch(pathToParams(url));
|
||||
if (currentParams.device !== requestedParams.device || currentParams.deviceInstance !== requestedParams.deviceInstance) {
|
||||
dispatch(goto(url));
|
||||
}
|
||||
};
|
||||
|
||||
/*
|
||||
* Redirect to first device or landing page
|
||||
*/
|
||||
export const selectFirstAvailableDevice = (): ThunkAction => (dispatch: Dispatch): void => {
|
||||
const url = dispatch(getFirstAvailableDeviceUrl());
|
||||
if (url) {
|
||||
dispatch(goto(url));
|
||||
} else {
|
||||
dispatch(gotoLandingPage());
|
||||
}
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
/* @flow */
|
||||
import React from 'react';
|
||||
import styled from 'styled-components';
|
||||
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import colors from 'config/colors';
|
||||
|
||||
const Wrapper = styled.header`
|
||||
@ -13,12 +13,9 @@ const Wrapper = styled.header`
|
||||
fill: ${colors.WHITE};
|
||||
height: 28px;
|
||||
width: 100px;
|
||||
flex: 1;
|
||||
}
|
||||
`;
|
||||
|
||||
const LinkWrapper = styled.div``;
|
||||
|
||||
const LayoutWrapper = styled.div`
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@ -26,12 +23,21 @@ const LayoutWrapper = styled.div`
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
@media screen and (max-width: 1170px) {
|
||||
padding: 0 25px;
|
||||
}
|
||||
`;
|
||||
|
||||
const Left = styled.div`
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
`;
|
||||
|
||||
const Right = styled.div``;
|
||||
|
||||
const A = styled.a`
|
||||
color: ${colors.WHITE};
|
||||
margin-left: 24px;
|
||||
@ -54,21 +60,25 @@ const A = styled.a`
|
||||
const Header = (): React$Element<string> => (
|
||||
<Wrapper>
|
||||
<LayoutWrapper>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 163.7 41.9" width="100%" height="100%" preserveAspectRatio="xMinYMin meet">
|
||||
<polygon points="101.1,12.8 118.2,12.8 118.2,17.3 108.9,29.9 118.2,29.9 118.2,35.2 101.1,35.2 101.1,30.7 110.4,18.1 101.1,18.1" />
|
||||
<path d="M158.8,26.9c2.1-0.8,4.3-2.9,4.3-6.6c0-4.5-3.1-7.4-7.7-7.4h-10.5v22.3h5.8v-7.5h2.2l4.1,7.5h6.7L158.8,26.9z M154.7,22.5 h-4V18h4c1.5,0,2.5,0.9,2.5,2.2C157.2,21.6,156.2,22.5,154.7,22.5z" />
|
||||
<path d="M130.8,12.5c-6.8,0-11.6,4.9-11.6,11.5s4.9,11.5,11.6,11.5s11.7-4.9,11.7-11.5S137.6,12.5,130.8,12.5z M130.8,30.3 c-3.4,0-5.7-2.6-5.7-6.3c0-3.8,2.3-6.3,5.7-6.3c3.4,0,5.8,2.6,5.8,6.3C136.6,27.7,134.2,30.3,130.8,30.3z" />
|
||||
<polygon points="82.1,12.8 98.3,12.8 98.3,18 87.9,18 87.9,21.3 98,21.3 98,26.4 87.9,26.4 87.9,30 98.3,30 98.3,35.2 82.1,35.2 " />
|
||||
<path d="M24.6,9.7C24.6,4.4,20,0,14.4,0S4.2,4.4,4.2,9.7v3.1H0v22.3h0l14.4,6.7l14.4-6.7h0V12.9h-4.2V9.7z M9.4,9.7 c0-2.5,2.2-4.5,5-4.5s5,2,5,4.5v3.1H9.4V9.7z M23,31.5l-8.6,4l-8.6-4V18.1H23V31.5z" />
|
||||
<path d="M79.4,20.3c0-4.5-3.1-7.4-7.7-7.4H61.2v22.3H67v-7.5h2.2l4.1,7.5H80l-4.9-8.3C77.2,26.1,79.4,24,79.4,20.3z M71,22.5h-4V18 h4c1.5,0,2.5,0.9,2.5,2.2C73.5,21.6,72.5,22.5,71,22.5z" />
|
||||
<polygon points="40.5,12.8 58.6,12.8 58.6,18.1 52.4,18.1 52.4,35.2 46.6,35.2 46.6,18.1 40.5,18.1 " />
|
||||
</svg>
|
||||
<LinkWrapper>
|
||||
<Left>
|
||||
<NavLink to="/">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 163.7 41.9" width="100%" height="100%" preserveAspectRatio="xMinYMin meet">
|
||||
<polygon points="101.1,12.8 118.2,12.8 118.2,17.3 108.9,29.9 118.2,29.9 118.2,35.2 101.1,35.2 101.1,30.7 110.4,18.1 101.1,18.1" />
|
||||
<path d="M158.8,26.9c2.1-0.8,4.3-2.9,4.3-6.6c0-4.5-3.1-7.4-7.7-7.4h-10.5v22.3h5.8v-7.5h2.2l4.1,7.5h6.7L158.8,26.9z M154.7,22.5 h-4V18h4c1.5,0,2.5,0.9,2.5,2.2C157.2,21.6,156.2,22.5,154.7,22.5z" />
|
||||
<path d="M130.8,12.5c-6.8,0-11.6,4.9-11.6,11.5s4.9,11.5,11.6,11.5s11.7-4.9,11.7-11.5S137.6,12.5,130.8,12.5z M130.8,30.3 c-3.4,0-5.7-2.6-5.7-6.3c0-3.8,2.3-6.3,5.7-6.3c3.4,0,5.8,2.6,5.8,6.3C136.6,27.7,134.2,30.3,130.8,30.3z" />
|
||||
<polygon points="82.1,12.8 98.3,12.8 98.3,18 87.9,18 87.9,21.3 98,21.3 98,26.4 87.9,26.4 87.9,30 98.3,30 98.3,35.2 82.1,35.2 " />
|
||||
<path d="M24.6,9.7C24.6,4.4,20,0,14.4,0S4.2,4.4,4.2,9.7v3.1H0v22.3h0l14.4,6.7l14.4-6.7h0V12.9h-4.2V9.7z M9.4,9.7 c0-2.5,2.2-4.5,5-4.5s5,2,5,4.5v3.1H9.4V9.7z M23,31.5l-8.6,4l-8.6-4V18.1H23V31.5z" />
|
||||
<path d="M79.4,20.3c0-4.5-3.1-7.4-7.7-7.4H61.2v22.3H67v-7.5h2.2l4.1,7.5H80l-4.9-8.3C77.2,26.1,79.4,24,79.4,20.3z M71,22.5h-4V18 h4c1.5,0,2.5,0.9,2.5,2.2C73.5,21.6,72.5,22.5,71,22.5z" />
|
||||
<polygon points="40.5,12.8 58.6,12.8 58.6,18.1 52.4,18.1 52.4,35.2 46.6,35.2 46.6,18.1 40.5,18.1 " />
|
||||
</svg>
|
||||
</NavLink>
|
||||
</Left>
|
||||
<Right>
|
||||
<A href="https://trezor.io/" target="_blank" rel="noreferrer noopener">TREZOR</A>
|
||||
<A href="https://doc.satoshilabs.com/trezor-user/" target="_blank" rel="noreferrer noopener">Docs</A>
|
||||
<A href="https://blog.trezor.io/" target="_blank" rel="noreferrer noopener">Blog</A>
|
||||
<A href="https://trezor.io/support/" target="_blank" rel="noreferrer noopener">Support</A>
|
||||
</LinkWrapper>
|
||||
</Right>
|
||||
</LayoutWrapper>
|
||||
</Wrapper>
|
||||
);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user