[react devtools][device storage] Device storage methods for React DevTools

Libraries/Core/deviceStorageMethods.js

@@ -0,0 +1,33 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ * @format
+ */
+
+'use strict';
+
+import {MMKV} from 'react-native-mmkv';
+
+const storage = new MMKV({
+  id: 'ReactDevTools',
+});
+
+export type DeviceStorageMethods = {
+  setValueOnDevice: (key: string, value: string) => void,
+  getValueOnDevice: (key: string) => ?string,
+};
+
+const methods: DeviceStorageMethods = {
+  setValueOnDevice: (key, value) => {
+    storage.set(key, value);
+  },
+  getValueOnDevice: key => {
+    return storage.getString(key);
+  },
+};
+
+module.exports = methods;

Libraries/Core/setUpReactDevTools.js

@@ -60,14 +60,21 @@ if (__DEV__) {
 
       const ReactNativeStyleAttributes = require('../Components/View/ReactNativeStyleAttributes');
 
-      reactDevTools.connectToDevTools({
+      let connectToDevToolsParams = {
         isAppActive,
         resolveRNStyle: require('../StyleSheet/flattenStyle'),
         nativeStyleEditorValidAttributes: Object.keys(
           ReactNativeStyleAttributes,
         ),
         websocket: ws,
-      });
+      };
+
+      if (__DEV__) {
+        // $FlowFixMe[prop-missing]
+        connectToDevToolsParams.deviceStorageMethods = require('./deviceStorageMethods');
+      }
+
+      reactDevTools.connectToDevTools(connectToDevToolsParams);
     }
   };
 

package.json

@@ -126,6 +126,7 @@
     "promise": "^8.0.3",
     "react-devtools-core": "4.24.0",
     "react-native-gradle-plugin": "^0.71.0",
+    "react-native-mmkv": "^2.4.3",
     "react-refresh": "^0.4.0",
     "react-shallow-renderer": "^16.15.0",
     "regenerator-runtime": "^0.13.2",

yarn.lock

@@ -5926,6 +5926,11 @@ react-is@^18.2.0:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
   integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
 
+react-native-mmkv@^2.4.3:
+  version "2.4.3"
+  resolved "https://registry.yarnpkg.com/react-native-mmkv/-/react-native-mmkv-2.4.3.tgz#6bb4c2d5e328513da11faab1371d056a189adbd0"
+  integrity sha512-0hYNOTbsjJ5j5cpX+qjwReGIxuYE9MWRsyPQ72fTOvzmEjYXCF4Wr2VQoqx8R6W1/Uinekvln7dGvJ4RExmHhQ==
+
 react-refresh@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.4.0.tgz#d421f9bd65e0e4b9822a399f14ac56bda9c92292"