Skip to content

Commit

Permalink
Merge branch 'dev' into feat/support-feed
Browse files Browse the repository at this point in the history
  • Loading branch information
@thebeyondr
thebeyondr authored Mar 21, 2024
2 parents fbd9dd1 + f615565 commit ab66a25
Show file tree
Hide file tree
Showing 14 changed files with 360 additions and 275 deletions.
Binary file modified app/favicon.ico
View file
Binary file not shown.
92 changes: 60 additions & 32 deletions app/profile/[address]/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,42 +3,62 @@ import Link from "next/link";

import { getContributionsByAddress } from "@/lib/directus";
import { fetchReportByHCId } from "@/lib/impact-reports";
import { cn } from "@/lib/utils";
import { cn, isNotNull } from "@/lib/utils";

import History, { type HistoryData } from "@/components/my-actions/history";
import { SideBar } from "@/components/my-actions/sidebar";
import { Summary } from "@/components/my-actions/summary";
import History, { type HistoryData } from "@/components/profile/history";
import { SideBar } from "@/components/profile/sidebar";
import { Summary } from "@/components/profile/summary";
import { buttonVariants } from "@/components/ui/button";

/**
* Fetches contribution history data for a given address.
* @param {string} address The blockchain address to fetch contributions for.
* @returns {Promise<{history: HistoryData[], categoryCounts: Record<string, number>, totalAmount: number, reportCount: number}>} An object containing the contribution history and summary statistics.
*/
async function getContributionsHistoryData(address: `0x${string}`) {
// The return value is *not* serialized
// You can return Date, Map, Set, etc.
try {
const contributions = await getContributionsByAddress(address);
const historyPromises = contributions.map(async (contribution) => {
const report = await fetchReportByHCId(contribution.hypercert_id);
return {
id: contribution.txid,
date: contribution.date_created
? new Date(contribution.date_created)
: undefined,
amount: contribution.amount,
img: {
src: report.image,
alt: report.title,
},
title: report.title,
category: report.category,
location: report.state,
description: report.summary,
} as HistoryData;
});
const historyPromises = contributions.map(
async (contribution): Promise<HistoryData | null> => {
const report = await fetchReportByHCId(contribution.hypercert_id);
return {
id: contribution.txid,
date: new Date(contribution.date_created),
amount: contribution.amount,
img: {
src: report.image,
alt: report.title,
},
title: report.title,
category: report.category,
location: report.state,
description: report.summary,
};
},
);

const history = await Promise.all(historyPromises);
return history;
const historyResults = await Promise.all(historyPromises);
const history = historyResults.filter(isNotNull);

let totalAmount = 0;
const categoryCounts: { [key: string]: number } = {};
const reportCount = history.length;

for (const entry of history) {
totalAmount += entry.amount;
categoryCounts[entry.category] =
(categoryCounts[entry.category] || 0) + 1;
}

// Returning history, categoryCounts, and totalAmount directly
return { history, categoryCounts, totalAmount, reportCount };
} catch (error) {
console.error(`Failed to load reports contributed by ${address}: ${error}`);
return [];
return {
history: [],
categoryCounts: {},
totalAmount: 0,
reportCount: 0,
};
}
}

Expand All @@ -47,8 +67,12 @@ export default async function ProfilePage({
}: {
params: { address: `0x${string}` };
}) {
const history = await getContributionsHistoryData(address);

const {
history = [],
categoryCounts = {},
totalAmount = 0,
reportCount = 0,
} = await getContributionsHistoryData(address);
return (
<main className="container grid grid-cols-1 md:grid-cols-3 auto-rows-auto md:gap-4 gap-4 text-vd-blue-900 mb-6 max-w-6xl pb-16 md:pb-0">
<header className="md:col-span-3 flex justify-between my-4">
Expand All @@ -61,9 +85,13 @@ export default async function ProfilePage({
<Settings2 className="ml-2 h-4 w-4 mt-1" />
</Link>
</header>
<Summary />
<Summary
totalAmount={totalAmount}
reportCount={reportCount}
categoryCounts={categoryCounts}
/>
<SideBar />
<History history={history || []} />
<History history={history} />
</main>
);
}
120 changes: 60 additions & 60 deletions components/global/nav-links.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,61 +2,61 @@
import { cn } from "@/lib/utils";

import { ArrowUpRight } from "lucide-react";
import { buttonVariants } from "../ui/button";
import Link from "next/link";
import { usePathname } from "next/navigation";
import React from "react";
import type React from "react";
import { buttonVariants } from "../ui/button";

export const NavLink = ({
href,
children,
isActive,
className,
href,
children,
isActive,
className,
}: {
href: string;
children: React.ReactNode;
isActive: boolean;
className?: string;
href: string;
children: React.ReactNode;
isActive: boolean;
className?: string;
}) => {
return (
<Link
href={href}
className={cn(
buttonVariants({ variant: "ghost" }),
"rounded-md font-semibold",
isActive ?? "bg-vd-beige-300 dark:bg-vd-beige-100",
className || ""
)}
>
{children}
</Link>
);
return (
<Link
href={href}
className={cn(
buttonVariants({ variant: "ghost" }),
"rounded-md font-semibold",
isActive ?? "bg-vd-beige-300 dark:bg-vd-beige-100",
className || "",
)}
>
{children}
</Link>
);
};

const NavLinks = () => {
const pathname = usePathname();
const isActive = (path: string) => pathname.startsWith(path);
const pathname = usePathname();
const isActive = (path: string) => pathname.startsWith(path);

return (
<ul className="hidden md:flex gap-1">
<li>
<NavLink href="/" isActive={isActive("/reports")}>
Reports
</NavLink>
</li>
<li>
<a
href="http://about-example.com"
target="_blank"
rel="noopener noreferrer"
className={cn(buttonVariants({ variant: "link" }), "font-semibold")}
>
About
<div className="p-0.5" />
<ArrowUpRight size={18} />
</a>
{/* TODO: I believe that About and FAQs are external Links. If they are different Routes use below. Confirm in Design Review */}
{/* <NavLink
return (
<ul className="hidden md:flex gap-1">
<li>
<NavLink href="/" isActive={isActive("/reports")}>
Reports
</NavLink>
</li>
<li>
<a
href="https://voicedeck.org/"
target="_blank"
rel="noopener noreferrer"
className={cn(buttonVariants({ variant: "link" }), "font-semibold")}
>
About
<div className="p-0.5" />
<ArrowUpRight size={18} />
</a>
{/* TODO: I believe that About and FAQs are external Links. If they are different Routes use below. Confirm in Design Review */}
{/* <NavLink
to="/about"
className={({ isActive }) =>
cn(
Expand All @@ -76,21 +76,21 @@ const NavLinks = () => {
)
}
</NavLink> */}
</li>
<li>
<a
href="http://faqs-example.com"
target="_blank"
rel="noopener noreferrer"
className={cn(buttonVariants({ variant: "link" }), "font-semibold")}
>
FAQs
<div className="p-0.5" />
<ArrowUpRight size={18} />
</a>
</li>
</ul>
);
</li>
<li>
<a
href="https://voicedeck.org/faq/"
target="_blank"
rel="noopener noreferrer"
className={cn(buttonVariants({ variant: "link" }), "font-semibold")}
>
FAQs
<div className="p-0.5" />
<ArrowUpRight size={18} />
</a>
</li>
</ul>
);
};

NavLinks.displayName = "NavLinks";
Expand Down
58 changes: 0 additions & 58 deletions components/my-actions/history.tsx
View file

This file was deleted.

Loading

0 comments on commit ab66a25

Please sign in to comment.