@exodus/ui-config 1.0.0 → 2.0.0

package/README.md

@@ -16,15 +16,21 @@ import uiConfig from '@exodus/ui-config'
 // exodus is created via `@exodus/headless`
 exodus.use(
   uiConfig({
-    atoms: [
-      // these are emitted to the `port` as events 'delightUserAtom' and 'terrifyUserAtom'
-      { id: 'delightUserAtom' },
-      { id: 'terrifyUserAtom' },
+    config: [
+      // Note: these are NOT atom definitions, they're only metadata about atoms: `id` and later `type` (so we can
+      // internally instantiate different types of atoms)
+      //
+      // these are emitted to the `port` as events 'delightUser' and 'terrifyUser'
+      { id: 'delightUser' },
+      { id: 'terrifyUser' },
     ],
   })
 )
 
 // API usage
-exodus.uiConfig.setDelightUser(true)
-exodus.uiConfig.setTerrifyUser(false)
+exodus.uiConfig.delightUser(true)
+exodus.uiConfig.terrifyUser(false)
 ```
+
+// Port events
+feature emit data from atoms in with following format: `port.emit('delightUserAtom', value)`

package/api/index.js

@@ -1,27 +1,27 @@
 import { mapValues } from '@exodus/basic-utils'
 import { merge } from 'lodash'
-import { stripAtom, toFirstUpper } from '../utils'
 
-const getGetterName = (name) => `get${toFirstUpper(stripAtom(name))}`
-
-const getSetterName = (name) => `set${toFirstUpper(stripAtom(name))}`
-
-const createUiConfigApiDefinition = ({ atomIds }) => {
+const createUiConfigApiDefinition = ({ atomIds, atomConfigMap }) => {
   return {
     definition: {
       type: 'api',
       id: 'uiConfig',
-      factory: ({ ...atoms }) => ({
-        uiConfig: merge(
+      factory: ({ ...atoms }) => {
+        const uiConfig = merge(
           ...Object.values(
-            mapValues(atoms, (atom, name) => ({
+            mapValues(atoms, (atom, atomId) => ({
               // assetsShowPriceMapAtom -> getAssetsShowPriceMap, setAssetsShowPriceMap
-              [getGetterName(name)]: atom.get,
-              [getSetterName(name)]: atom.set,
+              [atomConfigMap[atomId]]: {
+                set: atom.set,
+                get: atom.get,
+              },
             }))
           )
-        ),
-      }),
+        )
+        return {
+          uiConfig,
+        }
+      },
       dependencies: atomIds,
     },
     writesAtoms: atomIds,

package/index.js

@@ -1,16 +1,20 @@
 import { createStorageAtomFactory } from '@exodus/atoms'
 import createUiConfigApiDefinition from './api'
 import createUiConfigPluginDefinition from './plugin'
-import { stripAtom } from './utils'
 
-const createUiConfigFeatureDefinition = ({ atoms: uiConfigAtoms }) => {
-  const atoms = uiConfigAtoms.map(({ id }) => ({
+const createUiConfigFeatureDefinition = ({ config }) => {
+  const getAtomId = (id) => `${id}Atom`
+  const configAtomMap = Object.fromEntries(config.map(({ id }) => [id, getAtomId(id)]))
+  const atomConfigMap = Object.fromEntries(
+    Object.keys(configAtomMap).map((configId) => [configAtomMap[configId], configId])
+  )
+  const atoms = config.map(({ id }) => ({
     definition: {
-      id,
+      id: configAtomMap[id],
       type: 'atom',
       factory: ({ storage, config }) =>
         createStorageAtomFactory({ storage })({
-          key: stripAtom(id),
+          key: id,
           isSoleWriter: true,
         }),
       dependencies: ['storage'],
@@ -18,14 +22,14 @@ const createUiConfigFeatureDefinition = ({ atoms: uiConfigAtoms }) => {
     storage: { namespace: 'uiConfig' },
   }))
 
-  const atomIds = uiConfigAtoms.map(({ id }) => id)
+  const atomIds = Object.keys(atomConfigMap)
 
   return {
     id: 'uiConfigFeatureDefinition',
     definitions: [
       ...atoms,
-      createUiConfigApiDefinition({ atomIds }),
-      createUiConfigPluginDefinition({ atomIds }),
+      createUiConfigApiDefinition({ atomIds, atomConfigMap }),
+      createUiConfigPluginDefinition({ atomIds, atomConfigMap }),
     ],
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@exodus/ui-config",
-  "version": "1.0.0",
+  "version": "2.0.0",
   "description": "Helper for storing various UI-specific settings/config.",
   "author": "Exodus Movement Inc.",
   "license": "UNLICENSED",
@@ -31,5 +31,5 @@
   "devDependencies": {
     "eslint": "^8.44.0"
   },
-  "gitHead": "14fc30509aaa011e0e214aa6b7e0d6608ad3f7c2"
+  "gitHead": "77f9575942b25e8cd2229c79889264c5994b7bb6"
 }

package/plugin/index.js

@@ -4,9 +4,9 @@ const createUiConfigPluginDefinition = ({ atomIds }) => ({
     id: 'uiConfigPlugin',
     factory: ({ port, ...atoms }) => {
       const watch = () =>
-        Object.entries(atoms).forEach(([name, atom]) =>
-          atom.observe((value) => port.emit(name, value))
-        )
+        Object.entries(atoms).forEach(([atomId, atom]) => {
+          return atom.observe((value) => port.emit(atomId, value))
+        })
 
       const clear = () =>
         Promise.all(Object.entries(atoms).map(([name, atom]) => atom.set(undefined)))

package/utils.js

@@ -1,3 +0,0 @@
-export const toFirstUpper = (name) => name.slice(0, 1).toUpperCase() + name.slice(1)
-
-export const stripAtom = (name) => name.replace(/Atom$/, '')