[C-919] Migrate profile sagas to common (#1826)

* Move fetchCID into audius backend

* Move fileUtils to common

* Move some constants into common

* Move CollectibleState into common

* Move OpenSea types to common

* Move OpenSeaClient to common

* Move SolanaClient to common

* Move profile sagas to web/common

* Fix some paths

* Create SolanaClient instances

* Update types

packages/common/package.json

@@ -37,6 +37,7 @@
     "lodash": "4.17.21",
     "moment": "2.24.0",
     "numeral": "2.0.6",
+    "promise.allsettled": "1.0.5",
     "reselect": "4.0.0",
     "typed-redux-saga": "1.3.1",
     "typesafe-actions": "5.1.0"

packages/web/src/components/collectibles/types.ts → packages/common/src/models/CollectibleState.ts

@@ -1,4 +1,4 @@
-import { Collectible } from '@audius/common'
+import { Collectible } from './Collectible'
 
 export type CollectibleState = {
   [wallet: string]: Collectible[]

packages/web/src/services/opensea-client/types.ts → packages/common/src/models/OpenSea.ts

@@ -1,4 +1,4 @@
-import { Nullable } from '@audius/common'
+import { Nullable } from '../utils/typeUtils'
 
 type AssetContract = {
   address: Nullable<string>

packages/common/src/models/index.ts

@@ -1,20 +1,22 @@
-export * from './Identifiers'
-export * from './Timestamped'
-export * from './Cache'
 export * from './Analytics'
 export * from './AudioRewards'
 export * from './BadgeTier'
+export * from './Cache'
 export * from './Chain'
 export * from './Client'
 export * from './Collectible'
+export * from './CollectibleState'
 export * from './Collection'
 export * from './Color'
+export * from './ErrorReporting'
 export * from './Favorite'
 export * from './FeedFilter'
+export * from './Identifiers'
 export * from './ImageSizes'
 export * from './Kind'
 export * from './Lineup'
 export * from './OnChain'
+export * from './OpenSea'
 export * from './OS'
 export * from './Playable'
 export * from './PlaylistLibrary'
@@ -25,8 +27,8 @@ export * from './Status'
 export * from './Stems'
 export * from './Theme'
 export * from './TimeRange'
+export * from './Timestamped'
 export * from './Tipping'
 export * from './Track'
 export * from './User'
 export * from './Wallet'
-export * from './ErrorReporting'

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

@@ -201,14 +201,6 @@ type WithEagerOption = (
 
 type WaitForLibsInit = () => Promise<unknown>
 
-type FetchCID = (
-  cid: CID,
-  creatorNodeGateways: string[],
-  cache?: boolean,
-  asUrl?: boolean,
-  trackId?: Nullable<ID>
-) => Promise<any>
-
 type AudiusBackendParams = {
   claimDistributionContractAddress: Maybe<string>
   disableImagePreload?: boolean
@@ -228,7 +220,6 @@ type AudiusBackendParams = {
     web3ProviderUrls: Maybe<string[]>,
     web3NetworkId: Maybe<string>
   ) => Promise<any>
-  fetchCID: FetchCID
   // Not required on web
   hedgehogConfig?: {
     createKey: HedgehogConfig['createKey']
@@ -274,7 +265,6 @@ export const audiusBackend = ({
   getHostUrl,
   getLibs,
   getWeb3Config,
-  fetchCID,
   hedgehogConfig,
   identityServiceUrl,
   isElectron,
@@ -418,6 +408,40 @@ export const audiusBackend = ({
     })
   }
 
+  async function fetchCID(
+    cid: CID,
+    creatorNodeGateways = [] as string[],
+    cache = true,
+    asUrl = true,
+    trackId: Nullable<ID> = null
+  ) {
+    await waitForLibsInit()
+    try {
+      const res = await audiusLibs.File.fetchCID(
+        cid,
+        creatorNodeGateways,
+        () => {},
+        // If requesting a url (we mean a blob url for the file),
+        // otherwise, default to JSON
+        asUrl ? 'blob' : 'json',
+        trackId
+      )
+      if (asUrl) {
+        const url = URL.createObjectURL(res.data)
+        if (cache) CIDCache.add(cid, url)
+        return url
+      }
+      return res?.data ?? null
+    } catch (e) {
+      const message = getErrorMessage(e)
+      if (message === 'Unauthorized') {
+        return message
+      }
+      console.error(e)
+      return asUrl ? '' : null
+    }
+  }
+
   async function fetchImageCID(
     cid: CID,
     creatorNodeGateways: string[] = [],
@@ -3161,6 +3185,7 @@ export const audiusBackend = ({
     didSelectDiscoveryProviderListeners,
     disableBrowserNotifications,
     emailInUse,
+    fetchCID,
     fetchImageCID,
     fetchUserAssociatedEthWallets,
     fetchUserAssociatedSolWallets,

packages/common/src/services/index.ts

@@ -9,3 +9,5 @@ export * from './wallet-client'
 export * from './env'
 export * from './explore'
 export * from './audio-player'
+export * from './opensea-client'
+export * from './solana-client'

packages/web/src/services/opensea-client/OpenSeaClient.ts → packages/common/src/services/opensea-client/OpenSeaClient.ts

@@ -1,13 +1,13 @@
-import { Collectible } from '@audius/common'
 import * as allPromisesSettled from 'promise.allsettled'
 
-import { CollectibleState } from 'components/collectibles/types'
 import {
+  Collectible,
+  CollectibleState,
   OpenSeaAsset,
   OpenSeaAssetExtended,
   OpenSeaEvent,
   OpenSeaEventExtended
-} from 'services/opensea-client/types'
+} from '../../models'
 
 import {
   isAssetValid,

packages/web/src/services/opensea-client/ethCollectibleHelpers.ts → packages/common/src/services/opensea-client/ethCollectibleHelpers.ts

@@ -1,10 +1,11 @@
-import { Chain, Collectible, CollectibleMediaType } from '@audius/common'
-
 import {
+  Chain,
+  Collectible,
+  CollectibleMediaType,
   OpenSeaAssetExtended,
   OpenSeaEvent,
   OpenSeaEventExtended
-} from 'services/opensea-client/types'
+} from '../../models'
 
 const fetchWithTimeout = async (
   resource: RequestInfo,

packages/common/src/services/opensea-client/index.ts

@@ -0,0 +1,2 @@
+export * from './ethCollectibleHelpers'
+export { default as OpenSeaClient } from './OpenSeaClient'

packages/web/src/services/solana-client/SolanaClient.ts → packages/common/src/services/solana-client/SolanaClient.ts

@@ -1,24 +1,25 @@
-import { Collectible } from '@audius/common'
 import { TOKEN_PROGRAM_ID } from '@solana/spl-token'
 import { Connection, PublicKey } from '@solana/web3.js'
 
-import { CollectibleState } from 'components/collectibles/types'
+import { Collectible, CollectibleState } from '../../models'
 
 import { solanaNFTToCollectible } from './solCollectibleHelpers'
 import { SolanaNFTType } from './types'
 
-const SOLANA_CLUSTER_ENDPOINT = process.env.REACT_APP_SOLANA_CLUSTER_ENDPOINT
-const METADATA_PROGRAM_ID = process.env.REACT_APP_METADATA_PROGRAM_ID
-
-const METADATA_PROGRAM_ID_PUBLIC_KEY = new PublicKey(
-  METADATA_PROGRAM_ID || 'metaqbxxUerdq28cj1RbAWkYQm3ybzjb6a8bt518x1s'
-)
-
-class SolanaClient {
+type SolanaClientArgs = {
+  solanaClusterEndpoint: string | undefined
+  metadataProgramId: string | undefined
+}
+export class SolanaClient {
   private connection: Connection | null = null
-  constructor() {
+  private metadataProgramIdPublicKey: PublicKey
+
+  constructor({ solanaClusterEndpoint, metadataProgramId }: SolanaClientArgs) {
+    this.metadataProgramIdPublicKey = new PublicKey(
+      metadataProgramId || 'metaqbxxUerdq28cj1RbAWkYQm3ybzjb6a8bt518x1s'
+    )
     try {
-      this.connection = new Connection(SOLANA_CLUSTER_ENDPOINT!, 'confirmed')
+      this.connection = new Connection(solanaClusterEndpoint!, 'confirmed')
     } catch (e) {
       console.error('Could create Solana RPC connection', e)
       this.connection = null
@@ -50,7 +51,7 @@ class SolanaClient {
       const potentialNFTsByOwnerAddress = tokenAccountsByOwnerAddress
         .map((ta) => ta.value)
         // value is an array of parsed token info
-        .map((value, i) => {
+        .map((value) => {
           const mintAddresses = value
             .map((v) => ({
               mint: v.account.data.parsed.info.mint,
@@ -77,10 +78,10 @@ class SolanaClient {
                   await PublicKey.findProgramAddress(
                     [
                       Buffer.from('metadata'),
-                      METADATA_PROGRAM_ID_PUBLIC_KEY.toBytes(),
+                      this.metadataProgramIdPublicKey.toBytes(),
                       new PublicKey(mintAddress).toBytes()
                     ],
-                    METADATA_PROGRAM_ID_PUBLIC_KEY
+                    this.metadataProgramIdPublicKey
                   )
                 )[0]
             )
@@ -92,7 +93,7 @@ class SolanaClient {
           const nonNullInfos = accountInfos?.filter(Boolean) ?? []
 
           const metadataUrls = nonNullInfos
-            .map((x) => client._utf8ArrayToNFTType(x!.data))
+            .map((x) => this._utf8ArrayToNFTType(x!.data))
             .filter(Boolean) as { type: SolanaNFTType; url: string }[]
 
           const results = await Promise.all(
@@ -152,10 +153,10 @@ class SolanaClient {
     // for the sake of simplicty/readability/understandability, we check the decoded url
     // one by one against metaplex, star atlas, and others
     return (
-      client._metaplex(text) ||
-      client._starAtlas(text) ||
-      client._jsonExtension(text) ||
-      client._ipfs(text)
+      this._metaplex(text) ||
+      this._starAtlas(text) ||
+      this._jsonExtension(text) ||
+      this._ipfs(text)
     )
   }
 
@@ -257,7 +258,3 @@ class SolanaClient {
     }
   }
 }
-
-const client = new SolanaClient()
-
-export default client

packages/common/src/services/solana-client/index.ts

@@ -0,0 +1 @@
+export { SolanaClient } from './SolanaClient'