Skip to content

Commit

Permalink
Consistent device list sorting and formatting. (#596)
Browse files Browse the repository at this point in the history
* Consistent device list sorting and formatting.

* Fix failing tests
  • Loading branch information
TwitchBronBron authored Sep 27, 2024
1 parent 438832a commit 123e653
Show file tree
Hide file tree
Showing 7 changed files with 75 additions and 51 deletions.
10 changes: 5 additions & 5 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
"multi-root-ready"
],
"engines": {
"vscode": "^1.57.0",
"vscode": "^1.81.0",
"node": "^12.12.0"
},
"repository": {
Expand Down Expand Up @@ -107,7 +107,7 @@
"@types/resolve": "^1.20.6",
"@types/semver": "^7.1.0",
"@types/sinon": "7.0.6",
"@types/vscode": "^1.53.0",
"@types/vscode": "^1.81.0",
"@types/xml2js": "^0.4.14",
"@types/yargs": "^17.0.10",
"@typescript-eslint/eslint-plugin": "^5.14.0",
Expand Down
28 changes: 16 additions & 12 deletions src/ActiveDeviceManager.ts
Original file line number Diff line number Diff line change
Expand Up @@ -85,18 +85,22 @@ export class ActiveDeviceManager {
this.firstRequestForDevices = false;
const devices = Object.values(
this.deviceCache.mget(this.deviceCache.keys()) as Record<string, RokuDeviceDetails>
).sort(firstBy((a: RokuDeviceDetails, b: RokuDeviceDetails) => {
return this.getPriorityForDeviceFormFactor(a) - this.getPriorityForDeviceFormFactor(b);
}).thenBy((a: RokuDeviceDetails, b: RokuDeviceDetails) => {
if (a.id < b.id) {
return -1;
}
if (a.id > b.id) {
return 1;
}
// ids must be equal
return 0;
}));
).sort(
firstBy<RokuDeviceDetails>((a, b) => {
return this.getPriorityForDeviceFormFactor(a) - this.getPriorityForDeviceFormFactor(b);
}).thenBy<RokuDeviceDetails>((a, b) => {
return a.deviceInfo['default-device-name'].localeCompare(b.deviceInfo['default-device-name']);
}).thenBy<RokuDeviceDetails>((a, b) => {
if (a.id < b.id) {
return -1;
}
if (a.id > b.id) {
return 1;
}
// ids must be equal
return 0;
})
);
return devices;
}

Expand Down
15 changes: 15 additions & 0 deletions src/icons.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
import * as vscode from 'vscode';
import type { RokuDeviceDetails } from './ActiveDeviceManager';

export const icons = {
streamingStick: {
light: vscode.Uri.file(`${__dirname}/../images/icons/streaming-stick-light.svg`),
Expand All @@ -11,5 +13,18 @@ export const icons = {
setTopBox: {
light: vscode.Uri.file(`${__dirname}/../images/icons/set-top-box-light.svg`),
dark: vscode.Uri.file(`${__dirname}/../images/icons/set-top-box-dark.svg`)
},
/**
* Get the correct icon for the device type
*/
getDeviceType: (device: RokuDeviceDetails) => {
if (device.deviceInfo?.['is-stick']) {
return icons.streamingStick;
} else if (device.deviceInfo?.['is-tv']) {
return icons.tv;
//fall back to settop box in all other cases
} else {
return icons.setTopBox;
}
}
};
17 changes: 11 additions & 6 deletions src/managers/UserInputManager.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { standardizePath as s } from 'brighterscript';
import * as fsExtra from 'fs-extra';
import type { RokuDeviceDetails } from '../ActiveDeviceManager';
import { ActiveDeviceManager } from '../ActiveDeviceManager';
import { icons } from '../icons';

const sinon = createSandbox();
const Module = require('module');
Expand Down Expand Up @@ -47,7 +48,8 @@ describe('UserInputManager', () => {
deviceInfo: {
'user-device-name': 'roku1',
'serial-number': 'alpha',
'model-number': 'model1'
'model-number': 'model1',
'software-version': '11.5.0'
},
id: '1',
ip: '1.1.1.1',
Expand All @@ -56,7 +58,8 @@ describe('UserInputManager', () => {
deviceInfo: {
'user-device-name': 'roku2',
'serial-number': 'beta',
'model-number': 'model2'
'model-number': 'model2',
'software-version': '11.5.0'
},
id: '2',
ip: '1.1.1.2',
Expand All @@ -65,14 +68,15 @@ describe('UserInputManager', () => {
deviceInfo: {
'user-device-name': 'roku3',
'serial-number': 'charlie',
'model-number': 'model3'
'model-number': 'model3',
'software-version': '11.5.0'
},
id: '3',
ip: '1.1.1.3',
location: '???'
}];
function label(device: RokuDeviceDetails) {
return `${device.ip} | ${device.deviceInfo['user-device-name']} - ${device.deviceInfo['serial-number']} - ${device.deviceInfo['model-number']}`;
return `${device.deviceInfo['model-number']} ${device.deviceInfo['user-device-name']} – OS ${device.deviceInfo['software-version']} ${device.ip}`;
}

it('includes "manual', () => {
Expand All @@ -95,8 +99,9 @@ describe('UserInputManager', () => {
label: 'devices'
},
{
label: '1.1.1.1 | roku1 - alpha - model1',
device: devices[0]
label: 'model1 – roku1 – OS 11.5.0 – 1.1.1.1',
device: devices[0],
iconPath: icons.setTopBox
},
{
kind: QuickPickItemKind.Separator,
Expand Down
16 changes: 12 additions & 4 deletions src/managers/UserInputManager.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import type {
} from 'vscode';
import * as vscode from 'vscode';
import type { ActiveDeviceManager, RokuDeviceDetails } from '../ActiveDeviceManager';
import { icons } from '../icons';

/**
* An id to represent the "Enter manually" option in the host picker
Expand Down Expand Up @@ -143,7 +144,12 @@ export class UserInputManager {
* @returns a properly formatted host string
*/
private createHostLabel(device: RokuDeviceDetails) {
return `${device.ip} | ${device.deviceInfo['user-device-name']} - ${device.deviceInfo['serial-number']} - ${device.deviceInfo['model-number']}`;
return [
device.deviceInfo['model-number'],
device.deviceInfo['user-device-name'],
`OS ${device.deviceInfo['software-version']}`,
device.ip
].join(' – ');
}

/**
Expand All @@ -169,8 +175,9 @@ export class UserInputManager {
//add the device
items.push({
label: this.createHostLabel(lastUsedDevice),
device: lastUsedDevice
});
device: lastUsedDevice,
iconPath: icons.getDeviceType(lastUsedDevice)
} as any);
}

//add all other devices
Expand All @@ -185,7 +192,8 @@ export class UserInputManager {
//add the device
items.push({
label: this.createHostLabel(device),
device: device
device: device,
iconPath: icons.getDeviceType(device)
});
}
}
Expand Down
36 changes: 14 additions & 22 deletions src/viewProviders/OnlineDevicesViewProvider.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,21 +19,12 @@ export class OnlineDevicesViewProvider implements vscode.TreeDataProvider<vscode
) {
this.devices = [];
this.activeDeviceManager.on('device-found', newDevice => {
if (!this.findDeviceById(newDevice.id)) {
// Add the device to the list
this.devices.push(newDevice);
this._onDidChangeTreeData.fire(null);
} else {
// Update the device
const foundIndex = this.devices.findIndex(device => device.id === newDevice.id);
this.devices[foundIndex] = newDevice;
}
this.devices = this.activeDeviceManager.getActiveDevices();
this._onDidChangeTreeData.fire(null);
});

this.activeDeviceManager.on('device-expired', device => {
// Remove the device from the list
const foundIndex = this.devices.findIndex(x => x.id === device.id);
this.devices.splice(foundIndex, 1);
this.devices = this.activeDeviceManager.getActiveDevices();
this._onDidChangeTreeData.fire(null);
});
}
Expand All @@ -47,27 +38,28 @@ export class OnlineDevicesViewProvider implements vscode.TreeDataProvider<vscode

private devices: Array<RokuDeviceDetails>;

private makeName(device: RokuDeviceDetails) {
return [
device.deviceInfo['model-number'],
device.deviceInfo['user-device-name'],
`OS ${device.deviceInfo['software-version']}`
].join(' – ');
}

getChildren(element?: DeviceTreeItem | DeviceInfoTreeItem): vscode.ProviderResult<DeviceTreeItem[] | DeviceInfoTreeItem[]> {
if (!element) {
if (this.devices) {
let items: DeviceTreeItem[] = [];
for (const device of this.devices) {
// Make a rook item for each device
let treeItem = new DeviceTreeItem(
device.deviceInfo['user-device-name'] + ' - ' + this.concealString(device.deviceInfo['serial-number']),
this.makeName(device),
vscode.TreeItemCollapsibleState.Collapsed,
device.id,
device.deviceInfo
);
treeItem.tooltip = `${device.ip} | ${device.deviceInfo['default-device-name']} - ${device.deviceInfo['model-number']} | ${device.deviceInfo['user-device-location']}`;
if (device.deviceInfo?.['is-stick']) {
treeItem.iconPath = icons.streamingStick;
} else if (device.deviceInfo?.['is-tv']) {
treeItem.iconPath = icons.tv;
//fall back to settop box in all other cases
} else {
treeItem.iconPath = icons.setTopBox;
}
treeItem.tooltip = `${device.ip} | ${device.deviceInfo['friendly-model-name']} - ${this.concealString(device.deviceInfo['serial-number'])} | ${device.deviceInfo['user-device-location']}`;
treeItem.iconPath = icons.getDeviceType(device);
items.push(treeItem);
}

Expand Down

0 comments on commit 123e653

Please sign in to comment.