npm - sprygen - Versions diffs - 1.0.0 - Mend

sprygen 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (56) hide show

package/templates/project/static/index.html.ejs ADDED Viewed

@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8"/>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+  <title><%= projectName %></title>
+  <meta name="description" content="<%= description %>"/>
+  <link rel="stylesheet" href="/css/style.css"/>
+</head>
+<body>
+<div class="landing">
+  <!-- Top nav -->
+  <nav class="landing-nav">
+    <div class="landing-brand">
+      <span class="brand-mark">SG</span>
+      <span class="brand-name"><%= projectName %></span>
+    </div>
+    <div class="landing-nav-actions">
+      <a href="/login.html" class="btn btn-ghost btn-sm">Sign in</a>
+      <a href="/register.html" class="btn btn-primary btn-sm">Get started</a>
+    </div>
+  </nav>
+  <!-- Hero -->
+  <section class="landing-hero-section">
+    <div class="landing-container">
+      <div class="status-pill">
+        <span class="status-dot"></span>
+        <span>Running on Spring Boot 3.x</span>
+      </div>
+      <h1 class="hero-title">
+        Your Spring Boot backend<br/>
+        <span class="text-green">is ready.</span>
+      </h1>
+      <p class="hero-sub">
+        Generated by Sprygen. JWT authentication, role-based access control,
+        user management and an admin panel — all included.
+      </p>
+      <div class="hero-actions">
+        <a href="/register.html" class="btn btn-primary">Create account</a>
+        <a href="/login.html" class="btn btn-outline">Sign in</a>
+        <a href="/swagger-ui/index.html" class="btn btn-ghost" target="_blank">API Docs</a>
+      </div>
+      <div class="tech-pills">
+        <span class="tech-pill">Spring Boot 3.x</span>
+        <span class="tech-pill">JWT</span>
+        <span class="tech-pill">RBAC</span>
+        <span class="tech-pill">Spring Data JPA</span>
+        <span class="tech-pill">BCrypt</span>
+        <span class="tech-pill">Validation</span>
+      </div>
+    </div>
+  </section>
+  <!-- API reference -->
+  <section class="landing-section">
+    <div class="landing-container">
+      <div class="section-row">
+        <h2 class="section-heading">API Endpoints</h2>
+        <a href="/swagger-ui/index.html" class="link-green" target="_blank">Open Swagger UI</a>
+      </div>
+      <div class="table-wrap">
+        <table>
+          <thead>
+            <tr><th>Method</th><th>Endpoint</th><th>Description</th><th>Access</th></tr>
+          </thead>
+          <tbody>
+            <tr><td><code class="http-post">POST</code></td><td><code>/api/v1/auth/register</code></td><td>Register new account</td><td><span class="badge badge-open">Public</span></td></tr>
+            <tr><td><code class="http-post">POST</code></td><td><code>/api/v1/auth/login</code></td><td>Login and receive JWT</td><td><span class="badge badge-open">Public</span></td></tr>
+            <tr><td><code class="http-get">GET</code></td><td><code>/api/v1/profile</code></td><td>Get own profile</td><td><span class="badge badge-auth">Auth</span></td></tr>
+            <tr><td><code class="http-put">PUT</code></td><td><code>/api/v1/profile</code></td><td>Update profile</td><td><span class="badge badge-auth">Auth</span></td></tr>
+            <tr><td><code class="http-put">PUT</code></td><td><code>/api/v1/profile/password</code></td><td>Change password</td><td><span class="badge badge-auth">Auth</span></td></tr>
+            <tr><td><code class="http-get">GET</code></td><td><code>/api/v1/admin/users</code></td><td>List all users</td><td><span class="badge badge-admin">Admin</span></td></tr>
+            <tr><td><code class="http-put">PUT</code></td><td><code>/api/v1/admin/users/{id}/role</code></td><td>Assign role to user</td><td><span class="badge badge-admin">Admin</span></td></tr>
+            <tr><td><code class="http-delete">DELETE</code></td><td><code>/api/v1/admin/users/{id}</code></td><td>Delete user</td><td><span class="badge badge-admin">Admin</span></td></tr>
+            <tr><td><code class="http-get">GET</code></td><td><code>/actuator/health</code></td><td>Health check</td><td><span class="badge badge-open">Public</span></td></tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </section>
+  <footer class="landing-footer">
+    <span>Generated with Sprygen</span>
+    <span><%= projectName %></span>
+  </footer>
+</div>
+<script src="/js/auth.js"></script>
+<script>
+  // Redirect logged-in users to dashboard
+  if (Auth.loggedIn()) window.location.href = '/dashboard.html';
+</script>
+</body>
+</html>

package/templates/project/static/js/api.js ADDED Viewed

@@ -0,0 +1,30 @@
+/* ================================================================
+   api.js — HTTP client with JWT injection
+   ================================================================ */
+const API_BASE = '';
+export async function request(method, path, body) {
+  const token = Auth.token();
+  const headers = { 'Content-Type': 'application/json' };
+  if (token) headers['Authorization'] = 'Bearer ' + token;
+  const res = await fetch(API_BASE + path, {
+    method,
+    headers,
+    body: body !== undefined ? JSON.stringify(body) : undefined,
+  });
+  if (res.status === 204) return {};
+  const json = await res.json().catch(() => ({}));
+  if (!res.ok) {
+    const msg = json.message || json.error || `Request failed (${res.status})`;
+    throw new Error(msg);
+  }
+  return json;
+}
+export const get    = (path)        => request('GET',    path);
+export const post   = (path, body)  => request('POST',   path, body);
+export const put    = (path, body)  => request('PUT',    path, body);
+export const del    = (path)        => request('DELETE', path);

package/templates/project/static/js/auth.js ADDED Viewed

@@ -0,0 +1,44 @@
+/* ================================================================
+   auth.js — JWT + localStorage session management
+   ================================================================ */
+const KEYS = { token: '_sg_token', user: '_sg_user' };
+const Auth = window.Auth = {
+  save(data) {
+    localStorage.setItem(KEYS.token, data.token);
+    localStorage.setItem(KEYS.user, JSON.stringify({
+      email:     data.email     || '',
+      firstName: data.firstName || '',
+      lastName:  data.lastName  || '',
+      role:      data.role      || 'ROLE_USER',
+    }));
+  },
+  clear() {
+    localStorage.removeItem(KEYS.token);
+    localStorage.removeItem(KEYS.user);
+  },
+  token() { return localStorage.getItem(KEYS.token); },
+  user() {
+    try { return JSON.parse(localStorage.getItem(KEYS.user) || 'null'); }
+    catch { return null; }
+  },
+  isAdmin()  { const u = this.user(); return u?.role === 'ROLE_ADMIN'; },
+  loggedIn() { return !!this.token() && !!this.user(); },
+  initials() {
+    const u = this.user();
+    if (!u) return '??';
+    return ((u.firstName?.[0] || '') + (u.lastName?.[0] || '')).toUpperCase();
+  },
+  fullName() {
+    const u = this.user();
+    if (!u) return '';
+    return u.firstName + ' ' + u.lastName;
+  },
+};

package/templates/project/static/js/nav.js.ejs ADDED Viewed

@@ -0,0 +1,82 @@
+/* ================================================================
+   nav.js — Sidebar + topbar component
+   ================================================================ */
+function renderNav(activePage) {
+  const user    = Auth.user();
+  const isAdmin = Auth.isAdmin();
+  const adminSection = isAdmin ? `
+    <li class="nav-section-label">Administration</li>
+    <li>
+      <a class="nav-link ${activePage === 'admin' ? 'active' : ''}"
+         href="/admin.html">
+        <span class="nav-icon">A</span> Admin Panel
+        <span class="nav-badge">ADMIN</span>
+      </a>
+    </li>` : '';
+  document.getElementById('sidebar').innerHTML = `
+    <div class="sidebar-brand">
+      <span class="brand-mark">SG</span>
+      <span class="brand-name"><%= projectName %></span>
+    </div>
+    <nav class="sidebar-nav">
+      <ul>
+        <li class="nav-section-label">Menu</li>
+        <li>
+          <a class="nav-link ${activePage === 'dashboard' ? 'active' : ''}"
+             href="/dashboard.html">
+            <span class="nav-icon">D</span> Dashboard
+          </a>
+        </li>
+        <li>
+          <a class="nav-link ${activePage === 'profile' ? 'active' : ''}"
+             href="/profile.html">
+            <span class="nav-icon">P</span> Profile
+          </a>
+        </li>
+        ${adminSection}
+      </ul>
+    </nav>
+    <div class="sidebar-footer">
+      <div class="user-chip">
+        <div class="avatar">${Auth.initials()}</div>
+        <div class="user-chip-info">
+          <div class="user-chip-name">${Auth.fullName()}</div>
+          <div class="user-chip-role">${isAdmin ? 'Administrator' : 'Member'}</div>
+        </div>
+      </div>
+      <button class="btn btn-ghost btn-sm btn-full" onclick="doLogout()">Sign out</button>
+    </div>
+  `;
+}
+function doLogout() {
+  Auth.clear();
+  window.location.href = '/';
+}
+function guardAuth() {
+  if (!Auth.loggedIn()) {
+    window.location.href = '/login.html';
+    return false;
+  }
+  return true;
+}
+function guardAdmin() {
+  if (!guardAuth()) return false;
+  if (!Auth.isAdmin()) {
+    window.location.href = '/dashboard.html';
+    return false;
+  }
+  return true;
+}
+window.renderNav  = renderNav;
+window.doLogout   = doLogout;
+window.guardAuth  = guardAuth;
+window.guardAdmin = guardAdmin;

package/templates/project/static/js/ui.js ADDED Viewed

@@ -0,0 +1,57 @@
+/* ================================================================
+   ui.js — Toast, alerts, counters, loaders
+   ================================================================ */
+// ── Toast ─────────────────────────────────────────────────────
+let _toastTimer;
+function showToast(msg, type = 'success') {
+  const el = document.getElementById('toast');
+  if (!el) return;
+  el.textContent = msg;
+  el.className = 'toast toast-' + type + ' show';
+  clearTimeout(_toastTimer);
+  _toastTimer = setTimeout(() => el.classList.remove('show'), 3200);
+}
+// ── Alert inside a form ───────────────────────────────────────
+function showAlert(id, msg, type = 'error') {
+  const el = document.getElementById(id);
+  if (!el) return;
+  el.textContent = msg;
+  el.className = 'alert alert-' + type + ' visible';
+}
+function clearAlert(id) {
+  const el = document.getElementById(id);
+  if (el) el.className = 'alert';
+}
+// ── Animated counter ─────────────────────────────────────────
+function animateCount(el, target, duration = 800) {
+  if (!el) return;
+  const start = 0;
+  const step  = target / (duration / 16);
+  let current = start;
+  const timer = setInterval(() => {
+    current = Math.min(current + step, target);
+    el.textContent = Math.round(current).toLocaleString();
+    if (current >= target) clearInterval(timer);
+  }, 16);
+}
+// ── Busy button ───────────────────────────────────────────────
+function setBusy(btn, busy, label) {
+  btn.disabled = busy;
+  if (busy) {
+    btn.dataset.orig = btn.textContent;
+    btn.textContent  = label || 'Working…';
+  } else {
+    btn.textContent = btn.dataset.orig || btn.textContent;
+  }
+}
+// expose globally
+window.showToast  = showToast;
+window.showAlert  = showAlert;
+window.clearAlert = clearAlert;
+window.animateCount = animateCount;
+window.setBusy    = setBusy;

package/templates/project/static/login.html.ejs ADDED Viewed

@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8"/>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+  <title>Sign in — <%= projectName %></title>
+  <link rel="stylesheet" href="/css/style.css"/>
+</head>
+<body class="auth-body">
+<div class="auth-wrap">
+  <div class="auth-card">
+    <div class="auth-header">
+      <div class="brand-mark-lg">SG</div>
+      <h1><%= projectName %></h1>
+      <p class="text-muted">Sign in to your account</p>
+    </div>
+    <div id="login-alert" class="alert"></div>
+    <form id="login-form">
+      <div class="form-group">
+        <label for="email">Email address</label>
+        <input id="email" type="email" placeholder="you@example.com" required autocomplete="email"/>
+      </div>
+      <div class="form-group">
+        <label for="password">Password</label>
+        <input id="password" type="password" placeholder="••••••••" required autocomplete="current-password"/>
+      </div>
+      <button type="submit" id="submit-btn" class="btn btn-primary btn-full">Sign in</button>
+    </form>
+    <p class="auth-switch">
+      New here? <a href="/register.html">Create an account</a>
+    </p>
+    <p class="auth-switch">
+      <a href="/" class="text-dim">← Back to home</a>
+    </p>
+  </div>
+</div>
+<script src="/js/auth.js"></script>
+<script src="/js/ui.js"></script>
+<script>
+  // Redirect if already logged in
+  if (Auth.loggedIn()) window.location.href = '/dashboard.html';
+  document.getElementById('login-form').addEventListener('submit', async e => {
+    e.preventDefault();
+    clearAlert('login-alert');
+    const btn = document.getElementById('submit-btn');
+    setBusy(btn, true, 'Signing in…');
+    try {
+      const res = await fetch('/api/v1/auth/login', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          email:    document.getElementById('email').value,
+          password: document.getElementById('password').value,
+        })
+      });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.message || 'Invalid credentials');
+      Auth.save(data);
+      window.location.href = '/dashboard.html';
+    } catch (err) {
+      showAlert('login-alert', err.message);
+      setBusy(btn, false);
+    }
+  });
+</script>
+</body>
+</html>

package/templates/project/static/profile.html.ejs ADDED Viewed

@@ -0,0 +1,163 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8"/>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+  <title><%= projectName %> — Profile</title>
+  <link rel="stylesheet" href="/css/style.css"/>
+</head>
+<body>
+<div class="app-shell">
+  <aside id="sidebar" class="sidebar"></aside>
+  <div class="main">
+    <header class="topbar">
+      <span class="topbar-title">Profile</span>
+    </header>
+    <div class="page">
+      <div class="profile-hero" id="profile-hero">
+        <div class="avatar avatar-lg" id="hero-avatar"></div>
+        <div>
+          <h2 id="hero-name"></h2>
+          <p class="text-muted" id="hero-email"></p>
+          <span id="hero-badge" class="badge" style="margin-top:6px;display:inline-block;"></span>
+        </div>
+      </div>
+      <div class="two-col">
+        <!-- Personal info -->
+        <div class="card">
+          <div class="card-header"><span class="card-title">Personal information</span></div>
+          <div class="card-body">
+            <div id="profile-alert" class="alert"></div>
+            <form id="profile-form">
+              <div class="row-2">
+                <div class="form-group">
+                  <label>First name</label>
+                  <input id="pf-first" type="text"/>
+                </div>
+                <div class="form-group">
+                  <label>Last name</label>
+                  <input id="pf-last" type="text"/>
+                </div>
+              </div>
+              <div class="form-group">
+                <label>Bio</label>
+                <textarea id="pf-bio" rows="3" placeholder="A short bio…"></textarea>
+              </div>
+              <div class="form-group">
+                <label>Avatar URL</label>
+                <input id="pf-avatar" type="url" placeholder="https://…"/>
+              </div>
+              <button type="submit" class="btn btn-primary" id="save-btn">Save changes</button>
+            </form>
+          </div>
+        </div>
+        <!-- Change password -->
+        <div class="card">
+          <div class="card-header"><span class="card-title">Change password</span></div>
+          <div class="card-body">
+            <div id="pw-alert" class="alert"></div>
+            <form id="password-form">
+              <div class="form-group">
+                <label>Current password</label>
+                <input id="pw-current" type="password" placeholder="••••••••"/>
+              </div>
+              <div class="form-group">
+                <label>New password</label>
+                <input id="pw-new" type="password" placeholder="••••••••"/>
+              </div>
+              <div class="form-group">
+                <label>Confirm new password</label>
+                <input id="pw-confirm" type="password" placeholder="••••••••"/>
+              </div>
+              <button type="submit" class="btn btn-primary" id="pw-btn">Update password</button>
+            </form>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<div id="toast" class="toast"></div>
+<script src="/js/auth.js"></script>
+<script src="/js/ui.js"></script>
+<script src="/js/nav.js"></script>
+<script>
+  if (!guardAuth()) throw new Error('redirect');
+  renderNav('profile');
+  async function loadProfile() {
+    const res = await fetch('/api/v1/profile', {
+      headers: { Authorization: 'Bearer ' + Auth.token() }
+    });
+    if (!res.ok) { showToast('Failed to load profile', 'error'); return; }
+    const u = await res.json();
+    const initials = ((u.firstName?.[0]||'') + (u.lastName?.[0]||'')).toUpperCase();
+    document.getElementById('hero-avatar').textContent = initials;
+    document.getElementById('hero-name').textContent   = u.firstName + ' ' + u.lastName;
+    document.getElementById('hero-email').textContent  = u.email;
+    const isAdmin = u.roles?.includes('ROLE_ADMIN');
+    const badge   = document.getElementById('hero-badge');
+    badge.textContent = isAdmin ? 'Administrator' : 'Member';
+    badge.className   = 'badge ' + (isAdmin ? 'badge-admin' : 'badge-auth');
+    document.getElementById('pf-first').value  = u.firstName || '';
+    document.getElementById('pf-last').value   = u.lastName  || '';
+    document.getElementById('pf-bio').value    = u.bio       || '';
+    document.getElementById('pf-avatar').value = u.avatarUrl || '';
+  }
+  document.getElementById('profile-form').addEventListener('submit', async e => {
+    e.preventDefault();
+    clearAlert('profile-alert');
+    const btn = document.getElementById('save-btn');
+    setBusy(btn, true, 'Saving…');
+    try {
+      await fetch('/api/v1/profile', {
+        method: 'PUT',
+        headers: { 'Content-Type':'application/json', Authorization: 'Bearer ' + Auth.token() },
+        body: JSON.stringify({
+          firstName: document.getElementById('pf-first').value,
+          lastName:  document.getElementById('pf-last').value,
+          bio:       document.getElementById('pf-bio').value,
+          avatarUrl: document.getElementById('pf-avatar').value,
+        })
+      });
+      showToast('Profile updated');
+      loadProfile();
+    } catch(err) {
+      showAlert('profile-alert', err.message);
+    } finally { setBusy(btn, false); }
+  });
+  document.getElementById('password-form').addEventListener('submit', async e => {
+    e.preventDefault();
+    clearAlert('pw-alert');
+    const newPw   = document.getElementById('pw-new').value;
+    const confirm = document.getElementById('pw-confirm').value;
+    if (newPw !== confirm) { showAlert('pw-alert', 'Passwords do not match.'); return; }
+    const btn = document.getElementById('pw-btn');
+    setBusy(btn, true, 'Updating…');
+    try {
+      const res = await fetch('/api/v1/profile/password', {
+        method: 'PUT',
+        headers: { 'Content-Type':'application/json', Authorization: 'Bearer ' + Auth.token() },
+        body: JSON.stringify({ currentPassword: document.getElementById('pw-current').value, newPassword: newPw })
+      });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.error || 'Failed');
+      document.getElementById('password-form').reset();
+      showToast('Password changed');
+    } catch(err) {
+      showAlert('pw-alert', err.message);
+    } finally { setBusy(btn, false); }
+  });
+  loadProfile();
+</script>
+</body>
+</html>

package/templates/project/static/register.html.ejs ADDED Viewed

@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8"/>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+  <title>Register — <%= projectName %></title>
+  <link rel="stylesheet" href="/css/style.css"/>
+</head>
+<body class="auth-body">
+<div class="auth-wrap">
+  <div class="auth-card">
+    <div class="auth-header">
+      <div class="brand-mark-lg">SG</div>
+      <h1><%= projectName %></h1>
+      <p class="text-muted">Create your account</p>
+    </div>
+    <div id="reg-alert" class="alert"></div>
+    <form id="register-form">
+      <div class="row-2">
+        <div class="form-group">
+          <label for="firstName">First name</label>
+          <input id="firstName" type="text" placeholder="John" required/>
+        </div>
+        <div class="form-group">
+          <label for="lastName">Last name</label>
+          <input id="lastName" type="text" placeholder="Doe" required/>
+        </div>
+      </div>
+      <div class="form-group">
+        <label for="email">Email address</label>
+        <input id="email" type="email" placeholder="you@example.com" required autocomplete="email"/>
+      </div>
+      <div class="form-group">
+        <label for="password">
+          Password
+          <span class="label-hint">Min 6 characters</span>
+        </label>
+        <input id="password" type="password" placeholder="••••••••" required minlength="6" autocomplete="new-password"/>
+      </div>
+      <button type="submit" id="submit-btn" class="btn btn-primary btn-full">Create account</button>
+    </form>
+    <p class="auth-switch">
+      Already have an account? <a href="/login.html">Sign in</a>
+    </p>
+  </div>
+</div>
+<script src="/js/auth.js"></script>
+<script src="/js/ui.js"></script>
+<script>
+  if (Auth.loggedIn()) window.location.href = '/dashboard.html';
+  document.getElementById('register-form').addEventListener('submit', async e => {
+    e.preventDefault();
+    clearAlert('reg-alert');
+    const btn = document.getElementById('submit-btn');
+    setBusy(btn, true, 'Creating account…');
+    try {
+      const res = await fetch('/api/v1/auth/register', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          firstName: document.getElementById('firstName').value,
+          lastName:  document.getElementById('lastName').value,
+          email:     document.getElementById('email').value,
+          password:  document.getElementById('password').value,
+        })
+      });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.message || 'Registration failed');
+      Auth.save(data);
+      window.location.href = '/dashboard.html';
+    } catch (err) {
+      showAlert('reg-alert', err.message);
+      setBusy(btn, false);
+    }
+  });
+</script>
+</body>
+</html>