update
This commit is contained in:
Iliyan Angelov
444
POLICY_API_SETUP.md
Normal file
444
POLICY_API_SETUP.md
Normal file
@@ -0,0 +1,444 @@
|
||||
# Policy API Setup - Complete Guide
|
||||
|
||||
## 🎉 Summary
|
||||
|
||||
Successfully created a comprehensive Policy Management System with:
|
||||
- **3 Policy Types**: Privacy Policy, Terms of Use, Support Policy
|
||||
- **Professional Enterprise Content**: 13-15 sections per policy with detailed legal and operational information
|
||||
- **Full CRUD API**: RESTful API endpoints for managing policies
|
||||
- **Dynamic Frontend**: React-based policy viewer with loading states and error handling
|
||||
|
||||
---
|
||||
|
||||
## 📋 What Was Created
|
||||
|
||||
### Backend (Django)
|
||||
|
||||
#### 1. **Models** (`backend/policies/models.py`)
|
||||
- `Policy`: Main policy document with metadata (type, title, version, effective date)
|
||||
- `PolicySection`: Individual sections within each policy
|
||||
|
||||
#### 2. **API Views** (`backend/policies/views.py`)
|
||||
- `PolicyViewSet`: RESTful viewset for policy CRUD operations
|
||||
- Endpoints support filtering by type
|
||||
- Retrieve by ID or policy type
|
||||
|
||||
#### 3. **Serializers** (`backend/policies/serializers.py`)
|
||||
- `PolicySerializer`: Full policy with all sections
|
||||
- `PolicyListSerializer`: Simplified list view
|
||||
- `PolicySectionSerializer`: Individual section data
|
||||
|
||||
#### 4. **Admin Interface** (`backend/policies/admin.py`)
|
||||
- Full admin panel integration
|
||||
- Inline section editing
|
||||
- List filters and search functionality
|
||||
|
||||
#### 5. **Management Command** (`backend/policies/management/commands/populate_policies.py`)
|
||||
- Command: `python manage.py populate_policies`
|
||||
- Creates/updates all 3 policies with professional content
|
||||
- 42 total sections across all policies
|
||||
|
||||
### Frontend (Next.js)
|
||||
|
||||
#### 1. **API Service** (`lib/api/policyService.ts`)
|
||||
- `getPolicies()`: Fetch all policies
|
||||
- `getPolicyByType(type)`: Fetch specific policy
|
||||
- `getPolicyById(id)`: Fetch by ID
|
||||
|
||||
#### 2. **React Hook** (`lib/hooks/usePolicy.ts`)
|
||||
- `usePolicies()`: Hook for all policies
|
||||
- `usePolicy(type)`: Hook for specific policy
|
||||
- `usePolicyById(id)`: Hook for policy by ID
|
||||
|
||||
#### 3. **Policy Page** (`app/policy/page.tsx`)
|
||||
- Dynamic page showing policy content
|
||||
- Query parameter: `?type=privacy|terms|support`
|
||||
- Loading and error states
|
||||
- Responsive design
|
||||
- Styled with inline styles
|
||||
|
||||
#### 4. **Support Center Integration** (`components/pages/support/SupportCenterHero.tsx`)
|
||||
- Added 3 new clickable cards:
|
||||
- Privacy Policy → `/policy?type=privacy`
|
||||
- Terms of Use → `/policy?type=terms`
|
||||
- Support Policy → `/policy?type=support`
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Setup Complete!
|
||||
|
||||
### What Was Done:
|
||||
|
||||
```bash
|
||||
# 1. Created migrations
|
||||
python manage.py makemigrations policies
|
||||
✅ Created: policies/migrations/0001_initial.py
|
||||
|
||||
# 2. Applied migrations
|
||||
python manage.py migrate policies
|
||||
✅ Created database tables
|
||||
|
||||
# 3. Populated with content
|
||||
python manage.py populate_policies
|
||||
✅ Privacy Policy: 13 sections
|
||||
✅ Terms of Use: 14 sections
|
||||
✅ Support Policy: 15 sections
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📡 API Endpoints
|
||||
|
||||
### Base URL
|
||||
```
|
||||
http://localhost:8000/api/policies/
|
||||
```
|
||||
|
||||
### Available Endpoints
|
||||
|
||||
#### 1. **List All Policies**
|
||||
```
|
||||
GET /api/policies/
|
||||
```
|
||||
**Response:**
|
||||
```json
|
||||
[
|
||||
{
|
||||
"id": 1,
|
||||
"type": "privacy",
|
||||
"title": "Privacy Policy",
|
||||
"slug": "privacy",
|
||||
"description": "Our commitment to protecting your privacy and personal data",
|
||||
"last_updated": "2025-10-08",
|
||||
"version": "2.1"
|
||||
},
|
||||
...
|
||||
]
|
||||
```
|
||||
|
||||
#### 2. **Get Specific Policy by Type**
|
||||
```
|
||||
GET /api/policies/privacy/
|
||||
GET /api/policies/terms/
|
||||
GET /api/policies/support/
|
||||
```
|
||||
**Response:**
|
||||
```json
|
||||
{
|
||||
"id": 1,
|
||||
"type": "privacy",
|
||||
"title": "Privacy Policy",
|
||||
"slug": "privacy",
|
||||
"description": "Our commitment to protecting your privacy and personal data",
|
||||
"last_updated": "2025-10-08",
|
||||
"version": "2.1",
|
||||
"effective_date": "2025-10-08",
|
||||
"sections": [
|
||||
{
|
||||
"id": 1,
|
||||
"heading": "1. Introduction and Scope",
|
||||
"content": "GNX Software Solutions...",
|
||||
"order": 1
|
||||
},
|
||||
...
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
#### 3. **Get Policy by ID**
|
||||
```
|
||||
GET /api/policies/{id}/
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🎨 Frontend Usage
|
||||
|
||||
### 1. **Direct Navigation**
|
||||
```typescript
|
||||
// Link to policies from anywhere
|
||||
<a href="/policy?type=privacy">Privacy Policy</a>
|
||||
<a href="/policy?type=terms">Terms of Use</a>
|
||||
<a href="/policy?type=support">Support Policy</a>
|
||||
```
|
||||
|
||||
### 2. **Using the Hook**
|
||||
```typescript
|
||||
import { usePolicy } from '@/lib/hooks/usePolicy';
|
||||
|
||||
function MyComponent() {
|
||||
const { data: policy, isLoading, error } = usePolicy('privacy');
|
||||
|
||||
if (isLoading) return <div>Loading...</div>;
|
||||
if (error) return <div>Error: {error.message}</div>;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>{policy.title}</h1>
|
||||
{policy.sections.map(section => (
|
||||
<div key={section.id}>
|
||||
<h2>{section.heading}</h2>
|
||||
<p>{section.content}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
### 3. **Support Center Cards**
|
||||
The support center hero now has 6 cards:
|
||||
- **Top Row** (Opens Modals):
|
||||
- Submit Tickets
|
||||
- Knowledge Base
|
||||
- Track Status
|
||||
- **Bottom Row** (Navigates to Policy Page):
|
||||
- Privacy Policy
|
||||
- Terms of Use
|
||||
- Support Policy
|
||||
|
||||
---
|
||||
|
||||
## 📝 Policy Content Overview
|
||||
|
||||
### Privacy Policy (13 Sections)
|
||||
1. Introduction and Scope
|
||||
2. Information We Collect
|
||||
3. How We Collect Information
|
||||
4. Use of Information
|
||||
5. Information Sharing and Disclosure
|
||||
6. Data Security
|
||||
7. Data Retention
|
||||
8. Your Rights and Choices
|
||||
9. International Data Transfers
|
||||
10. Cookies and Tracking Technologies
|
||||
11. Children's Privacy
|
||||
12. Changes to This Privacy Policy
|
||||
13. Contact Information
|
||||
|
||||
### Terms of Use (14 Sections)
|
||||
1. Acceptance of Terms
|
||||
2. Service Description and Scope
|
||||
3. User Accounts and Registration
|
||||
4. Acceptable Use Policy
|
||||
5. Intellectual Property Rights
|
||||
6. Service Level Agreements
|
||||
7. Payment Terms and Billing
|
||||
8. Term and Termination
|
||||
9. Disclaimer of Warranties
|
||||
10. Limitation of Liability
|
||||
11. Dispute Resolution and Governing Law
|
||||
12. Modifications to Terms
|
||||
13. General Provisions
|
||||
14. Contact Information
|
||||
|
||||
### Support Policy (15 Sections)
|
||||
1. Support Overview and Commitment
|
||||
2. Support Coverage and Eligibility
|
||||
3. Support Channels and Access Methods
|
||||
4. Business Hours and Availability
|
||||
5. Priority Levels and Response Times
|
||||
6. Support Request Submission Requirements
|
||||
7. Support Scope and Covered Activities
|
||||
8. Exclusions and Limitations
|
||||
9. Escalation Procedures
|
||||
10. Knowledge Base and Self-Service Resources
|
||||
11. Customer Responsibilities
|
||||
12. Scheduled Maintenance and Updates
|
||||
13. Service Level Credits and Remedies
|
||||
14. Feedback and Continuous Improvement
|
||||
15. Contact Information and Resources
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Admin Panel
|
||||
|
||||
Access the admin panel to manage policies:
|
||||
|
||||
```
|
||||
http://localhost:8000/admin/policies/
|
||||
```
|
||||
|
||||
**Features:**
|
||||
- ✅ Create/Edit/Delete policies
|
||||
- ✅ Inline section editing
|
||||
- ✅ Version management
|
||||
- ✅ Effective date tracking
|
||||
- ✅ Active/Inactive toggle
|
||||
- ✅ Search and filtering
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Features
|
||||
|
||||
### Backend
|
||||
- ✅ RESTful API with Django REST Framework
|
||||
- ✅ Versioned policies
|
||||
- ✅ Effective date tracking
|
||||
- ✅ Ordered sections
|
||||
- ✅ Active/Inactive status
|
||||
- ✅ Full admin interface
|
||||
- ✅ Management command for easy population
|
||||
|
||||
### Frontend
|
||||
- ✅ Dynamic policy loading from API
|
||||
- ✅ Loading states with spinner
|
||||
- ✅ Error handling with user-friendly messages
|
||||
- ✅ Responsive design (mobile-friendly)
|
||||
- ✅ Version and date display
|
||||
- ✅ Smooth animations
|
||||
- ✅ SEO-friendly structure
|
||||
- ✅ Integration with support center
|
||||
|
||||
---
|
||||
|
||||
## 🚦 Testing
|
||||
|
||||
### Test the API
|
||||
```bash
|
||||
# List all policies
|
||||
curl http://localhost:8000/api/policies/
|
||||
|
||||
# Get privacy policy
|
||||
curl http://localhost:8000/api/policies/privacy/
|
||||
|
||||
# Get terms of use
|
||||
curl http://localhost:8000/api/policies/terms/
|
||||
|
||||
# Get support policy
|
||||
curl http://localhost:8000/api/policies/support/
|
||||
```
|
||||
|
||||
### Test the Frontend
|
||||
1. Navigate to: `http://localhost:3000/policy?type=privacy`
|
||||
2. Navigate to: `http://localhost:3000/policy?type=terms`
|
||||
3. Navigate to: `http://localhost:3000/policy?type=support`
|
||||
4. Navigate to: `http://localhost:3000/support-center`
|
||||
5. Click on any of the 6 feature cards
|
||||
|
||||
---
|
||||
|
||||
## 📊 Database Schema
|
||||
|
||||
```sql
|
||||
-- Policy Table
|
||||
CREATE TABLE policies_policy (
|
||||
id INTEGER PRIMARY KEY,
|
||||
type VARCHAR(50) UNIQUE,
|
||||
title VARCHAR(200),
|
||||
slug VARCHAR(100) UNIQUE,
|
||||
description TEXT,
|
||||
last_updated DATE,
|
||||
version VARCHAR(20),
|
||||
is_active BOOLEAN,
|
||||
effective_date DATE,
|
||||
created_at TIMESTAMP,
|
||||
updated_at TIMESTAMP
|
||||
);
|
||||
|
||||
-- PolicySection Table
|
||||
CREATE TABLE policies_policysection (
|
||||
id INTEGER PRIMARY KEY,
|
||||
policy_id INTEGER REFERENCES policies_policy(id),
|
||||
heading VARCHAR(300),
|
||||
content TEXT,
|
||||
order INTEGER,
|
||||
is_active BOOLEAN,
|
||||
created_at TIMESTAMP,
|
||||
updated_at TIMESTAMP
|
||||
);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🔄 Updating Policies
|
||||
|
||||
### Via Management Command
|
||||
```bash
|
||||
# Re-run to update all policies
|
||||
cd backend
|
||||
../venv/bin/python manage.py populate_policies
|
||||
```
|
||||
|
||||
### Via Admin Panel
|
||||
1. Go to `http://localhost:8000/admin/policies/policy/`
|
||||
2. Click on the policy to edit
|
||||
3. Modify sections inline
|
||||
4. Save changes
|
||||
|
||||
### Via API (Programmatic)
|
||||
```python
|
||||
from policies.models import Policy, PolicySection
|
||||
|
||||
# Get policy
|
||||
policy = Policy.objects.get(type='privacy')
|
||||
|
||||
# Add new section
|
||||
PolicySection.objects.create(
|
||||
policy=policy,
|
||||
heading="New Section",
|
||||
content="Section content...",
|
||||
order=14
|
||||
)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🎨 Customization
|
||||
|
||||
### Styling
|
||||
The policy page uses inline styles. To customize:
|
||||
- Edit `/app/policy/page.tsx`
|
||||
- Modify the `<style jsx>` blocks
|
||||
- Or create a separate SCSS file
|
||||
|
||||
### Content
|
||||
To modify policy content:
|
||||
1. Edit `/backend/policies/management/commands/populate_policies.py`
|
||||
2. Update the sections array for each policy
|
||||
3. Run: `python manage.py populate_policies`
|
||||
|
||||
---
|
||||
|
||||
## ✅ Checklist
|
||||
|
||||
- [x] Backend models created
|
||||
- [x] Database migrations applied
|
||||
- [x] API endpoints configured
|
||||
- [x] Professional content populated
|
||||
- [x] Frontend service created
|
||||
- [x] React hooks implemented
|
||||
- [x] Policy page created
|
||||
- [x] Support center integrated
|
||||
- [x] Loading states added
|
||||
- [x] Error handling implemented
|
||||
- [x] Responsive design
|
||||
- [x] Admin panel configured
|
||||
|
||||
---
|
||||
|
||||
## 🎉 You're All Set!
|
||||
|
||||
The Policy API system is now fully operational. Users can:
|
||||
1. View all three policies from the support center
|
||||
2. Access detailed, professional legal documents
|
||||
3. See version information and effective dates
|
||||
4. Navigate easily between policies
|
||||
|
||||
**Next Steps:**
|
||||
- Customize policy content for your organization
|
||||
- Add more policy types if needed
|
||||
- Integrate policy acceptance tracking (optional)
|
||||
- Add PDF export functionality (optional)
|
||||
|
||||
---
|
||||
|
||||
## 📞 Support
|
||||
|
||||
For questions or issues:
|
||||
- Check the Django admin: `http://localhost:8000/admin/`
|
||||
- View API docs: `http://localhost:8000/swagger/`
|
||||
- Review backend logs: `/backend/logs/django.log`
|
||||
|
||||
**Congratulations!** 🎊 Your enterprise-grade policy management system is ready to use!
|
||||
|
||||
Reference in New Issue
Block a user