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:21:05 +02:00
parent 279098e9fa
commit 7be9fc3722
1 changed files with 3 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/components/OffsetOrder.tsx
View File

@ -64,9 +64,6 @@ export function OffsetOrder({ tons, monetaryAmount, onBack, calculatorType }: Pr
fetchPortfolio();
}, []);
const [portfolios, setPortfolios] = useState<Portfolio[]>([]);
const [selectedPortfolioId, setSelectedPortfolioId] = useState<number | null>(null);
const fetchPortfolio = async () => {
try {
const allPortfolios = await getPortfolios();
@ -76,21 +73,19 @@ export function OffsetOrder({ tons, monetaryAmount, onBack, calculatorType }: Pr
throw new Error('No portfolios available');
}
setPortfolios(allPortfolios);
// Set default portfolio - prefer one with "puffin" in the name, otherwise first one
// Only get the puffin portfolio, no selection allowed
const puffinPortfolio = allPortfolios.find(p =>
p.name.toLowerCase().includes('puffin') ||
p.name.toLowerCase().includes('maritime')
);
if (puffinPortfolio) {
console.log('[OffsetOrder] Found Puffin portfolio with ID:', puffinPortfolio.id);
setPortfolio(puffinPortfolio);
setSelectedPortfolioId(puffinPortfolio.id);
} else {
// Default to first portfolio if no puffin portfolio found
console.log('[OffsetOrder] No Puffin portfolio found, using first available portfolio with ID:', allPortfolios[0].id);
setPortfolio(allPortfolios[0]);
setSelectedPortfolioId(allPortfolios[0].id);
}
} catch (err) {
setError('Failed to fetch portfolio information. Please try again.');
@ -99,15 +94,6 @@ export function OffsetOrder({ tons, monetaryAmount, onBack, calculatorType }: Pr
}
};
// Handle portfolio selection change
const handlePortfolioChange = (portfolioId: number) => {
const selected = portfolios.find(p => p.id === portfolioId);
if (selected) {
setPortfolio(selected);
setSelectedPortfolioId(portfolioId);
}
};
const handleOffsetOrder = async () => {
if (!portfolio) return;
@ -311,52 +297,6 @@ export function OffsetOrder({ tons, monetaryAmount, onBack, calculatorType }: Pr
</div>
) : portfolio ? (
<>
{portfolios.length > 0 && (
<div className="mb-8">
<h3 className="text-lg font-semibold text-gray-900 mb-4">
Select A Carbon Offset Portfolio
</h3>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
{portfolios.map((p) => (
<div
key={p.id}
onClick={() => handlePortfolioChange(p.id)}
className={`cursor-pointer border rounded-lg p-4 transition-all ${
selectedPortfolioId === p.id
? 'border-blue-500 bg-blue-50 shadow-md'
: 'border-gray-200 hover:border-blue-300 hover:bg-blue-50'
}`}
>
<div className="flex justify-between items-start mb-2">
<h4 className="text-lg font-medium text-gray-900">{p.name}</h4>
{selectedPortfolioId === p.id && (
<div className="bg-blue-500 text-white rounded-full p-1">
<Check size={16} />
</div>
)}
</div>
<p className="text-sm text-gray-600 mb-3 line-clamp-2">
{p.description}
</p>
<div className="flex justify-between items-center">
<div className="text-xs text-gray-500">
{p.projects?.length || 0} project{p.projects?.length !== 1 ? 's' : ''}
</div>
<div className="text-blue-600 font-semibold">
{formatCurrency(p.pricePerTon, getCurrencyByCode(currency))}/ton
</div>
</div>
</div>
))}
</div>
<p className="mt-4 text-sm text-gray-500">
Click on a portfolio to select which climate projects you'd like to support.
</p>
</div>
)}
<div className="bg-white border rounded-lg p-6 mb-8">
<h3 className="text-xl font-semibold text-gray-900 mb-4">
{portfolio.name}