Update app/templates/generate_api.html

app/templates/generate_api.html

@@ -1,149 +1,9 @@
 {% extends "base.html" %}
-{% block title %}My API Keys – Resume Ranker API{% endblock %}
-
-{% block extra_head %}
-{# Link any specific CSS for this page here if separate from dashboard.css #}
-{% endblock %}
-
+{% block title %}Generate Resume Ranker API{% endblock %}
 {% block content %}
-<div class="dashboard-wrapper">
-    <aside class="sidebar" id="sidebar">
-        <div class="sidebar-header">
-            <div class="logo">ResumeRanker<span style="color:var(--accent)">.API</span></div>
-            <button class="close-sidebar" id="closeSidebar" aria-label="Close menu">
-                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>
-            </button>
-        </div>
-        <nav class="sidebar-nav">
-            {# Highlight active link: Use Flask's request.endpoint to set 'active' class #}
-            <a href="{{ url_for('auth.dashboard') }}" class="nav-item">
-                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-grid"><rect x="3" y="3" width="7" height="7"></rect><rect x="14" y="3" width="7" height="7"></rect><rect x="14" y="14" width="7" height="7"></rect><rect x="3" y="14" width="7" height="7"></rect></svg>
-                <span>Dashboard</span>
-            </a>
-            <a href="{{ url_for('auth.generate_api') }}" class="nav-item active"> {# Active #}
-                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-key"><path d="M19 10H5a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-6a2 2 0 0 0-2-2z"></path><circle cx="12" cy="16" r="2"></circle><path d="M15 10V4.5a2.5 2.5 0 0 0-5 0V10"></path></svg>
-                <span>My API Keys</span>
-            </a>
-            <a href="{{ url_for('api.rank_resumes') }}" class="nav-item">
-                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-award"><circle cx="12" cy="8" r="7"></circle><polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.89"></polyline></svg>
-                <span>Resume Rankings</span>
-            </a>
-            <a href="{{ url_for('auth.try_api') }}" class="nav-item">
-                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-play-circle"><circle cx="12" cy="12" r="10"></circle><polygon points="10 8 16 12 10 16 10 8"></polygon></svg>
-                <span>Try It Now</span>
-            </a>
-            <a href="{{ url_for('auth.try_api') }}" class="nav-item">
-                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-settings"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l-.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg>
-                <span>Settings</span>
-            </a>
-            <a href="{{ url_for('auth.logout') }}" class="nav-item logout-item">
-                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-log-out"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="17 16 22 12 17 8"></polyline><line x1="22" y1="12" x2="10" y2="12"></line></svg>
-                <span>Logout</span>
-            </a>
-        </nav>
-    </aside>
-
-    <div class="main-content-area" id="mainContentArea">
-        <header class="dashboard-header">
-            <button class="hamburger-dashboard" id="hamburgerDashboard" aria-label="Open sidebar menu">
-                <span></span><span></span><span></span>
-            </button>
-            <div class="user-settings">
-                <span class="user-name">{{ user.username }}</span>
-                <div class="user-avatar">
-                    <img src="https://ui-avatars.com/api/?name={{ user.username | urlencode }}&background=2563eb&color=fff&size=30" alt="User Avatar">
-                </div>
-                <button class="theme-toggle" id="themeToggleDashboard" aria-label="Toggle dark mode">🌙</button>
-            </div>
-        </header>
-
-        <div class="content-padding">
-            <h1 class="welcome-title">My API Keys</h1>
-            <p class="subtitle">Manage your API key for integrating with ResumeRanker API.</p>
-
-            {% if error %}
-            <div class="error-message">{{ error }}</div>
-            {% endif %}
-
-            {% if success %}
-            <div class="success-message">{{ success }}</div>
-            {% endif %}
-
-            <div class="section-card api-key-full-section">
-                <h3 class="section-title">Your API Key</h3>
-                <p class="section-description">This is your unique API key. Keep it secure and do not share it publicly.</p>
-                <div class="input-group">
-                    <input type="text" class="form-input" id="apiKey" value="{{ user.api_key }}" readonly>
-                    <button class="btn primary-btn copy-btn" type="button" onclick="copyApiKey()">Copy</button>
-                </div>
-                <form method="POST" action="{{ url_for('generate_api') }}" class="api-key-form">
-                    <button class="btn secondary-btn">Regenerate API Key</button>
-                </form>
-                <p class="docs-link"><a href="{{ url_for('auth.docs') }}">📘 View API Documentation</a></p>
-            </div>
-        </div>
-    </div>
-</div>
-{% endblock %}
-
-{% block extra_scripts %}
-<script>
-    // Theme toggle (specific to dashboard header)
-    const themeToggleDashboard = document.getElementById('themeToggleDashboard');
-    const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
-    function setTheme(theme) {
-        document.documentElement.setAttribute('data-theme', theme);
-        localStorage.setItem('theme', theme);
-        themeToggleDashboard.textContent = theme === 'dark' ? '☀️' : '🌙';
-    }
-    const savedTheme = localStorage.getItem('theme');
-    setTheme(savedTheme || (prefersDark ? 'dark' : 'light'));
-    themeToggleDashboard.onclick = () => {
-        const current = document.documentElement.getAttribute('data-theme');
-        setTheme(current === 'dark' ? 'light' : 'dark');
-    };
-
-    // Sidebar toggle for mobile
-    const hamburgerDashboard = document.getElementById('hamburgerDashboard');
-    const sidebar = document.getElementById('sidebar');
-    const mainContentArea = document.getElementById('mainContentArea');
-    const closeSidebarBtn = document.getElementById('closeSidebar');
-
-    hamburgerDashboard.onclick = () => {
-        sidebar.classList.add('open');
-        mainContentArea.classList.add('shifted');
-    };
-    closeSidebarBtn.onclick = () => {
-        sidebar.classList.remove('open');
-        mainContentArea.classList.remove('shifted');
-    };
-    mainContentArea.onclick = (event) => {
-        if (sidebar.classList.contains('open') && !sidebar.contains(event.target) && !hamburgerDashboard.contains(event.target)) {
-            sidebar.classList.remove('open');
-            mainContentArea.classList.remove('shifted');
-        }
-    };
-    Array.from(sidebar.getElementsByClassName('nav-item')).forEach(item => {
-        item.onclick = () => {
-            if (window.innerWidth <= 900) {
-                sidebar.classList.remove('open');
-                mainContentArea.classList.remove('shifted');
-            }
-        };
-    });
-
-    // API Key Copy function (only on this page now)
-    function copyApiKey() {
-        const input = document.getElementById("apiKey");
-        input.select();
-        input.setSelectionRange(0, 99999);
-        document.execCommand("copy");
-        const originalText = document.querySelector('.copy-btn').textContent;
-        document.querySelector('.copy-btn').textContent = 'Copied!';
-        setTimeout(() => {
-            document.querySelector('.copy-btn').textContent = originalText;
-        }, 1500);
-    }
-</script>
+<h2>Generate Resume Ranker API</h2>
+<p>This will generate a single endpoint that accepts resumes and a job description, and returns ranked results.</p>
+<form method="POST">
+  <button type="submit" class="btn btn-primary">Generate API</button>
+</form>
 {% endblock %}
-