🚚 (smpl): Rename Session to DeviceSession

LedgerHQ · May 15, 2024 · 2f05046 · 2f05046
1 parent a83a609
commit 2f05046
Show file tree

Hide file tree

Showing 9 changed files with 67 additions and 63 deletions.
diff --git a/apps/sample/src/app/client-layout.tsx b/apps/sample/src/app/client-layout.tsx
@@ -16,7 +16,7 @@ import styled, { DefaultTheme } from "styled-components";
 import { Header } from "@/components/Header";
 import { Sidebar } from "@/components/Sidebar";
 import { SdkProvider } from "@/providers/DeviceSdkProvider";
-import { SessionProvider } from "@/providers/SessionsProvider";
+import { DeviceSessionsProvider } from "@/providers/DeviceSessionsProvider";
 import { GlobalStyle } from "@/styles/globalstyles";
 
 type ClientRootLayoutProps = {
@@ -45,13 +45,13 @@ const ClientRootLayout: React.FC<ClientRootLayoutProps> = ({ children }) => {
           <GlobalStyle />
           <body>
             <Root>
-              <SessionProvider>
+              <DeviceSessionsProvider>
                 <Sidebar />
                 <PageContainer>
                   <Header />
                   {children}
                 </PageContainer>
-              </SessionProvider>
+              </DeviceSessionsProvider>
             </Root>
           </body>
         </StyleProvider>

diff --git a/apps/sample/src/components/ApduView/index.tsx b/apps/sample/src/components/ApduView/index.tsx
@@ -5,7 +5,7 @@ import styled, { DefaultTheme } from "styled-components";
 
 import { useApduForm } from "@/hooks/useApduForm";
 import { useSdk } from "@/providers/DeviceSdkProvider";
-import { useSessionContext } from "@/providers/SessionsProvider";
+import { useDeviceSessionsContext } from "@/providers/DeviceSessionsProvider";
 
 const Root = styled(Flex).attrs({ mx: 15, mt: 10, mb: 5 })`
   flex-direction: column;
@@ -70,7 +70,7 @@ export const ApduView: React.FC = () => {
   const sdk = useSdk();
   const {
     state: { selectedId: selectedSessionId },
-  } = useSessionContext();
+  } = useDeviceSessionsContext();
   const onSubmit = useCallback(
     async (values: typeof apduFormValues) => {
       setLoading(true);

diff --git a/apps/sample/src/components/Device/index.tsx b/apps/sample/src/components/Device/index.tsx
@@ -2,12 +2,12 @@ import React from "react";
 import {
   ConnectionType,
   DeviceModelId,
-  SessionId,
+  DeviceSessionId,
 } from "@ledgerhq/device-sdk-core";
 import { Box, DropdownGeneric, Flex, Icons, Text } from "@ledgerhq/react-ui";
 import styled, { DefaultTheme } from "styled-components";
 
-import { useSessionState } from "@/hooks/useSessionState";
+import { useDeviceSessionState } from "@/hooks/useDeviceSessionState";
 
 import { StatusText } from "./StatusText";
 
@@ -38,7 +38,7 @@ const ActionRow = styled(Flex).attrs({ py: 4, px: 2 })`
 type DeviceProps = {
   name: string;
   type: ConnectionType;
-  sessionId: SessionId;
+  sessionId: DeviceSessionId;
   model: DeviceModelId;
   onDisconnect: () => Promise<void>;
 };
@@ -50,7 +50,7 @@ export const Device: React.FC<DeviceProps> = ({
   onDisconnect,
   sessionId,
 }) => {
-  const sessionState = useSessionState(sessionId);
+  const sessionState = useDeviceSessionState(sessionId);
   return (
     <Root>
       <IconContainer>

diff --git a/apps/sample/src/components/MainView/index.tsx b/apps/sample/src/components/MainView/index.tsx
@@ -4,7 +4,7 @@ import Image from "next/image";
 import styled, { DefaultTheme } from "styled-components";
 
 import { useSdk } from "@/providers/DeviceSdkProvider";
-import { useSessionContext } from "@/providers/SessionsProvider";
+import { useDeviceSessionsContext } from "@/providers/DeviceSessionsProvider";
 
 const Root = styled(Flex)`
   flex: 1;
@@ -23,7 +23,7 @@ const NanoLogo = styled(Image).attrs({ mb: 8 })`
 
 export const MainView: React.FC = () => {
   const sdk = useSdk();
-  const { dispatch } = useSessionContext();
+  const { dispatch } = useDeviceSessionsContext();
 
   // Example starting the discovery on a user action
   const onSelectDeviceClicked = useCallback(() => {

diff --git a/apps/sample/src/components/Sidebar/index.tsx b/apps/sample/src/components/Sidebar/index.tsx
@@ -7,7 +7,7 @@ import styled, { DefaultTheme } from "styled-components";
 import { Device } from "@/components/Device";
 import { Menu } from "@/components/Menu";
 import { useSdk } from "@/providers/DeviceSdkProvider";
-import { useSessionContext } from "@/providers/SessionsProvider";
+import { useDeviceSessionsContext } from "@/providers/DeviceSessionsProvider";
 
 const Root = styled(Flex).attrs({ py: 8, px: 6 })`
   flex-direction: column;
@@ -46,7 +46,7 @@ export const Sidebar: React.FC = () => {
   const {
     state: { deviceById },
     dispatch,
-  } = useSessionContext();
+  } = useDeviceSessionsContext();
 
   useEffect(() => {
     sdk

diff --git a/apps/sample/src/hooks/useSessionState.ts → ...sample/src/hooks/useDeviceSessionState.ts b/apps/sample/src/hooks/useSessionState.ts → ...sample/src/hooks/useDeviceSessionState.ts
@@ -1,21 +1,22 @@
 import { useEffect, useState } from "react";
-import { SessionDeviceState, SessionId } from "@ledgerhq/device-sdk-core";
+import { DeviceSessionId, DeviceSessionState } from "@ledgerhq/device-sdk-core";
 
 import { useSdk } from "@/providers/DeviceSdkProvider";
 
-export function useSessionState(sessionId: SessionId) {
+export function useDeviceSessionState(sessionId: DeviceSessionId) {
   const sdk = useSdk();
-  const [sessionState, setSessionState] = useState<SessionDeviceState>();
+  const [deviceSessionState, setDeviceSessionState] =
+    useState<DeviceSessionState>();
 
   useEffect(() => {
     if (sessionId) {
       const subscription = sdk
-        .getSessionDeviceState({
+        .getDeviceSessionState({
           sessionId,
         })
         .subscribe((state) => {
           // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
-          setSessionState(state);
+          setDeviceSessionState(state);
         });
 
       return () => {
@@ -24,5 +25,5 @@ export function useSessionState(sessionId: SessionId) {
     }
   }, [sessionId, sdk]);
 
-  return sessionState;
+  return deviceSessionState;
 }
diff --git a/apps/sample/src/providers/DeviceSessionsProvider/index.tsx b/apps/sample/src/providers/DeviceSessionsProvider/index.tsx
@@ -0,0 +1,38 @@
+import React, { Context, createContext, useContext, useReducer } from "react";
+
+import {
+  AddSessionAction,
+  DeviceSessionsInitialState,
+  deviceSessionsReducer,
+  DeviceSessionsState,
+  RemoveSessionAction,
+} from "@/reducers/deviceSessions";
+
+type DeviceSessionsContextType = {
+  state: DeviceSessionsState;
+  dispatch: (value: AddSessionAction | RemoveSessionAction) => void;
+};
+
+const DeviceSessionsContext: Context<DeviceSessionsContextType> =
+  createContext<DeviceSessionsContextType>({
+    state: DeviceSessionsInitialState,
+    dispatch: () => null,
+  });
+
+export const DeviceSessionsProvider: React.FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const [state, dispatch] = useReducer(
+    deviceSessionsReducer,
+    DeviceSessionsInitialState,
+  );
+
+  return (
+    <DeviceSessionsContext.Provider value={{ state, dispatch }}>
+      {children}
+    </DeviceSessionsContext.Provider>
+  );
+};
+
+export const useDeviceSessionsContext = () =>
+  useContext<DeviceSessionsContextType>(DeviceSessionsContext);
diff --git a/apps/sample/src/providers/SessionsProvider/index.tsx b/apps/sample/src/providers/SessionsProvider/index.tsx
diff --git a/apps/sample/src/reducers/sessions.ts → apps/sample/src/reducers/deviceSessions.ts b/apps/sample/src/reducers/sessions.ts → apps/sample/src/reducers/deviceSessions.ts
@@ -1,28 +1,28 @@
 import { Reducer } from "react";
-import { ConnectedDevice, SessionId } from "@ledgerhq/device-sdk-core";
+import { ConnectedDevice, DeviceSessionId } from "@ledgerhq/device-sdk-core";
 
-export type SessionsState = {
-  selectedId: SessionId | null;
-  deviceById: Record<SessionId, ConnectedDevice>;
+export type DeviceSessionsState = {
+  selectedId: DeviceSessionId | null;
+  deviceById: Record<DeviceSessionId, ConnectedDevice>;
 };
 
 export type AddSessionAction = {
   type: "add_session";
-  payload: { sessionId: SessionId; connectedDevice: ConnectedDevice };
+  payload: { sessionId: DeviceSessionId; connectedDevice: ConnectedDevice };
 };
 
 export type RemoveSessionAction = {
   type: "remove_session";
-  payload: { sessionId: SessionId };
+  payload: { sessionId: DeviceSessionId };
 };
 
-export const SessionsInitialState: SessionsState = {
+export const DeviceSessionsInitialState: DeviceSessionsState = {
   selectedId: null,
   deviceById: {},
 };
 
-export const sessionsReducer: Reducer<
-  SessionsState,
+export const deviceSessionsReducer: Reducer<
+  DeviceSessionsState,
   AddSessionAction | RemoveSessionAction
 > = (state, action) => {
   switch (action.type) {