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.

Sign up for GitHub

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

Jump to bottom

feat(app): add multichain info in app router #625

Merged
merged 1 commit into from
Nov 15, 2024
Merged

feat(app): add multichain info in app router #625

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
46 changes: 46 additions & 0 deletions apps/app/public/images/metamask.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion apps/app/src/app/[locale]/about/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export default async function About({
return (
<>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72 -mb-48"></div>
<div className="py-16 bg-white dark:bg-black-600 soft-shadow sm:container sm:mx-auto rounded-md my-10">
<div className="py-16 bg-white dark:bg-black-600 soft-shadow container-xxl sm:mx-auto rounded-md my-10">
<h1 className="mb-4 pt-8 sm:text-2xl text-center text-2xl text-green-500 dark:text-green-250">
{t('About Nearblocks')}
</h1>
Expand Down
75 changes: 37 additions & 38 deletions apps/app/src/app/[locale]/address/[id]/layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,21 +6,16 @@ import SponserdText from '@/components/app/SponserdText';
import FaCheckCircle from '@/components/Icons/FaCheckCircle';
import ListCheck from '@/components/Icons/ListCheck';
import { appUrl, networkId } from '@/utils/app/config';

const network = process.env.NEXT_PUBLIC_NETWORK_ID;

export async function generateMetadata({
params: { id, locale },
}: {
params: { id: string; locale: string };
}) {
unstable_setRequestLocale(locale);

const thumbnail = `${appUrl}/api/og?account=true&address=${id}`;

const metaTitle = `Near Account ${id} | NearBlocks`;
const metaDescription = `Near Account ${id} page allows users to view transactions, balances, token holdings and transfers.`;

return {
alternates: {
canonical: `${appUrl}/address/${id}`,
Expand Down Expand Up @@ -55,10 +50,10 @@ export default function AddressLayout({
);
return (
<>
<div className="relative container mx-auto px-3 mb-10">
<div className="flex items-center justify-between flex-wrap pt-4">
<div className="flex md:flex-wrap w-full">
<div className="flex justify-between md:items-center dark:text-neargray-10 border-b w-full mb-5 dark:border-black-200">
<div className="relative container-xxl mx-auto px-5 mb-10">
<div className="flex items-center justify-between flex-wrap pt-3">
<div className="flex md:flex-wrap w-full border-b mb-5 dark:border-black-200">
<div className="sm:flex flex-1 justify-between md:items-center dark:text-neargray-10 w-full ">
<h1 className="py-2 break-all space-x-2 text-xl text-gray-700 dark:text-white leading-8 px-2 font-medium">
Near Account:&nbsp;
{id && (
Expand All @@ -68,38 +63,42 @@ export default function AddressLayout({
)}
<Buttons address={id as string} />
</h1>
<ul className="flex relative md:pt-0 pt-2 items-center text-gray-500 text-xs">
<RpcMenu />
<li className="ml-3 max-md:mb-2">
<span className="group flex w-full relative h-full">
<a
className={`md:flex justify-center w-full hover:text-green-500 dark:hover:text-green-250 hover:no-underline px-0 py-1`}
href="#"
>
<div className="py-2 px-2 h-8 bg-gray-100 dark:bg-black-200 rounded border">
<ListCheck className="h-4 dark:filter dark:invert" />
</div>
</a>
<ul className="bg-white dark:bg-black-600 soft-shadow hidden min-w-full absolute top-full right-0 rounded-lg group-hover:block py-1 z-[99]">
<li className="pb-2">
<a
className={`flex items-center whitespace-nowrap px-2 pt-2 hover:text-green-400 dark:text-neargray-10 dark:hover:text-green-250`}
href={`https://nearvalidate.org/address/${id}?network=${networkId}`}
target="_blank"
>
Validate Account
<span className="w-4 ml-3 dark:text-green-250">
<FaCheckCircle />
</span>
</a>
</li>
</ul>
<div>
<ul className="flex relative md:pt-2 sm:pb-2 pb-1 items-center text-gray-500 text-xs">
<span className="ml-2">
<RpcMenu />
</span>
</li>
</ul>
<li className="ml-3 max-md:mb-2">
<span className="group flex w-full relative h-full">
<a
className={`md:flex justify-center w-full hover:text-green-500 dark:hover:text-green-250 hover:no-underline px-0 py-1`}
href="#"
>
<div className="py-2 px-2 h-8 bg-gray-100 dark:bg-black-200 rounded border">
<ListCheck className="h-4 dark:filter dark:invert" />
</div>
</a>
<ul className="bg-white dark:bg-black-600 soft-shadow hidden min-w-full absolute top-full right-0 rounded-lg group-hover:block py-1 z-[99]">
<li className="pb-2">
<a
className={`flex items-center whitespace-nowrap px-2 pt-2 hover:text-green-400 dark:text-neargray-10 dark:hover:text-green-250`}
href={`https://validate.nearblocks.io/address/${id}?network=${networkId}`}
target="_blank"
>
Validate Account
<span className="w-4 ml-3 dark:text-green-250">
<FaCheckCircle />
</span>
</a>
</li>
</ul>
</span>
</li>
</ul>
</div>
</div>
</div>
<div className="container mx-auto pl-2 pb-6 text-nearblue-600">
<div className="container-xxl justify-left pl-2 pb-6 text-nearblue-600">
<div className="min-h-[80px] md:min-h-[25px]">
<SponserdText />
</div>
Expand Down
2 changes: 1 addition & 1 deletion apps/app/src/app/[locale]/advertise/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ export default async function Advertise({
}) {
const t = await getTranslations({ locale });
return (
<div className="container mx-auto herobg flex flex-col items-center p-4.5 lg:!py-16 px-6">
<div className="container-xxl mx-auto herobg flex flex-col items-center p-4.5 lg:!py-16 px-6">
<div className="w-full flex ">
<div className="md:w-3/6 w-full flex flex-col items-start">
<p className="text-green-500 text-sm lg:!text-base font-semibold lg:!mt-3 mt-5 dark:text-white">
Expand Down
2 changes: 1 addition & 1 deletion apps/app/src/app/[locale]/blocks/[hash]/loading.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import HashLoading from '@/components/app/skeleton/blocks/hash';
export default function Loading() {
return (
<>
<div className="relative container mx-auto px-3">
<div className="relative container-xxl mx-auto px-5">
<HashLoading />
</div>
<div className="py-8"></div>
Expand Down
2 changes: 1 addition & 1 deletion apps/app/src/app/[locale]/blocks/[hash]/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export default async function Hash({

return (
<>
<div className="relative container mx-auto px-3">
<div className="relative container-xxl mx-auto px-5">
<Suspense fallback={<HashLoading />}>
<Details
data={hashData}
Expand Down
4 changes: 2 additions & 2 deletions apps/app/src/app/[locale]/blocks/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,13 +18,13 @@ export default async function Blocks({
return (
<>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-white text-lg font-medium">
{t('blockHeading') || 'Latest Near Protocol Blocks'}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="relative block lg:flex lg:space-x-2">
<div className="w-full">
<Suspense fallback={<ListSkeleton />}>
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/active-accounts/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,14 @@ export default async function Tps({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:text-2xl text-xl text-white">
{t('addressesCharts.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense
fallback={<ChartDetails chartTypes="active-account-daily" />}
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/addresses/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ export default async function AddressesChart({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
{t('addressesCharts.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="addresses" />}>
<Chart
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/blocks/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ export default async function BlocksChart({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
{t('blocksCharts.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="blocks" />}>
<Chart
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/market-cap/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ export default async function MarketCapChart({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
{t('marketCapCharts.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="market-cap" />}>
<Chart
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/near-price/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ export default async function NearPriceChart({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
{t('charts.nearPrice.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="near-price" />}>
<Chart
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/near-supply/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ export default async function NearSupplyChart({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
{t('nearSupplyCharts.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="near-supply" />}>
<Chart
Expand Down
4 changes: 2 additions & 2 deletions apps/app/src/app/[locale]/charts/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,14 @@ export default async function ChartIndex({
return (
<>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white font-medium">
{t('charts.heading')}
</h1>
</div>
</div>
<div className="mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartSkeletion />}>
<Chart poweredBy={false} />
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/tps/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,14 +52,14 @@ export default async function Tps() {
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
Near Transactions per Second Chart
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="near-tps" />}>
<TpsChart chartTypes={'near-tps'} data={data} poweredBy={false} />
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/txn-fee/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ export default async function TxnFeeChart({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
{t('txnFeeCharts.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="txn-fee" />}>
<Chart
Expand Down
6 changes: 3 additions & 3 deletions apps/app/src/app/[locale]/charts/txn-volume/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,14 +56,14 @@ export default async function TxnVolumeChart({
return (
<section>
<div className="bg-hero-pattern dark:bg-hero-pattern-dark h-72">
<div className="container mx-auto px-3">
<div className="container-xxl mx-auto px-5">
<h1 className="mb-4 pt-8 sm:!text-2xl text-xl text-white">
{t('txnVolumeCharts.heading')}
</h1>
</div>
</div>
<div className="container mx-auto px-3 -mt-48">
<div className="container mx-auto px-3 -mt-36">
<div className="container-xxl mx-auto px-5 -mt-48">
<div className="container-xxl mx-auto px-5 -mt-36">
<div className="relative">
<Suspense fallback={<ChartDetails chartTypes="txn-volume" />}>
<Chart
Expand Down
Loading
Loading