Add selectors for ConnectivityController

packages/connectivity-controller/CHANGELOG.md

@@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Added
+
+- Add `connectivityControllerSelectors` with `selectConnectivityStatus` and `selectIsOffline` selectors ([#7701](https://github.com/MetaMask/core/pull/7701))
+  - `selectConnectivityStatus` returns the current connectivity status from the controller state
+  - `selectIsOffline` is a memoized selector that returns `true` when the device is offline
+
 ## [0.2.0]
 
 ### Added

packages/connectivity-controller/package.json

@@ -49,7 +49,8 @@
   },
   "dependencies": {
     "@metamask/base-controller": "^9.0.1",
-    "@metamask/messenger": "^1.0.0"
+    "@metamask/messenger": "^1.0.0",
+    "reselect": "^5.1.1"
   },
   "devDependencies": {
     "@metamask/auto-changelog": "^3.4.4",

packages/connectivity-controller/src/index.ts

@@ -13,3 +13,4 @@ export {
   ConnectivityController,
   getDefaultConnectivityControllerState,
 } from './ConnectivityController';
+export { connectivityControllerSelectors } from './selectors';

packages/connectivity-controller/src/selectors.test.ts

@@ -0,0 +1,51 @@
+import type { ConnectivityControllerState } from './ConnectivityController';
+import { connectivityControllerSelectors } from './selectors';
+import { CONNECTIVITY_STATUSES } from './types';
+
+describe('connectivityControllerSelectors', () => {
+  describe('selectConnectivityStatus', () => {
+    it('returns Online when connectivityStatus is Online', () => {
+      const state: ConnectivityControllerState = {
+        connectivityStatus: CONNECTIVITY_STATUSES.Online,
+      };
+
+      const result =
+        connectivityControllerSelectors.selectConnectivityStatus(state);
+
+      expect(result).toBe(CONNECTIVITY_STATUSES.Online);
+    });
+
+    it('returns Offline when connectivityStatus is Offline', () => {
+      const state: ConnectivityControllerState = {
+        connectivityStatus: CONNECTIVITY_STATUSES.Offline,
+      };
+
+      const result =
+        connectivityControllerSelectors.selectConnectivityStatus(state);
+
+      expect(result).toBe(CONNECTIVITY_STATUSES.Offline);
+    });
+  });
+
+  describe('selectIsOffline', () => {
+    it('returns false when connectivityStatus is Online', () => {
+      const state: ConnectivityControllerState = {
+        connectivityStatus: CONNECTIVITY_STATUSES.Online,
+      };
+
+      const result = connectivityControllerSelectors.selectIsOffline(state);
+
+      expect(result).toBe(false);
+    });
+
+    it('returns true when connectivityStatus is Offline', () => {
+      const state: ConnectivityControllerState = {
+        connectivityStatus: CONNECTIVITY_STATUSES.Offline,
+      };
+
+      const result = connectivityControllerSelectors.selectIsOffline(state);
+
+      expect(result).toBe(true);
+    });
+  });
+});

packages/connectivity-controller/src/selectors.ts

@@ -0,0 +1,35 @@
+import { createSelector } from 'reselect';
+
+import type { ConnectivityControllerState } from './ConnectivityController';
+import { CONNECTIVITY_STATUSES } from './types';
+import type { ConnectivityStatus } from './types';
+
+/**
+ * Selects the connectivity status from the controller state.
+ *
+ * @param state - The controller state
+ * @returns The connectivity status
+ */
+const selectConnectivityStatus = (
+  state: ConnectivityControllerState,
+): ConnectivityStatus => state.connectivityStatus;
+
+/**
+ * Selects whether the device is offline.
+ *
+ * @param state - The controller state
+ * @returns Whether the device is offline
+ */
+const selectIsOffline = createSelector(
+  [selectConnectivityStatus],
+  (connectivityStatus) => connectivityStatus === CONNECTIVITY_STATUSES.Offline,
+);
+
+/**
+ * Selectors for the ConnectivityController state.
+ * These can be used with Redux or directly with controller state.
+ */
+export const connectivityControllerSelectors = {
+  selectConnectivityStatus,
+  selectIsOffline,
+};

yarn.lock

@@ -3249,6 +3249,7 @@ __metadata:
     "@types/jest": "npm:^29.5.14"
     deepmerge: "npm:^4.2.2"
     jest: "npm:^29.7.0"
+    reselect: "npm:^5.1.1"
     ts-jest: "npm:^29.2.5"
     tsx: "npm:^4.20.5"
     typedoc: "npm:^0.25.13"