@djangocfg/ext-support 1.0.0

package/README.md

@@ -0,0 +1,233 @@
+# @djangocfg/ext-support
+
+Customer support and ticketing system extension for DjangoCFG.
+
+**Part of [DjangoCFG](https://djangocfg.com)** — modern Django framework for production-ready SaaS applications.
+
+## Features
+
+- 🎫 **Ticket Management** - Create, track, and resolve support tickets
+- 💬 **Real-time Chat** - Live chat support integration
+- 📧 **Email Integration** - Convert emails to tickets automatically
+- 🏷️ **Categories & Tags** - Organize tickets with custom categories
+- 👥 **Team Assignment** - Assign tickets to support agents
+- 📊 **Analytics** - Track response times and resolution rates
+- 🔔 **Notifications** - Real-time ticket updates
+- 📎 **Attachments** - Support for file attachments
+
+## Install
+
+```bash
+pnpm add @djangocfg/ext-support
+```
+
+## Usage
+
+### Provider Setup
+
+```typescript
+import { SupportExtensionProvider } from '@djangocfg/ext-support/hooks';
+
+export default function RootLayout({ children }) {
+  return (
+    <SupportExtensionProvider>
+      {children}
+    </SupportExtensionProvider>
+  );
+}
+```
+
+### Create Support Ticket
+
+```typescript
+import { useSupportContext } from '@djangocfg/ext-support/hooks';
+
+function ContactSupport() {
+  const { createTicket, isCreatingTicket } = useSupportContext();
+
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    const formData = new FormData(e.currentTarget);
+
+    await createTicket({
+      subject: formData.get('subject') as string,
+      description: formData.get('description') as string,
+      category: 'technical',
+      priority: 'medium',
+    });
+  };
+
+  return (
+    <form onSubmit={handleSubmit}>
+      <input name="subject" placeholder="Subject" required />
+      <textarea name="description" placeholder="Describe your issue" required />
+      <button type="submit" disabled={isCreatingTicket}>
+        {isCreatingTicket ? 'Submitting...' : 'Submit Ticket'}
+      </button>
+    </form>
+  );
+}
+```
+
+### View Tickets
+
+```typescript
+import { useSupportContext } from '@djangocfg/ext-support/hooks';
+
+function TicketsPage() {
+  const { tickets, isLoadingTickets, updateTicket } = useSupportContext();
+
+  const handleStatusChange = async (ticketId: string, status: string) => {
+    await updateTicket(ticketId, { status });
+  };
+
+  return (
+    <div>
+      <h2>Support Tickets</h2>
+      {tickets.map(ticket => (
+        <div key={ticket.id}>
+          <h3>{ticket.subject}</h3>
+          <p>{ticket.description}</p>
+          <span>Status: {ticket.status}</span>
+          <span>Priority: {ticket.priority}</span>
+          <select
+            value={ticket.status}
+            onChange={(e) => handleStatusChange(ticket.id, e.target.value)}
+          >
+            <option value="open">Open</option>
+            <option value="in_progress">In Progress</option>
+            <option value="resolved">Resolved</option>
+            <option value="closed">Closed</option>
+          </select>
+        </div>
+      ))}
+    </div>
+  );
+}
+```
+
+### Ticket Details with Comments
+
+```typescript
+import { useSupportContext } from '@djangocfg/ext-support/hooks';
+
+function TicketDetails({ ticketId }: { ticketId: string }) {
+  const { getTicketById, addComment } = useSupportContext();
+  const [ticket, setTicket] = useState(null);
+
+  useEffect(() => {
+    getTicketById(ticketId).then(setTicket);
+  }, [ticketId]);
+
+  const handleAddComment = async (text: string) => {
+    await addComment(ticketId, {
+      text,
+      is_internal: false,
+    });
+    // Refresh ticket
+    getTicketById(ticketId).then(setTicket);
+  };
+
+  if (!ticket) return <div>Loading...</div>;
+
+  return (
+    <div>
+      <h2>{ticket.subject}</h2>
+      <p>{ticket.description}</p>
+
+      <div>
+        <h3>Comments</h3>
+        {ticket.comments?.map(comment => (
+          <div key={comment.id}>
+            <strong>{comment.author}</strong>
+            <p>{comment.text}</p>
+            <span>{new Date(comment.created_at).toLocaleString()}</span>
+          </div>
+        ))}
+      </div>
+
+      <textarea
+        placeholder="Add a comment..."
+        onKeyDown={(e) => {
+          if (e.key === 'Enter' && !e.shiftKey) {
+            e.preventDefault();
+            handleAddComment(e.currentTarget.value);
+            e.currentTarget.value = '';
+          }
+        }}
+      />
+    </div>
+  );
+}
+```
+
+### Ticket Filters
+
+```typescript
+import { useSupportContext } from '@djangocfg/ext-support/hooks';
+
+function TicketFilters() {
+  const { tickets, filterTickets } = useSupportContext();
+
+  const handleFilter = (status: string) => {
+    filterTickets({ status });
+  };
+
+  return (
+    <div>
+      <button onClick={() => handleFilter('open')}>
+        Open ({tickets.filter(t => t.status === 'open').length})
+      </button>
+      <button onClick={() => handleFilter('in_progress')}>
+        In Progress ({tickets.filter(t => t.status === 'in_progress').length})
+      </button>
+      <button onClick={() => handleFilter('resolved')}>
+        Resolved ({tickets.filter(t => t.status === 'resolved').length})
+      </button>
+    </div>
+  );
+}
+```
+
+## API Reference
+
+### Support Context
+
+- `tickets` - List of all tickets
+- `createTicket(data)` - Create new ticket
+- `updateTicket(id, data)` - Update ticket
+- `deleteTicket(id)` - Delete ticket
+- `getTicketById(id)` - Get ticket details
+- `addComment(ticketId, data)` - Add comment to ticket
+- `assignTicket(ticketId, agentId)` - Assign ticket to agent
+- `closeTicket(id)` - Close ticket
+- `reopenTicket(id)` - Reopen closed ticket
+- `filterTickets(filters)` - Filter tickets by criteria
+- `isLoadingTickets` - Loading state
+- `isCreatingTicket` - Creation state
+
+## Ticket Properties
+
+```typescript
+interface Ticket {
+  id: string;
+  subject: string;
+  description: string;
+  status: 'open' | 'in_progress' | 'resolved' | 'closed';
+  priority: 'low' | 'medium' | 'high' | 'urgent';
+  category: string;
+  assigned_to?: string;
+  created_at: string;
+  updated_at: string;
+  comments?: Comment[];
+}
+```
+
+## License
+
+MIT
+
+## Links
+
+- [DjangoCFG Documentation](https://djangocfg.com)
+- [GitHub](https://github.com/markolofsen/django-cfg)