Create standalone browser port of LTX Athena with authenticated native API transport

2026-09-29 17:59:23 +02:00
commit 1333b0c36b
202 changed files with 63054 additions and 0 deletions
@@ -0,0 +1,83 @@
+import { Heart, Sparkles } from 'lucide-react'
+import type { GenSpaceSortDir, GenSpaceSortKey, GenSpaceTypeFilter } from '../../lib/genspace-gallery'
+import { GenSpaceGallerySizeMenu, type GallerySize } from './GenSpaceGallerySizeMenu'
+import { GenSpaceSortMenu } from './GenSpaceSortMenu'
+import { GenSpaceTypeFilter as TypeFilter } from './GenSpaceTypeFilter'
+
+export function GenSpaceGalleryToolbar({
+  showBrowseLoras,
+  onBrowseLoras,
+  typeFilter,
+  onTypeFilterChange,
+  sortKey,
+  sortDir,
+  onSortKeyChange,
+  onToggleSortDir,
+  showFavorites,
+  favoriteCount,
+  onToggleFavorites,
+  gallerySize,
+  onGallerySizeChange,
+}: {
+  showBrowseLoras: boolean
+  onBrowseLoras: () => void
+  typeFilter: GenSpaceTypeFilter
+  onTypeFilterChange: (value: GenSpaceTypeFilter) => void
+  sortKey: GenSpaceSortKey
+  sortDir: GenSpaceSortDir
+  onSortKeyChange: (key: GenSpaceSortKey) => void
+  onToggleSortDir: () => void
+  showFavorites: boolean
+  favoriteCount: number
+  onToggleFavorites: () => void
+  gallerySize: GallerySize
+  onGallerySizeChange: (size: GallerySize) => void
+}) {
+  return (
+    <div className="flex items-center justify-between pb-2 gap-2">
+      <div className="flex items-center gap-2">
+        {showBrowseLoras && (
+          <button
+            type="button"
+            onClick={onBrowseLoras}
+            className="flex items-center gap-1.5 px-3 py-1.5 rounded-md text-sm font-medium text-zinc-400 hover:text-white hover:bg-zinc-800 transition-colors"
+          >
+            <Sparkles className="h-4 w-4" /> Browse LoRAs
+          </button>
+        )}
+      </div>
+      <div className="flex items-center gap-2">
+        <TypeFilter value={typeFilter} onChange={onTypeFilterChange} />
+        <GenSpaceSortMenu
+          sortKey={sortKey}
+          sortDir={sortDir}
+          onSortKeyChange={onSortKeyChange}
+          onToggleSortDir={onToggleSortDir}
+        />
+        <button
+          type="button"
+          onClick={onToggleFavorites}
+          className={`flex items-center gap-1.5 px-3 py-1.5 rounded-md text-sm font-medium transition-colors ${
+            showFavorites
+              ? 'bg-red-500/20 text-red-400 border border-red-500/30'
+              : 'text-zinc-400 hover:text-white hover:bg-zinc-800'
+          }`}
+        >
+          <Heart className={`h-4 w-4 ${showFavorites ? 'fill-current' : ''}`} />
+          Favorites
+          {favoriteCount > 0 && (
+            <span className={`text-xs px-1.5 py-0.5 rounded-full ${
+              showFavorites ? 'bg-red-500/30 text-red-300' : 'bg-zinc-800 text-zinc-500'
+            }`}>
+              {favoriteCount}
+            </span>
+          )}
+        </button>
+        <GenSpaceGallerySizeMenu
+          gallerySize={gallerySize}
+          onGallerySizeChange={onGallerySizeChange}
+        />
+      </div>
+    </div>
+  )
+}