diff --git a/frontend/components.d.ts b/frontend/components.d.ts
index b9411e86..c205bb11 100644
--- a/frontend/components.d.ts
+++ b/frontend/components.d.ts
@@ -42,6 +42,8 @@ declare module 'vue' {
CodeEditor: typeof import('./src/components/Controls/CodeEditor.vue')['default']
CollapseSidebar: typeof import('./src/components/Icons/CollapseSidebar.vue')['default']
ColorSwatches: typeof import('./src/components/Controls/ColorSwatches.vue')['default']
+ CouponDetails: typeof import('./src/components/Settings/CouponDetails.vue')['default']
+ Coupons: typeof import('./src/components/Settings/Coupons.vue')['default']
CourseCard: typeof import('./src/components/CourseCard.vue')['default']
CourseCardOverlay: typeof import('./src/components/CourseCardOverlay.vue')['default']
CourseInstructors: typeof import('./src/components/CourseInstructors.vue')['default']
diff --git a/frontend/src/components/Settings/CouponDetails.vue b/frontend/src/components/Settings/CouponDetails.vue
new file mode 100644
index 00000000..3e3fff36
--- /dev/null
+++ b/frontend/src/components/Settings/CouponDetails.vue
@@ -0,0 +1,157 @@
+
+
+
+
+
diff --git a/frontend/src/components/Settings/Coupons.vue b/frontend/src/components/Settings/Coupons.vue
new file mode 100644
index 00000000..078f4846
--- /dev/null
+++ b/frontend/src/components/Settings/Coupons.vue
@@ -0,0 +1,92 @@
+
+
+
+
+
+
+
+
+ {{ __('Code') }}
+ {{ __('Type') }}
+ {{ __('Value') }}
+ {{ __('Expires On') }}
+ {{ __('Usage') }}
+ {{ __('Active') }}
+
+
+
+ {{ row.code }}
+ {{ row.discount_type }}
+
+ {{ row.percent_off }}%
+ {{ row.amount_off }}
+
+ {{ row.expires_on || '-' }}
+ {{ row.times_redeemed }}/{{ row.usage_limit || '∞' }}
+
+
+