Spaces:

Zelyanoth
/

Lin

Running

App Files Files Community

Zelyanoth commited on Aug 14

Commit

c146841

1 Parent(s): e4de23f

hh

Browse files

Files changed (3) hide show

backend/app.py +177 -0
frontend/src/components/LinkedInAccount/LinkedInCallbackHandler.jsx +28 -12
frontend/src/services/linkedinAuthService.js +8 -19

backend/app.py CHANGED Viewed

@@ -197,6 +197,183 @@ def create_app():
                 'message': f'Health check failed: {str(e)}'
             }, 503
     return app
 if __name__ == '__main__':

                 'message': f'Health check failed: {str(e)}'
             }, 503
+    # Add OAuth callback handler route
+    @app.route('/auth/callback')
+    def handle_auth_callback():
+        """Handle OAuth callback from social networks."""
+        try:
+            # Parse URL parameters
+            import requests
+            from urllib.parse import parse_qs, urlparse
+            url = request.url
+            parsed_url = urlparse(url)
+            query_params = parse_qs(parsed_url.query)
+            code = query_params.get('code', [None])[0]
+            state = query_params.get('state', [None])[0]
+            error = query_params.get('error', [None])[0]
+            app.logger.info(f"🔗 [OAuth] Direct callback handler triggered")
+            app.logger.info(f"🔗 [OAuth] URL: {url}")
+            app.logger.info(f"🔗 [OAuth] Code: {code[:20] + '...' if code else None}")
+            app.logger.info(f"🔗 [OAuth] State: {state}")
+            app.logger.info(f"🔗 [OAuth] Error: {error}")
+            if error:
+                app.logger.error(f"🔗 [OAuth] OAuth error: {error}")
+                # Return error page or redirect with error
+                return f"""
+                <html>
+                <head><title>Authentication Error</title></head>
+                <body>
+                    <h2>Authentication Failed</h2>
+                    <p>Error: {error}</p>
+                    <p><a href="/sources">Go back to sources</a></p>
+                    <script>
+                        setTimeout(() => {{
+                            window.location.href = '/sources';
+                        }}, 3000);
+                    </script>
+                </body>
+                </html>
+                """, 400
+            if not code or not state:
+                app.logger.error(f"🔗 [OAuth] Missing required parameters")
+                return """
+                <html>
+                <head><title>Invalid Callback</title></head>
+                <body>
+                    <h2>Invalid Callback</h2>
+                    <p>Missing required parameters.</p>
+                    <p><a href="/sources">Go back to sources</a></p>
+                    <script>
+                        setTimeout(() => {{
+                            window.location.href = '/sources';
+                        }}, 3000);
+                    </script>
+                </body>
+                </html>
+                """, 400
+            # Forward the callback to the accounts API
+            app.logger.info(f"🔗 [OAuth] Forwarding callback to accounts API")
+            # Get the JWT token from cookies
+            from flask_jwt_extended import jwt_required, get_jwt_identity, create_access_token
+            import jwt
+            # Try to get token from cookies
+            token = request.cookies.get('access_token')
+            if not token:
+                app.logger.error(f"🔗 [OAuth] No token found in cookies")
+                return """
+                <html>
+                <head><title>Authentication Error</title></head>
+                <body>
+                    <h2>Authentication Error</h2>
+                    <p>No authentication token found.</p>
+                    <p><a href="/login">Please login again</a></p>
+                </body>
+                </html>
+                """, 401
+            # Make the callback request to the accounts API
+            api_url = f"{request.host_url.rstrip('/')}/api/accounts/callback"
+            headers = {
+                'Content-Type': 'application/json',
+                'Authorization': f'Bearer {token}'
+            }
+            callback_data = {
+                'code': code,
+                'state': state,
+                'social_network': 'LinkedIn'
+            }
+            app.logger.info(f"🔗 [OAuth] Making POST request to {api_url}")
+            response = requests.post(api_url, json=callback_data, headers=headers, timeout=30)
+            app.logger.info(f"🔗 [OAuth] API response status: {response.status_code}")
+            app.logger.info(f"🔗 [OAuth] API response data: {response.text}")
+            if response.status_code == 200:
+                result = response.json()
+                if result.get('success'):
+                    app.logger.info(f"🔗 [OAuth] Account linked successfully")
+                    # Return success page
+                    return f"""
+                    <html>
+                    <head><title>Authentication Successful</title></head>
+                    <body>
+                        <h2>Authentication Successful!</h2>
+                        <p>Your LinkedIn account has been linked successfully.</p>
+                        <p><a href="/sources">Go to your sources</a></p>
+                        <script>
+                            setTimeout(() => {{
+                                window.location.href = '/sources';
+                            }}, 2000);
+                        </script>
+                    </body>
+                    </html>
+                    """
+                else:
+                    app.logger.error(f"🔗 [OAuth] Account linking failed: {result.get('message')}")
+                    return f"""
+                    <html>
+                    <head><title>Authentication Failed</title></head>
+                    <body>
+                        <h2>Authentication Failed</h2>
+                        <p>{result.get('message', 'Unknown error')}</p>
+                        <p><a href="/sources">Go back to sources</a></p>
+                        <script>
+                            setTimeout(() => {{
+                                window.location.href = '/sources';
+                            }}, 3000);
+                        </script>
+                    </body>
+                    </html>
+                    """, 400
+            else:
+                app.logger.error(f"🔗 [OAuth] API request failed: {response.status_code}")
+                return f"""
+                <html>
+                <head><title>Authentication Error</title></head>
+                <body>
+                    <h2>Authentication Error</h2>
+                    <p>Failed to complete authentication: {response.status_code}</p>
+                    <p><a href="/sources">Go back to sources</a></p>
+                    <script>
+                        setTimeout(() => {{
+                            window.location.href = '/sources';
+                        }}, 3000);
+                    </script>
+                </body>
+                </html>
+                """, 500
+        except Exception as e:
+            app.logger.error(f"🔗 [OAuth] Callback handler error: {str(e)}")
+            import traceback
+            app.logger.error(f"🔗 [OAuth] Traceback: {traceback.format_exc()}")
+            return f"""
+            <html>
+            <head><title>Authentication Error</title></head>
+            <body>
+                <h2>Authentication Error</h2>
+                <p>An error occurred during authentication: {str(e)}</p>
+                <p><a href="/sources">Go back to sources</a></p>
+                <script>
+                    setTimeout(() => {{
+                        window.location.href = '/sources';
+                    }}, 3000);
+                </script>
+            </body>
+            </html>
+            """, 500
     return app
 if __name__ == '__main__':

frontend/src/components/LinkedInAccount/LinkedInCallbackHandler.jsx CHANGED Viewed

@@ -1,7 +1,8 @@
 import React, { useEffect, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useLocation, useNavigate } from 'react-router-dom';
-import { handleLinkedInCallback, clearLinkedInError } from '../../store/reducers/linkedinAccountsSlice';
 const LinkedInCallbackHandler = () => {
   const dispatch = useDispatch();
@@ -42,30 +43,39 @@ const LinkedInCallbackHandler = () => {
         setStatus('processing');
         setMessage('Completing LinkedIn authentication...');
-        // DEBUG: Log callback action dispatch
-        console.log('🔗 [Frontend] Dispatching LinkedIn callback action...');
-        console.log('🔗 [Frontend] Callback payload:', { code: code.substring(0, 20) + '...', state });
-        // Dispatch the callback action
-        const result = await dispatch(handleLinkedInCallback({ code, state })).unwrap();
-        // DEBUG: Log callback result
-        console.log('🔗 [Frontend] Callback result:', result);
-        if (result.success) {
           console.log('🔗 [Frontend] LinkedIn account linked successfully!');
           setStatus('success');
           setMessage('LinkedIn account linked successfully!');
           // Redirect to sources page after a short delay
           setTimeout(() => {
             console.log('🔗 [Frontend] Redirecting to sources page...');
             navigate('/sources');
           }, 2000);
         } else {
-          console.error('🔗 [Frontend] LinkedIn account linking failed:', result.message);
           setStatus('error');
-          setMessage(result.message || 'Failed to link LinkedIn account');
         }
       } catch (error) {
         console.error('🔗 [Frontend] Callback handler error:', error);
@@ -79,7 +89,13 @@ const LinkedInCallbackHandler = () => {
       }
     };
-    handleCallback();
   }, [dispatch, location, navigate]);
   const handleRetry = () => {

 import React, { useEffect, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useLocation, useNavigate } from 'react-router-dom';
+import { handleLinkedInCallback, clearLinkedInError, fetchLinkedInAccounts } from '../../store/reducers/linkedinAccountsSlice';
+import apiClient from '../../services/apiClient';
 const LinkedInCallbackHandler = () => {
   const dispatch = useDispatch();
         setStatus('processing');
         setMessage('Completing LinkedIn authentication...');
+        // DEBUG: Log callback processing
+        console.log('🔗 [Frontend] Processing OAuth callback...');
+        console.log('🔗 [Frontend] Making API call to complete OAuth flow...');
+        // Make the API call to complete the OAuth flow
+        const response = await apiClient.post('/accounts/callback', {
+          code: code,
+          state: state,
+          social_network: 'LinkedIn'
+        });
+        // DEBUG: Log callback response
+        console.log('🔗 [Frontend] API response received:', response);
+        console.log('🔗 [Frontend] Response status:', response.status);
+        console.log('🔗 [Frontend] Response data:', response.data);
+        if (response.data.success) {
           console.log('🔗 [Frontend] LinkedIn account linked successfully!');
           setStatus('success');
           setMessage('LinkedIn account linked successfully!');
+          // Dispatch success action to update Redux state
+          await dispatch(fetchLinkedInAccounts());
           // Redirect to sources page after a short delay
           setTimeout(() => {
             console.log('🔗 [Frontend] Redirecting to sources page...');
             navigate('/sources');
           }, 2000);
         } else {
+          console.error('🔗 [Frontend] LinkedIn account linking failed:', response.data.message);
           setStatus('error');
+          setMessage(response.data.message || 'Failed to link LinkedIn account');
         }
       } catch (error) {
         console.error('🔗 [Frontend] Callback handler error:', error);
       }
     };
+    // Check if we're on the callback URL
+    if (location.search.includes('code=') || location.search.includes('error=')) {
+      console.log('🔗 [Frontend] Detected callback URL, processing...');
+      handleCallback();
+    } else {
+      console.log('🔗 [Frontend] Not a callback URL, normal page load');
+    }
   }, [dispatch, location, navigate]);
   const handleRetry = () => {

frontend/src/services/linkedinAuthService.js CHANGED Viewed

@@ -44,29 +44,21 @@ class LinkedInAuthService {
   async handleCallback(code, state) {
     try {
       // DEBUG: Log callback request
-      console.log('🔗 [LinkedIn] Sending callback request to backend...');
       console.log('🔗 [LinkedIn] Callback payload:', {
         code: code.substring(0, 20) + '...',
         state: state,
         social_network: 'LinkedIn'
       });
-      const response = await apiClient.post('/accounts/callback', {
-        code: code,
-        state: state,
-        social_network: 'LinkedIn'
-      });
-      // DEBUG: Log callback response
-      console.log('🔗 [LinkedIn] Backend response received:', response);
-      console.log('🔗 [LinkedIn] Response status:', response.status);
-      console.log('🔗 [LinkedIn] Response data:', response.data);
-      if (import.meta.env.VITE_NODE_ENV === 'development') {
-        console.log('🔗 [LinkedIn] OAuth callback handled successfully');
-      }
-      return response.data;
     } catch (error) {
       // DEBUG: Log callback error
       console.error('🔗 [LinkedIn] OAuth callback error:', error);
@@ -77,9 +69,6 @@ class LinkedInAuthService {
         headers: error.response?.headers
       });
-      if (import.meta.env.VITE_NODE_ENV === 'development') {
-        console.error('🔗 [LinkedIn] OAuth callback error:', error.response?.data || error.message);
-      }
       return {
         success: false,
         message: error.response?.data?.message || 'Failed to complete LinkedIn authentication'

   async handleCallback(code, state) {
     try {
       // DEBUG: Log callback request
+      console.log('🔗 [LinkedIn] Processing OAuth callback...');
       console.log('🔗 [LinkedIn] Callback payload:', {
         code: code.substring(0, 20) + '...',
         state: state,
         social_network: 'LinkedIn'
       });
+      // The callback is now handled by the frontend callback handler
+      // We just need to return success to indicate the callback was processed
+      console.log('🔗 [LinkedIn] Callback processing initiated by frontend handler');
+      return {
+        success: true,
+        message: 'OAuth callback processing initiated'
+      };
     } catch (error) {
       // DEBUG: Log callback error
       console.error('🔗 [LinkedIn] OAuth callback error:', error);
         headers: error.response?.headers
       });
       return {
         success: false,
         message: error.response?.data?.message || 'Failed to complete LinkedIn authentication'