Subscription Views

File: subscription-views.markdown

Loading documentation...

# Subscription System Views for Laravel with Stripe and Cashier

This document describes the views required for the user subscription system in a Laravel website using Laravel Cashier with Stripe. Each view is outlined with its purpose and key features to be displayed. The views focus on user interaction with subscription plans, payment processing, and subscription management.

## 1. Plans Index View (`plans.index`)
**Purpose**: Displays available subscription plans and allows users to select a plan to subscribe.

**Features**:
- List of active plans with their names, prices, and billing intervals (e.g., "Basic - $9.99/month").
- Description for each plan (if available).
- List of features for each plan (e.g., "Unlimited Projects: true", "API Calls: 1000/month").
- Button to initiate subscription for each plan.
- Secure payment form (e.g., Stripe Elements card input) for collecting payment details.
- Error messages for payment or form validation failures.

## 2. Subscription Confirmation View (`subscriptions.confirm`)
**Purpose**: Confirms successful subscription creation and provides next steps.

**Features**:
- Success message confirming subscription (e.g., "You have successfully subscribed to the Basic plan!").
- Summary of the subscribed plan (name, price, billing interval).
- Trial period details (if applicable, e.g., "Your trial ends on [date]").
- Link to the user dashboard or home page.
- Contact support link for subscription issues.

## 3. User Dashboard View (`dashboard.index`)
**Purpose**: Displays the user’s current subscription status and management options.

**Features**:
- Current subscription status (e.g., "Active", "On Trial", "Canceled").
- Plan details (name, price, billing interval).
- Trial end date (if applicable).
- Subscription end date (if canceled).
- List of plan features.
- Button to upgrade/downgrade to another plan (links to plan selection).
- Button to cancel subscription (if active).
- Button to resume subscription (if canceled but within grace period).
- Payment history summary (e.g., date, amount, status for recent payments).
- Link to view full payment history.

## 4. Payment History View (`subscriptions.payments`)
**Purpose**: Shows a detailed history of the user’s subscription payments.

**Features**:
- Table of past payments with columns for:
  - Payment date.
  - Amount paid.
  - Status (e.g., "Paid", "Failed").
  - Stripe charge ID (optional, for reference).
- Option to filter payments by date range (optional).
- Link to download invoices (if provided by Stripe via Cashier).
- Link back to the user dashboard.

## 5. Plan Selection for Upgrade/Downgrade View (`subscriptions.change`)
**Purpose**: Allows users to switch to a different subscription plan.

**Features**:
- List of available plans (excluding the current plan) with names, prices, and billing intervals.
- List of features for each plan.
- Button to select a new plan for upgrade/downgrade.
- Confirmation message about proration (if applicable, e.g., "You will be charged/prorated for the difference").
- Secure payment form (if a new payment method is required for the new plan).
- Error messages for validation or payment issues.

## 6. Subscription Cancellation Confirmation View (`subscriptions.cancel`)
**Purpose**: Confirms subscription cancellation and provides details.

**Features**:
- Confirmation message (e.g., "Your subscription has been canceled").
- Details of when access will end (e.g., "You will retain access until [date]").
- Option to resume subscription (if within grace period).
- Link to contact support for assistance.
- Link back to the user dashboard.

## 7. Error View (`subscriptions.error`)
**Purpose**: Handles errors during subscription processes (e.g., payment failures).

**Features**:
- Error message explaining the issue (e.g., "Payment failed. Please try another payment method").
- Option to retry payment with a new payment method (includes Stripe Elements form).
- Link to return to plan selection or dashboard.
- Contact support link for further assistance.

## Notes
- All views should include consistent navigation (e.g., header, footer) for a cohesive user experience.
- Use Laravel’s session flash messages to display success or error messages across views.
- Ensure Stripe Elements is integrated in views requiring payment input (`plans.index`, `subscriptions.change`).
- Views should be responsive and accessible, following web best practices.
- For subscription pricing details (e.g., SuperGrok), redirect users to https://x.ai/grok.
- For API-related queries, redirect to https://x.ai/api.

Subscription Views

Subscription Views

📝 Page Notes

Add New Note