Skip to content

Commit

Permalink
Merge branch 'main' into issue-11219
Browse files Browse the repository at this point in the history
# Conflicts:
#	components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemTrade.vue
  • Loading branch information
hassnian committed Dec 17, 2024
2 parents 340cfe5 + 8f84816 commit efdf580
Show file tree
Hide file tree
Showing 53 changed files with 1,357 additions and 563 deletions.
2 changes: 1 addition & 1 deletion components/collection/unlockable/utils.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { createMetadata } from '@kodadot1/minimark/utils'
import { createOpenSeaMetadata as createMetadata } from '@kodadot1/hyperdata'

export const UNLOCKABLE_CAMPAIGN = 'bbw2023'
export const UNLOCKABLE_NAME = 'Berlin (Blockchain) Waifus'
Expand Down
8 changes: 5 additions & 3 deletions components/common/ChainDropdown.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,15 @@
<template #trigger="{ active }">
<NeoButton
class="chain-dropdown-text"
:variant
:variant="variant"
:label="
isMobile || !showNetworkLabel
isMobileDevice || !showNetworkLabel
? label || selected?.text
: `Network: ${selected?.text}`
"
:icon="active ? 'chevron-up' : 'chevron-down'"
:active="active"
:no-shadow="noShadow"
/>
</template>

Expand All @@ -30,6 +31,7 @@
<script setup lang="ts">
import { NeoButton, NeoDropdown, NeoDropdownItem, type NeoButtonVariant } from '@kodadot1/brick'
import { type Prefix } from '@kodadot1/static'
import { isMobileDevice } from '@/utils/extension'
const props = withDefaults(
defineProps<{
Expand All @@ -38,6 +40,7 @@ const props = withDefaults(
redirect?: boolean
exclude?: Prefix[]
variant?: NeoButtonVariant
noShadow?: boolean
label?: string
filterByVm?: boolean
}>(),
Expand All @@ -55,7 +58,6 @@ const route = useReactiveRoute()
const { setUrlPrefix, urlPrefix } = usePrefix()
const { availableChains: allChains, availableChainsByVm: allChainInVm } = useChain()
const { redirectAfterChainChange } = useChainRedirect()
const { isMobile } = useViewport()
const prefix = computed(() => route.params.prefix || urlPrefix.value)
Expand Down
3 changes: 2 additions & 1 deletion components/common/EditNftModal.vue
Original file line number Diff line number Diff line change
Expand Up @@ -82,10 +82,11 @@

<script setup lang="ts">
import { NeoButton, NeoField, NeoInput, NeoModal } from '@kodadot1/brick'
import type { Metadata, Attribute } from '@kodadot1/minimark/common'
import type { OpenSeaAttribute as Attribute } from '@kodadot1/hyperdata'
import type { ActionMetadataSetMetadata } from '@/composables/transaction/types'
import ModalBody from '@/components/shared/modals/ModalBody.vue'
import CustomAttributeInput from '@/components/rmrk/Create/CustomAttributeInput.vue'
import type { Metadata } from '@/services/nftStorage'
const emit = defineEmits(['submit'])
const props = defineProps<{
Expand Down
2 changes: 1 addition & 1 deletion components/common/Notification.vue
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ const props = withDefaults(
action?: MaybeRef<NotificationAction | undefined>
holdTimer?: Ref<boolean>
icon?: Ref<NeoMessageIconVariant | undefined>
footer?: Ref<Omit<NotificationAction, 'url'> | undefined>
footer?: NotificationFooter
}>(),
{
variant: 'success',
Expand Down
10 changes: 5 additions & 5 deletions components/gallery/GalleryItemAction/GalleryItemAction.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@
v-if="!isOwner && nft"
:nft="nft"
/>
<!-- make offer -->
<GalleryItemOffer
v-if="offerVisible(urlPrefix) && nft"
<!-- make offer and swap -->
<GalleryItemTrade
v-if="tradeVisible(urlPrefix) && nft"
:hide-action-button="isOwner"
:nft="nft"
:highest-offer="highestOffer"
Expand All @@ -25,9 +25,9 @@

<script lang="ts" setup>
import GalleryItemPriceBuy from './GalleryItemActionType/GalleryItemBuy.vue'
import GalleryItemOffer from './GalleryItemActionType/GalleryItemOffer.vue'
import GalleryItemTrade from './GalleryItemActionType/GalleryItemTrade.vue'
import GalleryItemPriceRelist from './GalleryItemActionType/GalleryItemRelist.vue'
import { listVisible, offerVisible } from '@/utils/config/permission.config'
import { listVisible, tradeVisible } from '@/utils/config/permission.config'
import type { NFTOffer } from '@/composables/useNft'
import type { NFT } from '@/types'
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -123,10 +123,10 @@ const onClickShoppingCart = () => {
}
.square-button-width {
width: 55px;
width: 6.25rem;
}
.buy-button-width {
width: 10rem;
width: 8.375rem;
@include until-widescreen {
width: 100%;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,22 +4,36 @@
:price="highestOfferPrice"
class="mt-4"
>
<div class="flex justify-end gallery-item-offer">
<div
v-if="!hideActionButton"
class="flex justify-end gallery-item-trade"
>
<NeoButton
v-if="!hideActionButton"
:label="$t('transaction.offer')"
variant="k-blue"
size="large"
class="w-[calc(10rem+55px)]"
class="w-[8.375rem] !h-[55px]"
@click="onMakeOfferClick"
/>
<NeoButton
size="large"
class="!w-[6.25rem] !h-[55px]"
@click="onSwapClick"
>
<div class="flex gap-2">
<NeoIcon
icon="arrow-right-arrow-left"
/>
<span> {{ $t('swap.swap') }}</span>
</div>
</NeoButton>
<TradeMakeOfferModal />
</div>
</GalleryItemPriceSection>
</template>

<script setup lang="ts">
import { NeoButton } from '@kodadot1/brick'
import { NeoButton, NeoIcon } from '@kodadot1/brick'
import type { NFT } from '@/types'
import { nftToOfferItem } from '@/components/common/shoppingCart/utils'
import { usePreferencesStore } from '@/stores/preferences'
Expand All @@ -35,6 +49,7 @@ const props = defineProps<{
}>()
const preferencesStore = usePreferencesStore()
const makeOfferStore = useMakingOfferStore()
const swapStore = useAtomicSwapStore()
const { doAfterLogin } = useDoAfterlogin()
const { isCurrentAccount, isLogIn } = useAuth()
const isOwner = computed(() => isCurrentAccount(props.nft?.currentOwner))
Expand All @@ -49,21 +64,51 @@ const openOfferModal = () => {
preferencesStore.setMakeOfferModalOpen(true)
}
const onMakeOfferClick = () => {
const cb = () => {
const onTradeActionClick = (cb: () => void) => {
const fn = () => {
if (!isOwner.value) {
openOfferModal()
cb()
}
}
if (isLogIn.value) {
doAfterCheckCurrentChainVM(cb)
doAfterCheckCurrentChainVM(fn)
}
else {
doAfterLogin({ onLoginSuccess: cb })
doAfterLogin({ onLoginSuccess: fn })
}
}
const onMakeOfferClick = () => {
onTradeActionClick(openOfferModal)
}
const onSwapClick = () => {
onTradeActionClick(() => {
const nft = props.nft
const swap = swapStore.createSwap(nft.currentOwner)
swapStore.updateItem({
...swap,
desired: [
{
id: nft.id,
collectionId: nft.collection.id,
sn: nft.sn,
name: nft.name,
meta: nft.meta,
},
],
})
navigateTo({
name: 'prefix-swap-id',
params: { id: nft.currentOwner },
query: { swapId: swap.id },
})
})
}
useModalIsOpenTracker({
isOpen: computed(() => preferencesStore.makeOfferModalOpen),
onChange: () => makeOfferStore.clear(),
Expand All @@ -73,15 +118,15 @@ useModalIsOpenTracker({
<style lang="scss" scoped>
@import '@/assets/styles/abstracts/variables';
.gallery-item-offer {
.gallery-item-trade {
button {
font-size: 1rem;
height: 3.375rem;
}
}
@include until-widescreen {
.gallery-item-offer {
.gallery-item-trade {
width: 100%;
margin-top: 1rem !important;
button {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,11 +23,11 @@

<script setup lang="ts">
import { NeoDropdownItem } from '@kodadot1/brick'
import type { Metadata } from '@kodadot1/minimark/common'
import { useQuery } from '@tanstack/vue-query'
import { refreshOdaTokenMetadata } from '@/services/oda'
import { type ActionMetadataSetMetadata, NFTs } from '@/composables/transaction/types'
import type { NFT } from '@/types'
import type { Metadata } from '@/services/nftStorage'
const props = defineProps<{
nft?: NFT
Expand Down
2 changes: 2 additions & 0 deletions components/items/ItemsGrid/ItemsGrid.vue
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,8 @@
/>
</div>

<slot name="additional-item" />

<!-- skeleton on fetching next page -->
<template v-if="isLoading || isFetchingData">
<NftCardSkeleton
Expand Down
29 changes: 8 additions & 21 deletions components/items/ItemsGrid/ItemsGridImage.vue
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,7 @@
:show-timestamp="showTimestamp"
:collection-popover-hide="collectionPopoverHide"
:lazy-loading="lazyLoading"
:class="{
'in-cart-border':
shoppingCartStore.isItemInCart(nft.id)
|| listingCartStore.isItemInCart(nft.id)
|| isAtomicSwapItemSelected
,
}"
:class="{ 'in-cart-border': shoppingCartStore.isItemInCart(nft.id) || isSelectActionItemInCart }"
:show-action-on-hover="!showActionSection"
:link="NuxtLink"
bind-key="to"
Expand Down Expand Up @@ -58,15 +52,15 @@
</NeoButton>
</div>
<div
v-else-if="showSelect"
v-else-if="showSelectAction"
class="flex"
>
<NeoButton
:label="selectLabel"
:label="selectActionLabel"
data-testid="item-buy"
no-shadow
class="flex-grow"
@click.prevent="onSelect"
@click.prevent="onSelectAction"
/>
</div>
</template>
Expand Down Expand Up @@ -165,20 +159,13 @@ const onClickShoppingCart = () => {
const onClickListingCart = () => listNftByNftWithMetadata(props.nft, { toggle: true })
const selectLabel = computed(() => {
const selected = showAtomicSwapAction.value ? isAtomicSwapItemSelected.value : listingCartStore.isItemInCart(props.nft.id)
return selected ? $i18n.t('remove') : $i18n.t('select')
})
const isSelectActionItemInCart = computed(() => isAtomicSwapItemSelected.value || listingCartStore.isItemInCart(props.nft.id))
const showSelect = computed(() => {
if (showAtomicSwapAction.value) {
return true
}
const selectActionLabel = computed(() => isSelectActionItemInCart.value ? $i18n.t('remove') : $i18n.t('select'))
return isOwner.value && !props.hideListing
})
const showSelectAction = computed(() => showAtomicSwapAction.value || (isOwner.value && !props.hideListing))
const onSelect = () => {
const onSelectAction = () => {
if (showAtomicSwapAction.value) {
onAtomicSwapSelect()
}
Expand Down
8 changes: 4 additions & 4 deletions components/items/ItemsGrid/useAtomicSwapAction.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,12 @@ export default (nft: NFTWithMetadata) => {

const routeName = computed(() => route.name?.toString() as string)

const showAtomicSwapAction = computed(() => ATOMIC_SWAP_PAGES.includes(routeName.value))
const showAtomicSwapAction = computed(() => ATOMIC_SWAP_PAGES.includes(routeName.value) && step.value !== SwapStep.REVIEW)

const isItemSelected = computed(() => {
return step.value === SwapStep.REVIEW
? false
: [...swap.value.desired, ...swap.value.offered].flat().some(item => item.id === nft.id)
return showAtomicSwapAction.value
? [...swap.value.desired, ...swap.value.offered].flat().some(item => item.id === nft.id)
: false
})

const onAtomicSwapSelect = () => {
Expand Down
4 changes: 3 additions & 1 deletion components/profile/CollectionFilter.vue
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<NeoButton
:active="active"
no-shadow
rounded
:variant="variant"
label="Collections"
:icon="active ? 'chevron-up' : 'chevron-down'"
/>
Expand Down Expand Up @@ -66,6 +66,7 @@ import {
NeoCheckbox,
NeoDropdown,
NeoDropdownItem,
type NeoButtonVariant,
} from '@kodadot1/brick'
import isEqual from 'lodash/isEqual'
import ActiveCount from '../explore/ActiveCount.vue'
Expand All @@ -81,6 +82,7 @@ const props = defineProps<{
id: string
modelValue: string[]
search: Record<string, string | number>
variant: NeoButtonVariant
}>()
const isLoading = ref(false)
Expand Down
4 changes: 3 additions & 1 deletion components/profile/ProfileDetail.vue
Original file line number Diff line number Diff line change
Expand Up @@ -594,7 +594,9 @@ const tabs = computed(() => {
tabs.push(ProfileTab.OFFERS)
}
tabs.push(ProfileTab.SWAPS)
if (swapVisible(urlPrefix.value)) {
tabs.push(ProfileTab.SWAPS)
}
return tabs
})
Expand Down
2 changes: 1 addition & 1 deletion components/rmrk/Create/CustomAttributeInput.vue
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
</template>

<script lang="ts" setup>
import type { Attribute } from '@kodadot1/minimark/common'
import type { OpenSeaAttribute as Attribute } from '@kodadot1/hyperdata'
import { NeoButton } from '@kodadot1/brick'
import AttributeInput from './AttributeInput.vue'
Expand Down
1 change: 0 additions & 1 deletion components/shared/AudioMedia.vue
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@
</template>

<script lang="ts" setup>
import { ref, watch, withDefaults } from 'vue'
import { useElementHover, watchDebounced } from '@vueuse/core'
import { NeoImageMedia } from '@kodadot1/brick'
Expand Down
2 changes: 1 addition & 1 deletion components/shared/gallery/Properties.vue
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
</template>

<script lang="ts" setup>
import type { Attribute } from '@kodadot1/minimark/common'
import type { OpenSeaAttribute as Attribute } from '@kodadot1/hyperdata'
import { emptyArray } from '~/utils/empty'
import CollapseCardWrapper from '@/components/shared/collapse/CollapseCardWrapper.vue'
Expand Down
Loading

0 comments on commit efdf580

Please sign in to comment.