diff --git a/packages/internal/docs/docs/v2/introduction/features/payments.mdx b/packages/internal/docs/docs/v2/introduction/features/payments.mdx
new file mode 100644
index 000000000..c83b807bf
--- /dev/null
+++ b/packages/internal/docs/docs/v2/introduction/features/payments.mdx
@@ -0,0 +1,58 @@
+---
+title: Payments and subscriptions
+description: Integration with Stripe
+---
+import useBaseUrl from "@docusaurus/useBaseUrl";
+
+SaaS Boilerplate provides a payments and subscriptions functionality out of the box based on the integration with
+Stripe. This functionality is divided into two parts: **[payments](#payments)** and
+**[subscription management](#subscription-management)**.
+
+### Payments
+
+The payments functionality allows users to define payment methods (including multiple cards) that are stored in the
+Stripe merchant account. Users can edit and update their payment methods at any time.
+
+
+
+
+
+The payment form allows users to make transactions with a defined amount of USD, using an already added payment method
+or adding a new card for one time charge. Successful transactions are added to the transaction history list.
+
+
+
+
+
+
+### Subscription management
+
+The subscription management functionality allows users to select one of the three pre-defined plans in the Stripe admin
+panel: Free, Monthly, and Yearly. The selected plan is automatically registered as an active subscription in the system
+and can be used in the business logic of the application. The system supports changing and canceling subscriptions
+based on the rules defined by the application administrator in Stripe.
+
+
+
+
+
+
+
+:::info
+If you would like to learn more about the technical aspects of the payments and subscriptions in SaaS Boilerplate,
+or if you need to adjust it to meet the specific needs of your application, please refer to our
+[Payments (Stripe integration)](../../../working-with-sb/payments) guides for detailed information.
+:::
+
+----
+
+Having Stripe payments integrated from the start of a SaaS project offers several advantages. First, it allows for a
+seamless user experience, as users can easily subscribe to paid plans and make payments without leaving the application.
+Second, it allows for better financial tracking and reporting, as all payment information is stored in the Stripe
+merchant account. Finally, it provides a scalable payment solution that can grow with the application, as Stripe
+supports a wide range of payment methods and currencies.
+
+_Payments and subscriptions functionality is a critical component of any SaaS application. SaaS Boilerplate offers a
+robust payments and subscriptions solution out of the box, integrated with Stripe. This functionality includes payment
+method management, a payment form for transactions, active subscription management, and the ability to change and cancel
+subscriptions._
\ No newline at end of file
diff --git a/packages/internal/docs/docs/v2/introduction/features/stripe.mdx b/packages/internal/docs/docs/v2/introduction/features/stripe.mdx
deleted file mode 100644
index 19d6e1fd8..000000000
--- a/packages/internal/docs/docs/v2/introduction/features/stripe.mdx
+++ /dev/null
@@ -1,6 +0,0 @@
----
-title: Payments and Subscriptions
-description: Stripe integration
----
-
-TBD
\ No newline at end of file
diff --git a/packages/internal/docs/docs/v2/working-with-sb/payments/index.mdx b/packages/internal/docs/docs/v2/working-with-sb/payments/index.mdx
new file mode 100644
index 000000000..1dd668866
--- /dev/null
+++ b/packages/internal/docs/docs/v2/working-with-sb/payments/index.mdx
@@ -0,0 +1,16 @@
+---
+title: Payments (Stripe integration)
+slug: /working-with-sb/payments
+---
+
+import DocCardList from '@theme/DocCardList';
+
+In this section, we will cover the technical details of the payments and subscriptions feature.
+
+:::info
+This is a comprehensive technical section of the documentation for the Stripe integration feature in SaaS Boilerplate.
+If you are looking for a high-level description of this feature, please refer to
+[this article](../../v2/introduction/features/payments).
+:::
+
+
diff --git a/packages/internal/docs/sidebars.js b/packages/internal/docs/sidebars.js
index 531bba359..6d42303c5 100644
--- a/packages/internal/docs/sidebars.js
+++ b/packages/internal/docs/sidebars.js
@@ -198,7 +198,7 @@ module.exports = {
'v2/introduction/features/emails',
'v2/introduction/features/notifications',
'v2/introduction/features/openai',
- 'v2/introduction/features/stripe',
+ 'v2/introduction/features/payments',
'v2/introduction/features/iac',
'v2/introduction/features/cicd',
'v2/introduction/features/cms',
@@ -412,7 +412,6 @@ module.exports = {
type: 'doc',
id: 'v2/working-with-sb/users/index',
},
-
items: [
'v2/working-with-sb/users/create-profile-field',
'v2/working-with-sb/users/create-oauth-method',
@@ -423,12 +422,10 @@ module.exports = {
{
type: 'category',
label: 'Payments (Stripe integration)',
-
+ collapsed: false,
link: {
- type: 'generated-index',
- title: 'Payments (Stripe integration)',
- description: 'TODO: >description<',
- slug: '/working-with-sb/payments',
+ type: 'doc',
+ id: 'v2/working-with-sb/payments/index',
},
items: [
'v2/working-with-sb/payments/one-time-payment-form',
diff --git a/packages/internal/docs/static/img/features/payments/card-form.png b/packages/internal/docs/static/img/features/payments/card-form.png
new file mode 100644
index 000000000..79d458f94
Binary files /dev/null and b/packages/internal/docs/static/img/features/payments/card-form.png differ
diff --git a/packages/internal/docs/static/img/features/payments/payment-form.png b/packages/internal/docs/static/img/features/payments/payment-form.png
new file mode 100644
index 000000000..05301f7c3
Binary files /dev/null and b/packages/internal/docs/static/img/features/payments/payment-form.png differ
diff --git a/packages/internal/docs/static/img/features/subscriptions/plans.png b/packages/internal/docs/static/img/features/subscriptions/plans.png
new file mode 100644
index 000000000..c830ed993
Binary files /dev/null and b/packages/internal/docs/static/img/features/subscriptions/plans.png differ
diff --git a/packages/internal/docs/static/img/features/subscriptions/subscriptions.png b/packages/internal/docs/static/img/features/subscriptions/subscriptions.png
new file mode 100644
index 000000000..00b85aa2a
Binary files /dev/null and b/packages/internal/docs/static/img/features/subscriptions/subscriptions.png differ
diff --git a/packages/internal/docs/static/img/features/subscriptions/transaction-history.png b/packages/internal/docs/static/img/features/subscriptions/transaction-history.png
new file mode 100644
index 000000000..ec4881e7b
Binary files /dev/null and b/packages/internal/docs/static/img/features/subscriptions/transaction-history.png differ