Build New Form Based on Updated Project Schema

[ankitbisen28]

Description: We need to build a new form that aligns with the updated project schema. The existing form needs to be revised to include new fields and structure as per the schema changes detailed below.

Current Schema:

const projectSchema = mongoose.Schema({
    "title": String,
    "description": String,
    "requirements": String,
    "budget": Number,
    "deadline": Date,
    "consumerId": String, // Reference to the user who posted the project
    "category": String,
    "images": [
        {
            "url": String, // URL of the image stored in an external service
            "description": String, // Optional description of the image
            "uploadedAt": Date // Timestamp when the image was uploaded
        }
    ],
    "bids": [
        {
            "bidderId": String, // Reference to the user who placed the bid
            "amount": Number,
            "message": String,
            "createdAt": Date
        }
    ],
    "selectedBidder": String, // Reference to the selected bidder (if any)
    "status": String, // "open", "closed", "in progress", "completed"
    "createdAt": Date,
    "updatedAt": Date
});

Tasks:

1. Form Layout:

   • Create a new form layout that includes all the fields from the updated schema.
   • Ensure the form fields are organized logically and intuitively for the user.

2. Form Fields:

   • title: Text input.
   • description: Textarea.
   • requirements: Textarea.
   • budget: Number input.
   • deadline: Date picker.
   • consumerId: Text input (hidden or pre-filled if the user is logged in).
   • category: Dropdown with predefined categories.
   • images:
     • Multiple file upload field for images.
     • Optional text input for image description.
   • bids: (This section may be dynamically generated based on bid submissions, not required in the initial form).
   • selectedBidder: Text input (hidden or read-only, to be set programmatically).
   • status: Dropdown with options ("open", "closed", "in progress", "completed").
   • createdAt and updatedAt: These fields should be handled automatically and do not need to be included in the form.

3. Form Validation:

   • Implement validation rules for each field based on the data type and requirements.
   • Ensure required fields are marked and validated.

4. UI/UX Considerations:

   • Ensure the form is responsive and works well on different devices.
   • Provide user feedback for form submission, success, and error states.

5. Integration:

   • Integrate the form with the backend to ensure data is submitted and stored as per the schema.
   • Handle image uploads appropriately and store image URLs in the database.

6. Testing:

   • Test the form thoroughly to ensure all fields are correctly captured and stored.
   • Include tests for form validation and submission.

Additional Notes:

• The existing form needs to be backed up before making changes.
• Ensure backward compatibility where possible.

Attachments/Resources:

• Provide any design mockups or wireframes if available.
• Link to the relevant documentation or previous issues if any.

---

Feel free to adjust any details as necessary. This template should cover all aspects required to build a new form based on the updated schema.