[PAY-2722] Add account switcher

packages/common/src/api/account.ts

@@ -1,4 +1,11 @@
 import { createApi } from '~/audius-query'
+import { Id } from './utils'
+import {
+  ID,
+  UserMetadata,
+  managedUserListFromSDK,
+  userManagerListFromSDK
+} from '~/models'
 
 type ResetPasswordArgs = {
   email: string
@@ -18,6 +25,21 @@ const accountApi = createApi({
         type: 'query'
       }
     },
+    getCurrentWeb3User: {
+      async fetch(_, { audiusBackend }) {
+        const libs = await audiusBackend.getAudiusLibsTyped()
+        // TODO: https://linear.app/audius/issue/PAY-2838/separate-walletentropy-user-and-current-user-in-state
+        // What happens in the cache if something here is null?
+
+        // Note: This cast is mostly safe, but is missing info populated in AudiusBackend.getAccount()
+        // Okay for now as that info isn't generally available on non-account users and isn't used in manager mode.
+        return libs.Account?.getWeb3User() as UserMetadata | null
+      },
+      options: {
+        type: 'query',
+        schemaKey: 'currentWeb3User'
+      }
+    },
     resetPassword: {
       async fetch(args: ResetPasswordArgs, context) {
         const { email, password } = args
@@ -29,10 +51,45 @@ const accountApi = createApi({
       options: {
         type: 'mutation'
       }
+    },
+    getManagedAccounts: {
+      async fetch({ userId }: { userId: ID }, { audiusSdk }) {
+        const sdk = await audiusSdk()
+        const managedUsers = await sdk.full.users.getManagedUsers({
+          id: Id.parse(userId)
+        })
+
+        const { data = [] } = managedUsers
+        return managedUserListFromSDK(data)
+      },
+      options: {
+        type: 'query',
+        schemaKey: 'managedUsers'
+      }
+    },
+    getManagers: {
+      async fetch({ userId }: { userId: ID }, { audiusSdk }) {
+        const sdk = await audiusSdk()
+        const managedUsers = await sdk.full.users.getManagers({
+          id: Id.parse(userId)
+        })
+
+        const { data = [] } = managedUsers
+        return userManagerListFromSDK(data)
+      },
+      options: {
+        type: 'query',
+        schemaKey: 'userManagers'
+      }
     }
   }
 })
 
-export const { useGetCurrentUserId, useResetPassword } = accountApi.hooks
+export const {
+  useGetCurrentUserId,
+  useGetCurrentWeb3User,
+  useResetPassword,
+  useGetManagedAccounts
+} = accountApi.hooks
 
 export const accountApiReducer = accountApi.reducer

packages/common/src/audius-query/schema.ts

@@ -22,8 +22,19 @@ export const collectionSchema = new schema.Entity(
   { idAttribute: 'playlist_id' }
 )
 
+export const managedUserSchema = new schema.Object({
+  user: userSchema
+})
+
+export const userManagerSchema = new schema.Object({
+  manager: userSchema
+})
+
 export const apiResponseSchema = new schema.Object({
+  currentWeb3User: userSchema,
+  managedUsers: new schema.Array(managedUserSchema),
   user: userSchema,
+  userManagers: new schema.Array(userManagerSchema),
   track: trackSchema,
   collection: collectionSchema,
   users: new schema.Array(userSchema),

packages/common/src/hooks/index.ts

@@ -1,3 +1,4 @@
+export * from './useAccountSwitcher'
 export * from './useBooleanOnce'
 export * from './useFeatureFlag'
 export * from './useRemoteVar'

packages/common/src/hooks/useAccountSwitcher.ts

@@ -0,0 +1,24 @@
+import { useCallback } from 'react'
+import { useAppContext } from '~/context'
+import { UserMetadata } from '~/models/User'
+
+// Matches corresponding key in libs (DISCOVERY_PROVIDER_USER_WALLET_OVERRIDE)
+const USER_WALLET_OVERRIDE_KEY = '@audius/user-wallet-override'
+
+export const useAccountSwitcher = () => {
+  const { localStorage } = useAppContext()
+  const switchAccount = useCallback(async (user: UserMetadata) => {
+    if (!user.wallet) {
+      console.error('User has no wallet address')
+      return
+    }
+
+    await localStorage.setItem(USER_WALLET_OVERRIDE_KEY, user.wallet)
+    await localStorage.clearAudiusAccount()
+    await localStorage.clearAudiusAccountUser()
+
+    window.location.reload()
+  }, [])
+
+  return { switchAccount }
+}

packages/common/src/models/Grant.ts

@@ -0,0 +1,23 @@
+import { full } from '@audius/sdk'
+import { Nullable, decodeHashId } from '~/utils'
+import { ID } from './Identifiers'
+
+export type Grant = {
+  grantee_address: string
+  user_id: Nullable<ID>
+  is_revoked: boolean
+  is_approved: boolean
+  created_at: string
+  updated_at: string
+}
+
+export const grantFromSDK = (input: full.Grant): Grant => {
+  return {
+    grantee_address: input.granteeAddress,
+    user_id: decodeHashId(input.userId) ?? null,
+    is_revoked: input.isRevoked,
+    is_approved: input.isApproved,
+    created_at: input.createdAt,
+    updated_at: input.updatedAt
+  }
+}

packages/common/src/models/User.ts

@@ -23,6 +23,7 @@ import { Nullable, removeNullable } from '~/utils/typeUtils'
 
 import { Timestamped } from './Timestamped'
 import { UserEvent } from './UserEvent'
+import { Grant, grantFromSDK } from './Grant'
 
 export type UserMetadata = {
   album_count: number
@@ -85,6 +86,16 @@ export type UserMetadata = {
   events?: UserEvent
 } & Timestamped
 
+export type ManagedUserMetadata = {
+  grant: Grant
+  user: UserMetadata
+}
+
+export type UserManagerMetadata = {
+  grant: Grant
+  manager: UserMetadata
+}
+
 export type ComputedUserProperties = {
   _profile_picture_sizes: ProfilePictureSizes
   _cover_photo_sizes: CoverPhotoSizes
@@ -164,3 +175,35 @@ export const userMetadataFromSDK = (
 
 export const userMetadataListFromSDK = (input?: full.UserFull[]) =>
   input ? input.map((d) => userMetadataFromSDK(d)).filter(removeNullable) : []
+
+export const managedUserFromSDK = (
+  input: full.ManagedUser
+): ManagedUserMetadata | undefined => {
+  const user = userMetadataFromSDK(input.user)
+  if (!user) {
+    return undefined
+  }
+  return {
+    user,
+    grant: grantFromSDK(input.grant)
+  }
+}
+
+export const managedUserListFromSDK = (input?: full.ManagedUser[]) =>
+  input ? input.map((d) => managedUserFromSDK(d)).filter(removeNullable) : []
+
+export const userManagerFromSDK = (
+  input: full.UserManager
+): UserManagerMetadata | undefined => {
+  const manager = userMetadataFromSDK(input.manager)
+  if (!manager) {
+    return undefined
+  }
+  return {
+    manager,
+    grant: grantFromSDK(input.grant)
+  }
+}
+
+export const userManagerListFromSDK = (input?: full.UserManager[]) =>
+  input ? input.map((d) => userManagerFromSDK(d)).filter(removeNullable) : []

packages/common/src/services/audius-backend/AudiusBackend.ts

@@ -706,7 +706,7 @@ export const audiusBackend = ({
             getRemoteVar(IntKeys.DISCOVERY_NODE_MAX_BLOCK_DIFF) ?? undefined,
 
           discoveryNodeSelector,
-          enableUserIdOverride: isManagerModeEnabled
+          enableUserWalletOverride: isManagerModeEnabled
         },
         identityServiceConfig:
           AudiusLibs.configIdentityService(identityServiceUrl),

packages/libs/src/api/Account.ts

@@ -25,6 +25,7 @@ export class Account extends Base {
     this.ServiceProvider = serviceProvider
 
     this.getCurrentUser = this.getCurrentUser.bind(this)
+    this.getWeb3User = this.getWeb3User.bind(this)
     this.login = this.login.bind(this)
     this.logout = this.logout.bind(this)
     this.generateRecoveryLink = this.generateRecoveryLink.bind(this)
@@ -54,6 +55,15 @@ export class Account extends Base {
     return this.userStateManager.getCurrentUser()
   }
 
+  /**
+   * Fetches the user metadata for user belonging to the current web3 wallet.
+   * May be different if acting as a managed account.
+   * @return {Object} user metadata
+   */
+  getWeb3User() {
+    return this.userStateManager.getWeb3User()
+  }
+
   /**
    * Logs a user into Audius
    */

packages/libs/src/services/discoveryProvider/DiscoveryProvider.ts

@@ -21,7 +21,11 @@ import {
   DiscoveryProviderSelection,
   DiscoveryProviderSelectionConfig
 } from './DiscoveryProviderSelection'
-import { DEFAULT_UNHEALTHY_BLOCK_DIFF, REQUEST_TIMEOUT_MS } from './constants'
+import {
+  DEFAULT_UNHEALTHY_BLOCK_DIFF,
+  DISCOVERY_PROVIDER_USER_WALLET_OVERRIDE,
+  REQUEST_TIMEOUT_MS
+} from './constants'
 import * as Requests from './requests'
 
 const MAX_MAKE_REQUEST_RETRY_COUNT = 5
@@ -65,7 +69,7 @@ export type DiscoveryProviderConfig = {
   unhealthySlotDiffPlays?: number
   unhealthyBlockDiff?: number
   discoveryNodeSelector?: DiscoveryNodeSelector
-  enableUserIdOverride?: boolean
+  enableUserWalletOverride?: boolean
 } & Pick<
   DiscoveryProviderSelectionConfig,
   'selectionCallback' | 'monitoringCallbacks' | 'localStorage'
@@ -97,10 +101,10 @@ type DiscoveryNodeChallenge = {
   disbursed_amount: number
 }
 
-const getUserIdOverride = async (localStorage?: LocalStorage) => {
+const getUserWalletOverride = async (localStorage?: LocalStorage) => {
   try {
     const userIdOverride = await localStorage?.getItem(
-      '@audius/user-id-override'
+      DISCOVERY_PROVIDER_USER_WALLET_OVERRIDE
     )
     return userIdOverride == null ? undefined : userIdOverride
   } catch {
@@ -152,7 +156,7 @@ export class DiscoveryProvider {
     | DiscoveryProviderSelection['monitoringCallbacks']
     | undefined
 
-  enableUserIdOverride = false
+  enableUserWalletOverride = false
 
   discoveryProviderEndpoint: string | undefined
   isInitialized = false
@@ -176,7 +180,7 @@ export class DiscoveryProvider {
     unhealthySlotDiffPlays,
     unhealthyBlockDiff,
     discoveryNodeSelector,
-    enableUserIdOverride = false
+    enableUserWalletOverride = false
   }: DiscoveryProviderConfig) {
     this.whitelist = whitelist
     this.blacklist = blacklist
@@ -185,7 +189,7 @@ export class DiscoveryProvider {
     this.web3Manager = web3Manager
     this.selectionCallback = selectionCallback
     this.localStorage = localStorage
-    this.enableUserIdOverride = enableUserIdOverride
+    this.enableUserWalletOverride = enableUserWalletOverride
 
     this.unhealthyBlockDiff = unhealthyBlockDiff ?? DEFAULT_UNHEALTHY_BLOCK_DIFF
     this.serviceSelector = new DiscoveryProviderSelection(
@@ -243,12 +247,33 @@ export class DiscoveryProvider {
       this.web3Manager &&
       this.web3Manager.web3
     ) {
-      // Set current user if it exists
-      const userAccount = await this.getUserAccount(
+      const walletOverride = this.enableUserWalletOverride
+        ? await getUserWalletOverride(this.localStorage)
+        : undefined
+
+      const web3AccountPromise = this.getUserAccount(
         this.web3Manager.getWalletAddress()
       )
-      if (userAccount) {
-        await this.userStateManager.setCurrentUser(userAccount)
+
+      if (walletOverride) {
+        const overrideAccountPromise = this.getUserAccount(walletOverride)
+        const [web3User, currentUser] = await Promise.all([
+          web3AccountPromise,
+          overrideAccountPromise
+        ])
+
+        if (web3User) {
+          this.userStateManager.setWeb3User(web3User)
+        }
+        if (currentUser) {
+          await this.userStateManager.setCurrentUser(currentUser)
+        }
+      } else {
+        const currentUser = await web3AccountPromise
+        if (currentUser) {
+          this.userStateManager.setWeb3User(currentUser)
+          await this.userStateManager.setCurrentUser(currentUser)
+        }
       }
     }
   }
@@ -839,21 +864,8 @@ export class DiscoveryProvider {
    * Return user collections (saved & uploaded) along w/ users for those collections
    */
   async getUserAccount(wallet: string) {
-    const userIdOverride = this.enableUserIdOverride
-      ? await getUserIdOverride(this.localStorage)
-      : undefined
-    // If override is used, fetch that account instead
-    if (userIdOverride) {
-      const req = Requests.getUsers(1, 0, [parseInt(userIdOverride)])
-      const res = await this._makeRequest<CurrentUser[]>(req)
-      if (res && res.length > 0 && res[0]) {
-        return { ...res[0], playlists: [] } as CurrentUser
-      }
-      return null
-    } else {
-      const req = Requests.getUserAccount(wallet)
-      return await this._makeRequest<CurrentUser>(req)
-    }
+    const req = Requests.getUserAccount(wallet)
+    return await this._makeRequest<CurrentUser>(req)
   }
 
   /**

packages/libs/src/services/discoveryProvider/constants.ts

@@ -1,5 +1,7 @@
 export const DISCOVERY_PROVIDER_TIMESTAMP =
   '@audius/libs:discovery-node-timestamp'
+export const DISCOVERY_PROVIDER_USER_WALLET_OVERRIDE =
+  '@audius/user-wallet-override'
 export const DISCOVERY_SERVICE_NAME = 'discovery-node'
 export const DEFAULT_UNHEALTHY_BLOCK_DIFF = 15
 export const REGRESSED_MODE_TIMEOUT = 2 * 60 * 1000 // two minutes