Added Ticket Page with Ticket Management, Filters, and Header Banner

[IkkiOcean]

Description:
This PR introduces the complete support page for managing tickets, including the following features:

• Header Banner: A flashy, animated banner with a gradient background and a "Get Help Now" button.
• Ticket Submission Form: Allows users to submit new tickets with a subject, description, and priority level.
• Ticket Filters: Enables filtering tickets by status, priority, and search term.
• Ticket List: Displays a list of tickets with key details such as ID, subject, status, priority, agent, and creation date.
• Ticket Detail Modal: Shows additional information about a selected ticket.

---

Features Added:

1. Header Banner:

   • Introduced a vibrant, animated header banner with a gradient background.
   • The banner includes a heading, a description, and a "Get Help Now" button.
   • Fade-in animations have been applied to the text and button elements.

2. Ticket Form:

   • A form where users can input the subject, description, and priority of their support ticket.
   • Users can upload files associated with the ticket.

3. Ticket Filters:

   • Filters for sorting tickets by status and priority.
   • A search bar for finding tickets based on subject or ID.

4. Ticket List:

   • Displayed a list of tickets with relevant details like ticket ID, subject, status, priority, agent name, and the creation date.
   • Tickets are displayed in a table format for better readability.

5. Ticket Detail Modal:

   • Modal window to view more detailed information about a selected ticket.

---

File Changes:

• TicketUser.js: The main component that integrates the entire functionality.
• HeaderBanner.js: New component for the animated header banner.
• TicketForm.js: Form for creating new tickets.
• TicketFilters.js: Component for filtering and searching tickets.
• TicketList.js: Displays the list of tickets.
• TicketDetailModal.js: Modal to show detailed information of a selected ticket.
• MainContext.jsx Integrated the TicketUser component into the main app.

---

Tailwind CSS Customization:

• Added custom utility classes for the header banner’s gradient and animations.
• Tailwind classes such as bg-gradient-to-r, text-white, and shadow-lg were used to style the header and other components.
• Integrated the animate.css library for smooth fade-in animations.

Screenshots/Visuals:

rt.mp4

---

Related Issues:

• Closes Implement Ticket Creation and Raised Tickets View Page for Users #964

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
agro-tech-ai	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 10, 2024 5:38am

[github-actions]

Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, please ensure that your changes align with our CONTRIBUTING.md. If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊

[github-actions]

🎉 Your pull request has been successfully merged! 🎉 Thank you for your valuable contribution to our project. Your efforts are greatly appreciated. Feel free to reach out if you have any more contributions or if there's anything else we can assist you with. Keep up the fantastic work! 🚀