Files
at-container-registry/pkg/appview/templates/partials/subscription_info.html
T

66 lines
3.1 KiB
HTML

{{ define "subscription_info" }}
{{ if .HideBilling }}
<!-- subscription: billing not available for this hold -->
{{ else }}
<section id="subscription-section" class="card bg-base-100 shadow-sm p-6 space-y-4">
<h2 class="text-xl font-semibold">Subscription</h2>
<p class="text-base-content/70">Manage your storage tier and billing.{{ if .HoldDisplayName }} Storage provided by <strong>{{ .HoldDisplayName }}</strong>.{{ end }}</p>
{{ if .Error }}
<div class="alert alert-error">
{{ icon "alert-circle" "size-5" }} {{ .Error }}
</div>
{{ else }}
<!-- Current Plan -->
<div class="bg-base-200 p-4 rounded-lg mb-4">
<div class="flex justify-between py-2 border-b border-base-300">
<span class="text-base-content/70">Current Tier:</span>
<span class="font-bold capitalize">{{ .CurrentTier }}</span>
</div>
{{ if and .CrewTier (ne .CrewTier .CurrentTier) }}
<div class="flex justify-between items-center py-2 border border-warning bg-warning/10 rounded-lg px-2 my-1">
<span class="text-base-content/70">Crew Record Tier:</span>
<span class="font-bold capitalize">{{ .CrewTier }}<span class="text-xs text-warning ml-2">(pending sync)</span></span>
</div>
{{ end }}
{{ if .SubscriptionID }}
<div class="flex justify-between py-2">
<span class="text-base-content/70">Billing:</span>
<span class="font-bold">{{ .BillingInterval }}</span>
</div>
<a href="/settings/subscription/portal" class="btn btn-outline btn-primary mt-4">Manage Billing</a>
{{ end }}
</div>
<!-- Available Tiers -->
{{ if .Tiers }}
<h3 class="font-semibold">Available Plans</h3>
<div class="grid grid-cols-[repeat(auto-fit,minmax(200px,1fr))] gap-4 mt-4">
{{ range .Tiers }}
<div class="border rounded-lg p-5 bg-base-200 relative flex flex-col{{ if .IsCurrent }} border-primary border-2{{ else }} border-base-300{{ end }}">
{{ if .IsCurrent }}<span class="badge badge-primary badge-sm absolute -top-2 right-4">Current</span>{{ end }}
<div class="text-xl font-bold capitalize mb-2">{{ .Name }}</div>
<div class="text-2xl font-bold text-primary">{{ .QuotaFormatted }}</div>
{{ if .Description }}
<div class="text-sm text-base-content/70 mb-4">{{ .Description }}</div>
{{ end }}
<div class="flex-1"></div>
<div class="text-base-content/70 my-2">{{ .PriceFormatted }}</div>
{{ if not .IsCurrent }}
{{ if or .PriceCentsMonthly .PriceCentsYearly }}
{{ if $.SubscriptionID }}
<a href="/settings/subscription/portal" class="btn btn-primary w-full">Change Plan</a>
{{ else }}
<a href="/settings/subscription/checkout?tier={{ .ID }}" class="btn btn-primary w-full">Upgrade</a>
{{ end }}
{{ end }}
{{ end }}
</div>
{{ end }}
</div>
{{ end }}
{{ end }}
</section>
{{ end }}
{{ end }}