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

Rework eco + card components, sidebar 'For Users', add/mod user guides #52

Merged
merged 34 commits into from
May 10, 2024
Merged
Show file tree
Hide file tree
Changes from 14 commits
Commits
Show all changes
34 commits
Select commit Hold shift + click to select a range
8c83fa7
modified: pages/_meta.json
Cordtus May 3, 2024
4bb2b8d
modified: .gitignore
Cordtus May 3, 2024
a4cadb1
modified: theme.config.tsx
Cordtus May 4, 2024
939521b
modified: theme.config.tsx
Cordtus May 6, 2024
98fbfe2
restructure For Users section
May 6, 2024
1c1dfbf
add FAQ, add linking addresses page, add images
May 7, 2024
a345751
add to FAQ, refactor User quickstart
May 7, 2024
a331956
modified: .gitignore
Cordtus May 7, 2024
7767539
modified: .gitignore
Cordtus May 7, 2024
4349bd1
modified: components/Card/Card.tsx
Cordtus May 8, 2024
11214ba
Update Card.tsx
cordt-sei May 8, 2024
aac3d46
Merge branch 'seiv2' into seiv2
Cordtus May 8, 2024
a80955c
Adding Compass wallet to ecosystem
Cordtus May 8, 2024
3ec75c4
Update .gitignore
Cordtus May 8, 2024
9f72fc1
Update appData.ts
Cordtus May 8, 2024
98ec894
modified: data/appData.ts
Cordtus May 8, 2024
8e01676
Update Card.tsx
Cordtus May 9, 2024
3e7b6bf
Update EcosystemApps.tsx
Cordtus May 9, 2024
5374e40
Update appData.ts
Cordtus May 9, 2024
14456f6
Update package.json
Cordtus May 9, 2024
f9414f6
Update package.json
Cordtus May 9, 2024
a89d3ad
Update block-explorers.mdx
Cordtus May 9, 2024
451410f
Update user-quickstart.mdx
Cordtus May 9, 2024
4ed9850
Remove unused elements - tailwind.config.js
Cordtus May 9, 2024
f6b0b04
Add missing ecosystem images
Cordtus May 9, 2024
fc002b5
Delete public/assets/ecosystem/superseiyanbot.jpeg
Cordtus May 9, 2024
9e34b67
replace superseiyanbot image
Cordtus May 9, 2024
e60f53c
Update appData.ts
Cordtus May 9, 2024
2b6ef23
Update user-guides _meta.json
Cordtus May 9, 2024
9dec7c6
add compass logo
Cordtus May 9, 2024
386459e
Add Compass wallet to ecosystem
Cordtus May 9, 2024
ac53a9b
modified: .gitignore
Cordtus May 9, 2024
b7371bf
modified: .gitignore
Cordtus May 9, 2024
848fdd0
modified: components/Card/Card.tsx
Cordtus May 9, 2024
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
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
.next
node_modules
.idea/*
.DS_Store
.DS_Store
7 changes: 4 additions & 3 deletions components/Card/Card.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Image, { StaticImageData } from "next/image";
// Card.tsx

Cordtus marked this conversation as resolved.
Show resolved Hide resolved
import Image, { StaticImageData } from "next/image";
interface CardProps {
image: StaticImageData;
title: string;
Expand All @@ -17,10 +18,10 @@ function Card({ image, title, description, href }: CardProps) {
className="flex flex-col border border-gray-200 dark:border-gray-700 rounded-lg overflow-hidden hover:opacity-80"
href={href}
target="_blank"
rel="noopener"
rel="noopener noreferrer"
>
<div>
<Image src={image} alt={title} />
<Image src={image} alt={title} layout="responsive" width={700} height={475} priority />
</div>
<div className="flex-1 p-4 bg-gray-100 dark:bg-gray-800">
<p className="text-lg font-semibold mb-2">{title}</p>
Expand Down
209 changes: 45 additions & 164 deletions components/EcosystemApps/EcosystemApps.tsx
Original file line number Diff line number Diff line change
@@ -1,172 +1,53 @@
import { StaticImageData } from "next/image";
import { Card, Cards } from "../../components";
import React, { useState, useMemo, useEffect } from 'react';
import { Card, Cards } from '../../components/Card';
import appData from '../../data/appData'; // Ensure this import is correct

import camelLogo from "../../public/assets/ecosystem/camel.png";
import gamblinoLogo from "../../public/assets/ecosystem/gamblino.jpeg";
import dragonswapLogo from "../../public/assets/ecosystem/dragonswap.jpeg";
import fluidLogo from "../../public/assets/ecosystem/fluid.png";
import belugasLogo from "../../public/assets/ecosystem/belugas.png";
import squaredLabsLogo from "../../public/assets/ecosystem/squared-labs.jpeg";
import seijinLogo from "../../public/assets/ecosystem/seijin.png";
import predxLogo from "../../public/assets/ecosystem/predx.jpeg";
import yakaLogo from "../../public/assets/ecosystem/yaka.jpeg";
import webumpLogo from "../../public/assets/ecosystem/webump.jpeg";
import accumulatedLogo from "../../public/assets/ecosystem/accumulated.jpeg";
import mambaLogo from "../../public/assets/ecosystem/mamba.png";
import jellyverseLogo from "../../public/assets/ecosystem/jellyverse.png";
import seicasinoLogo from "../../public/assets/ecosystem/seicasino.png";
import hoyuLogo from "../../public/assets/ecosystem/hoyu.jpeg";
import superSeiyanBotLogo from "../../public/assets/ecosystem/superseiyanbot.jpeg";
import nfts2meLogo from "../../public/assets/ecosystem/nfts2me.png";
import stafiLogo from "../../public/assets/ecosystem/stafi.png";
import siloLogo from "../../public/assets/ecosystem/silo.jpeg";
import vermillionLogo from "../../public/assets/ecosystem/vermillion.jpeg";
const EcosystemApps = () => {
const [searchTerm, setSearchTerm] = useState('');
const [allTags, setAllTags] = useState([]);

interface App {
title: string;
description: string;
href: string;
image: StaticImageData;
}
// Extract unique tags from appData
useEffect(() => {
const tags = new Set();
appData.forEach(app => app.tags.forEach(tag => tags.add(tag)));
setAllTags(Array.from(tags));
}, []);

const APPS: App[] = [
{
title: "DragonSwap",
description: "The native DEX on SEI",
href: "https://test.dragonswap.app/",
image: dragonswapLogo,
},
{
title: "SeiCasino",
description: "Full-featured casino built natively on Sei",
href: "https://seicasino.io",
image: seicasinoLogo,
},
{
title: "WeBump",
description: "Sei native NFT launchpad",
href: "https://webump.xyz/",
image: webumpLogo,
},
{
title: "Seijin",
description: "Launchpad on Sei",
href: "https://seijin.app/staking",
image: seijinLogo,
},
{
title: "Squared Labs",
description: "Quadratic price exposure on perpetual futures",
href: "https://squaredlabs.io/app/btc",
image: squaredLabsLogo,
},
{
title: "PredX",
description: "Prediction market",
href: "https://events.predx.ai/",
image: predxLogo,
},
{
title: "Gamblino",
description:
"GambleFi protocol covering crypto, sportsbook and classic games of chance",
href: "https://test.gamblino.app/",
image: gamblinoLogo,
},
{
title: "Silo",
description: "Liquid staking and MEV on Sei",
href: "https://silo-evm.dc37hw5o72ljt.amplifyapp.com/",
image: siloLogo,
},
{
title: "Camel",
description: "Sei's liquidity oasis",
href: "https://camel.money",
image: camelLogo,
},
{
title: "Fluid",
description: "Interest free loans, backed by Sei",
href: "https://fluidex.metabest.tech/",
image: fluidLogo,
},
{
title: "Belugas",
description: "Decentralized marketplace for lenders and borrowers",
href: "https://www.belugas.io/",
image: belugasLogo,
},
{
title: "Yaka",
description: "Algebra Integral fork on Sei",
href: "https://test.yaka.finance/",
image: yakaLogo,
},
{
title: "Accumulated",
description: "Liquid staking protocol",
href: "https://testnet.accumulated.finance/stake/sei",
image: accumulatedLogo,
},
{
title: "Mamba Defi",
description: "Defi and memecoin ecosystem",
href: "https://www.mambaswap.io/",
image: mambaLogo,
},
{
title: "JellyVerse",
description: "Smart order router",
href: "https://jelly-verse-sei.vercel.app/jellyswap",
image: jellyverseLogo,
},
{
title: "Hoyu",
description:
"DeFi protocol uniting lending and trading markets to give every token new utility as safe collateral",
href: "https://arctic.hoyu.io",
image: hoyuLogo,
},
{
title: "Super Seiyan Bot",
description: "Sei native telegram trading bot",
href: "https://t.me/SSeiyanEvmBot",
image: superSeiyanBotLogo,
},
{
title: "NFTs2ME",
description: "No-code NFT creation tool",
href: "https://nfts2me.com/app/sei-devnet/",
image: nfts2meLogo,
},
{
title: "Stafi",
description: "LST protocol",
href: "https://test-app.stafi.io/gallery/evm/SEI/?net=SEI",
image: stafiLogo,
},
{
title: "Vermillion",
description: "Next-gen AMM and stablecoin",
href: "https://app.vermillion.finance/swap",
image: vermillionLogo,
},
];
const filteredApps = useMemo(() => (
appData.filter(app =>
app.title.toLowerCase().includes(searchTerm.toLowerCase()) ||
app.tags.some(tag => tag.toLowerCase().includes(searchTerm.toLowerCase()))
)
), [searchTerm]);

const EcosystemApps = () => {
return (
<Cards>
{APPS.map((app) => (
<Card
key={app.title}
title={app.title}
description={app.description}
href={app.href}
image={app.image}
/>
))}
</Cards>
<div>
<input
type="text"
placeholder="Search apps by name or tag..."
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
className="w-full p-2 text-sm border rounded shadow-sm placeholder-gray-400"
/>
<div className="mt-2 mb-4 text-sm text-gray-600">
<strong>Filter by Tags:</strong> {allTags.join(', ')}
</div>
<Cards>
{filteredApps.length > 0 ? (
filteredApps.map((app) => (
<Card
key={app.title}
title={app.title}
description={app.description}
href={app.href}
image={app.image}
/>
))
) : (
<div className="text-center text-gray-500">No apps found.</div>
)}
</Cards>
</div>
);
};

Expand Down
Loading
Loading