diff --git a/explorer-nextjs/src/app/(pages)/account/[address]/not-found/page.tsx b/explorer-nextjs/src/app/(pages)/account/[address]/not-found/page.tsx index 77f5e425aa..3a88418623 100644 --- a/explorer-nextjs/src/app/(pages)/account/[address]/not-found/page.tsx +++ b/explorer-nextjs/src/app/(pages)/account/[address]/not-found/page.tsx @@ -4,6 +4,7 @@ import SectionHeading from "@/components/headings/SectionHeading"; import ExplorerButtonGroup from "@/components/toggleButton/ToggleButton"; import { Box, Typography } from "@mui/material"; import Grid from "@mui/material/Grid2"; +import Markdown from "react-markdown"; export default async function Account({ params, @@ -20,6 +21,7 @@ export default async function Account({ - Is this your accont? Set up your node! + + This account does’t have a Nym node bonded. Is this your account? + Start [setting up your node](https://nym.com/docs) today! + - + ); diff --git a/explorer-nextjs/src/app/(pages)/explorer/page.tsx b/explorer-nextjs/src/app/(pages)/explorer/page.tsx index e9ff897a24..525d17f076 100644 --- a/explorer-nextjs/src/app/(pages)/explorer/page.tsx +++ b/explorer-nextjs/src/app/(pages)/explorer/page.tsx @@ -2,15 +2,19 @@ import BlogArticlesCards from "@/components/blogs/BlogArticleCards"; import { ContentLayout } from "@/components/contentLayout/ContentLayout"; import SectionHeading from "@/components/headings/SectionHeading"; import NodeTableWithAction from "@/components/nodeTable/NodeTableWithAction"; +import NodeAndAddressSearch from "@/components/search/NodeAndAddressSearch"; import { Wrapper } from "@/components/wrapper"; -import { Box } from "@mui/material"; +import { Box, Stack } from "@mui/material"; import Grid from "@mui/material/Grid2"; export default function ExplorerPage() { return ( - + + + + diff --git a/explorer-nextjs/src/app/globals.css b/explorer-nextjs/src/app/globals.css index 9e6cea0114..a3ebe5e8d2 100644 --- a/explorer-nextjs/src/app/globals.css +++ b/explorer-nextjs/src/app/globals.css @@ -52,3 +52,9 @@ a { width: 8px; height: 8px; } + +.reactMarkDownLink a { + color: #00ca33; + display: inline; + font-weight: 700; +} diff --git a/explorer-nextjs/src/components/accountPageComponents/AccountBalancesCard.tsx b/explorer-nextjs/src/components/accountPageComponents/AccountBalancesCard.tsx index 2ef7914241..c46f2505e6 100644 --- a/explorer-nextjs/src/components/accountPageComponents/AccountBalancesCard.tsx +++ b/explorer-nextjs/src/components/accountPageComponents/AccountBalancesCard.tsx @@ -3,8 +3,8 @@ import { fetchAccountBalance, fetchNymPrice } from "@/app/api"; import { Skeleton, Stack, Typography } from "@mui/material"; import { useQuery } from "@tanstack/react-query"; import type { IRewardDetails } from "../../app/api/types"; -import { AccountBalancesTable } from "../cards/AccountBalancesTable"; import ExplorerCard from "../cards/ExplorerCard"; +import { AccountBalancesTable } from "./AccountBalancesTable"; export interface IAccontStatsRowProps { type: string; diff --git a/explorer-nextjs/src/components/cards/AccountBalancesTable.tsx b/explorer-nextjs/src/components/accountPageComponents/AccountBalancesTable.tsx similarity index 100% rename from explorer-nextjs/src/components/cards/AccountBalancesTable.tsx rename to explorer-nextjs/src/components/accountPageComponents/AccountBalancesTable.tsx diff --git a/explorer-nextjs/src/components/blogs/BlogArticleCards.tsx b/explorer-nextjs/src/components/blogs/BlogArticleCards.tsx index 78c3257f0e..783da83c0e 100644 --- a/explorer-nextjs/src/components/blogs/BlogArticleCards.tsx +++ b/explorer-nextjs/src/components/blogs/BlogArticleCards.tsx @@ -6,7 +6,13 @@ import type { BlogArticleWithLink } from "./types"; // TODO: Articles should be sorted by date -const BlogArticlesCards = async ({ limit }: { limit?: number }) => { +const BlogArticlesCards = async ({ + limit, + ids, +}: { + limit?: number; + ids?: Array; +}) => { const blogsDir = path.join(process.cwd(), "/src/data"); const blogsDirFilenames = await fs.readdir(blogsDir); @@ -23,11 +29,30 @@ const BlogArticlesCards = async ({ limit }: { limit?: number }) => { }), ); - const limitedBlogArticles = limit - ? blogArticles.slice(0, limit) - : blogArticles; + const limitedOrFilteredBlogArticles = ( + blogArticles: BlogArticleWithLink[], + limit?: number, + ids?: number[], + ): BlogArticleWithLink[] => { + let filteredArticles = blogArticles; - return limitedBlogArticles + // Filter by IDs if provided + if (ids && ids.length > 0) { + filteredArticles = filteredArticles.filter((article) => + ids.includes(article.id), + ); + } + + // Apply limit if provided + if (limit) { + filteredArticles = filteredArticles.slice(0, limit); + } + + return filteredArticles; + }; + const articles = limitedOrFilteredBlogArticles(blogArticles, limit, ids); + + return articles .sort((a, b) => { // sort by date return ( diff --git a/explorer-nextjs/src/components/blogs/types.ts b/explorer-nextjs/src/components/blogs/types.ts index 4d141e7f0e..211448f49d 100644 --- a/explorer-nextjs/src/components/blogs/types.ts +++ b/explorer-nextjs/src/components/blogs/types.ts @@ -1,6 +1,7 @@ type Content = { type: string; text: string }; type BlogArticle = { + id: number; title: string; label: string; description: string; diff --git a/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx b/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx index 38687b334b..1b84a90bb8 100644 --- a/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx +++ b/explorer-nextjs/src/components/landingPageComponents/StakersNumberCard.tsx @@ -41,7 +41,7 @@ export const RewardsCard = () => { const allStakers = getActiveStakersNumber(observatoryNodes); return ( - + {allStakers} diff --git a/explorer-nextjs/src/components/nodeTable/NodeTable.tsx b/explorer-nextjs/src/components/nodeTable/NodeTable.tsx index 2007c3761e..00312657c3 100644 --- a/explorer-nextjs/src/components/nodeTable/NodeTable.tsx +++ b/explorer-nextjs/src/components/nodeTable/NodeTable.tsx @@ -284,11 +284,11 @@ const NodeTable = ({ nodes }: { nodes: MappedNymNodes }) => { enableColumnFilter: false, header: "Favorite", accessorKey: "Favorite", - size: 110, + size: 50, Header: ( - Favorite + Fav ), sortingFn: (a, b) => { diff --git a/explorer-nextjs/src/components/staking/StakeTable.tsx b/explorer-nextjs/src/components/staking/StakeTable.tsx index 0f0bbf0e2b..c54aaab67d 100644 --- a/explorer-nextjs/src/components/staking/StakeTable.tsx +++ b/explorer-nextjs/src/components/staking/StakeTable.tsx @@ -456,7 +456,6 @@ const StakeTable = ({ nodes }: { nodes: MappedNymNodes }) => { sortingFn: (rowA, rowB) => { const saturationA = rowA.original.node?.stakeSaturation || 0; const saturationB = rowB.original.node?.stakeSaturation || 0; - console.log("sorting :>> ", saturationA, saturationB); return saturationA - saturationB; }, Cell: ({ row }) => @@ -473,11 +472,11 @@ const StakeTable = ({ nodes }: { nodes: MappedNymNodes }) => { header: "Favorite", accessorKey: "Favorite", enableColumnFilter: false, - size: 80, + size: 50, Header: ( - Favorite + Fav ), sortingFn: (rowA, rowB) => { diff --git a/explorer-nextjs/src/data/blog-template-1.json b/explorer-nextjs/src/data/blog-template-1.json index 42e544594b..f5a9dfeda3 100644 --- a/explorer-nextjs/src/data/blog-template-1.json +++ b/explorer-nextjs/src/data/blog-template-1.json @@ -1,4 +1,5 @@ { + "id": 1, "title": "Welcome to the Nym Network Explorer", "label": "Onboarding", "description": "Let's unpack the key features of the long awaited features together!", diff --git a/explorer-nextjs/src/data/blog-template-2.json b/explorer-nextjs/src/data/blog-template-2.json index fb980d13b5..5c9c5d6d18 100644 --- a/explorer-nextjs/src/data/blog-template-2.json +++ b/explorer-nextjs/src/data/blog-template-2.json @@ -1,4 +1,5 @@ { + "id": 2, "title": "How to find the best nodes to stake your $NYM?", "label": "Onboarding", "description": "Follow this simple guide to learn more about staking!", diff --git a/explorer-nextjs/src/data/blog-template-3.json b/explorer-nextjs/src/data/blog-template-3.json index 988407bfdd..55d6bc60a6 100644 --- a/explorer-nextjs/src/data/blog-template-3.json +++ b/explorer-nextjs/src/data/blog-template-3.json @@ -1,4 +1,5 @@ { + "id": 3, "title": "Beginners guide to buying and swapping $NYM", "label": "Onboarding", "description": "Let us help you find the most convenient way for you to participate in securing the Nym NGM.", diff --git a/explorer-nextjs/src/data/blog-template-4.json b/explorer-nextjs/src/data/blog-template-4.json index 18f0a8ac12..b4f71a5af5 100644 --- a/explorer-nextjs/src/data/blog-template-4.json +++ b/explorer-nextjs/src/data/blog-template-4.json @@ -1,4 +1,5 @@ { + "id": 4, "title": "Become a Nym Node Operator", "label": "Onboarding", "description": "VAnyone can operate a Nym node, this article is an overview of what you'll need to set up and run a successful Nym node.",