Skip to content

Commit

Permalink
fix(marketplace): Byebye auction
Browse files Browse the repository at this point in the history
  • Loading branch information
@jschill
jschill committed Mar 3, 2024
1 parent b8bf272 commit da01ce1
Show file tree
Hide file tree
Showing 3 changed files with 41 additions and 41 deletions.
32 changes: 16 additions & 16 deletions frontend/marketplace/src/pages/CreditCollectionPage.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { onMounted, ref } from "vue";
import { GET_MARKETPLACE_LISTING } from "@/graphql/queries";
import { formatListingDetails } from "@/utils/formatListingDetails";
interface AuctionDetails {
interface ListingDetails {
applicant: string;
location: string[];
material: MaterialProperty[][];
Expand All @@ -34,7 +34,7 @@ const router = useRoute();
const data = ref();
const showSpinner = ref(true);
const auctionDetails = ref<AuctionDetails>({
const listingDetails = ref<ListingDetails>({
applicant: "",
location: [""],
material: [],
Expand All @@ -46,7 +46,7 @@ const auctionDetails = ref<AuctionDetails>({
plasticType: "",
});
const getAuctionDetails = (id: string | string[]) => {
const getListingDetails = (id: string | string[]) => {
try {
const { result, loading, error, onResult } = useQuery(
GET_MARKETPLACE_LISTING,
Expand All @@ -62,7 +62,7 @@ const getAuctionDetails = (id: string | string[]) => {
loading,
error,
};
auctionDetails.value = formatListingDetails(
listingDetails.value = formatListingDetails(
result.value.marketplaceListings?.nodes[0].creditCollection.creditData
.nodes,
parseInt(
Expand All @@ -78,12 +78,12 @@ const getAuctionDetails = (id: string | string[]) => {
});
showSpinner.value = false;
} catch (error) {
console.log("Error in getAuctionDetails", error);
console.log("Error in getListingDetails", error);
}
};
onMounted(() => {
getAuctionDetails(router.params.denom);
getListingDetails(router.params.denom);
});
</script>
<template>
Expand All @@ -98,15 +98,15 @@ onMounted(() => {
data?.result?.marketplaceListings?.nodes[0].creditCollection?.creditData
?.nodes[0].applicantDataByCreditDataId.nodes[0].name
}}
- {{ auctionDetails.plasticType }}
- {{ listingDetails.plasticType }}
</h1>

<!-- Gallery-->
<ImageCarousel
class="md:hidden my-5"
:image-array="auctionDetails?.image"
:image-array="listingDetails?.image"
/>
<ImageGallery class="hidden md:flex" :image-array="auctionDetails?.image" />
<ImageGallery class="hidden md:flex" :image-array="listingDetails?.image" />

<!-- Project Details-->
<div class="flex flex-col md:flex-row w-full mt-5 justify-between">
Expand All @@ -122,33 +122,33 @@ onMounted(() => {
/>
<ProjectDetailMaterial
label="Material"
:materials="auctionDetails?.material"
:materials="listingDetails?.material"
/>
<ProjectDetailContent label="Kgs per credit" value="1" />
<ProjectDetailContent
label="Registration date"
:value="auctionDetails?.registrationDate"
:value="listingDetails?.registrationDate"
/>
<ProjectDetailContent
label="Location"
:value="auctionDetails?.location"
:value="listingDetails?.location"
list
/>
<ProjectDetailContent
label="Collection organisation"
:value="auctionDetails?.applicant"
:value="listingDetails?.applicant"
/>
<ProjectDetailContent
label="Volume"
:value="auctionDetails?.volume + 'kg'"
:value="listingDetails?.volume + 'kg'"
/>
</div>

<!-- Map Section-->
<div
class="mt-5 md:mt-0 md:w-[60%] md:ml-5 h-[330px] md:h-auto rounded-lg relative"
>
<CustomGoogleMap :locations="auctionDetails?.locationPointers" />
<CustomGoogleMap :locations="listingDetails?.locationPointers" />
</div>
</div>

Expand All @@ -172,7 +172,7 @@ onMounted(() => {
<ul class="pl-5">
<li
class="text-title14 text-greenPrimary underline truncate"
v-for="file in auctionDetails?.file"
v-for="file in listingDetails?.file"
:key="file.name"
>
<a target="_blank" :href="file.url">{{ file.name }}</a>
Expand Down
28 changes: 14 additions & 14 deletions frontend/marketplace/src/pages/ListingPage.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ import { useQuery } from "@vue/apollo-composable";
import { ref, watch, computed } from "vue";
import { GET_MARKETPLACE_LISTING } from "@/graphql/queries";
interface AuctionDetails {
interface ListingDetails {
applicant: string;
location: string[];
material: MaterialProperty[][];
Expand All @@ -43,7 +43,7 @@ const data = ref();
const showSpinner = ref(true);
const denom = ref("");
const owner = ref("");
const auctionDetails = ref<AuctionDetails>({
const listingDetails = ref<ListingDetails>({
applicant: "",
location: [""],
material: [],
Expand Down Expand Up @@ -112,7 +112,7 @@ const getDetailsList = (data: any, materialVolume: number) => {
};
};
const getAuctionDetails = (id: string | string[]) => {
const getListingDetails = (id: string | string[]) => {
const { result, loading, error, onResult } = useQuery(
GET_MARKETPLACE_LISTING,
{
Expand All @@ -130,7 +130,7 @@ const getAuctionDetails = (id: string | string[]) => {
};
onResult(({ data }) => {
auctionDetails.value = getDetailsList(
listingDetails.value = getDetailsList(
data.marketplaceListings?.nodes[0].creditCollection.creditData.nodes,
parseInt(
data.marketplaceListings?.nodes[0].creditCollection.activeAmount,
Expand All @@ -150,7 +150,7 @@ const getAuctionDetails = (id: string | string[]) => {
const handlePageLoadAndCollectionIdChange = (newId: string, oldId?: string) => {
if (newId && newId !== oldId) {
getAuctionDetails(newId);
getListingDetails(newId);
}
};
Expand All @@ -176,9 +176,9 @@ watch(currentId, handlePageLoadAndCollectionIdChange, { immediate: true });
<!-- Gallery-->
<ImageCarousel
class="md:hidden my-5"
:image-array="auctionDetails?.image"
:image-array="listingDetails?.image"
/>
<ImageGallery class="hidden md:flex" :image-array="auctionDetails?.image" />
<ImageGallery class="hidden md:flex" :image-array="listingDetails?.image" />

<!-- Buy Credits-->
<BuyCredits
Expand Down Expand Up @@ -209,33 +209,33 @@ watch(currentId, handlePageLoadAndCollectionIdChange, { immediate: true });
/>
<ProjectDetailMaterial
label="Material"
:materials="auctionDetails?.material"
:materials="listingDetails?.material"
/>
<ProjectDetailContent label="Kgs per credit" value="1" />
<ProjectDetailContent
label="Registration date"
:value="auctionDetails?.registrationDate"
:value="listingDetails?.registrationDate"
/>
<ProjectDetailContent
label="Location"
:value="auctionDetails?.location"
:value="listingDetails?.location"
list
/>
<ProjectDetailContent
label="Collection organisation"
:value="auctionDetails?.applicant"
:value="listingDetails?.applicant"
/>
<ProjectDetailContent
label="Volume"
:value="auctionDetails?.volume + 'kg'"
:value="listingDetails?.volume + 'kg'"
/>
</div>

<!-- Map Section-->
<div
class="mt-5 md:mt-0 md:w-[60%] md:ml-5 h-[330px] md:h-auto rounded-lg relative"
>
<CustomGoogleMap :locations="auctionDetails?.locationPointers" />
<CustomGoogleMap :locations="listingDetails?.locationPointers" />
</div>
</div>

Expand All @@ -259,7 +259,7 @@ watch(currentId, handlePageLoadAndCollectionIdChange, { immediate: true });
<ul class="pl-5">
<li
class="text-title14 text-greenPrimary underline"
v-for="file in auctionDetails?.file"
v-for="file in listingDetails?.file"
:key="file.name"
>
<a target="_blank" :href="file.url">{{ file.name }}</a>
Expand Down
22 changes: 11 additions & 11 deletions frontend/marketplace/src/pages/PaymentSuccessfulPage.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ interface AuctionStatusResponse {
id: string;
}
const auctionStatus = ref<PaymentStatus | undefined>(undefined);
const paymentStatus = ref<PaymentStatus | undefined>(undefined);
const isCheckingStatus = ref(false);
const route = useRoute();
Expand All @@ -34,7 +34,7 @@ const handleFetchResponse = async (response: Response | null) => {
try {
const body = (await response.json()) as AuctionStatusResponse;
auctionStatus.value = body.status;
paymentStatus.value = body.status;
if (body.status === PaymentStatus.COMPLETE) {
return false;
}
Expand All @@ -45,7 +45,7 @@ const handleFetchResponse = async (response: Response | null) => {
return true;
};
const checkAuctionStatus = async () => {
const checkPaymentStatus = async () => {
const { getAccessToken } = useAuth();
const accessToken = await getAccessToken(PC_BACKEND_ENDPOINT);
const paymentId = route.query.paymentId as string;
Expand All @@ -65,14 +65,14 @@ const checkAuctionStatus = async () => {
);
} catch (e) {
console.log("e", e);
auctionStatus.value = PaymentStatus.ERROR;
paymentStatus.value = PaymentStatus.ERROR;
} finally {
isCheckingStatus.value = false;
}
};
onMounted(async () => {
await checkAuctionStatus();
await checkPaymentStatus();
});
</script>

Expand All @@ -85,13 +85,13 @@ onMounted(async () => {
Processing...
</h1>
<h1
v-if="auctionStatus === PaymentStatus.COMPLETE"
v-if="paymentStatus === PaymentStatus.COMPLETE"
class="text-white text-title38 md:mt-10 mb-10 text-center"
>
Payment confirmation
</h1>
<h1
v-else-if="auctionStatus === PaymentStatus.ERROR"
v-else-if="paymentStatus === PaymentStatus.ERROR"
class="text-white text-title38 md:mt-10 mb-10 text-center"
>
Transaction error
Expand All @@ -104,7 +104,7 @@ onMounted(async () => {
</h1>
<div class="pointer-events-none">
<Vue3Lottie
v-if="auctionStatus === PaymentStatus.COMPLETE"
v-if="paymentStatus === PaymentStatus.COMPLETE"
class="absolute top-0"
:animation-data="FireworksAnimation"
:loop="false"
Expand All @@ -125,14 +125,14 @@ onMounted(async () => {
class="bg-white/10 rounded-lg md:rounded-sm p-4 max-w-xl text-center"
>
<span
v-if="auctionStatus === PaymentStatus.COMPLETE"
v-if="paymentStatus === PaymentStatus.COMPLETE"
class="font-Inter text-white text-title18"
>
Your plastic credit purchase was successful and a Plastic Credit
Offset Certificate has been generated for you.
</span>
<span
v-else-if="auctionStatus === PaymentStatus.ERROR"
v-else-if="paymentStatus === PaymentStatus.ERROR"
class="font-Inter text-white text-title18"
>
Transaction couldn't be completed. You will receive a refund
Expand All @@ -148,7 +148,7 @@ onMounted(async () => {
of your transaction.
</span>
<a
v-if="auctionStatus === PaymentStatus.COMPLETE"
v-if="paymentStatus === PaymentStatus.COMPLETE"
class="mt-5 text-white btn btn-ghost btn-block normal-case bg-greenPrimary hover:bg-greenDark text-title24 lg:text-title32 lg:btn-lg p-0 px-12 font-normal md:max-w-lg"
href="/certificate"
>See your certificates</a
Expand Down

0 comments on commit da01ce1

Please sign in to comment.