From bb7c4adfff7ebd2d22494b12558613a3cf37499c Mon Sep 17 00:00:00 2001
From: "Valentin D. Pinkman" <valentin.d.pinkman@hey.com>
Date: Wed, 31 Jan 2024 18:06:15 +0100
Subject: [PATCH] feat(sample): display sdk version in sample app

---
 apps/sample/package.json                      |  1 +
 apps/sample/src/components/Sidebar/index.tsx  | 20 ++++++++++++++++++-
 .../src/providers/DeviceSdkProvider/index.tsx | 18 +++++++++++++++++
 packages/core/index.ts                        |  1 +
 packages/core/src/api/DeviceSdk.ts            |  8 +++++---
 packages/core/src/api/index.ts                |  4 +---
 packages/core/tsconfig.json                   |  2 +-
 pnpm-lock.yaml                                |  3 +++
 8 files changed, 49 insertions(+), 8 deletions(-)
 create mode 100644 apps/sample/src/providers/DeviceSdkProvider/index.tsx
 create mode 100644 packages/core/index.ts

diff --git a/apps/sample/package.json b/apps/sample/package.json
index 03583a602..a071150c3 100644
--- a/apps/sample/package.json
+++ b/apps/sample/package.json
@@ -9,6 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@ledgerhq/device-sdk-core": "workspace:*",
     "@ledgerhq/react-ui": "^0.14.13",
     "next": "14.0.4",
     "react": "^18",
diff --git a/apps/sample/src/components/Sidebar/index.tsx b/apps/sample/src/components/Sidebar/index.tsx
index 9ed6c7cff..25280edf5 100644
--- a/apps/sample/src/components/Sidebar/index.tsx
+++ b/apps/sample/src/components/Sidebar/index.tsx
@@ -1,6 +1,7 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { Box, Flex, Icons, Text } from "@ledgerhq/react-ui";
 import styled, { DefaultTheme } from "styled-components";
+import { useSdk } from "@/providers/DeviceSdkProvider";
 import { Menu } from "../Menu";
 import { Device } from "../Device";
 
@@ -40,10 +41,27 @@ const VersionText = styled(Text)`
 `;
 
 export const Sidebar: React.FC = () => {
+  const [version, setVersion] = useState("");
+  const sdk = useSdk();
+
+  useEffect(() => {
+    sdk
+      .getVersion()
+      .then((v) => setVersion(v))
+      .catch((error: unknown) => {
+        console.error(error as Error);
+        setVersion("");
+      });
+  }, [sdk]);
+
   return (
     <Root>
       <Title variant={"large"}>Ledger Device SDK</Title>
 
+      {version ? (
+        <Subtitle variant={"small"}>SDK Version: {version}</Subtitle>
+      ) : null}
+
       <Subtitle variant={"tiny"}>Device</Subtitle>
       <Device />
 
diff --git a/apps/sample/src/providers/DeviceSdkProvider/index.tsx b/apps/sample/src/providers/DeviceSdkProvider/index.tsx
new file mode 100644
index 000000000..1e4ed022e
--- /dev/null
+++ b/apps/sample/src/providers/DeviceSdkProvider/index.tsx
@@ -0,0 +1,18 @@
+import { createContext, useContext } from "react";
+import { DeviceSdkBuilder, DeviceSdk } from "@ledgerhq/device-sdk-core";
+
+export const sdk = new DeviceSdkBuilder().build();
+
+const SdkContext = createContext<DeviceSdk>(sdk);
+
+type Props = {
+  children: React.ReactNode;
+};
+
+export const SdkProvider: React.FC<Props> = ({ children }) => {
+  return <SdkContext.Provider value={sdk}>{children}</SdkContext.Provider>;
+};
+
+export const useSdk = () => {
+  return useContext(SdkContext);
+};
diff --git a/packages/core/index.ts b/packages/core/index.ts
new file mode 100644
index 000000000..3bd16e178
--- /dev/null
+++ b/packages/core/index.ts
@@ -0,0 +1 @@
+export * from "./src";
diff --git a/packages/core/src/api/DeviceSdk.ts b/packages/core/src/api/DeviceSdk.ts
index f12b242aa..77cf44d31 100644
--- a/packages/core/src/api/DeviceSdk.ts
+++ b/packages/core/src/api/DeviceSdk.ts
@@ -1,6 +1,8 @@
 import { Container } from "inversify";
-import { GetSdkVersionUseCase } from "@internal/config/usecase/GetSdkVersionUseCase";
+// import { GetSdkVersionUseCase } from "@internal/config/usecase/GetSdkVersionUseCase";
+import { types as ConfigTypes } from "@internal/config/di/configTypes";
 import { MakeContainerProps, makeContainer } from "../di";
+import { GetSdkVersionUseCase } from "@internal/config/usecase/GetSdkVersionUseCase";
 
 export class DeviceSdk {
   container: Container;
@@ -20,9 +22,9 @@ export class DeviceSdk {
     return;
   }
 
-  getVersion() {
+  getVersion(): Promise<string> {
     return this.container
-      .get<GetSdkVersionUseCase>("GetSdkVersionUseCase")
+      .get<GetSdkVersionUseCase>(ConfigTypes.GetSdkVersionUseCase)
       .getSdkVersion();
   }
 }
diff --git a/packages/core/src/api/index.ts b/packages/core/src/api/index.ts
index 65ae36972..76b5ef838 100644
--- a/packages/core/src/api/index.ts
+++ b/packages/core/src/api/index.ts
@@ -1,6 +1,4 @@
 "use strict";
 
 export { LedgerDeviceSdkBuilder as DeviceSdkBuilder } from "./DeviceSdkBuilder";
-
-// NOTE: not sure we want to export directly the DeviceSdk as we are using the builder pattern
-// export { DeviceSdk } from "./DeviceSdk";
+export { DeviceSdk } from "./DeviceSdk";
diff --git a/packages/core/tsconfig.json b/packages/core/tsconfig.json
index 8ffe96945..69133a3fd 100644
--- a/packages/core/tsconfig.json
+++ b/packages/core/tsconfig.json
@@ -7,5 +7,5 @@
       "@internal/*": ["src/internal/*"]
     }
   },
-  "include": ["src", "jest.*.ts"]
+  "include": ["src", "index.ts", "jest.*.ts"]
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 163fa0223..9eb01b9ed 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -41,6 +41,9 @@ importers:
 
   apps/sample:
     dependencies:
+      '@ledgerhq/device-sdk-core':
+        specifier: workspace:*
+        version: link:../../packages/core
       '@ledgerhq/react-ui':
         specifier: ^0.14.13
         version: 0.14.13(@types/react@18.2.45)(react-dom@18.2.0)(react@18.2.0)(styled-components@5.3.11)