RootView ohne Hard-Login-Gate — TabBar zeigt sich immer, beim Start wechselt App bei .signedOut automatisch in den anonymen .guest-Modus (mana-swift-core v1.2.0). Auth-Sheets (Login, SignUp, Forgot, Reset) hängen jetzt als ManaAuthGate-Modifier am Root. AccountView zeigt im Guest-Modus eine eigene CTA-Surface („Anmelden / Konto erstellen" + Hinweis was Login bringt). signOut nutzt keepGuestMode: true → App bleibt nach Logout anonym nutzbar, Marketplace und lokale Daten gehen nicht verloren. DeckListView: Empty-State im Guest-Mode mit Login-CTA + Marketplace- Hinweis. Toolbar-„+"-Button via authGate.require gewrappt — Tap aus dem Guest-Modus öffnet erst das Sign-In-Sheet, danach den Editor. DeckListStore.refresh() skippt im Guest-Mode (kein 401-Spam). Cache wird so wie er ist gerendert (heute leer, später Marketplace-Klone). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
287 lines
11 KiB
Swift
287 lines
11 KiB
Swift
import ManaAuthUI
|
|
import ManaCore
|
|
import SwiftData
|
|
import SwiftUI
|
|
|
|
/// Navigations-Routen für die DeckListView. Tap auf eine Tile geht
|
|
/// direkt in Study-Mode, Tap auf den Edit-Button in den Deck-Detail-
|
|
/// View für Browse + Edit.
|
|
enum DeckRoute: Hashable {
|
|
case study(deckId: String, deckName: String)
|
|
case detail(deckId: String)
|
|
}
|
|
|
|
/// Decks-Hauptbildschirm im Cardecky-Look: horizontale Scroll-Reihen
|
|
/// mit Fan-Stack-Karten-Tiles. Web-Vorbild:
|
|
/// `cards/apps/web/src/routes/decks/+page.svelte`.
|
|
struct DeckListView: View {
|
|
@Environment(AuthClient.self) private var auth
|
|
@Environment(ManaAuthGate.self) private var authGate
|
|
@Environment(\.modelContext) private var context
|
|
@Query(sort: \CachedDeck.updatedAt, order: .reverse) private var decks: [CachedDeck]
|
|
|
|
@Binding var showCreate: Bool
|
|
|
|
private var isGuest: Bool {
|
|
if case .signedIn = auth.status { false } else { true }
|
|
}
|
|
|
|
@State private var store: DeckListStore?
|
|
@State private var pendingShares: [PendingShare] = []
|
|
@State private var path = NavigationPath()
|
|
|
|
var body: some View {
|
|
NavigationStack(path: $path) {
|
|
ZStack {
|
|
CardsTheme.background.ignoresSafeArea()
|
|
content
|
|
}
|
|
.navigationTitle("Decks")
|
|
.navigationDestination(for: DeckRoute.self) { route in
|
|
switch route {
|
|
case let .study(deckId, deckName):
|
|
StudySessionView(deckId: deckId, deckName: deckName)
|
|
case let .detail(deckId):
|
|
DeckDetailView(deckId: deckId)
|
|
}
|
|
}
|
|
.navigationDestination(for: PendingShareRoute.self) { route in
|
|
PendingShareConsumeView(share: route.share, onDone: {
|
|
PendingShareStore.remove(id: route.share.id)
|
|
pendingShares = PendingShareStore.readAll()
|
|
})
|
|
}
|
|
.toolbar { toolbar }
|
|
.refreshable {
|
|
await store?.refresh()
|
|
}
|
|
.sheet(isPresented: $showCreate) {
|
|
NavigationStack {
|
|
DeckEditorView(mode: .create) { _ in
|
|
Task { await store?.refresh() }
|
|
}
|
|
}
|
|
}
|
|
.task {
|
|
if store == nil {
|
|
store = DeckListStore(auth: auth, context: context)
|
|
}
|
|
await store?.refresh()
|
|
pendingShares = PendingShareStore.readAll()
|
|
}
|
|
.onAppear {
|
|
pendingShares = PendingShareStore.readAll()
|
|
}
|
|
}
|
|
}
|
|
|
|
@ViewBuilder
|
|
private var content: some View {
|
|
if decks.isEmpty {
|
|
emptyState
|
|
} else {
|
|
ScrollView {
|
|
VStack(alignment: .leading, spacing: 24) {
|
|
pendingShareSection
|
|
inboxBanner
|
|
deckSection(title: "Eigene Decks", icon: "rectangle.stack", decks: ownDecks)
|
|
if !subscribedDecks.isEmpty {
|
|
deckSection(title: "Abonniert", icon: "globe", decks: subscribedDecks)
|
|
}
|
|
}
|
|
.padding(.vertical, 12)
|
|
}
|
|
}
|
|
}
|
|
|
|
private var ownDecks: [CachedDeck] {
|
|
decks.filter { !$0.isFromMarketplace }
|
|
}
|
|
|
|
private var subscribedDecks: [CachedDeck] {
|
|
decks.filter(\.isFromMarketplace)
|
|
}
|
|
|
|
@ViewBuilder
|
|
private func deckSection(title: String, icon: String, decks: [CachedDeck]) -> some View {
|
|
if !decks.isEmpty {
|
|
VStack(alignment: .leading, spacing: 12) {
|
|
HStack(spacing: 6) {
|
|
Image(systemName: icon)
|
|
.foregroundStyle(CardsTheme.primary)
|
|
Text(title)
|
|
.font(.title3.weight(.semibold))
|
|
.foregroundStyle(CardsTheme.foreground)
|
|
Text("\(decks.count)")
|
|
.font(.subheadline)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
}
|
|
.padding(.horizontal, 20)
|
|
|
|
ScrollView(.horizontal, showsIndicators: false) {
|
|
HStack(alignment: .top, spacing: 16) {
|
|
ForEach(decks) { deck in
|
|
DeckStackTile(
|
|
deck: deck,
|
|
onTap: { path.append(DeckRoute.study(deckId: deck.id, deckName: deck.name)) },
|
|
onEdit: { path.append(DeckRoute.detail(deckId: deck.id)) }
|
|
)
|
|
.frame(width: 240)
|
|
.scrollTransition(.animated) { content, phase in
|
|
content
|
|
.scaleEffect(phase.isIdentity ? 1 : 0.92)
|
|
.opacity(phase.isIdentity ? 1 : 0.7)
|
|
}
|
|
}
|
|
}
|
|
.padding(.horizontal, 20)
|
|
.padding(.bottom, 12)
|
|
.scrollTargetLayout()
|
|
}
|
|
.scrollTargetBehavior(.viewAligned)
|
|
}
|
|
}
|
|
}
|
|
|
|
@ViewBuilder
|
|
private var inboxBanner: some View {
|
|
if let inbox = decks.first(where: { $0.isFromMarketplace && $0.dueCount > 0 }) {
|
|
Button {
|
|
path.append(DeckRoute.study(deckId: inbox.id, deckName: inbox.name))
|
|
} label: {
|
|
HStack(spacing: 12) {
|
|
Image(systemName: "tray.full.fill")
|
|
.font(.title3)
|
|
.foregroundStyle(CardsTheme.primary)
|
|
VStack(alignment: .leading, spacing: 2) {
|
|
Text("Inbox")
|
|
.font(.subheadline.weight(.semibold))
|
|
.foregroundStyle(CardsTheme.foreground)
|
|
Text("\(inbox.dueCount) fällige Karten aus abonnierten Decks")
|
|
.font(.caption)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
}
|
|
Spacer()
|
|
Image(systemName: "chevron.right")
|
|
.font(.footnote)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
}
|
|
.padding(14)
|
|
.background(
|
|
CardsTheme.primary.opacity(0.08),
|
|
in: RoundedRectangle(cornerRadius: 12, style: .continuous)
|
|
)
|
|
.overlay(
|
|
RoundedRectangle(cornerRadius: 12, style: .continuous)
|
|
.stroke(CardsTheme.primary.opacity(0.18), lineWidth: 1)
|
|
)
|
|
.padding(.horizontal, 20)
|
|
}
|
|
.buttonStyle(.plain)
|
|
}
|
|
}
|
|
|
|
@ViewBuilder
|
|
private var pendingShareSection: some View {
|
|
if !pendingShares.isEmpty {
|
|
VStack(alignment: .leading, spacing: 8) {
|
|
ForEach(pendingShares) { share in
|
|
NavigationLink(value: PendingShareRoute(share: share)) {
|
|
HStack(spacing: 12) {
|
|
Image(systemName: "square.and.arrow.down")
|
|
.foregroundStyle(CardsTheme.warning)
|
|
VStack(alignment: .leading, spacing: 2) {
|
|
Text("Aus Teilen-Menü")
|
|
.font(.subheadline.weight(.semibold))
|
|
.foregroundStyle(CardsTheme.foreground)
|
|
Text(share.text)
|
|
.font(.caption)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
.lineLimit(2)
|
|
}
|
|
Spacer()
|
|
Image(systemName: "chevron.right")
|
|
.font(.footnote)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
}
|
|
.padding(14)
|
|
.background(
|
|
CardsTheme.warning.opacity(0.12),
|
|
in: RoundedRectangle(cornerRadius: 12, style: .continuous)
|
|
)
|
|
}
|
|
.buttonStyle(.plain)
|
|
}
|
|
}
|
|
.padding(.horizontal, 20)
|
|
}
|
|
}
|
|
|
|
private var emptyState: some View {
|
|
VStack(spacing: 16) {
|
|
if store?.state == .loading {
|
|
ProgressView()
|
|
.tint(CardsTheme.primary)
|
|
Text("Lade Decks …")
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
} else if let message = store?.errorMessage {
|
|
ContentUnavailableView {
|
|
Label("Decks konnten nicht geladen werden", systemImage: "wifi.exclamationmark")
|
|
.foregroundStyle(CardsTheme.foreground)
|
|
} description: {
|
|
Text(message)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
}
|
|
} else if isGuest {
|
|
ContentUnavailableView {
|
|
Label("Cardecky ohne Konto", systemImage: "person.crop.circle.dashed")
|
|
.foregroundStyle(CardsTheme.foreground)
|
|
} description: {
|
|
Text(
|
|
"Browse den Marketplace im Entdecken-Tab — kein Konto nötig. Für eigene Decks und Cloud-Sync logge dich ein."
|
|
)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
} actions: {
|
|
Button("Anmelden / Konto erstellen") {
|
|
authGate.require(reason: "deck-list-empty") {}
|
|
}
|
|
.buttonStyle(.borderedProminent)
|
|
.tint(CardsTheme.primary)
|
|
}
|
|
} else {
|
|
ContentUnavailableView {
|
|
Label("Noch keine Decks", systemImage: "rectangle.stack")
|
|
.foregroundStyle(CardsTheme.foreground)
|
|
} description: {
|
|
Text(
|
|
"Tippe unten auf »+«, um dein erstes Deck zu erstellen, oder browse den Marketplace im Entdecken-Tab."
|
|
)
|
|
.foregroundStyle(CardsTheme.mutedForeground)
|
|
}
|
|
}
|
|
}
|
|
.frame(maxWidth: .infinity, maxHeight: .infinity)
|
|
}
|
|
|
|
@ToolbarContentBuilder
|
|
private var toolbar: some ToolbarContent {
|
|
// Auf iOS 26 übernimmt das `.tabViewBottomAccessory` aus RootView die
|
|
// „Neues Deck"-Pille. Doppelten „+"-Button im Liquid-Glass-Layout
|
|
// vermeiden — bottomBar-Button nur auf iOS < 26 zeigen.
|
|
if #unavailable(iOS 26.0) {
|
|
ToolbarItemGroup(placement: .bottomBar) {
|
|
Button {
|
|
authGate.require(reason: "deck-create-toolbar") {
|
|
showCreate = true
|
|
}
|
|
} label: {
|
|
Label("Deck hinzufügen", systemImage: "plus")
|
|
.labelStyle(.iconOnly)
|
|
.foregroundStyle(CardsTheme.primary)
|
|
}
|
|
.accessibilityLabel("Deck hinzufügen")
|
|
Spacer()
|
|
}
|
|
}
|
|
}
|
|
}
|