Skip to content

Commit 8c2c05d

Browse files
valpinkmanvalpinkman
authored
✨ (repo) [DSDK-558]: Extract transports into their own packages (#474)
2 parents 37e755e + d3033a4 commit 8c2c05d

File tree

202 files changed

+2335
-1372
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

202 files changed

+2335
-1372
lines changed

‎.changeset/chilly-carpets-press.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
"@ledgerhq/device-management-kit": minor
3+
"@ledgerhq/device-transport-kit-mockserver": minor
4+
"@ledgerhq/device-transport-kit-web-ble": minor
5+
"@ledgerhq/device-transport-kit-web-hid": minor
6+
"@ledgerhq/device-management-kit-sample": minor
7+
---
8+
9+
Extract Transports to their own module

‎README.md

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -81,16 +81,19 @@ This project uses [turbo monorepo](https://turbo.build/repo/docs) to build and r
8181

8282
A brief description of this project packages:
8383

84-
| Name | Path | Description |
85-
|----------------------------------------|--------------------------------|------------------------------------------------------------------------------------------------------------------------------------------|
86-
| @ledgerhq/device-management-kit-sample | apps/sample | React Next web app used to test & demonstrate the Web Device Management Kit |
87-
| @ledgerhq/eslint-config-dsdk | packages/config/eslint | internal package which contains eslint shared config. Used by `extends: ["@ledgerhq/dsdk"]` in `.eslintrc`. |
88-
| @ledgerhq/jest-config-dsdk | packages/config/jest | internal package which contains jest shared config. Used by `preset: "@ledgerhq/jest-config-dsdk"` in `jest.config.ts` |
89-
| @ledgerhq/tsconfig-dsdk | packages/config/typescript | internal package which contains typescript shared config. Used by `"extends": "@ledgerhq/tsconfig-dsdk/tsconfig.sdk"` in `tsconfig.json` |
90-
| @ledgerhq/device-management-kit | packages/device-management-kit | external package that contains the core of the Web Device Management Kit |
91-
| @ledgerhq/device-signer-kit-ethereum | packages/signer/signer-eth | external package that contains device ethereum coin application dedicated handlers |
92-
| @ledgerhq/device-signer-kit-solana | packages/signer/signer-solana | external package that contains device solana coin application dedicated handlers |
93-
| @ledgerhq/device-management-kit-flipper-plugin-client | packages/flipper-plugin-client | external package that contains [flipper](https://github.com/facebook/flipper) logger for Device Management Kit |
84+
| Name | Path | Description |
85+
|-------------------------------------------------------|--------------------------------|------------------------------------------------------------------------------------------------------------------------------------------|
86+
| @ledgerhq/device-management-kit-sample | apps/sample | React Next web app used to test & demonstrate the Web Device Management Kit |
87+
| @ledgerhq/eslint-config-dsdk | packages/config/eslint | internal package which contains eslint shared config. Used by `extends: ["@ledgerhq/dsdk"]` in `.eslintrc`. |
88+
| @ledgerhq/jest-config-dsdk | packages/config/jest | internal package which contains jest shared config. Used by `preset: "@ledgerhq/jest-config-dsdk"` in `jest.config.ts` |
89+
| @ledgerhq/tsconfig-dsdk | packages/config/typescript | internal package which contains typescript shared config. Used by `"extends": "@ledgerhq/tsconfig-dsdk/tsconfig.sdk"` in `tsconfig.json` |
90+
| @ledgerhq/device-management-kit | packages/device-management-kit | external package that contains the core of the Web Device Management Kit |
91+
| @ledgerhq/device-signer-kit-ethereum | packages/signer/signer-eth | external package that contains device ethereum coin application dedicated handlers |
92+
| @ledgerhq/device-signer-kit-solana | packages/signer/signer-solana | external package that contains device solana coin application dedicated handlers |
93+
| @ledgerhq/device-management-kit-flipper-plugin-client | packages/flipper-plugin-client | external package that contains [flipper](https://github.com/facebook/flipper) logger for Device Management Kit |
94+
| @ledgerhq/device-transport-kit-web-hid | packages/transport/web-hid | external package that contains the Web Hid transport implementation |
95+
| @ledgerhq/device-transport-kit-web-ble | packages/transport/web-ble | external package that contains the Web Ble transport implementation |
96+
| @ledgerhq/device-mockserver-client | packages/mockserver-client | external package that contains the client to interact with the mock-server |
9497

9598
# Getting started
9699

@@ -178,7 +181,7 @@ Please configure JEST extention accordingly.
178181

179182
Each package is built using the following command (at the root of the monorepo).
180183

181-
### Core
184+
### Device Management Kit
182185

183186
Device Management Kit main module.
184187

@@ -275,7 +278,7 @@ pnpm hygen <name> with-prompt
275278

276279
| workspace | script | description |
277280
| --------- | --------------- | ------------------------------------- |
278-
| 📦 core | `module:create` | scaffolds a new _src/internal_ module |
281+
| 📦 dmk | `module:create` | scaffolds a new _src/internal_ module |
279282

280283
## Play with the sample app ?
281284

‎apps/sample/package.json

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,12 @@
1818
"@ledgerhq/context-module": "workspace:*",
1919
"@ledgerhq/device-management-kit": "workspace:*",
2020
"@ledgerhq/device-management-kit-flipper-plugin-client": "workspace:*",
21+
"@ledgerhq/device-mockserver-client": "workspace:*",
2122
"@ledgerhq/device-signer-kit-ethereum": "workspace:*",
2223
"@ledgerhq/device-signer-kit-solana": "workspace:*",
23-
"@ledgerhq/device-transport-kit-mock-client": "workspace:*",
24+
"@ledgerhq/device-transport-kit-mockserver": "workspace:*",
25+
"@ledgerhq/device-transport-kit-web-ble": "workspace:*",
26+
"@ledgerhq/device-transport-kit-web-hid": "workspace:*",
2427
"@ledgerhq/react-ui": "^0.16.2",
2528
"@playwright/test": "^1.48.2",
2629
"@sentry/nextjs": "^8.32.0",

‎apps/sample/src/components/CommandsView/Command.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -145,13 +145,13 @@ export function Command<
145145
overflowY="scroll"
146146
data-testid="box_device-commands-responses"
147147
>
148-
{responses.map(({ args, date, response, loading }, index) => (
148+
{responses.map(({ args, date, response, loading: l }, index) => (
149149
<CommandResponse
150150
args={args}
151151
key={date.toISOString()}
152152
date={date}
153153
response={response}
154-
loading={loading}
154+
loading={l}
155155
isLatest={index === responses.length - 1}
156156
/>
157157
))}

‎apps/sample/src/components/Header/index.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { useCallback, useEffect, useState } from "react";
2-
import { BuiltinTransports } from "@ledgerhq/device-management-kit";
32
import { FlipperPluginManager } from "@ledgerhq/device-management-kit-flipper-plugin-client";
3+
import { mockserverIdentifier } from "@ledgerhq/device-transport-kit-mockserver";
4+
import { webHidIdentifier } from "@ledgerhq/device-transport-kit-web-hid";
45
import {
56
Button,
67
Divider,
@@ -47,15 +48,15 @@ export const Header = () => {
4748
type: "set_transport",
4849
payload: {
4950
transport:
50-
transport === BuiltinTransports.MOCK_SERVER
51-
? BuiltinTransports.USB
52-
: BuiltinTransports.MOCK_SERVER,
51+
transport === mockserverIdentifier
52+
? webHidIdentifier
53+
: mockserverIdentifier,
5354
},
5455
});
5556
}, [dispatch, transport]);
5657
const [mockServerStateUrl, setMockServerStateUrl] =
5758
useState<string>(mockServerUrl);
58-
const mockServerEnabled = transport === BuiltinTransports.MOCK_SERVER;
59+
const mockServerEnabled = transport === mockserverIdentifier;
5960

6061
const validateServerUrl = useCallback(
6162
() =>

‎apps/sample/src/components/MainView/ConnectDeviceActions.tsx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import React, { useCallback } from "react";
2-
import {
3-
BuiltinTransports,
4-
type DmkError,
5-
} from "@ledgerhq/device-management-kit";
2+
import { type DmkError } from "@ledgerhq/device-management-kit";
3+
import { mockserverIdentifier } from "@ledgerhq/device-transport-kit-mockserver";
4+
import { webBleIdentifier } from "@ledgerhq/device-transport-kit-web-ble";
5+
import { webHidIdentifier } from "@ledgerhq/device-transport-kit-web-hid";
66
import { Button, Flex } from "@ledgerhq/react-ui";
77
import styled from "styled-components";
88

@@ -26,7 +26,7 @@ export const ConnectDeviceActions = ({
2626
const dmk = useDmk();
2727

2828
const onSelectDeviceClicked = useCallback(
29-
(selectedTransport: BuiltinTransports) => {
29+
(selectedTransport: string) => {
3030
onError(null);
3131
dmk.startDiscovering({ transport: selectedTransport }).subscribe({
3232
next: (device) => {
@@ -65,9 +65,9 @@ export const ConnectDeviceActions = ({
6565
// also we should not have a different appearance when the mock server is enabled
6666
// we should just display the list of active transports somewhere in the sidebar, discreetly
6767

68-
return transport === BuiltinTransports.MOCK_SERVER ? (
68+
return transport === mockserverIdentifier ? (
6969
<ConnectButton
70-
onClick={() => onSelectDeviceClicked(BuiltinTransports.MOCK_SERVER)}
70+
onClick={() => onSelectDeviceClicked(mockserverIdentifier)}
7171
variant="main"
7272
backgroundColor="main"
7373
size="large"
@@ -78,15 +78,15 @@ export const ConnectDeviceActions = ({
7878
) : (
7979
<Flex>
8080
<ConnectButton
81-
onClick={() => onSelectDeviceClicked(BuiltinTransports.USB)}
81+
onClick={() => onSelectDeviceClicked(webHidIdentifier)}
8282
variant="main"
8383
backgroundColor="main"
8484
size="large"
8585
>
8686
Select a USB device
8787
</ConnectButton>
8888
<ConnectButton
89-
onClick={() => onSelectDeviceClicked(BuiltinTransports.BLE)}
89+
onClick={() => onSelectDeviceClicked(webBleIdentifier)}
9090
variant="main"
9191
backgroundColor="main"
9292
size="large"

‎apps/sample/src/components/Menu/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from "react";
2-
import { BuiltinTransports } from "@ledgerhq/device-management-kit";
2+
import { mockserverIdentifier } from "@ledgerhq/device-transport-kit-mockserver";
33
import { Flex, Icons, Link } from "@ledgerhq/react-ui";
44
import { useRouter } from "next/navigation";
55
import styled from "styled-components";
@@ -72,7 +72,7 @@ export const Menu: React.FC = () => {
7272
<Icons.SettingsAlt2 />
7373
<MenuTitle onClick={() => router.push("/cal")}>Crypto Assets</MenuTitle>
7474
</MenuItem>
75-
{transport === BuiltinTransports.MOCK_SERVER && (
75+
{transport === mockserverIdentifier && (
7676
<MenuItem>
7777
<Icons.Settings />
7878
<MenuTitle

‎apps/sample/src/components/MockView/MockDeviceDrawer.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import {
33
type Mock,
44
type MockClient,
55
type Session,
6-
} from "@ledgerhq/device-transport-kit-mock-client";
6+
} from "@ledgerhq/device-mockserver-client";
77
import { Button, Divider, Flex, Input, Text } from "@ledgerhq/react-ui";
88
import styled from "styled-components";
99

‎apps/sample/src/components/MockView/MockItem.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { useState } from "react";
2-
import { type Mock } from "@ledgerhq/device-transport-kit-mock-client";
2+
import { type Mock } from "@ledgerhq/device-mockserver-client";
33
import { Button, Flex, Icons, Input, Text } from "@ledgerhq/react-ui";
44

55
type MockItemProps = {

‎apps/sample/src/components/MockView/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { useCallback, useEffect, useState } from "react";
2-
import { type Session } from "@ledgerhq/device-transport-kit-mock-client";
2+
import { type Session } from "@ledgerhq/device-mockserver-client";
33
import { Button, Flex, Text } from "@ledgerhq/react-ui";
44
import styled from "styled-components";
55

‎apps/sample/src/components/Sidebar/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
"use client";
22
import React, { useCallback, useEffect, useState } from "react";
3-
import { BuiltinTransports } from "@ledgerhq/device-management-kit";
3+
import { mockserverIdentifier } from "@ledgerhq/device-transport-kit-mockserver";
44
import { Box, Flex, IconsLegacy, Link, Text } from "@ledgerhq/react-ui";
55
import { useRouter } from "next/navigation";
66
import styled, { type DefaultTheme } from "styled-components";
@@ -82,7 +82,7 @@ export const Sidebar: React.FC = () => {
8282

8383
const router = useRouter();
8484
return (
85-
<Root mockServerEnabled={transport === BuiltinTransports.MOCK_SERVER}>
85+
<Root mockServerEnabled={transport === mockserverIdentifier}>
8686
<Link
8787
onClick={() => router.push("/")}
8888
mb={8}
@@ -92,7 +92,7 @@ export const Sidebar: React.FC = () => {
9292
}}
9393
>
9494
Ledger Device Management Kit
95-
{transport === BuiltinTransports.MOCK_SERVER && <span> (MOCKED)</span>}
95+
{transport === mockserverIdentifier && <span> (MOCKED)</span>}
9696
</Link>
9797

9898
<Subtitle variant={"tiny"}>

‎apps/sample/src/hooks/useMockClient.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { useEffect, useState } from "react";
2-
import { MockClient } from "@ledgerhq/device-transport-kit-mock-client";
2+
import { MockClient } from "@ledgerhq/device-mockserver-client";
33

44
export const useMockClient = (url: string): MockClient => {
55
const [client, setClient] = useState(new MockClient(url));

‎apps/sample/src/providers/DeviceManagementKitProvider/index.tsx

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,18 @@
11
import React, { useCallback, useEffect, useState } from "react";
22
import { createContext, type PropsWithChildren, useContext } from "react";
33
import {
4-
BuiltinTransports,
54
ConsoleLogger,
65
type DeviceManagementKit,
76
DeviceManagementKitBuilder,
87
WebLogsExporterLogger,
98
} from "@ledgerhq/device-management-kit";
109
import { FlipperDmkLogger } from "@ledgerhq/device-management-kit-flipper-plugin-client";
10+
import {
11+
mockserverIdentifier,
12+
mockserverTransportFactory,
13+
} from "@ledgerhq/device-transport-kit-mockserver";
14+
import { webBleTransportFactory } from "@ledgerhq/device-transport-kit-web-ble";
15+
import { webHidTransportFactory } from "@ledgerhq/device-transport-kit-web-hid";
1116

1217
import { useHasChanged } from "@/hooks/useHasChanged";
1318
import { useDmkConfigContext } from "@/providers/DmkConfig";
@@ -17,8 +22,8 @@ const LogsExporterContext = createContext<WebLogsExporterLogger | null>(null);
1722

1823
function buildDefaultDmk(logsExporter: WebLogsExporterLogger) {
1924
return new DeviceManagementKitBuilder()
20-
.addTransport(BuiltinTransports.USB)
21-
.addTransport(BuiltinTransports.BLE)
25+
.addTransport(webHidTransportFactory)
26+
.addTransport(webBleTransportFactory)
2227
.addLogger(new ConsoleLogger())
2328
.addLogger(logsExporter)
2429
.addLogger(new FlipperDmkLogger())
@@ -27,7 +32,7 @@ function buildDefaultDmk(logsExporter: WebLogsExporterLogger) {
2732

2833
function buildMockDmk(url: string, logsExporter: WebLogsExporterLogger) {
2934
return new DeviceManagementKitBuilder()
30-
.addTransport(BuiltinTransports.MOCK_SERVER)
35+
.addTransport(mockserverTransportFactory)
3136
.addLogger(new ConsoleLogger())
3237
.addLogger(logsExporter)
3338
.addLogger(new FlipperDmkLogger())
@@ -40,7 +45,7 @@ export const DmkProvider: React.FC<PropsWithChildren> = ({ children }) => {
4045
state: { transport, mockServerUrl },
4146
} = useDmkConfigContext();
4247

43-
const mockServerEnabled = transport === BuiltinTransports.MOCK_SERVER;
48+
const mockServerEnabled = transport === mockserverIdentifier;
4449
const [state, setState] = useState(() => {
4550
const logsExporter = new WebLogsExporterLogger();
4651
const dmk = mockServerEnabled

‎apps/sample/src/reducers/dmkConfig.ts

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
import { type Reducer } from "react";
2-
import { BuiltinTransports } from "@ledgerhq/device-management-kit";
2+
import { type TransportIdentifier } from "@ledgerhq/device-management-kit";
3+
import { webHidIdentifier } from "@ledgerhq/device-transport-kit-web-hid";
34

45
export type DmkConfigState = {
56
mockServerUrl: string;
6-
transport: BuiltinTransports;
7+
transport: TransportIdentifier;
78
};
89

910
type SetTransportAction = {
1011
type: "set_transport";
1112
payload: {
12-
transport: BuiltinTransports;
13+
transport: string;
1314
};
1415
};
1516

@@ -24,9 +25,7 @@ export type DmkConfigAction = SetTransportAction | SetMockServerUrlAction;
2425

2526
export const DmkConfigInitialState: DmkConfigState = {
2627
mockServerUrl: "http://127.0.0.1:8080/",
27-
transport:
28-
(process.env.Dmk_CONFIG_TRANSPORT as BuiltinTransports) ||
29-
BuiltinTransports.USB,
28+
transport: process.env.Dmk_CONFIG_TRANSPORT || webHidIdentifier,
3029
};
3130

3231
export const dmkConfigReducer: Reducer<DmkConfigState, DmkConfigAction> = (

‎package.json

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44
"private": true,
55
"license": "Apache-2.0",
66
"scripts": {
7-
"clean": "rimraf -g **/.turbo **/.next **/coverage",
7+
"clean": "rimraf -g **/.turbo **/.next **/coverage **/node_modules",
88
"build": "turbo run build",
99
"build:libs": "turbo run build --filter=./packages/**",
10-
"dev": "turbo run dev",
10+
"dev": "turbo run dev --concurrency 20",
1111
"lint": "turbo run lint",
1212
"lint:fix": "turbo run lint:fix",
1313
"prettier": "turbo run prettier",
@@ -21,9 +21,14 @@
2121
"signer-btc": "pnpm --filter @ledgerhq/device-signer-kit-bitcoin",
2222
"signer-eth": "pnpm --filter @ledgerhq/device-signer-kit-ethereum",
2323
"signer-solana": "pnpm --filter @ledgerhq/device-signer-kit-solana",
24-
"mock-client": "pnpm --filter @ledgerhq/device-transport-kit-mock-client",
24+
"signer-utils": "pnpm --filter @ledgerhq/signer-utils",
25+
"mockserver-client": "pnpm --filter @ledgerhq/device-mockserver-client",
2526
"trusted-apps": "pnpm --filter @ledgerhq/device-sdk-trusted-apps",
2627
"ui": "pnpm --filter @ledgerhq/device-sdk-ui",
28+
"transports": "pnpm --filter @ledgerhq/device-transport-*",
29+
"transport-web-hid": "pnpm --filter @ledgerhq/device-transport-kit-web-hid",
30+
"transport-web-ble": "pnpm --filter @ledgerhq/device-transport-kit-web-ble",
31+
"transport-mockserver": "pnpm --filter @ledgerhq/device-transport-kit-mockserver",
2732
"flipper": "pnpm --filter @ledgerhq/device-management-kit-flipper-plugin-client",
2833
"sample": "pnpm --filter @ledgerhq/device-management-kit-sample",
2934
"doc": "pnpm --filter @ledgerhq/ledger-dmk-docs",

‎packages/device-management-kit/eslint.config.mjs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import config from "@ledgerhq/eslint-config-dsdk";
33
export default [
44
...config,
55
{
6-
ignores: ["eslint.config.mjs", "scripts/*.mjs"],
6+
ignores: ["eslint.config.mjs", "scripts/*.mjs", "lib/*"],
77
languageOptions: {
88
parserOptions: {
99
project: "./tsconfig.json",

‎packages/device-management-kit/package.json

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -36,19 +36,21 @@
3636
"module:create": "pnpm hygen core-module with-prompt"
3737
},
3838
"dependencies": {
39-
"@ledgerhq/device-transport-kit-mock-client": "workspace:*",
39+
"@ledgerhq/device-mockserver-client": "workspace:*",
4040
"@sentry/minimal": "^6.19.7",
4141
"@statelyai/inspect": "^0.4.0",
4242
"axios": "^1.7.7",
4343
"inversify": "^6.0.3",
4444
"inversify-logger-middleware": "^3.1.0",
4545
"purify-ts": "^2.1.0",
4646
"reflect-metadata": "^0.2.2",
47-
"rxjs": "^7.8.1",
4847
"semver": "^7.6.3",
4948
"uuid": "^10.0.0",
5049
"xstate": "^5.18.2"
5150
},
51+
"peerDependencies": {
52+
"rxjs": "^7.8.1"
53+
},
5254
"devDependencies": {
5355
"@ledgerhq/esbuild-tools": "workspace:*",
5456
"@ledgerhq/eslint-config-dsdk": "workspace:*",
@@ -57,8 +59,7 @@
5759
"@ledgerhq/tsconfig-dsdk": "workspace:*",
5860
"@types/semver": "^7.5.8",
5961
"@types/uuid": "^10.0.0",
60-
"@types/w3c-web-hid": "^1.0.6",
61-
"@types/web-bluetooth": "^0.0.20",
62+
"rxjs": "^7.8.1",
6263
"ts-node": "^10.9.2"
6364
}
6465
}

0 commit comments

Comments
 (0)