Skip to content

Prompts for VSCode AI Agent

Benjamin Ohene-Adu edited this page Jul 3, 2025 · 5 revisions

You are an expert full-stack developer of a system that provides farmers with crop recommendations and local supplier contacts, crop, using a hybrid architecture:

  • USSD for basic phone users with no internet access.
  • Mobile Web App (PWA) for enhanced smartphone functionality. Your task is to build GrowRight, a Crop Advisory Application with the following specifications:

Tech Stack:

  • Frontend: ReactJS (functional components + hooks), Tailwind CSS for styling, PWA support.
  • Backend: Node.js with Express.js, TypeScript.
  • ORM: Prisma for database access.
  • Database: SQLite (migrated from SQL Server for easier development).
  • Deployment: Initially in the local development environment.
  • Language: TypeScript for both frontend and backend.
  • UX: Modern styling with Ghana-focused design.
  • Authentication: JWT,
  • Frontend scaffolded with React, Tailwind CSS
  • Menu: Global menu system to facilitate navigation around the application

Development guidelines:

  • Use Prisma schema to define all entities described (User, Crop, Recommendation, Supplier, Location, Feedback, Notification, UserPreferences, AdminStaff, AuditLog, PaymentSubscription, Analytics).
  • Use Express.js routes to expose RESTful APIs.
  • React frontend to consume APIs and manage state using React Context or Redux.
  • Use Tailwind CSS or Bootstrap to build a clean, responsive UI.
  • Implement service worker and manifest.json for PWA capabilities.
  • Write clear, modular, and well-documented code.
  • Include error handling and input validation, both frontend and backend.
  • Include a README with setup instructions and usage.

We anticipate the following features provided by the GrowRight application:

Backend Features

  • User Management: User registration, authentication, and profile management.
  • Farm Management: CRUD operations for farms, including farm assets, with statistics endpoints.
  • Vendor Management: Vendor profile creation, update, and management, including business details and certifications.
  • Supplier Management: Supplier CRUD and crop association.
  • Crop Management: Users who are farmers should be able to manage crop information, including scientific, category, seasonality, and market data.
  • Task Management: CRUD for user tasks.
  • Marketplace Listings: CRUD for marketplace items.
  • Payment Transactions: The application should facilitate payment transaction records and subscriptions for services.
  • Feedback & Recommendations: User feedback, recommendations, and analytics.
  • Notifications: User notifications and audit logs.
  • Comprehensive API: RESTful endpoints for all entities, with Prisma ORM and Express.js
  • Implement offline PWA features

Frontend Features

  • Modern Dashboard: Overview and navigation for all major modules.
  • Crops Page: List/card display of crops with search and modern styling.
  • Farms Page: Full CRUD UI for farms, including statistics and asset management.
  • Vendors & Suppliers: Registration, listing, and management of vendors and suppliers.
  • Recommendations & Feedback: User feedback and recommendation management.
  • Authentication: Login and registration flows.
  • Responsive Navigation: Sidebar/topbar navigation with icons for all main sections.
  • Authorised users should have the ability to review recommendations
  • Include the ability for users to estimate distance between Supplier and Farmers in context
  • Integration with Leaflet.js for location based services
  • API Integration: All pages interact with backend APIs for real-time data.
  • Add vendor product management
  • Implement vendor review system
  • Add payment integration
  • Re-enable authentication when needed
  • Add comprehensive testing

Project Status:

COMPLETED:

  • Backend scaffolded with Express, Prisma, SQLite
  • Frontend scaffolded with React, Tailwind CSS
  • Database migrated from SQL Server to SQLite with sample data
  • Full TypeScript migration for both frontend and backend
  • Global Navigation component with user profile and mobile support
  • Settings page with tabbed interface
  • Authentication system with MockAuthContext (Ghana phone numbers)
  • All content adapted for Ghana context (phone numbers, locations, test users)
  • Demo mode implemented - authentication disabled for testing
  • Vendor data entities added to schema (VendorProfile, VendorProduct, VendorReview)
  • VendorRegistrationPage for multi-step vendor registration
  • Backend vendor API endpoints and controllers
  • Vendor dashboard with mock data
  • Navigation integration for vendor features

When in demo mode, the banner is displayed

  • All routes are public (no authentication required)
  • Users can register as Vendor, TradesPerson (Buyer), Farmer or Guest User
  • Vendor registration integrates with the backend API
  • MockAuthContext provides demo user data with Ghana phone numbers

Features Implemented:

  1. User Management:

    • Ghana phone number-based authentication (+233 format)
    • User roles: FARMER, VENDOR, TRADESPERSON, INFORMATION_CONSUMER, ADMIN
    • User profile and preferences management
    • MockAuthContext for demo mode
  2. Vendor System:

    • Multi-step vendor registration process
    • Vendor profile management with business information
    • Product and service offerings
    • Review and rating system
    • Vendor dashboard with analytics
  3. Global Navigation:

    • Responsive navigation with mobile support
    • User profile dropdown with avatar (initials)
    • Demo mode banner
    • Vendor-specific navigation options
  4. Database Schema:

    • User model with Ghana phone numbers
    • VendorProfile with business details
    • VendorProduct for vendor offerings
    • VendorReview for customer feedback
    • All other entities (Crop, Recommendation, Supplier, etc.)
  5. Ghana-Specific Features:

    • Ghana phone number validation
    • Ghana locations and context
    • Currency display in Ghana Cedis (₵)
    • Local business types and services

Test Data:

  • Demo User: +233241111111 (Kwame Asante) - FARMER
  • Vendor User: +233542222222 (Akosua Mensah) - VENDOR
  • Admin User: +233200000000 (Super Admin) - ADMIN

API Endpoints:

  • POST /api/vendors/register - Register new vendor
  • GET /api/vendors - Get all vendors
  • GET /api/vendors/:id - Get vendor profile
  • PUT /api/vendors/:id - Update vendor profile
  • DELETE /api/vendors/:id - Delete vendor profile

Ghana Context:

  • Phone numbers: +233 format validation
  • Locations: Ghana regions and cities
  • Business types: Seeds, fertilizers, equipment, consulting
  • Payment methods: Mobile money, bank transfer, cash
  • Local languages: English (primary), Twi, Ga, Ewe support planned

Development Guidelines:

  • All code in TypeScript
  • Use Tailwind CSS for consistent styling
  • Ghana-focused user experience
  • Mobile-first responsive design
  • Comprehensive error handling
  • Input validation (especially phone numbers)
  • Clean, modular, well-documented code

The application is currently in demo mode with all authentication disabled for easy testing and development.

Features to implement:

  1. User Management:

    • User registration and login (phone number-based authentication).
    • User profile and preferences management.
    • Roles: Regular User and Admin.
  2. Crop Recommendations:

    • Users input basic details (crop and location via GPS or LGA).
    • Backend fetches crop data and calculates personalised recommendations.
    • Recommendations were returned and displayed on the front end.
  3. Supplier Matching:

    • Find and list suppliers matching the user’s location (GPS or LGA).
    • Display supplier details and contact info.
  4. Feedback System:

    • Users can submit feedback on recommendations.
    • Feedback is stored and accessible by the Admin.
  5. Notification System:

    • SMS notification integration placeholder (simulate SMS gateway).
    • Log notification status and history.
  6. Analytics & Logging:

    • Log user actions like recommendations viewed and feedback submitted.
    • The admin uses a basic audit log to track important actions.
  7. PWA Features:

    • Offline support with cached data.
    • Responsive design for mobile-friendly use.

Deliverables:

COMPLETED:

  • Prisma schema file with vendor entities
  • Express.js backend with TypeScript and vendor API endpoints
  • React app with TypeScript, components, routing, and Tailwind styling
  • Ghana-focused authentication system (MockAuthContext)
  • Global navigation system with user profile management
  • Vendor registration and dashboard functionality
  • Database integration with SQLite and sample seed data
  • Comprehensive documentation and README

STILL NEEDED:

  • PWA setup (service worker, manifest) - partially implemented
  • Offline functionality and caching
  • Comprehensive testing suite
  • Production deployment configuration
  • Advanced vendor features (products, reviews)
  • Payment integration for vendor services
  • SMS/email notification system
  • Advanced analytics and reporting

Current Focus:

The application now supports complete vendor registration and management, with users able to register as vendors, tradespeople, or information consumers. All features are built with Ghana's agricultural market in mind, including local phone number formats, business types, and payment methods.

The app is currently in demo mode for easy testing and development, with authentication temporarily disabled and a demo user always logged in.

Phase 3 List of API endpoints that should be in place for full functionality of the GrowRight application:

User APIs POST /api/auth/register — Register a new user POST /api/auth/login — User login GET /api/users — List all users GET /api/users/:id — Get user by ID PUT /api/users/:id — Update user DELETE /api/users/:id — Delete user

Farm APIs GET /api/farms — List all farms (with optional filters) GET /api/farms/:id — Get farm by ID POST /api/farms — Create a new farm PUT /api/farms/:id — Update a farm DELETE /api/farms/:id — Delete a farm GET /api/farms/statistics — Get farm statistics

Farm Asset APIs GET /api/farm-assets — List all farm assets GET /api/farm-assets/:id — Get farm asset by ID POST /api/farm-assets — Create a new farm asset PUT /api/farm-assets/:id — Update a farm asset DELETE /api/farm-assets/:id — Delete a farm asset

Crop APIs GET /api/crops — List all crops (with search/filter) GET /api/crops/:id — Get crop by ID POST /api/crops — Create a new crop PUT /api/crops/:id — Update a crop DELETE /api/crops/:id — Delete a crop

Vendor Profile APIs GET /api/vendors — List all vendor profiles GET /api/vendors/:id — Get vendor profile by ID POST /api/vendors/register — Register a new vendor profile PUT /api/vendors/:id — Update vendor profile DELETE /api/vendors/:id — Delete vendor profile

Supplier APIs GET /api/suppliers — List all suppliers GET /api/suppliers/:id — Get supplier by ID POST /api/suppliers — Create a new supplier PUT /api/suppliers/:id — Update supplier DELETE /api/suppliers/:id — Delete supplier

Product APIs (for Vendor/Supplier) GET /api/products — List all products GET /api/products/:id — Get product by ID POST /api/products — Create a new product PUT /api/products/:id — Update product DELETE /api/products/:id — Delete product

Review APIs GET /api/reviews — List all reviews GET /api/reviews/:id — Get review by ID POST /api/reviews — Create a new review PUT /api/reviews/:id — Update review DELETE /api/reviews/:id — Delete review

Task APIs GET /api/tasks — List all tasks GET /api/tasks/:id — Get task by ID POST /api/tasks — Create a new task PUT /api/tasks/:id — Update task DELETE /api/tasks/:id — Delete task

Marketplace Listing APIs GET /api/marketplace-listings — List all listings GET /api/marketplace-listings/:id — Get listing by ID POST /api/marketplace-listings — Create a new listing PUT /api/marketplace-listings/:id — Update listing DELETE /api/marketplace-listings/:id — Delete listing

Payment Transaction APIs GET /api/payment-transactions — List all transactions GET /api/payment-transactions/:id — Get transaction by ID POST /api/payment-transactions — Create a new transaction PUT /api/payment-transactions/:id — Update transaction DELETE /api/payment-transactions/:id — Delete transaction

Feedback APIs GET /api/feedback — List all feedback GET /api/feedback/:id — Get feedback by ID POST /api/feedback — Submit feedback PUT /api/feedback/:id — Update feedback DELETE /api/feedback/:id — Delete feedback

Recommendation APIs GET /api/recommendations — List all recommendations GET /api/recommendations/:id — Get recommendation by ID POST /api/recommendations — Create a new recommendation PUT /api/recommendations/:id/: id — Update recommendation DELETE /api/recommendations/:id — Delete recommendation

Notification APIs GET /api/notifications — List all notifications GET /api/notifications/:id — Get notification by ID POST /api/notifications — Create a new notification PUT /api/notifications/:id — Update notification DELETE /api/notifications/:id — Delete notification

Analytics APIs GET /api/analytics — List analytics events POST /api/analytics — Log an analytics event

Phase 05

Based on the workspace, here’s how the structure of the GrowRight project looks:

GrowRight/ ├── backend/ │ ├── prisma/ │ │ ├── schema.prisma # Prisma ORM schema (all models, relations) │ │ ├── custom_scripts.sql # Custom SQL scripts (table creation, etc.) │ ├── src/ │ │ ├── controllers/ # Express controllers (e.g., farmController.ts, vendorController.ts) │ │ ├── routes/ # Express route definitions (e.g., farmRoutes.ts, userRoutes.ts) │ │ ├── services/ # Business logic/services (e.g., farmService.ts, api integrations) │ │ ├── middleware/ # Express middleware (e.g., error handling, auth) │ │ ├── utils/ # Utility functions (e.g., logger) │ │ ├── server.ts # Main Express app entry point (TypeScript) │ │ └── server.js # (Optional) Compiled or legacy JS entry point │ ├── package.json # Backend dependencies and scripts │ ├── tsconfig.json # TypeScript config for backend │ └── ... # Other backend config files │ ├── frontend/ │ ├── src/ │ │ ├── components/ # Reusable React components (e.g., Navigation.js, Layout.js) │ │ ├── pages/ # Page-level React components (e.g., FarmsPage.js, CropsPage.js) │ │ ├── services/ # API service layer (e.g., api.js) │ │ ├── context/ # React context providers (e.g., AuthContext) │ │ ├── hooks/ # Custom React hooks │ │ ├── App.js # Main React app entry point │ │ ├── index.js # ReactDOM render entry │ │ └── index.css # Global styles │ ├── package.json # Frontend dependencies and scripts │ ├── tsconfig.json # TypeScript config for frontend (if using TS) │ └── ... # Other frontend config files │ ├── GrowRight.prompt # Project prompt/requirements/notes └── ... # Other project-level files (README, .env, etc.)

Key points:

The backend is organised by feature (controllers, routes, services, middleware). The frontend uses a modern React structure with clear separation of components, pages, and services. Prisma is used for database modelling and migrations. There is a clear separation between backend and frontend codebases.

PHASE 06 Here are some valuable and practical scenarios you can explore and implement as you develop the MarketplaceListings feature in GrowRight:

  1. Listing Creation and Management Users can create, edit, and delete their listings on the marketplace. Users can upload images and add rich descriptions to their listings. Listings can be set as active or inactive, or scheduled for future publication.
  2. Search and Filtering Users can search listings by keywords, category, price range, location, or crop type. Advanced filters: sort by newest, price, popularity, or proximity.
  3. User Interactions Users can favourite or bookmark listings for later. Users can contact the listing owner via in-app messaging or email. Users can report listings that are inappropriate or fraudulent.
  4. Transactions and Offers Buyers can make offers or negotiate prices with sellers. Integration with the Transactions table for secure payments. Track listing status: available, pending, sold, or withdrawn.
  5. Reviews and Ratings After a transaction, buyers can leave reviews and ratings for sellers. Display average seller ratings on listings.
  6. Analytics and Insights Track views, clicks, and conversion rates for each listing. Provide sellers with insights on their listing performance.
  7. Moderation and Compliance Admins can review, approve, or remove listings that violate policies. Automated checks for prohibited items or spam.
  8. Notifications Please just notify users when their listing receives an offer, is about to expire, or is sold. Could you please notify buyers about new listings that match their interests?
  9. Integration with Other Features Link listings to farm assets, crops, or vendor profiles for richer context. Allow bulk listing uploads for vendors.

PHASE 07 Here are some practical ideas and usage scenarios for integrating Leaflet.js into your GrowRight application:

  1. Farm and Asset Mapping

    Display farm locations on an interactive map, allowing users to see all their farms visually. Show farm assets (tractors, irrigation systems, etc.) as markers within farm boundaries.

  2. Crop Distribution Visualisation Could you show where different crops are grown across regions or farms? Use coloured markers or polygons to represent different crop types and their corresponding densities.

  3. Vendor and Marketplace Listings Map Display vendor locations and marketplace listings on a map, enabling buyers to find nearby products or services easily. Enable users to filter listings by proximity.

  4. Location Selection and Geocoding Allow users to select or update their farm’s location by clicking on the map. Use reverse geocoding to auto-fill address fields based on map selection.

  5. Route Planning and Logistics Help users plan delivery or supply routes between farms, vendors, and buyers. Display optimal routes and estimated travel times.

  6. Weather and Environmental Overlays Overlay weather data (rainfall, temperature, drought risk) on the map for each farm or region. Show soil type, elevation, or satellite imagery as map layers.

  7. Task and Activity Tracking Please indicate where farm tasks (such as planting, spraying, and harvesting) are scheduled or completed. Use icons or coloured areas to indicate the status of tasks.

  8. Analytics and Insights Heatmaps to show areas with high activity, sales, or crop yield. Cluster markers for dense data points (e.g., many listings in a city).

  9. User Engagement Allow users to draw or edit farm boundaries and save them to the database. Enable sharing of farm or listing locations via map links.

Clone this wiki locally