uniswap-interface-uncensored/functions/utils/getAsset.ts
Brendan Wong 9954f9502d
feat: dynamically generated images for rich link previews (#6902)
* feat: add token and nft injection

* feat: basic tests

* fix: get jest configured properly

* fix: change timeout

* fix: uninstall port ready

* fix: readd port ready

* fix: local tests work

* Update yarn.lock

* add lint disable for setup files

* fix: update dependencies

* fix: basic test suite for nfts/tokens

* feat: collection data

* fix: make tests more comprehensive

* fix: change matches to contains

* fix: tests for twitter alt image tag

* fix: image gen

* fix: add patch-package

* fix: update yarn install

* feat: basic image gen for nfts and collections

* fix: remove vibrant attempt

* use watermark asset

* dynamically grab color

* modularize code and prototype for token preview

* refactor code

* finalize css

* fix color grabber

* update tests

* fix up css

* refactor code a bit more

* remove console logs

* tests

* update tests

* update images based on design feedback

* network logos

* update lint

* slight refactoring

* more refactoring

* fix packages

* Update yarn.lock

* remove dynamically generated image stuff

* Revert "remove dynamically generated image stuff"

This reverts commit a80241edb3a970a724b9a07ce36e492ff8a1c2af.

* change image reference and revamp tests

* cleanup return values

* Create README.md

* Revert "Create README.md"

This reverts commit 7a91c98d384995fba914c9bf9a2fb3072793621f.

* First round of feedback

* comments

* feat: cache

* Update test.yml

* Update test.yml

* Update test.yml

* feedback round 2

* final feedback

* final final feedback

* add coverage and other options

* Update test.yml

* start typecheck

* update cache

* update snapshots?

* Update jest.config.json

* Update jest.config.json

* give timeout some buffer

* update import

* upgrade ts

* fix typing for apollo deps

* finalize typechecks

* downgrade typescript to original version

* add cache directory to jest

* remove coverage

* remove google analytics from tests

* merge main

* remove timeout

* update tests

* update graphql queries

* review changes

* try cache setup

* Update cache.test.ts

* make cache helper function

* cache test

* remove unneeded test causing issues

* feat: parallelize cache (#6930)

* feat: parallelize cache?

* remove graph query from concurrency await

* most of feedback

* move tests

* update token tests

* singleton cache

* restructuring res and cache promise

* abstract away repeated graph logic

* update tests and functions

* refactor

* update typing, parallelize, and start tests

* fix one tsc issue

* final feedback

* Update yarn.lock

* final final feedback

* add svgs

* try and setup svg

* stashing changes

* cleanup!

* prepare for start of feedback?

* LESS GOO

* modify versioning

* fix: update wrangler version

* Update yarn.lock

* downgrade wrangler

* Update yarn.lock

* Update yarn.lock

* fix type error

* update github test

* cleanup tests

* Delete custom.d.ts

* fix: cloudfunctions

* update tests

* final touchups

* lint

* change github action

* Update yarn.lock

* styling updates

* nate's feedback

* feedback p1

* typing feedback

* update yarn

* Create wrangler.toml

* move wrangler.toml location

* last try

* Delete wrangler.toml

* use 2.20?

* remove comment

* Update yarn.lock

* change compatibility date

* update wrangler and fix bugs

* Update colorthief+2.4.0.patch

* build: cleanup flags

* cleaner patches

* update compatibility date

* quick tweeks

* cleanup rendering and lint

* final color update

---------

Co-authored-by: Zach Pomerantz <zzmp@uniswap.org>
2023-08-10 15:29:37 -04:00

42 lines
1.2 KiB
TypeScript

import { AssetDocument, AssetQuery } from '../../src/graphql/data/__generated__/types-and-hooks'
import client from '../client'
function formatTitleName(name: string | undefined, collectionName: string | undefined, tokenId: string) {
if (name) {
return name
}
if (collectionName && tokenId) {
return collectionName + ' #' + tokenId
}
if (tokenId) {
return 'Asset #' + tokenId
}
return 'View NFT on Uniswap'
}
export default async function getAsset(collectionAddress: string, tokenId: string, url: string) {
const origin = new URL(url).origin
const image = origin + '/api/image/nfts/asset/' + collectionAddress + '/' + tokenId
const { data } = await client.query<AssetQuery>({
query: AssetDocument,
variables: {
address: collectionAddress,
filter: {
tokenIds: [tokenId],
},
},
})
const asset = data?.nftAssets?.edges[0]?.node
if (!asset) {
return undefined
}
const title = formatTitleName(asset.name, asset.collection?.name, asset.tokenId)
const formattedAsset = {
title,
image,
url,
ogImage: asset.image?.url ?? origin + '/images/192x192_App_Icon.png',
}
return formattedAsset
}