diff --git a/package-lock.json b/package-lock.json index bb2353070d..9fd1d580d3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "matters-web", - "version": "3.33.0", + "version": "3.34.0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 5366c19b1a..651eaa067a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "matters-web", - "version": "3.33.0", + "version": "3.34.0", "description": "codebase of Matters' website", "sideEffects": false, "author": "Matters ", diff --git a/public/static/icons/16px/traveloggers.svg b/public/static/icons/16px/traveloggers.svg new file mode 100644 index 0000000000..8ebb18a901 --- /dev/null +++ b/public/static/icons/16px/traveloggers.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/components/Icon/IconTraveloggers16.tsx b/src/components/Icon/IconTraveloggers16.tsx new file mode 100644 index 0000000000..fc2120caf3 --- /dev/null +++ b/src/components/Icon/IconTraveloggers16.tsx @@ -0,0 +1,5 @@ +import { ReactComponent as Icon } from '@/public/static/icons/16px/traveloggers.svg' + +import { withIcon } from './withIcon' + +export const IconTraveloggers16 = withIcon(Icon) diff --git a/src/components/Icon/index.tsx b/src/components/Icon/index.tsx index 0b14a75fd8..6ac9476d80 100644 --- a/src/components/Icon/index.tsx +++ b/src/components/Icon/index.tsx @@ -105,6 +105,7 @@ export * from './IconSort16' export * from './IconSpinner16' export * from './IconSuperLike' export * from './IconSupport' +export * from './IconTraveloggers16' export * from './IconUnChecked' export * from './IconUnfollow24' export * from './IconUnlock24' diff --git a/src/components/Notice/CryptoNotice/CryptoWalletConnectedNotice.tsx b/src/components/Notice/CryptoNotice/CryptoWalletConnectedNotice.tsx index fa85d70e90..6477d54d16 100644 --- a/src/components/Notice/CryptoNotice/CryptoWalletConnectedNotice.tsx +++ b/src/components/Notice/CryptoNotice/CryptoWalletConnectedNotice.tsx @@ -18,9 +18,9 @@ const CryptoWalletConnectedNotice = ({ notice }: { notice: NoticeType }) => {

{notice.target.address}

diff --git a/src/components/UserProfile/Badges/index.tsx b/src/components/UserProfile/Badges/index.tsx index f9fd97d5c3..5b5202ee87 100644 --- a/src/components/UserProfile/Badges/index.tsx +++ b/src/components/UserProfile/Badges/index.tsx @@ -5,6 +5,7 @@ import { EXTERNAL_LINKS } from '~/common/enums' import { ReactComponent as IconArchitectBadge } from '@/public/static/icons/16px/badge-architect.svg' import { ReactComponent as IconGoldenMotorBadge } from '@/public/static/icons/16px/badge-golden-motor.svg' import { ReactComponent as IconSeedBadge } from '@/public/static/icons/16px/badge-seed.svg' +import { ReactComponent as IconTraveloggersBadge } from '@/public/static/icons/16px/traveloggers.svg' import { ReactComponent as IconCivicLikerBadge } from '@/public/static/icons/badge-civic-liker.svg' import styles from './styles.css' @@ -61,3 +62,20 @@ export const CivicLikerBadge = () => ( ))({})} ) + +export const TraveloggersBadge = () => ( + + } + > + + {withIcon(IconTraveloggersBadge)({})} + + + +) diff --git a/src/components/UserProfile/DropdownActions/EditProfileDialog/gql.ts b/src/components/UserProfile/DropdownActions/EditProfileDialog/gql.ts index 48af243688..1763078a97 100644 --- a/src/components/UserProfile/DropdownActions/EditProfileDialog/gql.ts +++ b/src/components/UserProfile/DropdownActions/EditProfileDialog/gql.ts @@ -1,21 +1,49 @@ import gql from 'graphql-tag' export const fragments = { - user: gql` - fragment EditProfileDialogUserPublic on User { - id - avatar - displayName - info { - profileCover - description - badges { - type + user: { + public: gql` + fragment EditProfileDialogUserPublic on User { + id + avatar + displayName + info { + profileCover + description + badges { + type + } + } + liker { + civicLiker } } - liker { - civicLiker + `, + private: gql` + fragment EditProfileDialogUserPrivate on User { + id + avatar + displayName + info { + profileCover + description + badges { + type + } + cryptoWallet { + id + address + nfts { + id + name + description + } + } + } + liker { + civicLiker + } } - } - `, + `, + }, } diff --git a/src/components/UserProfile/DropdownActions/index.tsx b/src/components/UserProfile/DropdownActions/index.tsx index 4814c12794..cd48147377 100644 --- a/src/components/UserProfile/DropdownActions/index.tsx +++ b/src/components/UserProfile/DropdownActions/index.tsx @@ -48,14 +48,16 @@ const fragments = { ...EditProfileDialogUserPublic } ${BlockUser.fragments.user.public} - ${EditProfileDialog.fragments.user} + ${EditProfileDialog.fragments.user.public} `, private: gql` fragment DropdownActionsUserPrivate on User { id ...BlockUserPrivate + ...EditProfileDialogUserPrivate } ${BlockUser.fragments.user.private} + ${EditProfileDialog.fragments.user.private} `, }, } diff --git a/src/components/UserProfile/index.tsx b/src/components/UserProfile/index.tsx index ba80441706..8e82689d86 100644 --- a/src/components/UserProfile/index.tsx +++ b/src/components/UserProfile/index.tsx @@ -25,6 +25,7 @@ import { CivicLikerBadge, GoldenMotorBadge, SeedBadge, + TraveloggersBadge, } from './Badges' import CircleWidget from './CircleWidget' import DropdownActions from './DropdownActions' @@ -33,6 +34,7 @@ import { FollowingDialog } from './FollowingDialog' import { USER_PROFILE_PRIVATE, USER_PROFILE_PUBLIC } from './gql' import styles from './styles.css' +import { UserProfileUserPrivate_user_info_cryptoWallet_nfts } from './__generated__/UserProfileUserPrivate' import { UserProfileUserPublic } from './__generated__/UserProfileUserPublic' export const UserProfile = () => { @@ -126,6 +128,13 @@ export const UserProfile = () => { const hasSeedBadge = badges.some((b) => b.type === 'seed') const hasArchitectBadge = badges.some((b) => b.type === 'architect') const hasGoldenMotorBadge = badges.some((b) => b.type === 'golden_motor') + const hasTraveloggersBadge = + Array.isArray(user.info.cryptoWallet?.nfts) && + ( + user?.info.cryptoWallet + ?.nfts as UserProfileUserPrivate_user_info_cryptoWallet_nfts[] + ).length > 0 + const profileCover = user.info.profileCover || '' const userState = user.status?.state as string const isCivicLiker = user.liker.civicLiker @@ -186,6 +195,7 @@ export const UserProfile = () => {

{user.displayName}

+ {hasTraveloggersBadge && } {hasSeedBadge && } {hasGoldenMotorBadge && } {hasArchitectBadge && }