matt/puffin-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more fixes

Browse Source
This commit is contained in:
Matt 2025-05-13 20:58:17 +02:00
parent 444ab364a4
commit 43fca42b7f
3 changed files with 31 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/api/wrenClient.ts
View File

@ -138,13 +138,24 @@ export async function getPortfolios(): Promise<Portfolio[]> {
// Convert from snake_case to camelCase for projects
const projects = portfolio.projects?.map(project => {
// Ensure cost_per_ton is properly mapped
const projectPricePerTon = project.cost_per_ton !== undefined && project.cost_per_ton !== null
? (typeof project.cost_per_ton === 'number' ? project.cost_per_ton : parseFloat(project.cost_per_ton))
: pricePerTon;
// Ensure percentage is properly captured
const projectPercentage = project.percentage !== undefined && project.percentage !== null
? (typeof project.percentage === 'number' ? project.percentage : parseFloat(project.percentage))
: undefined;
return {
id: project.id || `project-${Math.random().toString(36).substring(2, 9)}`,
name: project.name,
description: project.description || '',
shortDescription: project.short_description || project.description || '',
imageUrl: project.image_url, // Map from snake_case API response
pricePerTon: project.cost_per_ton || pricePerTon,
pricePerTon: projectPricePerTon,
percentage: projectPercentage, // Include percentage field
location: project.location || 'Global',
type: project.type || 'Nature Based',
verificationStandard: project.verification_standard || 'Gold Standard',

21
src/components/OffsetOrder.tsx
View File

@ -309,9 +309,16 @@ export function OffsetOrder({ tons, monetaryAmount, onBack, calculatorType }: Pr
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-6">
{portfolio.projects.map((project) => (
<div key={project.id} className="bg-gray-50 rounded-lg p-4 hover:shadow-md transition-shadow">
<div className="flex items-center space-x-2 mb-3">
<ProjectTypeIcon project={project} />
<h4 className="font-semibold text-gray-900">{project.name}</h4>
<div className="flex items-center justify-between mb-3">
<div className="flex items-center space-x-2">
<ProjectTypeIcon project={project} />
<h4 className="font-semibold text-gray-900">{project.name}</h4>
</div>
{project.percentage && (
<span className="text-sm text-gray-600 font-medium">
{(project.percentage * 100).toFixed(1)}%
</span>
)}
</div>
{project.imageUrl && (
<div className="relative h-32 mb-3 rounded-lg overflow-hidden">
@ -325,7 +332,13 @@ export function OffsetOrder({ tons, monetaryAmount, onBack, calculatorType }: Pr
<p className="text-sm text-gray-600 mb-3">
{project.shortDescription || project.description}
</p>
<div className="space-y-1 text-sm">
<div className="space-y-1 text-sm mt-3">
<div className="flex justify-between">
<span className="text-gray-500">Price per ton:</span>
<span className="text-gray-900 font-medium">
${project.pricePerTon.toFixed(2)}
</span>
</div>
{project.location && (
<div className="flex justify-between">
<span className="text-gray-500">Location:</span>

1
src/types.ts
View File

@ -54,6 +54,7 @@ export interface OffsetProject {
shortDescription: string;
imageUrl: string;
pricePerTon: number;
percentage?: number; // Added percentage field for project's contribution to portfolio
location: string;
type: string;
verificationStandard: string;