Implement Cloudinary integration with backend services and frontend components

Author: BTheCoderr

backend/app.py

@@ -3,6 +3,7 @@
 from routes.legal_ai import bp as legal_ai
 from routes.contracts import contracts
 from routes.performance import performance
+from routes.uploads import uploads
 from dotenv import load_dotenv
 import os
 from datetime import datetime
@@ -22,6 +23,7 @@
 app.register_blueprint(legal_ai)
 app.register_blueprint(contracts)
 app.register_blueprint(performance)
+app.register_blueprint(uploads)
 
 # Create data directory if it doesn't exist
 if not os.path.exists('data'):

backend/routes/uploads.py

@@ -0,0 +1,97 @@
+from flask import Blueprint, request, jsonify, current_app
+import os
+import uuid
+import tempfile
+from werkzeug.utils import secure_filename
+from services.cloudinary_service import cloudinary_service, DOCUMENT_UPLOAD_PRESET, TEMPLATE_UPLOAD_PRESET, USER_UPLOAD_PRESET
+
+# Create blueprint
+uploads = Blueprint('uploads', __name__, url_prefix='/api/uploads')
+
+@uploads.route('/signature', methods=['GET'])
+def get_upload_signature():
+    """Get a signature for direct uploads from frontend"""
+    preset_type = request.args.get('type', 'user')
+    
+    # Determine which preset to use
+    if preset_type == 'document':
+        preset_name = DOCUMENT_UPLOAD_PRESET
+    elif preset_type == 'template':
+        preset_name = TEMPLATE_UPLOAD_PRESET
+    else:
+        preset_name = USER_UPLOAD_PRESET
+    
+    try:
+        # Get signature from service
+        result = cloudinary_service.get_upload_signature(preset_name)
+        return jsonify(result)
+    except Exception as e:
+        current_app.logger.error(f"Error getting upload signature: {str(e)}")
+        return jsonify({"error": "Could not generate upload signature"}), 500
+
+@uploads.route('/server', methods=['POST'])
+def upload_file():
+    """Upload a file from the server to Cloudinary"""
+    if 'file' not in request.files:
+        return jsonify({"error": "No file part"}), 400
+    
+    file = request.files['file']
+    if file.filename == '':
+        return jsonify({"error": "No selected file"}), 400
+    
+    # Get parameters from request
+    folder = request.form.get('folder')
+    resource_type = request.form.get('resource_type', 'auto')
+    public_id = request.form.get('public_id')
+    
+    # Save the file temporarily
+    try:
+        filename = secure_filename(file.filename)
+        temp_file_path = os.path.join(tempfile.gettempdir(), f"{uuid.uuid4()}_{filename}")
+        file.save(temp_file_path)
+        
+        # Upload to Cloudinary
+        result = cloudinary_service.upload_file(
+            temp_file_path, 
+            public_id=public_id,
+            folder=folder,
+            resource_type=resource_type
+        )
+        
+        # Clean up the temp file
+        os.remove(temp_file_path)
+        
+        return jsonify(result)
+    except Exception as e:
+        current_app.logger.error(f"Error uploading file: {str(e)}")
+        # Clean up the temp file if it exists
+        if 'temp_file_path' in locals() and os.path.exists(temp_file_path):
+            os.remove(temp_file_path)
+        
+        return jsonify({"error": "Failed to upload file"}), 500
+
+@uploads.route('/<public_id>', methods=['DELETE'])
+def delete_file(public_id):
+    """Delete a file from Cloudinary"""
+    resource_type = request.args.get('resource_type', 'auto')
+    
+    try:
+        result = cloudinary_service.delete_file(public_id, resource_type)
+        return jsonify(result)
+    except Exception as e:
+        current_app.logger.error(f"Error deleting file: {str(e)}")
+        return jsonify({"error": "Failed to delete file"}), 500
+
+@uploads.route('/list', methods=['GET'])
+def list_files():
+    """List files in a folder"""
+    folder = request.args.get('folder', '')
+    resource_type = request.args.get('resource_type', 'auto')
+    max_results = request.args.get('max_results', 100, type=int)
+    
+    try:
+        result = cloudinary_service.list_files(folder, resource_type, max_results)
+        return jsonify(result)
+    except Exception as e:
+        current_app.logger.error(f"Error listing files: {str(e)}")
+        return jsonify({"error": "Failed to list files"}), 500 

backend/services/cloudinary_service.py

@@ -0,0 +1,122 @@
+import os
+import logging
+from dotenv import load_dotenv
+import cloudinary
+import cloudinary.uploader
+import cloudinary.api
+from cloudinary.utils import cloudinary_url
+
+# Load environment variables
+load_dotenv()
+
+# Configure Cloudinary
+cloudinary.config(
+    cloud_name=os.getenv('CLOUDINARY_CLOUD_NAME'),
+    api_key=os.getenv('CLOUDINARY_API_KEY'),
+    api_secret=os.getenv('CLOUDINARY_API_SECRET')
+)
+
+# Initialize logger
+logger = logging.getLogger(__name__)
+
+# Constants for Cloudinary folders and presets
+CASE_FOLDER = 'smartprobono/case_documents'
+TEMPLATE_FOLDER = 'smartprobono/document_templates'
+USER_FOLDER = 'smartprobono/user_uploads'
+
+DOCUMENT_UPLOAD_PRESET = 'document_uploads'
+TEMPLATE_UPLOAD_PRESET = 'template_uploads'
+USER_UPLOAD_PRESET = 'user_uploads'
+
+
+class CloudinaryService:
+    """Service for handling Cloudinary operations"""
+
+    @staticmethod
+    def get_upload_signature(preset_name=USER_UPLOAD_PRESET):
+        """Get a signature for direct upload from frontend"""
+        try:
+            timestamp = cloudinary.utils.now()
+            signature = cloudinary.utils.api_sign_request({
+                'timestamp': timestamp,
+                'upload_preset': preset_name
+            }, cloudinary.config().api_secret)
+            
+            return {
+                'signature': signature,
+                'timestamp': timestamp,
+                'cloudName': cloudinary.config().cloud_name,
+                'apiKey': cloudinary.config().api_key,
+                'uploadPreset': preset_name
+            }
+        except Exception as e:
+            logger.error(f"Error generating upload signature: {e}")
+            raise
+
+    @staticmethod
+    def upload_file(file_path, public_id=None, folder=USER_FOLDER, resource_type='auto', **options):
+        """Upload a file to Cloudinary from the server"""
+        try:
+            upload_options = {
+                'folder': folder,
+                'resource_type': resource_type,
+                **options
+            }
+            
+            if public_id:
+                upload_options['public_id'] = public_id
+            
+            result = cloudinary.uploader.upload(file_path, **upload_options)
+            return result
+        except Exception as e:
+            logger.error(f"Error uploading file: {e}")
+            raise
+
+    @staticmethod
+    def generate_url(public_id, **options):
+        """Generate a URL for a Cloudinary resource"""
+        try:
+            url, options = cloudinary_url(public_id, **options)
+            return url
+        except Exception as e:
+            logger.error(f"Error generating URL: {e}")
+            raise
+
+    @staticmethod
+    def delete_file(public_id, resource_type='auto'):
+        """Delete a file from Cloudinary"""
+        try:
+            result = cloudinary.uploader.destroy(public_id, resource_type=resource_type)
+            return result
+        except Exception as e:
+            logger.error(f"Error deleting file: {e}")
+            raise
+    
+    @staticmethod
+    def list_files(folder, resource_type='auto', max_results=100):
+        """List files in a folder"""
+        try:
+            result = cloudinary.api.resources(
+                type='upload',
+                prefix=folder,
+                resource_type=resource_type,
+                max_results=max_results
+            )
+            return result.get('resources', [])
+        except Exception as e:
+            logger.error(f"Error listing files: {e}")
+            raise
+    
+    @staticmethod
+    def create_folder(folder):
+        """Create a new folder in Cloudinary"""
+        try:
+            result = cloudinary.api.create_folder(folder)
+            return result
+        except Exception as e:
+            logger.error(f"Error creating folder: {e}")
+            raise
+
+
+# Create singleton instance
+cloudinary_service = CloudinaryService() 

frontend/src/App.js

@@ -25,6 +25,7 @@ import RightsPage from './pages/RightsPage';
 import Services from './pages/Services';
 import Contact from './pages/Contact';
 import NotFoundPage from './pages/NotFoundPage';
+import DocumentsPage from './pages/DocumentsPage';
 
 // Layout components for nested routes
 const ServicesLayout = () => (
@@ -112,6 +113,9 @@ const App = () => {
                 <Route path="/resources/*" element={<ResourcesLayout />} />
                 <Route path="/contact" element={<Contact />} />
 
+                {/* Document Management route */}
+                <Route path="/documents" element={<DocumentsPage />} />
+                
                 {/* Legal Chat route */}
                 <Route path="/legal-chat/*" element={<LegalChatLayout />} />
 

frontend/src/components/DocumentUpload.js

@@ -0,0 +1,113 @@
+import React, { useState } from 'react';
+import { Box, Card, CardContent, CardHeader, Typography, Divider, Link, Grid, Paper } from '@mui/material';
+import FileUpload from './FileUpload';
+
+const DocumentUpload = () => {
+  const [uploadedDocument, setUploadedDocument] = useState(null);
+  const [uploadedTemplate, setUploadedTemplate] = useState(null);
+  const [uploadedUserFile, setUploadedUserFile] = useState(null);
+
+  const handleDocumentUpload = (fileData) => {
+    console.log('Document uploaded:', fileData);
+    setUploadedDocument(fileData);
+  };
+
+  const handleTemplateUpload = (fileData) => {
+    console.log('Template uploaded:', fileData);
+    setUploadedTemplate(fileData);
+  };
+
+  const handleUserFileUpload = (fileData) => {
+    console.log('User file uploaded:', fileData);
+    setUploadedUserFile(fileData);
+  };
+
+  const renderUploadedFile = (fileData, title) => {
+    if (!fileData) return null;
+
+    return (
+      <Paper elevation={2} sx={{ p: 2, mb: 2, bgcolor: 'background.paper' }}>
+        <Typography variant="subtitle1" fontWeight="bold">{title}</Typography>
+        <Typography variant="body2">File name: {fileData.original_filename}</Typography>
+        <Typography variant="body2">Size: {Math.round(fileData.bytes / 1024)} KB</Typography>
+        <Typography variant="body2">Type: {fileData.format || 'Document'}</Typography>
+        <Typography variant="body2">
+          URL: <Link href={fileData.secure_url} target="_blank" rel="noopener">{fileData.secure_url}</Link>
+        </Typography>
+
+        {fileData.resource_type === 'image' && (
+          <Box sx={{ mt: 2, textAlign: 'center' }}>
+            <img 
+              src={fileData.secure_url} 
+              alt={fileData.original_filename}
+              style={{ maxWidth: '100%', maxHeight: '200px' }}
+            />
+          </Box>
+        )}
+      </Paper>
+    );
+  };
+
+  return (
+    <Card>
+      <CardHeader title="Document Upload" />
+      <Divider />
+      <CardContent>
+        <Grid container spacing={3}>
+          <Grid item xs={12} md={4}>
+            <Box>
+              <Typography variant="h6">Case Documents</Typography>
+              <Typography variant="body2" color="text.secondary" paragraph>
+                Upload documents related to legal cases.
+                Supported formats: PDF, DOC, DOCX
+              </Typography>
+              <FileUpload 
+                onUploadComplete={handleDocumentUpload}
+                uploadType="document" 
+                buttonText="Select Case Document"
+                allowedFormats={['pdf', 'doc', 'docx']}
+              />
+              {renderUploadedFile(uploadedDocument, 'Uploaded Case Document')}
+            </Box>
+          </Grid>
+
+          <Grid item xs={12} md={4}>
+            <Box>
+              <Typography variant="h6">Document Templates</Typography>
+              <Typography variant="body2" color="text.secondary" paragraph>
+                Upload document templates for generating legal documents.
+                Supported formats: DOC, DOCX, TXT, HTML
+              </Typography>
+              <FileUpload 
+                onUploadComplete={handleTemplateUpload}
+                uploadType="template" 
+                buttonText="Select Template"
+                allowedFormats={['doc', 'docx', 'txt', 'html']}
+              />
+              {renderUploadedFile(uploadedTemplate, 'Uploaded Template')}
+            </Box>
+          </Grid>
+
+          <Grid item xs={12} md={4}>
+            <Box>
+              <Typography variant="h6">User Files</Typography>
+              <Typography variant="body2" color="text.secondary" paragraph>
+                Upload general files and images.
+                Supported formats: PDF, DOC, DOCX, JPG, JPEG, PNG
+              </Typography>
+              <FileUpload 
+                onUploadComplete={handleUserFileUpload}
+                uploadType="user" 
+                buttonText="Select File"
+                allowedFormats={['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png']}
+              />
+              {renderUploadedFile(uploadedUserFile, 'Uploaded User File')}
+            </Box>
+          </Grid>
+        </Grid>
+      </CardContent>
+    </Card>
+  );
+};
+
+export default DocumentUpload;