feat: update connectiontab and datatab security fix (#1614)

* feat: update connectiontab and datatab security fix

# Connection Components and Diagnostics Updates

## GitHub Connection Component Changes
- Updated the disconnect button styling to match Vercel's design:
  - Changed from `<Button>` component to native `<button>` element
  - Added red background (`bg-red-500`) with hover effect (`hover:bg-red-600`)
  - Updated icon from `i-ph:sign-out` to `i-ph:plug`
  - Simplified text to just "Disconnect"
  - Added connection status indicator with check-circle icon and "Connected to GitHub" text

## ConnectionDiagnostics Tab Updates
### Added New Connection Diagnostics
- Implemented diagnostics for Vercel and Supabase connections
- Added new helper function `safeJsonParse` for safer JSON parsing operations

### Diagnostic Checks Added
- **Vercel Diagnostics:**
  - LocalStorage token verification
  - API endpoint connectivity test
  - Connection status validation
  - Reset functionality for Vercel connection

- **Supabase Diagnostics:**
  - LocalStorage credentials verification
  - API endpoint connectivity test
  - Connection status validation
  - Reset functionality for Supabase connection

### UI Enhancements
- Added new status cards for Vercel and Supabase
- Implemented reset buttons with consistent styling
- Added loading states during diagnostics
- Enhanced error handling and user feedback

### Function Updates
- Extended `runDiagnostics` function to include Vercel and Supabase checks
- Added new reset helper functions for each connection type
- Improved error handling and status reporting
- Enhanced toast notifications for better user feedback

### Visual Consistency
- Matched styling of new diagnostic cards with existing GitHub and Netlify cards
- Consistent use of icons and status indicators
- Uniform button styling across all connection types
- Maintained consistent spacing and layout patterns

### Code Structure
- Organized diagnostic checks into clear, separate sections
- Improved error handling and type safety
- Enhanced code readability and maintainability
- Added comprehensive status compilation for all connections

These changes ensure a consistent user experience across all connection types while providing robust diagnostic capabilities for troubleshooting connection issues.

# DataTab.tsx Changes

## Code Cleanup
- Removed unused variables from useDataOperations hook:
  - Removed `handleExportAPIKeys`
  - Removed `handleUndo`
  - Removed `lastOperation`

This change improves code quality by removing unused variables and resolves ESLint warnings without affecting any functionality.

* Test commit to verify pre-commit hook

app/components/@settings/tabs/connections/ConnectionsTab.tsx

@@ -149,48 +149,6 @@ export default function ConnectionsTab() {
         </div>
       </motion.div>
 
-      {/* Cloudflare Deployment Note - Highly visible */}
-      <motion.div
-        className="bg-gradient-to-r from-blue-50 to-blue-100 dark:from-blue-950/40 dark:to-blue-900/30 border border-blue-200 dark:border-blue-800/50 rounded-lg shadow-sm p-4 mb-6"
-        initial={{ opacity: 0, y: 20 }}
-        animate={{ opacity: 1, y: 0 }}
-        transition={{ delay: 0.3 }}
-      >
-        <div className="flex items-center gap-2 mb-2 text-blue-700 dark:text-blue-400">
-          <div className="i-ph:cloud-bold w-5 h-5" />
-          <h3 className="text-base font-medium">Using Cloudflare Pages?</h3>
-        </div>
-        <p className="text-sm text-blue-700 dark:text-blue-300 mb-2">
-          If you're experiencing GitHub connection issues (500 errors) on Cloudflare Pages deployments, you need to
-          configure environment variables in your Cloudflare dashboard:
-        </p>
-        <div className="bg-white/80 dark:bg-slate-900/60 rounded-md p-3 text-sm border border-blue-200 dark:border-blue-800/50">
-          <ol className="list-decimal list-inside pl-2 text-blue-700 dark:text-blue-300 space-y-2">
-            <li>
-              Go to <strong>Cloudflare Pages dashboard → Your project → Settings → Environment variables</strong>
-            </li>
-            <li>
-              Add <strong>both</strong> of these secrets (Production environment):
-              <ul className="list-disc list-inside pl-4 mt-1 mb-1">
-                <li>
-                  <code className="px-1 py-0.5 bg-blue-100 dark:bg-blue-800/40 rounded">GITHUB_ACCESS_TOKEN</code>{' '}
-                  (server-side API calls)
-                </li>
-                <li>
-                  <code className="px-1 py-0.5 bg-blue-100 dark:bg-blue-800/40 rounded">VITE_GITHUB_ACCESS_TOKEN</code>{' '}
-                  (client-side access)
-                </li>
-              </ul>
-            </li>
-            <li>
-              Add <code className="px-1 py-0.5 bg-blue-100 dark:bg-blue-800/40 rounded">VITE_GITHUB_TOKEN_TYPE</code> if
-              using fine-grained tokens
-            </li>
-            <li>Deploy a fresh build after adding these variables</li>
-          </ol>
-        </div>
-      </motion.div>
-
       <div className="grid grid-cols-1 gap-6">
         <Suspense fallback={<LoadingFallback />}>
           <GitHubConnection />