update TrezorDevice from trezor-connect@8

src/actions/LocalStorageActions.js

@@ -454,9 +454,8 @@ export const removeImportedAccounts = (device: TrezorDevice): ThunkAction => (
     const importedAccounts: ?Array<Account> = getImportedAccounts();
     if (!importedAccounts) return;
 
-    const deviceId = device.features ? device.features.device_id : null;
     const filteredImportedAccounts = importedAccounts.filter(
-        account => account.deviceID !== deviceId
+        account => account.deviceID !== device.id
     );
     storageUtils.remove(TYPE, KEY_IMPORTED_ACCOUNTS);
     filteredImportedAccounts.forEach(account => {

src/actions/ModalActions.js

@@ -144,7 +144,7 @@ export const onDeviceConnect = (device: Device): ThunkAction => (
             device.features &&
             modal.device &&
             modal.device.features &&
-            modal.device.features.device_id === device.features.device_id
+            modal.device.id === device.id
         ) {
             dispatch({
                 type: MODAL.CLOSE,

src/actions/RouterActions.js

@@ -65,14 +65,14 @@ export const paramsValidation = (params: RouterLocationState): PayloadAction<boo
             device = devices.find(
                 d =>
                     d.features &&
-                    d.features.device_id === params.device &&
+                    d.id === params.device &&
                     d.instance === parseInt(params.deviceInstance, 10)
             );
         } else {
             device = devices.find(
                 d =>
                     ((!d.features || d.mode === 'bootloader') && d.path === params.device) ||
-                    (d.features && d.features.device_id === params.device)
+                    (d.features && d.id === params.device)
             );
         }
 
@@ -218,21 +218,22 @@ const getDeviceUrl = (device: TrezorDevice | Device): PayloadAction<?string> =>
     getState: GetState
 ): ?string => {
     let url: ?string;
+    const prefix = `/device/${device.id || device.path}`;
     if (!device.features) {
-        url = `/device/${device.path}/${device.type === 'unreadable' ? 'unreadable' : 'acquire'}`;
+        url = `${prefix}/${device.type === 'unreadable' ? 'unreadable' : 'acquire'}`;
     } else if (device.mode === 'bootloader') {
         // device in bootloader doesn't have device_id
-        url = `/device/${device.path}/bootloader`;
+        url = `${prefix}/bootloader`;
     } else if (device.mode === 'initialize') {
-        url = `/device/${device.features.device_id}/initialize`;
+        url = `${prefix}/initialize`;
     } else if (device.mode === 'seedless') {
-        url = `/device/${device.features.device_id}/seedless`;
+        url = `${prefix}/seedless`;
     } else if (device.firmware === 'required') {
-        url = `/device/${device.features.device_id}/firmware-update`;
+        url = `${prefix}/firmware-update`;
     } else if (typeof device.instance === 'number') {
-        url = `/device/${device.features.device_id}:${device.instance}`;
+        url = `${prefix}:${device.instance}`;
     } else {
-        url = `/device/${device.features.device_id}`;
+        url = `${prefix}`;
         // make sure that device is not TrezorDevice type
         if (!device.hasOwnProperty('ts')) {
             // it is device from trezor-connect triggered by DEVICE.CONNECT event
@@ -379,10 +380,8 @@ export const gotoLandingPage = (): ThunkAction => (dispatch: Dispatch): void =>
 export const gotoDeviceSettings = (device: TrezorDevice): ThunkAction => (
     dispatch: Dispatch
 ): void => {
-    if (device.features) {
+    if (device.id) {
-        const devUrl: string = `${device.features.device_id}${
+        const devUrl: string = `${device.id}${device.instance ? `:${device.instance}` : ''}`;
-            device.instance ? `:${device.instance}` : ''
-        }`;
         dispatch(goto(`/device/${devUrl}/settings`));
     }
 };
@@ -403,8 +402,8 @@ export const gotoFirmwareUpdate = (): ThunkAction => (
     getState: GetState
 ): void => {
     const { selectedDevice } = getState().wallet;
-    if (!selectedDevice || !selectedDevice.features) return;
+    if (!selectedDevice || !selectedDevice.id) return;
-    const devUrl: string = `${selectedDevice.features.device_id}${
+    const devUrl: string = `${selectedDevice.id}${
         selectedDevice.instance ? `:${selectedDevice.instance}` : ''
     }`;
     dispatch(goto(`/device/${devUrl}/firmware-update`));
@@ -415,8 +414,8 @@ export const gotoFirmwareUpdate = (): ThunkAction => (
  */
 export const gotoBackup = (): ThunkAction => (dispatch: Dispatch, getState: GetState): void => {
     const { selectedDevice } = getState().wallet;
-    if (!selectedDevice || !selectedDevice.features) return;
+    if (!selectedDevice || !selectedDevice.id) return;
-    const devUrl: string = `${selectedDevice.features.device_id}${
+    const devUrl: string = `${selectedDevice.id}${
         selectedDevice.instance ? `:${selectedDevice.instance}` : ''
     }`;
     dispatch(goto(`/device/${devUrl}/backup`));

src/actions/TrezorConnectActions.js

@@ -17,16 +17,6 @@ import * as RouterActions from 'actions/RouterActions';
 import * as deviceUtils from 'utils/device';
 import * as buildUtils from 'utils/build';
 
-import type {
-    DeviceMessage,
-    DeviceMessageType,
-    UiMessage,
-    UiMessageType,
-    TransportMessage,
-    TransportMessageType,
-    BlockchainEvent,
-} from 'trezor-connect';
-
 import type {
     Dispatch,
     GetState,
@@ -113,56 +103,27 @@ export const init = (): AsyncAction => async (
     getState: GetState
 ): Promise<void> => {
     // set listeners
-    TrezorConnect.on(
+    TrezorConnect.on(DEVICE_EVENT, event => {
-        DEVICE_EVENT,
+        dispatch(event);
-        (event: DeviceMessage): void => {
+    });
-            // post event to reducers
-            const type: DeviceMessageType = event.type; // eslint-disable-line prefer-destructuring
-            dispatch({
-                type,
-                device: event.payload,
-            });
-        }
-    );
 
-    TrezorConnect.on(
+    TrezorConnect.on(UI_EVENT, event => {
-        UI_EVENT,
+        dispatch(event);
-        (event: UiMessage): void => {
+    });
-            // post event to reducers
-            const type: UiMessageType = event.type; // eslint-disable-line prefer-destructuring
-            dispatch({
-                type,
-                payload: event.payload,
-            });
-        }
-    );
 
-    TrezorConnect.on(
+    TrezorConnect.on(TRANSPORT_EVENT, event => {
-        TRANSPORT_EVENT,
+        dispatch(event);
-        (event: TransportMessage): void => {
+    });
-            // post event to reducers
-            const type: TransportMessageType = event.type; // eslint-disable-line prefer-destructuring
-            dispatch({
-                type,
-                payload: event.payload,
-            });
-        }
-    );
 
     // post event to reducers
-    TrezorConnect.on(
+    TrezorConnect.on(BLOCKCHAIN_EVENT, event => {
-        BLOCKCHAIN_EVENT,
+        dispatch(event);
-        (event: BlockchainEvent): void => {
+    });
-            dispatch(event);
-        }
-    );
 
     if (buildUtils.isDev()) {
         // eslint-disable-next-line
         window.__TREZOR_CONNECT_SRC =
-            typeof LOCAL === 'string'
+            typeof LOCAL === 'string' ? LOCAL : 'https://connect.corp.sldev.cz/develop/'; // eslint-disable-line no-underscore-dangle
-                ? LOCAL
-                : 'https://connect.corp.sldev.cz/fix/v7-ripple-lib-error/'; // eslint-disable-line no-underscore-dangle
         // window.__TREZOR_CONNECT_SRC = typeof LOCAL === 'string' ? LOCAL : 'https://localhost:8088/'; // eslint-disable-line no-underscore-dangle
         window.TrezorConnect = TrezorConnect;
     }
@@ -298,12 +259,7 @@ export const deviceDisconnect = (device: Device): AsyncAction => async (
 ): Promise<void> => {
     if (device.features) {
         const instances = getState().devices.filter(
-            d =>
+            d => d.features && device.features && d.state && !d.remember && d.id === device.id
-                d.features &&
-                device.features &&
-                d.state &&
-                !d.remember &&
-                d.features.device_id === device.features.device_id
         );
         if (instances.length > 0) {
             const isSelected = deviceUtils.isSelectedDevice(

src/actions/WalletActions.js

@@ -144,7 +144,7 @@ export const clearUnavailableDevicesData = (prevState: State, device: Device): T
         d =>
             d.features &&
             device.features &&
-            d.features.device_id === device.features.device_id &&
+            d.id === device.id &&
             d.features.passphrase_protection !== device.features.passphrase_protection
     );
 

src/flowtype/index.js

@@ -36,33 +36,19 @@ import type { ImportAccountAction } from 'actions/ImportAccountActions';
 import type { FiatRateAction } from 'services/CoingeckoService'; // this service has no action file, all is written inside one file
 
 import type {
-    Device,
+    KnownDevice,
-    Features,
+    UnknownDevice,
-    DeviceStatus,
+    TransportEvent,
-    FirmwareRelease,
-    DeviceFirmwareStatus,
-    DeviceMode,
-    DeviceMessageType,
-    TransportMessageType,
-    UiMessageType,
     BlockchainEvent,
-    BlockchainLinkTransaction,
+    UiEvent,
+    DeviceEvent,
+    AccountTransaction,
 } from 'trezor-connect';
 
 import type { RouterAction, LocationState } from 'connected-react-router';
 
-export type AcquiredDevice = $Exact<{
+export type ExtendedDevice = {|
-    +type: 'acquired',
-    path: string,
-    +label: string,
-    +features: Features,
-    +firmware: DeviceFirmwareStatus,
-    +firmwareRelease: ?FirmwareRelease,
-    status: DeviceStatus,
-    +mode: DeviceMode,
-    state: ?string,
     useEmptyPassphrase: boolean,
-
     remember: boolean, // device should be remembered
     connected: boolean, // device is connected
     available: boolean, // device cannot be used because of features.passphrase_protection is different then expected
@@ -70,29 +56,16 @@ export type AcquiredDevice = $Exact<{
     instanceLabel: string,
     instanceName: ?string,
     ts: number,
-}>;
+|};
 
-export type UnknownDevice = $Exact<{
+export type AcquiredDevice = {| ...KnownDevice, ...ExtendedDevice |};
-    +type: 'unacquired' | 'unreadable',
+export type UnacquiredDevice = {| ...UnknownDevice, ...ExtendedDevice |};
-    path: string,
-    +label: string,
-    +features: null,
-    state: ?string,
-    useEmptyPassphrase: boolean,
-
-    remember: boolean, // device should be remembered
-    connected: boolean, // device is connected
-    available: boolean, // device cannot be used because of features.passphrase_protection is different then expected
-    instance?: number,
-    instanceLabel: string,
-    instanceName: ?string,
-    ts: number,
-}>;
 
 export type { Device } from 'trezor-connect';
-export type TrezorDevice = AcquiredDevice | UnknownDevice;
+export type TrezorDevice = AcquiredDevice | UnacquiredDevice;
 
-export type Transaction = BlockchainLinkTransaction & {
+export type Transaction = AccountTransaction & {
+    descriptor: string,
     deviceState: string,
     network: string,
     rejected?: boolean,
@@ -100,38 +73,11 @@ export type Transaction = BlockchainLinkTransaction & {
 
 export type RouterLocationState = LocationState;
 
-// Cast event from TrezorConnect event listener to react Action
-type DeviceEventAction = {
-    type: DeviceMessageType,
-    device: Device,
-};
-
-type TransportEventAction = {
-    type: TransportMessageType,
-    payload: any,
-};
-
-type UiEventAction = {
-    type: UiMessageType,
-    payload: any,
-    // payload: {
-    //     device: Device;
-    //     code?: string;
-    // },
-};
-
-// TODO: join this message with uiMessage
-type IFrameHandshake = {
-    type: 'iframe_handshake',
-    payload: any,
-};
-
 export type Action =
     | RouterAction
-    | IFrameHandshake
+    | TransportEvent
-    | TransportEventAction
+    | DeviceEvent
-    | DeviceEventAction
+    | UiEvent
-    | UiEventAction
     | BlockchainEvent
     | SelectedAccountAction
     | AccountAction

src/reducers/DevicesReducer.js

@@ -62,8 +62,9 @@ const mergeDevices = (current: TrezorDevice, upcoming: Device | TrezorDevice): T
     }
     return {
         ...upcoming,
-        features: null,
         ...extended,
+        features: null,
+        state: null,
     };
 };
 
@@ -79,9 +80,7 @@ const addDevice = (state: State, device: Device): State => {
         }
         otherDevices = state.filter(d => affectedDevices.indexOf(d) === -1);
     } else {
-        affectedDevices = state.filter(
+        affectedDevices = state.filter(d => d.features && device.features && d.id === device.id);
-            d => d.features && device.features && d.features.device_id === device.features.device_id
-        );
         const unacquiredDevices = state.filter(d => d.path.length > 0 && d.path === device.path);
         otherDevices = state.filter(
             d => affectedDevices.indexOf(d) < 0 && unacquiredDevices.indexOf(d) < 0
@@ -191,7 +190,7 @@ const changeDevice = (state: State, device: Device | TrezorDevice, extended: Obj
         d =>
             (d.features &&
                 device.features &&
-                d.features.device_id === device.features.device_id &&
+                d.id === device.id &&
                 d.features.passphrase_protection === device.features.passphrase_protection) ||
             (d.features && d.path.length > 0 && d.path === device.path)
     );
@@ -247,7 +246,7 @@ const forgetDevice = (state: State, device: TrezorDevice): State =>
     state.filter(
         d =>
             d.remember ||
-            (d.features && device.features && d.features.device_id !== device.features.device_id) ||
+            (d.features && device.features && d.id !== device.id) ||
             (!d.features && d.path !== device.path)
     );
 
@@ -261,9 +260,7 @@ const forgetSingleDevice = (state: State, device: TrezorDevice): State => {
 
 const disconnectDevice = (state: State, device: Device): State => {
     const affectedDevices: State = state.filter(
-        d =>
+        d => d.path === device.path || (d.features && device.features && d.id === device.id)
-            d.path === device.path ||
-            (d.features && device.features && d.features.device_id === device.features.device_id)
     );
     const otherDevices: State = state.filter(d => affectedDevices.indexOf(d) === -1);
 
@@ -308,9 +305,7 @@ const onSelectedDevice = (state: State, device: ?TrezorDevice): State => {
 
 const onChangeWalletType = (state: State, device: TrezorDevice, hidden: boolean): State => {
     const affectedDevices: State = state.filter(
-        d =>
+        d => d.path === device.path || (d.features && device.features && d.id === device.id)
-            d.path === device.path ||
-            (d.features && device.features && d.features.device_id === device.features.device_id)
     );
     const otherDevices: State = state.filter(d => affectedDevices.indexOf(d) === -1);
     if (affectedDevices.length > 0) {
@@ -354,16 +349,16 @@ export default function devices(state: State = initialState, action: Action): St
 
         case DEVICE.CONNECT:
         case DEVICE.CONNECT_UNACQUIRED:
-            return addDevice(state, action.device);
+            return addDevice(state, action.payload);
 
         case DEVICE.CHANGED:
             // return changeDevice(state, { ...action.device, connected: true, available: true });
-            return changeDevice(state, action.device, { connected: true, available: true });
+            return changeDevice(state, action.payload, { connected: true, available: true });
         // TODO: check if available will propagate to unavailable
 
         case DEVICE.DISCONNECT:
             // case DEVICE.DISCONNECT_UNACQUIRED:
-            return disconnectDevice(state, action.device);
+            return disconnectDevice(state, action.payload);
 
         case WALLET.SET_SELECTED_DEVICE:
             return onSelectedDevice(state, action.device);

src/reducers/ModalReducer.js

@@ -67,7 +67,7 @@ export default function modal(state: State = initialState, action: Action): Stat
         case DEVICE.DISCONNECT:
             if (
                 state.context === MODAL.CONTEXT_DEVICE &&
-                action.device.path === state.device.path
+                action.payload.path === state.device.path
             ) {
                 return initialState;
             }
@@ -78,14 +78,14 @@ export default function modal(state: State = initialState, action: Action): Stat
         case UI.REQUEST_PASSPHRASE:
             return {
                 context: MODAL.CONTEXT_DEVICE,
-                device: action.payload.device,
+                device: (action.payload.device: any), // should be TrezorDevice, but ath this point it doesn't matter, Device is enough
                 windowType: action.type,
             };
 
         case UI.REQUEST_BUTTON:
             return {
                 context: MODAL.CONTEXT_DEVICE,
-                device: action.payload.device,
+                device: (action.payload.device: any), // should be TrezorDevice, but ath this point it doesn't matter, Device is enough
                 windowType: action.payload.code,
             };
 

src/reducers/NotificationReducer.js

@@ -66,7 +66,7 @@ const closeNotification = (state: State, payload: any): State => {
 export default function notification(state: State = initialState, action: Action): State {
     switch (action.type) {
         case DEVICE.DISCONNECT: {
-            const { path } = action.device; // Flow warning
+            const { path } = action.payload;
             return state.filter(entry => entry.devicePath !== path);
         }
 

src/reducers/TrezorConnectReducer.js

@@ -1,7 +1,7 @@
 /* @flow */
-import { TRANSPORT, UI } from 'trezor-connect';
+import { TRANSPORT, IFRAME } from 'trezor-connect';
 import * as CONNECT from 'actions/constants/TrezorConnect';
-
+import type { TransportInfo, BridgeInfo } from 'trezor-connect';
 import type { Action } from 'flowtype';
 
 export type SelectedDevice = {
@@ -9,26 +9,14 @@ export type SelectedDevice = {
     instance: ?number,
 };
 
-export type LatestBridge = {
-    version: Array<number>,
-    directory: string,
-    packages: Array<{ name: string, url: string, signature?: string, preferred: boolean }>,
-    changelog: Array<string>,
-};
-
 export type State = {
     initialized: boolean,
     error: ?string,
     transport:
-        | {
+        | TransportInfo
-              type: string,
-              version: string,
-              outdated: boolean,
-              bridge: LatestBridge,
-          }
         | {
               type: null,
-              bridge: LatestBridge,
+              bridge: ?BridgeInfo,
           },
     // browserState: {
     //     name: string;
@@ -46,12 +34,7 @@ const initialState: State = {
     error: null,
     transport: {
         type: null,
-        bridge: {
+        bridge: null,
-            version: [],
-            directory: '',
-            packages: [],
-            changelog: [],
-        },
     },
     browserState: {},
     acquiringDevice: false,
@@ -66,11 +49,10 @@ export default function connect(state: State = initialState, action: Action): St
                 error: action.error,
             };
         // trezor-connect iframe loaded
-        case UI.IFRAME_HANDSHAKE:
+        case IFRAME.LOADED:
             return {
                 ...state,
                 initialized: true,
-                browserState: action.payload.browser,
             };
         // trezor-connect (trezor-link) initialized
         case TRANSPORT.START:

src/reducers/WalletReducer.js

@@ -98,7 +98,7 @@ export default function wallet(state: State = initialState, action: Action): Sta
             };
 
         case DEVICE.DISCONNECT:
-            if (state.disconnectRequest && action.device.path === state.disconnectRequest.path) {
+            if (state.disconnectRequest && action.payload.path === state.disconnectRequest.path) {
                 return {
                     ...state,
                     disconnectRequest: null,

src/services/LogService.js

@@ -34,10 +34,10 @@ const LogService: Middleware = (api: MiddlewareAPI) => (next: MiddlewareDispatch
             );
             break;
         case DEVICE.CONNECT:
-            api.dispatch(LogActions.add('Device connected', action.device));
+            api.dispatch(LogActions.add('Device connected', action.payload));
             break;
         case DEVICE.DISCONNECT:
-            api.dispatch(LogActions.add('Device disconnected', action.device));
+            api.dispatch(LogActions.add('Device disconnected', action.payload));
             break;
         case DISCOVERY.START:
             api.dispatch(LogActions.add('Discovery started', action));

src/services/TrezorConnectService.js

@@ -30,7 +30,7 @@ const TrezorConnectService: Middleware = (api: MiddlewareAPI) => (next: Middlewa
     } else if (action.type === BLOCKCHAIN_READY) {
         api.dispatch(TrezorConnectActions.postInit());
     } else if (action.type === DEVICE.DISCONNECT) {
-        api.dispatch(TrezorConnectActions.deviceDisconnect(action.device));
+        api.dispatch(TrezorConnectActions.deviceDisconnect(action.payload));
     } else if (action.type === CONNECT.REMEMBER_REQUEST) {
         api.dispatch(ModalActions.onRememberRequest(prevModalState));
     } else if (action.type === CONNECT.FORGET) {
@@ -48,7 +48,7 @@ const TrezorConnectService: Middleware = (api: MiddlewareAPI) => (next: Middlewa
             api.dispatch(RouterActions.selectFirstAvailableDevice());
         }
     } else if (action.type === DEVICE.CONNECT || action.type === DEVICE.CONNECT_UNACQUIRED) {
-        api.dispatch(ModalActions.onDeviceConnect(action.device));
+        api.dispatch(ModalActions.onDeviceConnect(action.payload));
     } else if (action.type === CONNECT.DUPLICATE) {
         api.dispatch(RouterActions.selectDevice(action.device));
     } else if (action.type === BLOCKCHAIN.BLOCK) {

src/services/WalletService.js

@@ -56,7 +56,7 @@ const WalletService: Middleware = (api: MiddlewareAPI) => (next: MiddlewareDispa
             api.dispatch(TrezorConnectActions.requestWalletType());
             break;
         case DEVICE.CONNECT:
-            api.dispatch(WalletActions.clearUnavailableDevicesData(prevState, action.device));
+            api.dispatch(WalletActions.clearUnavailableDevicesData(prevState, action.payload));
             break;
         default: {
             break;

src/utils/url.js

@@ -4,7 +4,7 @@ import type { TrezorDevice } from 'flowtype';
 
 const getOldWalletUrl = (device: ?TrezorDevice): string => {
     if (!device || !device.firmwareRelease) return urlConstants.OLD_WALLET_BETA;
-    const release = device.firmwareRelease;
+    const { release } = device.firmwareRelease;
     const url = release.channel === 'beta' ? urlConstants.OLD_WALLET_BETA : urlConstants.OLD_WALLET;
     return url;
 };
@@ -12,7 +12,7 @@ const getOldWalletUrl = (device: ?TrezorDevice): string => {
 // TODO: use uri template to build urls
 const getOldWalletReleaseUrl = (device: ?TrezorDevice): string => {
     if (!device || !device.firmwareRelease) return urlConstants.OLD_WALLET_BETA;
-    const release = device.firmwareRelease;
+    const { release } = device.firmwareRelease;
     const url = getOldWalletUrl(device);
     const version = release.version.join('.');
     return `${url}?fw=${version}`;

src/views/Landing/views/InstallBridge/index.js

@@ -117,12 +117,15 @@ const GoBack = styled.span`
 class InstallBridge extends PureComponent<Props, State> {
     constructor(props: Props) {
         super(props);
+        const { transport } = props;
+        const packages = transport.bridge ? transport.bridge.packages : [];
+        const version = transport.bridge ? transport.bridge.packages : [];
 
-        const installers = props.transport.bridge.packages.map(p => ({
+        const installers = packages.map(p => ({
             label: p.name,
             value: p.url,
             signature: p.signature,
-            preferred: p.preferred,
+            preferred: !!p.preferred,
         }));
 
         const currentTarget: ?InstallTarget = installers.find(i => i.preferred === true);
@@ -131,7 +134,7 @@ class InstallBridge extends PureComponent<Props, State> {
                 props.transport.type && props.transport.type === 'bridge'
                     ? `Your version ${props.transport.version}`
                     : 'Not installed',
-            latestVersion: props.transport.bridge.version.join('.'),
+            latestVersion: version.join('.'),
             installers,
             target: currentTarget || installers[0],
             uri: 'https://wallet.trezor.io/data/',

src/views/Wallet/components/LeftNavigation/components/CoinMenu/index.js

@@ -46,8 +46,8 @@ class CoinMenu extends PureComponent<Props> {
     getBaseUrl() {
         const { selectedDevice } = this.props.wallet;
         let baseUrl = '';
-        if (selectedDevice && selectedDevice.features) {
+        if (selectedDevice && selectedDevice.id) {
-            baseUrl = `/device/${selectedDevice.features.device_id}`;
+            baseUrl = `/device/${selectedDevice.id}`;
             if (selectedDevice.instance) {
                 baseUrl += `:${selectedDevice.instance}`;
             }

src/views/Wallet/views/Dashboard/index.js

@@ -63,8 +63,8 @@ const StyledH4 = styled(H4)`
 
 const getBaseUrl = device => {
     let baseUrl = '';
-    if (device && device.features) {
+    if (device && device.id) {
-        baseUrl = `/device/${device.features.device_id}`;
+        baseUrl = `/device/${device.id}`;
         if (device.instance) {
             baseUrl += `:${device.instance}`;
         }