Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Application wide UI changes and partial integration of smart contract calls #17

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
completion of delete listing logic and check to disabled non unique l…
…isting flow
  • Loading branch information
Phoenix authored and Phoenix committed Sep 6, 2022
commit e1788dd17ea36f5442b1101336060dbe476b42b3
6 changes: 3 additions & 3 deletions frontend/src/client/components/ExploreRentals.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import { mergeNftsWithMetadata } from "../lib/fetchNft";
import { useAccount } from "wagmi";
import upArrow from "../../../static/up-arrow.svg";
import downArrow from "../../../static/down-arrow.svg";
import upArrow from "../../../static/upArrow.svg";
import downArrow from "../../../static/downArrow.svg";
import PaginatedNFTs from "../components/PaginatedNFTsPanel";

export const ExploreRentals = () => {
Expand Down Expand Up @@ -191,7 +191,7 @@ export const ExploreRentals = () => {
<PaginatedNFTs
queryTable={"Listing"}
accountAddress={accountData?.address}
limitPerPage={8}
limitPerPage={9}
limitPerRow="grid-cols-3 grid gap-4 w-full"
/>
</div>
Expand Down
8 changes: 4 additions & 4 deletions frontend/src/client/components/ListingPanel.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import React, { useState } from "react";
import { NftWithMetadata, Avaliability, AvaliabilityStatus } from "../../../types/nftTypes.js";
import upArrow from "../../../static/up-arrow.svg";
import downArrow from "../../../static/down-arrow.svg";
import upArrow from "../../../static/upArrow.svg";
import downArrow from "../../../static/downArrow.svg";

export const ListingPanel = ({
nft,
pureNft = false,
desc = true,
}: {
nft: NftWithMetadata;
nft: NftWithMetadata | null;
pureNft?: boolean;
desc?: boolean;
}) => {
Expand Down Expand Up @@ -51,7 +51,7 @@ export const ListingPanel = ({
{desc && (
<div className="border border-gray-200 rounded-lg shadow-md mt-2">
<div className="font-bold text-slate-800 text-xl py-3 px-6 border-b border-gray-200">Description</div>
<div className="bg-gray-50 w-full flex items-center px-6 py-4">
<div className="bg-gray-50 w-full rounded-b-lg flex items-center px-6 py-4">
<h1 className="text-lg font-semibold">{nft.name}</h1>
<div className="flex-grow pl-1"></div>
{!pureNft && <p>ETH({nft.nft.listing.pricePerDay}) / day</p>}
Expand Down
7 changes: 6 additions & 1 deletion frontend/src/client/components/PaginatedNFTsPanel.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,12 @@ const PaginatedNFTs = ({
if (typeof queryObj.queryKey !== "undefined" && typeof queryObj.queryValue !== "undefined") {
query.equalTo(queryObj.queryKey, queryObj.queryValue);
}
query.limit(queryObj.limitPerPage).skip(queryObj.limitPerPage * queryObj.skipPage);
if (typeof queryObj.limitPerPage !== "undefined") {
query.limit(queryObj.limitPerPage);
}
if (typeof queryObj.limitPerPage !== "undefined" && typeof queryObj.skipPage !== "undefined") {
query.skip(queryObj.limitPerPage * queryObj.skipPage);
}
await query.find().then(nftListingsData => {
// setNftListingsData(nftListingsData);
const nftListings: Nft[] = nftListingsData.map(nft => {
Expand Down
78 changes: 43 additions & 35 deletions frontend/src/client/components/RentDetails.tsx
Original file line number Diff line number Diff line change
@@ -1,53 +1,61 @@
import React, { useEffect, useState } from "react";
import { NftWithMetadata } from "../../../types/nftTypes.js";
import DatePicker from "react-datepicker";
import { ListingPanel } from "../components/ListingPanel";
import { Query } from "../../../types/queryTypes.js";
import { useMoralis } from "react-moralis";
import { NftWithMetadata, Nft } from "../../../types/nftTypes.js";

function checkOwner(accountAddress: string, owner: string): boolean {
function checkOwner(accountAddress: string, owner?: string): boolean {
return accountAddress !== owner;
}

async function cancelListing(nft: NftWithMetadata) {
export const RentDetails = ({ nft, accountAddress }: { nft: NftWithMetadata; accountAddress?: string }) => {
const [dateRange, setDateRange] = useState<[Date, Date]>([new Date(), new Date()]);
const [startDate, endDate] = dateRange;
const { Moralis } = useMoralis();

const queryObj: Query = {
table: "Listing",
queryKey: "objectId",
queryValue: nft.nft.objectId,
limitPerPage: undefined,
skipPage: undefined,
};
async function cancelListing(nft: NftWithMetadata) {

try {
const query = new Moralis.Query(queryObj.table);
if (typeof queryObj.queryKey !== "undefined" && typeof queryObj.queryValue !== "undefined") {
query.equalTo(queryObj.queryKey, queryObj.queryValue);
const queryObj: Query = {
table: "Listing",
queryKey: undefined,
queryValue: undefined,
limitPerPage: undefined,
skipPage: undefined,
};

try {
const query = new Moralis.Query(queryObj.table);
if (typeof queryObj.queryKey !== "undefined" && typeof queryObj.queryValue !== "undefined") {
query.equalTo(queryObj.queryKey, queryObj.queryValue);
}
if (typeof queryObj.limitPerPage !== "undefined" && typeof queryObj.skipPage !== "undefined") {
query.limit(queryObj.limitPerPage).skip(queryObj.limitPerPage * queryObj.skipPage);
}
if(typeof(nft.nft.objectId) !== "undefined") {
await query.get(nft.nft.objectId).then(nft => {
if(typeof(nft) !== "undefined") {
nft.destroy().then(
() => {
console.log("Deleted Successfully!!");
},
(error) => {
console.log("Some Error Occurred!!");
}
)
// const nftListing: Nft = {
// listing: nft.attributes.listing,
// specification: nft.attributes.nftSpecification,
// objectId: nft.id,
// };
// console.log("NFT is: ", nftListing);
}
});
}
} catch (error) {
console.log(error);
}
if (typeof queryObj.limitPerPage !== "undefined" && typeof queryObj.skipPage !== "undefined") {
query.limit(queryObj.limitPerPage).skip(queryObj.limitPerPage * queryObj.skipPage);
}
await query.find().then(nftListingsData => {
// setNftListingsData(nftListingsData);
const nftListings: Nft[] = nftListingsData.map(nft => {
return {
listing: nft.attributes.listing,
specification: nft.attributes.nftSpecification,
objectId: nft.id,
};
});
console.log("NFt Data: ", nftListings);
});
} catch (error) {
console.log(error);
}
}

export const RentDetails = ({ nft, accountAddress }: { nft: NftWithMetadata; accountAddress?: string }) => {
const [dateRange, setDateRange] = useState<[Date, Date]>([new Date(), new Date()]);
const [startDate, endDate] = dateRange;

return (
<div className="flex flex-row space-x-4 w-content">
Expand Down
21 changes: 0 additions & 21 deletions frontend/src/client/lib/fetchFromMoralis.ts

This file was deleted.

3 changes: 2 additions & 1 deletion frontend/src/client/lib/fetchNft.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,8 @@ export const mergeNftsWithMetadata = async (nfts: Nft[]) => {
for (let i = 0; i < nfts.length; i++) {
const metadata = metadatas[i].metadata!;

console.log("MEtat data is: ", metadata);

let attributes: Attribute[] = [];
if (metadata.attributes) {
attributes = metadata.attributes.map(attribute => {
Expand All @@ -39,7 +41,6 @@ export const mergeNftsWithMetadata = async (nfts: Nft[]) => {
}

let image = metadata.image!;

if (image.startsWith("ipfs://")) {
image = mapIpfsToUrl(image);
}
Expand Down
39 changes: 30 additions & 9 deletions frontend/src/client/pages/List.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -41,16 +41,36 @@ const List = () => {
},
);

const submitListing = (nft: Nft) => {
const listing = Listing.create(nft);
listing.save().then(
(listing: any) => {
console.log("Save Successfull!!");
},
(e: any) => {
console.log(e);
const checkUniqueNft = (nft: Nft) => {
const query = new Moralis.Query(Listing);
query.equalTo("nftSpecification.collection", nft.specification.collection);
query.equalTo("nftSpecification.id", nft.specification.id);
query.count().then(
(count:number) => {
if(count > 0) {
console.log("Non Unique");
} else {
console.log("Unique");
console.log("Can Saveeee");
const listing = Listing.create(nft);
listing.save().then(
(listing: any) => {
console.log("Save Successfull!!");
},
(e: any) => {
console.log(e);
},
);
}
},
);
(error) => {
console.log("Error Occurred");
}
)
}

const submitListing = (nft: Nft) => {
checkUniqueNft(nft);
};

const { handleSubmit, handleChange, values, touched } = useFormik({
Expand Down Expand Up @@ -86,6 +106,7 @@ const List = () => {
const NftsWithMetadata = await mergeNftsWithMetadata([
{
listing: {
owner: accountData?.address,
description: values.description,
datesForRent: [],
pricePerDay: values.pricePerDay,
Expand Down
5 changes: 5 additions & 0 deletions frontend/src/global.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,3 +2,8 @@ declare module "*.png" {
const value: any;
export = value;
}

declare module "*.svg" {
const value: any;
export = value;
}
File renamed without changes
File renamed without changes
4 changes: 2 additions & 2 deletions frontend/types/nftTypes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export interface AvaliableDates {
}

export interface Listing {
owner: string;
owner?: string;
description: string;
datesForRent: AvaliableDates[];
pricePerDay: number;
Expand All @@ -31,7 +31,7 @@ export interface Nft {
contract?: RentContract;
listing: Listing;
specification: NftSpecification;
objectId: string;
objectId?: string;
}

export enum AvaliabilityStatus {
Expand Down