Donor Portal

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Production Deployment

Data Refresh

This app syncs data from Airtable to PostgreSQL.

Documentation:

• 📖 PRODUCTION_DEPLOYMENT.md - Deployment strategies and setup
• 🔧 VERCEL_CRON_TROUBLESHOOTING.md - Start here if refresh not working
• 📝 LOGGING_GUIDE.md - Understanding logs

Quick Start:

• Manual: Click refresh button in UI (60s timeout, may fail for large datasets)
• Recommended: Use scheduled cron job via API route (requires Vercel Pro)
• Alternative: GitHub Actions or external cron service (free)
• Monitoring: Check Vercel logs for detailed timestamped progress

Test the endpoint:

node scripts/test-refresh.js https://your-domain.vercel.app your-cron-secret

Important: Server actions have strict timeouts. For production, use the /api/refresh endpoint or scheduled cron jobs.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Maintenance

Check for issues

npm audit          # Security vulnerabilities
npm outdated       # Outdated packages
npm run lint       # ESLint errors
npx tsc --noEmit   # TypeScript errors

Update packages

npm update                                              # Safe patch/minor updates
npm install next@latest eslint-config-next@latest       # Update Next.js

Update shadcn/ui components

npx shadcn@latest diff                                  # Check for component updates
npx shadcn@latest add <component-name> --overwrite      # Update specific component

Clean install (if issues occur)

rm -rf node_modules .next && npm install

Good to know

• use npx shadcn@latest add <component-name> when you need to add components.

• https://nextjs.org/docs/app/api-reference/file-conventions/src-folder

• https://nextjs.org/docs/app/getting-started/project-structure

• The /public directory should remain in the root of your project.

• Config files like package.json, next.config.js and tsconfig.json should remain in the root of your project.

• .env.* files should remain in the root of your project.

• src/app or src/pages will be ignored if app or pages are present in the root directory.

• If you are using a src directory, consider moving other application folders such as /components or /lib into src for consistency.

• If you are using a Proxy, ensure it is placed inside the src folder.

• When using Tailwind CSS, add the /src prefix to the content array in your tailwind.config.js file to ensure proper scanning.

• If you use TypeScript path aliases like @/*, update the paths object in tsconfig.json to include src/.

Regarding /impact

Some decisions/approaches:

1. Since the map was using UN geoscheme which didn't have a documented library of its own, it is currently defined in the code itself, once that is finalised we can bring it out into a 'dataset' in sheets/airtable and use that instead.
2. Same ^ for the different categories for project impact
3. One round of checks to see if every button takes you to the correct page is required, including a check with Ella/Antje to confirm if all the impact stories/project pages exist, what the format of the link is, and if it exists in the airtable and can simply be replaced in the fetch
4. Since all the data it uses is the same as the /partners page, be careful to change the variable names, or even rerunning the fecth from airtablein case any variable names have been changed there