Add credentials auth to home page + latest

Author: mythz

app/(home)/page.tsx

@@ -9,7 +9,7 @@ import { TabbedImages } from './tabbed-images';
 import { LightboxImage } from './lightbox-image';
 import { ThemeCarousel } from './theme-carousel';
 import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
-import { Star, Sparkles, Zap, Code2, Image as ImageIcon, Music, Calculator, Puzzle, Search, GalleryHorizontal, Sigma, Plug, Wand2, Mic, Monitor, Palette } from 'lucide-react';
+import { Star, Sparkles, Zap, Code2, Image as ImageIcon, Music, Calculator, Puzzle, Search, GalleryHorizontal, Sigma, Plug, Wand2, Mic, Monitor, Palette, ShieldCheck } from 'lucide-react';
 import { YouTube } from '@/components/youtube';
 
 export default function HomePage() {
@@ -64,10 +64,10 @@ export default function HomePage() {
           </a>
         </div>
         <p className="text-sm text-muted-foreground">
-          <span className="text-slate-400 dark:text-slate-500">Feb 27, 2026</span>
+          <span className="text-slate-400 dark:text-slate-500">Mar 2, 2026</span>
           {' - '}
           <Link href="/docs/latest" className="text-blue-600 dark:text-blue-400 hover:underline">
-            Support for Gemini Nano Banana 2, optimized gallery thumbnails, and more →
+            New Username/Password Credentials Auth Provider →
           </Link>
         </p>
 
@@ -175,6 +175,22 @@ export default function HomePage() {
               </Card>
             </Link>
 
+            <Link href="/docs/authentication/credentials" className="block">
+              <Card className="bg-white dark:bg-slate-900 border-slate-200 dark:border-slate-700 hover:border-blue-400 dark:hover:border-blue-500 transition-colors cursor-pointer h-full">
+                <CardHeader>
+                  <CardTitle className="flex items-center gap-2 text-slate-900 dark:text-slate-100">
+                    <ShieldCheck className="w-5 h-5 text-emerald-500" />
+                    Credentials Auth
+                  </CardTitle>
+                </CardHeader>
+                <CardContent>
+                  <p className="text-slate-700 dark:text-slate-300">
+                    Username/Password authentication with Admin UI and CLI user management
+                  </p>
+                </CardContent>
+              </Card>
+            </Link>
+
             <Link href="/docs/extensions/tools" className="block">
               <Card className="bg-white dark:bg-slate-900 border-slate-200 dark:border-slate-700 hover:border-blue-400 dark:hover:border-blue-500 transition-colors cursor-pointer h-full">
                 <CardHeader>
@@ -359,10 +375,10 @@ export default function HomePage() {
         <div className="max-w-6xl mx-auto">
           <div className="text-center mb-8">
             <h2 className="text-3xl font-bold text-slate-900 dark:text-slate-100 mb-4">
-              Powerful Model Selector
+              Model Selector
             </h2>
             <p className="text-lg text-slate-600 dark:text-slate-400">
-              Smart search, advanced filtering, sorting, and favorites system
+              Smart search, advanced filtering, sorting, and favorites over 530 models from 24 providers
             </p>
             <Link
               href="/docs/features/model-selector"
@@ -383,6 +399,76 @@ export default function HomePage() {
         </div>
       </div>
 
+      {/* Credentials Auth Section */}
+      <div id="credentials-auth" className="w-full my-16 px-4 bg-gradient-to-b from-transparent via-emerald-50/50 to-transparent dark:via-emerald-950/20 py-16">
+        <div className="max-w-6xl mx-auto">
+          <div className="text-center mb-8">
+            <h2 className="text-3xl font-bold text-slate-900 dark:text-slate-100 mb-4">
+              <ShieldCheck className="w-8 h-8 inline-block mr-2 text-emerald-500" />
+              Credentials Auth
+            </h2>
+            <p className="text-lg text-slate-600 dark:text-slate-400 max-w-2xl mx-auto">
+              Built-in Username/Password authentication with a Sign In page, Admin Web UI and CLI for user managing accounts, roles, and account locking
+            </p>
+            <Link
+              href="/docs/authentication/credentials"
+              className="inline-flex items-center gap-1 text-blue-600 dark:text-blue-400 hover:underline mt-2"
+            >
+              Learn more →
+            </Link>
+          </div>
+          <div className="grid md:grid-cols-2 gap-6 mb-8">
+            <div className="rounded-xl overflow-hidden shadow-xl border border-slate-200 dark:border-slate-700 dark:bg-white">
+              <LightboxImage
+                src="/img/auth/signin.webp"
+                alt="Sign In Page"
+                width={600}
+                height={400}
+                className="w-full h-auto"
+              />
+            </div>
+            <div className="rounded-xl overflow-hidden shadow-xl border border-slate-200 dark:border-slate-700 dark:bg-white">
+              <LightboxImage
+                src="/img/auth/manage-users.webp"
+                alt="Manage Users"
+                width={600}
+                height={400}
+                className="w-full h-auto"
+              />
+            </div>
+          </div>
+          <div className="grid md:grid-cols-3 gap-6">
+            <div className="rounded-xl overflow-hidden shadow-xl border border-slate-200 dark:border-slate-700 dark:bg-white">
+              <LightboxImage
+                src="/img/auth/create-user.webp"
+                alt="Create User"
+                width={400}
+                height={300}
+                className="w-full h-auto"
+              />
+            </div>
+            <div className="rounded-xl overflow-hidden shadow-xl border border-slate-200 dark:border-slate-700 dark:bg-white">
+              <LightboxImage
+                src="/img/auth/my-account-avatar.webp"
+                alt="My Account"
+                width={400}
+                height={300}
+                className="w-full h-auto"
+              />
+            </div>
+            <div className="rounded-xl overflow-hidden shadow-xl border border-slate-200 dark:border-slate-700 dark:bg-white">
+              <LightboxImage
+                src="/img/auth/lock-user.webp"
+                alt="Lock User"
+                width={400}
+                height={300}
+                className="w-full h-auto"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+
       {/* Gemini File Search Section */}
       <div id="rag" className="w-full my-16 px-4 bg-gradient-to-b from-transparent via-cyan-50/50 to-transparent dark:via-cyan-950/20 py-16">
         <div className="max-w-6xl mx-auto">

content/docs/latest.mdx

@@ -11,6 +11,31 @@ After upgrading, it's recommended to also upgrade any external extensions:
 
 <ShellCommand>llms --update all</ShellCommand>
 
+## Mar 2, 2026
+
+### Credentials Auth Provider
+
+The built-in [credentials](/docs/authentication/credentials) extension enables Username/Password authentication for your Application, including a Sign In page, user registration, role assignment, and account locking. It provides full user management through both the CLI and a web-based Admin UI, along with account self-service for all authenticated users.
+
+Credentials is the default Auth Provider that's automatically enabled when at least one user has been created:
+
+```bash
+llms --adduser admin
+```
+
+<Screenshot src="/img/auth/signin.webp" alt="Sign In Page" />
+
+After logging in as `admin`, you can create additional users from the **Manage Users** page which can be accessed from the user menu.
+
+<ScreenshotsGallery className="mb-8" gridClass="grid grid-cols-1 md:grid-cols-2 gap-4" images={{
+    'Manage Users': '/img/auth/manage-users.webp',
+    'Create User': '/img/auth/create-user.webp',
+    'Change Password': '/img/auth/change-password.webp',
+    'Lock User': '/img/auth/lock-user.webp',
+    'Delete User': '/img/auth/delete-user.webp',
+    'My Account': '/img/auth/my-account-avatar.webp',
+}} />
+
 
 ## Feb 27, 2026