Dwinzo-Beta/Dwinzo_dev
4
0
Fork 3
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'realTimeVisulization' into rtViz

Browse Source
This commit is contained in:
Gomathi
2025-03-27 09:43:52 +05:30
parent 38ab556d17 558236c458
commit fea5c168d1
35 changed files with 15084 additions and 1211 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
app/src/modules/market/Card.tsx
View File

@@ -1,4 +1,3 @@
// Card.tsx
import React from "react";
import {
CommentsIcon,
@@ -9,51 +8,24 @@ import {
} from "../../components/icons/marketPlaceIcons";
import assetImage from "../../assets/image/image.png";
interface CardProps {
assetName: string;
uploadedOn: string;
price: number;
rating: number;
views: number;
onSelectCard: (cardData: {
assetName: string;
uploadedOn: string;
price: number;
rating: number;
views: number;
}) => void;
}
const Card: React.FC<CardProps> = ({
assetName,
uploadedOn,
price,
rating,
views,
onSelectCard,
}) => {
const handleCardSelect = () => {
onSelectCard({ assetName, uploadedOn, price, rating, views });
};
const Card: React.FC = () => {
return (
<div className="card-container">
<div className="icon">
<DownloadIcon />
</div>
<div className="image-container">
<img src={assetImage} alt={assetName} />
<img src={assetImage} alt="" />
</div>
<div className="assets-container">
<div className="name-container">
<div className="assets-name">{assetName}</div>
<div className="assets-date">{uploadedOn}</div>
<div className="asstes-container">Asset name</div>
<div className="assets-date">Uploaded on-12 Jan 23</div>
</div>
<div className="details">
<div className="content">
<EyeIconBig />
{views}
1.5k
</div>
<div className="content">
<CommentsIcon />
@@ -67,17 +39,17 @@ const Card: React.FC<CardProps> = ({
</div>
<div className="stars-container">
<div className="stars-wrapper">
{[...Array(5)].map((_, index) => (
<StarsIconSmall key={index} />
))}
<StarsIconSmall />
<StarsIconSmall />
<StarsIconSmall />
<StarsIconSmall />
<StarsIconSmall />
</div>
<div className="units">
₹ {price}/<span>unit</span>
₹ 36,500/<span>unit</span>
</div>
</div>
<div className="buy-now-button" onClick={handleCardSelect}>
Buy now
</div>
<div className="buy-now-button">Buy now</div>
</div>
);
};

142
app/src/modules/market/CardsContainer.tsx
View File

@@ -1,149 +1,15 @@
import React, { useState } from "react";
import React from "react";
import Card from "./Card";
import AssetPreview from "./AssetPreview";
import RenderOverlay from "../../components/templates/Overlay";
const CardsContainer: React.FC = () => {
const array = [
{
id: 1,
name: "Asset 1",
uploadedOn: "12 Jan 23",
price: 36500,
rating: 4.5,
views: 500,
},
{
id: 2,
name: "Asset 2",
uploadedOn: "14 Jan 23",
price: 45000,
rating: 4.0,
views: 500,
},
{
id: 3,
name: "Asset 3",
uploadedOn: "15 Jan 23",
price: 52000,
rating: 4.8,
views: 500,
},
{
id: 4,
name: "Asset 4",
uploadedOn: "18 Jan 23",
price: 37000,
rating: 3.9,
views: 500,
},
{
id: 5,
name: "Asset 5",
uploadedOn: "20 Jan 23",
price: 60000,
rating: 5.0,
views: 500,
},
{
id: 6,
name: "Asset 6",
uploadedOn: "22 Jan 23",
price: 46000,
rating: 4.2,
views: 500,
},
{
id: 7,
name: "Asset 7",
uploadedOn: "25 Jan 23",
price: 38000,
rating: 4.3,
views: 500,
},
{
id: 8,
name: "Asset 8",
uploadedOn: "27 Jan 23",
price: 41000,
rating: 4.1,
views: 500,
},
{
id: 9,
name: "Asset 9",
uploadedOn: "30 Jan 23",
price: 55000,
rating: 4.6,
views: 500,
},
{
id: 10,
name: "Asset 10",
uploadedOn: "2 Feb 23",
price: 49000,
rating: 4.4,
views: 500,
},
{
id: 11,
name: "Asset 11",
uploadedOn: "5 Feb 23",
price: 62000,
rating: 5.0,
views: 500,
},
{
id: 12,
name: "Asset 12",
uploadedOn: "7 Feb 23",
price: 53000,
rating: 4.7,
views: 500,
},
];
const [selectedCard, setSelectedCard] = useState<{
assetName: string;
uploadedOn: string;
price: number;
rating: number;
views: number;
} | null>(null);
const handleCardSelect = (cardData: {
assetName: string;
uploadedOn: string;
price: number;
rating: number;
views: number;
}) => {
setSelectedCard(cardData);
};
const array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
return (
<div className="cards-container-container">
<div className="header">Products You May Like</div>
<div className="cards-wrapper-container">
{array.map((asset) => (
<Card
key={asset.id}
assetName={asset.name}
uploadedOn={asset.uploadedOn}
price={asset.price}
rating={asset.rating}
views={asset.views}
onSelectCard={handleCardSelect}
/>
{array.map((index) => (
<Card key={index} />
))}
{/* <RenderOverlay> */}
{selectedCard && (
<AssetPreview
selectedCard={selectedCard}
setSelectedCard={setSelectedCard}
/>
)}
{/* </RenderOverlay> */}
</div>
</div>
);

6
app/src/modules/market/FilterSearch.tsx
View File

@@ -13,12 +13,10 @@ const FilterSearch: React.FC = () => {
};
return (
<div className="filter-search-container">
<div className="asset-search-wrapper">
<Search onChange={() => {}} />
</div>
<Search onChange={() => {}} />
<RegularDropDown
header={activeOption}
options={["Alphabet ascending", "Alphabet descending"]}
options={["Alphabet ascending", "Alphabet descending", ""]}
onSelect={handleSelect}
search={false}
/>

36
app/src/modules/market/MarketPlace.tsx
View File

@@ -1,18 +1,18 @@
import React from "react";
import FilterSearch from "./FilterSearch";
import CardsContainer from "./CardsContainer";
const MarketPlace = () => {
return (
<div className="marketplace-wrapper">
<div className="marketplace-container">
<div className="marketPlace">
<FilterSearch />
<CardsContainer />
</div>
</div>
</div>
);
};
export default MarketPlace;
import React from "react";
import FilterSearch from "./FilterSearch";
import CardsContainer from "./CardsContainer";
const MarketPlace = () => {
return (
<div className="marketplace-wrapper">
<div className="marketplace-container">
<div className="marketPlace">
<FilterSearch />
<CardsContainer />
</div>
</div>
</div>
);
};
export default MarketPlace;