GRIN/nym
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #5558 from nymtech/radek/explorer_rewrites

Browse Source 
+ basepath
This commit is contained in:
windy-ux
2025-03-04 19:25:47 +01:00
committed by GitHub
parent 152b3635d1 9463f20a3a
commit f252ecd691
18 changed files with 126 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
explorer-v2/next.config.ts
+17 -1
View File
@@ -1,7 +1,23 @@
import type { NextConfig } from "next";
const nextConfig: NextConfig = {
/* config options here */
reactStrictMode: true,
basePath: "/explorer",
assetPrefix: "/explorer",
trailingSlash: false,
async redirects() {
return [
// Change the basePath to /explorer
{
source: "/",
destination: "/explorer",
basePath: false,
permanent: true,
},
]
}
};
export default nextConfig;
explorer-v2/src/components/blogs/BlogArticleCards.tsx
+2 -1
View File
@@ -3,6 +3,7 @@ import path from "node:path";
import Grid from "@mui/material/Grid2";
import ExplorerHeroCard from "../cards/ExplorerHeroCard";
import type { BlogArticleWithLink } from "./types";
import { icons, IconName } from "@/utils/getIconByName";
// TODO: Articles should be sorted by date
@@ -73,7 +74,7 @@ const BlogArticlesCards = async ({
label={blogArticle.label}
title={blogArticle.title}
description={blogArticle.description}
icon={blogArticle.icon}
icon={icons[blogArticle.icon as IconName]?.src}
link={blogArticle.link || ""}
sx={{ height: "100%" }}
/>
explorer-v2/src/components/footer/NewsLetterSignUp.tsx
+2 -3
View File
@@ -1,8 +1,7 @@
"use client";
// Types
import Arrow from "../../../public/icons/arrow.svg";
import { icons } from "@/utils/getIconByName";
// MUI Components
import { Box, Button, Input } from "@mui/material";
import Image from "next/image";
@@ -57,7 +56,7 @@ export const NewsletterSignUp = () => {
},
}}
>
<Image src={Arrow} alt={"arrow icon"} width={15} height={15} />
<Image src={icons.arrow} alt={"arrow icon"} width={15} height={15} />
</Button>
</Box>
);
explorer-v2/src/components/footer/SocialIcon.tsx
+11 -19
View File
@@ -1,29 +1,21 @@
"use client";
import Image from "next/image";
import Discord from "../../../public/icons/discord.svg";
import GitHub from "../../../public/icons/github.svg";
// Icons
import Telegram from "../../../public/icons/telegram.svg";
import X from "../../../public/icons/twitter.svg";
import YouTube from "../../../public/icons/youtube.svg";
import YouTubeInverted from "../../../public/icons/youtubeInverted.svg";
export const icons: { [key: string]: React.ComponentType } = {
telegram: Telegram,
youtube: YouTube,
discord: Discord,
github: GitHub,
twitter: X,
};
import { icons } from "@/utils/getIconByName";
// import { useMainContext } from "@/context";
export const SocialIcon = ({ channel }: { channel: string }): JSX.Element => {
// const { mode } = useMainContext();
const modeType = "light";
const iconSrc =
modeType === "light" && channel.toLowerCase() === "youtube"
? YouTubeInverted
: icons[channel.toLowerCase()];
// ✅ Normalize channel name & apply theme logic
const normalizedChannel = channel.toLowerCase();
const iconName =
modeType === "light" && normalizedChannel === "youtube"
? "youTubeInverted"
: (normalizedChannel as keyof typeof icons);
// ✅ Get the icon source dynamically
const iconSrc = icons[iconName]?.src || "/icons/default-icon.svg";
return <Image src={iconSrc} alt={channel} width={32} height={32} />;
};
explorer-v2/src/components/header/navigationIcons.ts
+3 -4
View File
@@ -1,7 +1,6 @@
import Document from "@/public/icons/document.svg";
import Download from "@/public/icons/download.svg";
import { icons } from "@/utils/getIconByName";
export const NavigationIcons = {
article: Document,
download: Download,
article: icons.document,
download: icons.download,
};
explorer-v2/src/components/icons/ArrowUpRight.tsx
+3 -1
View File
@@ -1,8 +1,10 @@
import Image from "next/image";
import { icons } from "@/utils/getIconByName";
const ArrowUpRight = () => (
<Image
src="icons/arrow-up-right.svg"
src={icons.arrowUpRight}
alt="Arrow Up Right"
width={32}
height={32}
explorer-v2/src/components/icons/Chevron.tsx
+2 -1
View File
@@ -1,9 +1,10 @@
import Image from "next/image";
import { icons } from "@/utils/getIconByName";
const ChevronMenu = () => {
return (
<Image
src="/icons/chevronMenu.svg"
src={icons.chevronMenu}
alt="Chevron Menu"
width={24}
height={24}
explorer-v2/src/components/icons/CopyFile.tsx
+3 -1
View File
@@ -1,8 +1,10 @@
import Image from "next/image";
import { icons } from "@/utils/getIconByName";
const CopyFile = ({ className }: { className?: string }) => (
<Image
src="/icons/copy-file.svg"
src={icons.copyFile}
alt="Copyfile"
width={16}
height={16}
explorer-v2/src/components/icons/Cross.tsx
+2 -1
View File
@@ -1,7 +1,8 @@
import Image from "next/image";
import { icons } from "@/utils/getIconByName";
const Cross = () => (
<Image src="/icons/cross.svg" alt="cross" width={12.5} height={12.5} />
<Image src={icons.cross} alt="cross" width={12.5} height={12.5} />
);
export default Cross;
explorer-v2/src/components/icons/Elips.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import Image from "next/image";
import * as React from "react";
import { icons } from "@/utils/getIconByName";
export const Elips = () => (
<Image src="/icons/elips.svg" alt="Elips" width={20} height={20} />
<Image src={icons.elips} alt="Elips" width={20} height={20} />
);
explorer-v2/src/components/icons/Gateway.tsx
+2 -1
View File
@@ -1,8 +1,9 @@
import Image from "next/image";
import { icons } from "@/utils/getIconByName";
const Gateway = () => {
return (
<Image src="/icons/gateway.svg" alt="Chevron Menu" width={84} height={84} />
<Image src={icons.gateway} alt="Chevron Menu" width={84} height={84} />
);
};
explorer-v2/src/components/icons/NymLogo.tsx
+2 -1
View File
@@ -1,8 +1,9 @@
import Image from "next/image";
import { icons } from "@/utils/getIconByName";
const NymLogo = () => {
return (
<Image src="/icons/nym-logo.svg" alt="Nym Logo" width={90} height={25} />
<Image src={icons.nymLogo} alt="Nym Logo" width={90} height={25} />
);
};
export default NymLogo;
explorer-v2/src/components/icons/Token.tsx
+2 -2
View File
@@ -1,6 +1,6 @@
import Image from "next/image";
import * as React from "react";
import { icons } from "@/utils/getIconByName";
export const Token = () => {
return <Image src="/icons/token.svg" alt="Token" width={20} height={20} />;
return <Image src={icons.token} alt="Token" width={20} height={20} />;
};
explorer-v2/src/data/Welcome-to-explorer-2.json
+1 -1
View File
@@ -8,7 +8,7 @@
"date": "Mon Jan 20 2025 10:26:09 GMT+0000 (Greenwich Mean Time)",
"readingTime": 5
},
"icon": "/icons/explorer-card.svg",
"icon": "explorerCard",
"image": "/images/Network.webp",
"overview": {
"content": [
explorer-v2/src/data/buy-nym.json
+1 -1
View File
@@ -8,7 +8,7 @@
"date": "Mon Jan 05 2025 10:26:09 GMT+0000 (Greenwich Mean Time)",
"readingTime": 5
},
"icon": "/icons/gateway.svg",
"icon": "gateway",
"image": "/images/placeholder.webp",
"overview": {
"content": [
explorer-v2/src/data/operate-a-node.json
+1 -1
View File
@@ -8,7 +8,7 @@
"date": "Mon Jan 05 2025 10:26:09 GMT+0000 (Greenwich Mean Time)",
"readingTime": 5
},
"icon": "/icons/gateway.svg",
"icon": "gateway",
"image": "/images/placeholder.webp",
"overview": {
"content": [
explorer-v2/src/data/staking-guide.json
+1 -1
View File
@@ -8,7 +8,7 @@
"date": "Mon Jan 05 2025 10:26:09 GMT+0000 (Greenwich Mean Time)",
"readingTime": 5
},
"icon": "/icons/stake-card.svg",
"icon": "stakeCard",
"image": "/images/stake-article.webp",
"overview": {
"content": [
explorer-v2/src/utils/getIconByName.tsx
+69
View File
@@ -0,0 +1,69 @@
import type { StaticImageData } from "next/image";
import nymLogo from "@/../public/icons/nym-logo.svg";
import token from "@/../public/icons/token.svg";
import gateway from "@/../public/icons/gateway.svg";
import elips from "@/../public/icons/elips.svg";
import cross from "@/../public/icons/cross.svg";
import copyFile from "@/../public/icons/copy-file.svg";
import chevronMenu from "@/../public/icons/chevronMenu.svg"
import document from "@/../public/icons/document.svg"
import download from "@/../public/icons/download.svg"
import discord from "@/../public/icons/discord.svg"
import github from "@/../public/icons/github.svg"
import telegram from "@/../public/icons/telegram.svg"
import twitter from "@/../public/icons/twitter.svg"
import youtube from "@/../public/icons/youtube.svg"
import youTubeInverted from "@/../public/icons/youtubeInverted.svg"
import arrowUpRight from "@/../public/icons/arrow-up-right.svg"
import arrow from "@/../public/icons/arrow-up-right.svg"
import explorerCard from "@/../public/icons/explorer-card.svg"
import stakeCard from "@/../public/icons/stake-card.svg"
export type IconName =
| "nymLogo"
| "token"
| "gateway"
| "elips"
| "cross"
| "copyFile"
| "chevronMenu"
| "document"
| "download"
| "discord"
| "github"
| "telegram"
| "twitter"
| "youtube"
| "youTubeInverted"
| "arrowUpRight"
| "arrow"
| "stakeCard"
| "explorerCard"
export type Icons = {
[key in IconName]: StaticImageData;
};
export const icons: Icons = {
nymLogo,
token,
gateway,
elips,
cross,
copyFile,
chevronMenu,
document,
download,
discord,
github,
telegram,
twitter,
youtube,
youTubeInverted,
arrowUpRight,
arrow,
stakeCard,
explorerCard
};