strapi-plugin-magic-mail 2.3.10 → 2.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,374 @@
1
+ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
+ import { useState, useEffect } from "react";
3
+ import { Loader, Typography, Flex, Toggle, Box, Field, TextInput } from "@strapi/design-system";
4
+ import { useFetchClient, useNotification } from "@strapi/strapi/admin";
5
+ import { ArrowPathIcon, LinkIcon, EyeIcon, EnvelopeIcon, UserIcon } from "@heroicons/react/24/outline";
6
+ import styled, { css, keyframes } from "styled-components";
7
+ import { T as TertiaryButton, G as GradientButton } from "./StyledButtons-nt2C730e.mjs";
8
+ const fadeIn = keyframes`
9
+ from { opacity: 0; transform: translateY(10px); }
10
+ to { opacity: 1; transform: translateY(0); }
11
+ `;
12
+ const PageContainer = styled(Box)`
13
+ ${css`animation: ${fadeIn} 0.4s ease-out;`}
14
+ max-width: 900px;
15
+ margin: 0 auto;
16
+ padding: 40px 32px;
17
+ `;
18
+ const PageHeader = styled(Flex)`
19
+ margin-bottom: 32px;
20
+ flex-direction: column;
21
+ align-items: flex-start;
22
+ gap: 8px;
23
+ `;
24
+ const PageTitle = styled(Typography)`
25
+ font-size: 28px;
26
+ font-weight: 700;
27
+ color: ${(props) => props.theme.colors.neutral800};
28
+ display: block;
29
+ `;
30
+ const PageSubtitle = styled(Typography)`
31
+ font-size: 14px;
32
+ color: ${(props) => props.theme.colors.neutral600};
33
+ display: block;
34
+ `;
35
+ const ActionBar = styled(Flex)`
36
+ margin-bottom: 32px;
37
+ padding: 16px 20px;
38
+ background: ${(props) => props.theme.colors.neutral0};
39
+ border: 1px solid ${(props) => props.theme.colors.neutral200};
40
+ border-radius: 8px;
41
+ box-shadow: 0 1px 2px rgba(0,0,0,0.05);
42
+ `;
43
+ const SettingsSection = styled(Box)`
44
+ background: ${(props) => props.theme.colors.neutral0};
45
+ border: 1px solid ${(props) => props.theme.colors.neutral200};
46
+ border-radius: 12px;
47
+ overflow: hidden;
48
+ margin-bottom: 24px;
49
+ box-shadow: 0 1px 3px rgba(0,0,0,0.04);
50
+ `;
51
+ const SectionHeader = styled(Flex)`
52
+ padding: 20px 24px;
53
+ background: ${(props) => props.theme.colors.neutral100};
54
+ border-bottom: 1px solid ${(props) => props.theme.colors.neutral200};
55
+ `;
56
+ const SectionIcon = styled(Box)`
57
+ width: 44px;
58
+ height: 44px;
59
+ border-radius: 10px;
60
+ display: flex;
61
+ align-items: center;
62
+ justify-content: center;
63
+ margin-right: 16px;
64
+ background: ${(props) => props.bgColor || "#E0F2FE"};
65
+ flex-shrink: 0;
66
+ `;
67
+ const SectionContent = styled(Box)`
68
+ padding: 24px;
69
+ `;
70
+ const SettingRow = styled(Flex)`
71
+ padding: 16px 0;
72
+ border-bottom: 1px solid ${(props) => props.theme.colors.neutral150};
73
+
74
+ &:last-child {
75
+ border-bottom: none;
76
+ padding-bottom: 0;
77
+ }
78
+
79
+ &:first-child {
80
+ padding-top: 0;
81
+ }
82
+ `;
83
+ const SettingInfo = styled(Flex)`
84
+ flex: 1;
85
+ padding-right: 24px;
86
+ flex-direction: column;
87
+ align-items: flex-start;
88
+ gap: 6px;
89
+ `;
90
+ const SettingLabel = styled(Typography)`
91
+ font-size: 14px;
92
+ font-weight: 600;
93
+ color: ${(props) => props.theme.colors.neutral800};
94
+ display: block;
95
+ `;
96
+ const SettingDescription = styled(Typography)`
97
+ font-size: 13px;
98
+ color: ${(props) => props.theme.colors.neutral500};
99
+ line-height: 1.5;
100
+ display: block;
101
+ `;
102
+ const ToggleWrapper = styled(Box)`
103
+ flex-shrink: 0;
104
+ display: flex;
105
+ align-items: center;
106
+ `;
107
+ const LoaderContainer = styled(Flex)`
108
+ min-height: 400px;
109
+ align-items: center;
110
+ justify-content: center;
111
+ flex-direction: column;
112
+ gap: 16px;
113
+ `;
114
+ const InfoBox = styled(Box)`
115
+ background: #EFF6FF;
116
+ border: 1px solid #BFDBFE;
117
+ border-radius: 8px;
118
+ padding: 12px 16px;
119
+ margin-top: 16px;
120
+ `;
121
+ const CodeSnippet = styled.code`
122
+ background: #1E293B;
123
+ color: #E2E8F0;
124
+ padding: 2px 8px;
125
+ border-radius: 4px;
126
+ font-size: 12px;
127
+ font-family: 'Monaco', 'Menlo', monospace;
128
+ `;
129
+ const PluginSettingsPage = () => {
130
+ const { get, put } = useFetchClient();
131
+ const { toggleNotification } = useNotification();
132
+ const [loading, setLoading] = useState(true);
133
+ const [settings, setSettings] = useState({
134
+ enableLinkTracking: true,
135
+ enableOpenTracking: true,
136
+ trackingBaseUrl: "",
137
+ defaultFromName: "",
138
+ defaultFromEmail: "",
139
+ unsubscribeUrl: "",
140
+ enableUnsubscribeHeader: true
141
+ });
142
+ const [hasChanges, setHasChanges] = useState(false);
143
+ const [saving, setSaving] = useState(false);
144
+ const fetchSettings = async () => {
145
+ setLoading(true);
146
+ try {
147
+ const response = await get("/magic-mail/settings");
148
+ if (response.data?.data) {
149
+ setSettings({
150
+ enableLinkTracking: response.data.data.enableLinkTracking ?? true,
151
+ enableOpenTracking: response.data.data.enableOpenTracking ?? true,
152
+ trackingBaseUrl: response.data.data.trackingBaseUrl || "",
153
+ defaultFromName: response.data.data.defaultFromName || "",
154
+ defaultFromEmail: response.data.data.defaultFromEmail || "",
155
+ unsubscribeUrl: response.data.data.unsubscribeUrl || "",
156
+ enableUnsubscribeHeader: response.data.data.enableUnsubscribeHeader ?? true
157
+ });
158
+ setHasChanges(false);
159
+ }
160
+ } catch (err) {
161
+ console.error("[MagicMail] Error fetching settings:", err);
162
+ toggleNotification({
163
+ type: "danger",
164
+ message: "Failed to load settings"
165
+ });
166
+ } finally {
167
+ setLoading(false);
168
+ }
169
+ };
170
+ const saveSettings = async () => {
171
+ setSaving(true);
172
+ try {
173
+ await put("/magic-mail/settings", settings);
174
+ toggleNotification({
175
+ type: "success",
176
+ message: "Settings saved successfully!"
177
+ });
178
+ setHasChanges(false);
179
+ } catch (err) {
180
+ console.error("[MagicMail] Error saving settings:", err);
181
+ toggleNotification({
182
+ type: "danger",
183
+ message: "Failed to save settings"
184
+ });
185
+ } finally {
186
+ setSaving(false);
187
+ }
188
+ };
189
+ const handleChange = (key, value) => {
190
+ setSettings((prev) => ({ ...prev, [key]: value }));
191
+ setHasChanges(true);
192
+ };
193
+ useEffect(() => {
194
+ fetchSettings();
195
+ }, []);
196
+ if (loading) {
197
+ return /* @__PURE__ */ jsx(PageContainer, { children: /* @__PURE__ */ jsx(LoaderContainer, { children: /* @__PURE__ */ jsx(Loader, { children: "Loading settings..." }) }) });
198
+ }
199
+ return /* @__PURE__ */ jsxs(PageContainer, { children: [
200
+ /* @__PURE__ */ jsxs(PageHeader, { children: [
201
+ /* @__PURE__ */ jsx(PageTitle, { children: "Plugin Settings" }),
202
+ /* @__PURE__ */ jsx(PageSubtitle, { children: "Configure email tracking, analytics, and default sender information" })
203
+ ] }),
204
+ /* @__PURE__ */ jsxs(ActionBar, { justifyContent: "space-between", alignItems: "center", children: [
205
+ /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", children: hasChanges ? "You have unsaved changes" : "All changes saved" }),
206
+ /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
207
+ /* @__PURE__ */ jsx(
208
+ TertiaryButton,
209
+ {
210
+ startIcon: /* @__PURE__ */ jsx(ArrowPathIcon, { style: { width: 18, height: 18 } }),
211
+ onClick: fetchSettings,
212
+ children: "Refresh"
213
+ }
214
+ ),
215
+ /* @__PURE__ */ jsx(
216
+ GradientButton,
217
+ {
218
+ onClick: saveSettings,
219
+ loading: saving,
220
+ disabled: !hasChanges,
221
+ children: "Save Changes"
222
+ }
223
+ )
224
+ ] })
225
+ ] }),
226
+ /* @__PURE__ */ jsxs(SettingsSection, { children: [
227
+ /* @__PURE__ */ jsxs(SectionHeader, { alignItems: "center", children: [
228
+ /* @__PURE__ */ jsx(SectionIcon, { bgColor: "#DBEAFE", children: /* @__PURE__ */ jsx(LinkIcon, { style: { width: 22, height: 22, color: "#2563EB" } }) }),
229
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", gap: 1, children: [
230
+ /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", children: "Link Tracking" }),
231
+ /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: "Track when recipients click links in your emails" })
232
+ ] })
233
+ ] }),
234
+ /* @__PURE__ */ jsxs(SectionContent, { children: [
235
+ /* @__PURE__ */ jsxs(SettingRow, { alignItems: "center", children: [
236
+ /* @__PURE__ */ jsxs(SettingInfo, { children: [
237
+ /* @__PURE__ */ jsx(SettingLabel, { children: "Enable Link Tracking" }),
238
+ /* @__PURE__ */ jsx(SettingDescription, { children: "Rewrite all links in outgoing emails to track click-through rates. This helps measure email engagement and campaign effectiveness." })
239
+ ] }),
240
+ /* @__PURE__ */ jsx(ToggleWrapper, { children: /* @__PURE__ */ jsx(
241
+ Toggle,
242
+ {
243
+ checked: settings.enableLinkTracking,
244
+ onChange: (e) => handleChange("enableLinkTracking", e.target.checked)
245
+ }
246
+ ) })
247
+ ] }),
248
+ settings.enableLinkTracking && /* @__PURE__ */ jsxs(Fragment, { children: [
249
+ /* @__PURE__ */ jsx(Box, { style: { marginTop: "20px" }, children: /* @__PURE__ */ jsxs(Field.Root, { children: [
250
+ /* @__PURE__ */ jsx(Field.Label, { children: "Tracking Base URL" }),
251
+ /* @__PURE__ */ jsx(
252
+ TextInput,
253
+ {
254
+ placeholder: "https://api.yoursite.com",
255
+ value: settings.trackingBaseUrl,
256
+ onChange: (e) => handleChange("trackingBaseUrl", e.target.value),
257
+ style: { marginTop: "8px" }
258
+ }
259
+ ),
260
+ /* @__PURE__ */ jsx(Field.Hint, { style: { marginTop: "8px" }, children: "The base URL for tracking links. Leave empty to use the server URL. Must be the public URL where your Strapi API is accessible." })
261
+ ] }) }),
262
+ /* @__PURE__ */ jsxs(InfoBox, { children: [
263
+ /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "primary700", fontWeight: "medium", children: "Per-Email Override" }),
264
+ /* @__PURE__ */ jsxs(Typography, { variant: "pi", textColor: "primary600", style: { marginTop: "4px" }, children: [
265
+ "Disable tracking for sensitive emails (password resets, magic links) by passing",
266
+ " ",
267
+ /* @__PURE__ */ jsx(CodeSnippet, { children: "skipLinkTracking: true" }),
268
+ " when sending."
269
+ ] })
270
+ ] })
271
+ ] })
272
+ ] })
273
+ ] }),
274
+ /* @__PURE__ */ jsxs(SettingsSection, { children: [
275
+ /* @__PURE__ */ jsxs(SectionHeader, { alignItems: "center", children: [
276
+ /* @__PURE__ */ jsx(SectionIcon, { bgColor: "#DCFCE7", children: /* @__PURE__ */ jsx(EyeIcon, { style: { width: 22, height: 22, color: "#16A34A" } }) }),
277
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", gap: 1, children: [
278
+ /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", children: "Open Tracking" }),
279
+ /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: "Track when recipients open your emails" })
280
+ ] })
281
+ ] }),
282
+ /* @__PURE__ */ jsx(SectionContent, { children: /* @__PURE__ */ jsxs(SettingRow, { alignItems: "center", children: [
283
+ /* @__PURE__ */ jsxs(SettingInfo, { children: [
284
+ /* @__PURE__ */ jsx(SettingLabel, { children: "Enable Open Tracking" }),
285
+ /* @__PURE__ */ jsx(SettingDescription, { children: "Inject an invisible tracking pixel into emails to detect when they are opened. Note: Some email clients block tracking pixels." })
286
+ ] }),
287
+ /* @__PURE__ */ jsx(ToggleWrapper, { children: /* @__PURE__ */ jsx(
288
+ Toggle,
289
+ {
290
+ checked: settings.enableOpenTracking,
291
+ onChange: (e) => handleChange("enableOpenTracking", e.target.checked)
292
+ }
293
+ ) })
294
+ ] }) })
295
+ ] }),
296
+ /* @__PURE__ */ jsxs(SettingsSection, { children: [
297
+ /* @__PURE__ */ jsxs(SectionHeader, { alignItems: "center", children: [
298
+ /* @__PURE__ */ jsx(SectionIcon, { bgColor: "#FEF3C7", children: /* @__PURE__ */ jsx(EnvelopeIcon, { style: { width: 22, height: 22, color: "#D97706" } }) }),
299
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", gap: 1, children: [
300
+ /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", children: "Unsubscribe Settings" }),
301
+ /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: "GDPR-compliant List-Unsubscribe headers" })
302
+ ] })
303
+ ] }),
304
+ /* @__PURE__ */ jsxs(SectionContent, { children: [
305
+ /* @__PURE__ */ jsxs(SettingRow, { alignItems: "center", children: [
306
+ /* @__PURE__ */ jsxs(SettingInfo, { children: [
307
+ /* @__PURE__ */ jsx(SettingLabel, { children: "Enable List-Unsubscribe Header" }),
308
+ /* @__PURE__ */ jsx(SettingDescription, { children: 'Add RFC 8058 compliant unsubscribe headers. This enables the "Unsubscribe" button in email clients like Gmail and Outlook.' })
309
+ ] }),
310
+ /* @__PURE__ */ jsx(ToggleWrapper, { children: /* @__PURE__ */ jsx(
311
+ Toggle,
312
+ {
313
+ checked: settings.enableUnsubscribeHeader,
314
+ onChange: (e) => handleChange("enableUnsubscribeHeader", e.target.checked)
315
+ }
316
+ ) })
317
+ ] }),
318
+ settings.enableUnsubscribeHeader && /* @__PURE__ */ jsx(Box, { style: { marginTop: "20px" }, children: /* @__PURE__ */ jsxs(Field.Root, { children: [
319
+ /* @__PURE__ */ jsx(Field.Label, { children: "Unsubscribe URL" }),
320
+ /* @__PURE__ */ jsx(
321
+ TextInput,
322
+ {
323
+ placeholder: "https://yoursite.com/unsubscribe?email={{email}}",
324
+ value: settings.unsubscribeUrl,
325
+ onChange: (e) => handleChange("unsubscribeUrl", e.target.value),
326
+ style: { marginTop: "8px" }
327
+ }
328
+ ),
329
+ /* @__PURE__ */ jsx(Field.Hint, { style: { marginTop: "8px" }, children: "The URL where users are directed when clicking unsubscribe. Leave empty to disable the header." })
330
+ ] }) })
331
+ ] })
332
+ ] }),
333
+ /* @__PURE__ */ jsxs(SettingsSection, { children: [
334
+ /* @__PURE__ */ jsxs(SectionHeader, { alignItems: "center", children: [
335
+ /* @__PURE__ */ jsx(SectionIcon, { bgColor: "#F3E8FF", children: /* @__PURE__ */ jsx(UserIcon, { style: { width: 22, height: 22, color: "#9333EA" } }) }),
336
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "flex-start", gap: 1, children: [
337
+ /* @__PURE__ */ jsx(Typography, { variant: "delta", fontWeight: "bold", children: "Default Sender" }),
338
+ /* @__PURE__ */ jsx(Typography, { variant: "pi", textColor: "neutral600", children: "Fallback sender information when not specified per email" })
339
+ ] })
340
+ ] }),
341
+ /* @__PURE__ */ jsx(SectionContent, { children: /* @__PURE__ */ jsxs(Box, { children: [
342
+ /* @__PURE__ */ jsxs(Field.Root, { style: { marginBottom: "20px" }, children: [
343
+ /* @__PURE__ */ jsx(Field.Label, { children: "Default From Name" }),
344
+ /* @__PURE__ */ jsx(
345
+ TextInput,
346
+ {
347
+ placeholder: "Your Company",
348
+ value: settings.defaultFromName,
349
+ onChange: (e) => handleChange("defaultFromName", e.target.value),
350
+ style: { marginTop: "8px" }
351
+ }
352
+ ),
353
+ /* @__PURE__ */ jsx(Field.Hint, { style: { marginTop: "8px" }, children: "The sender name shown in recipients' inboxes" })
354
+ ] }),
355
+ /* @__PURE__ */ jsxs(Field.Root, { children: [
356
+ /* @__PURE__ */ jsx(Field.Label, { children: "Default From Email" }),
357
+ /* @__PURE__ */ jsx(
358
+ TextInput,
359
+ {
360
+ placeholder: "noreply@yourcompany.com",
361
+ value: settings.defaultFromEmail,
362
+ onChange: (e) => handleChange("defaultFromEmail", e.target.value),
363
+ style: { marginTop: "8px" }
364
+ }
365
+ ),
366
+ /* @__PURE__ */ jsx(Field.Hint, { style: { marginTop: "8px" }, children: "Must be a verified sender address" })
367
+ ] })
368
+ ] }) })
369
+ ] })
370
+ ] });
371
+ };
372
+ export {
373
+ PluginSettingsPage as default
374
+ };
@@ -6,11 +6,9 @@ const designSystem = require("@strapi/design-system");
6
6
  const admin = require("@strapi/strapi/admin");
7
7
  const outline = require("@heroicons/react/24/outline");
8
8
  const styled = require("styled-components");
9
+ const StyledButtons = require("./StyledButtons-M7vUd2N4.js");
9
10
  const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
10
11
  const styled__default = /* @__PURE__ */ _interopDefault(styled);
11
- const theme = {
12
- borderRadius: { lg: "12px" }
13
- };
14
12
  const fadeIn = styled.keyframes`
15
13
  from { opacity: 0; transform: translateY(10px); }
16
14
  to { opacity: 1; transform: translateY(0); }
@@ -34,7 +32,7 @@ const StickySaveBar = styled__default.default(designSystem.Box)`
34
32
  `;
35
33
  const LicenseKeyBanner = styled__default.default(designSystem.Box)`
36
34
  background: linear-gradient(135deg, #0EA5E9 0%, #A855F7 100%);
37
- border-radius: ${theme.borderRadius.lg};
35
+ border-radius: 12px;
38
36
  padding: 28px 32px;
39
37
  color: white;
40
38
  position: relative;
@@ -72,7 +70,7 @@ const LoaderContainer = styled__default.default(designSystem.Flex)`
72
70
  flex-direction: column;
73
71
  gap: 16px;
74
72
  `;
75
- const LicensePage = () => {
73
+ const LicenseDetailsPage = () => {
76
74
  const { get } = admin.useFetchClient();
77
75
  const { toggleNotification } = admin.useNotification();
78
76
  const [loading, setLoading] = React.useState(true);
@@ -114,27 +112,27 @@ const LicensePage = () => {
114
112
  const lastName = data2.lastName || "";
115
113
  const fullName = `${firstName} ${lastName}`.trim() || "N/A";
116
114
  const content = `MagicMail - Email Business Suite - License Key
117
- ═══════════════════════════════════════
115
+ ===============================================
118
116
 
119
117
  License Key: ${licenseKey}
120
118
 
121
119
  License Holder Information:
122
- ──────────────────────────────────────
120
+ ----------------------------------------------
123
121
  Name: ${fullName}
124
122
  Email: ${email}
125
123
 
126
124
  License Status:
127
- ──────────────────────────────────────
125
+ ----------------------------------------------
128
126
  Status: ${data2.isActive ? "ACTIVE" : "INACTIVE"}
129
127
  Expires: ${data2.expiresAt ? new Date(data2.expiresAt).toLocaleDateString() : "Never"}
130
128
 
131
129
  Features:
132
- ──────────────────────────────────────
130
+ ----------------------------------------------
133
131
  Premium: ${data2.features?.premium ? "Enabled" : "Disabled"}
134
132
  Advanced: ${data2.features?.advanced ? "Enabled" : "Disabled"}
135
133
  Enterprise: ${data2.features?.enterprise ? "Enabled" : "Disabled"}
136
134
 
137
- ═══════════════════════════════════════
135
+ ===============================================
138
136
  Generated: ${(/* @__PURE__ */ new Date()).toLocaleString()}
139
137
  `;
140
138
  const blob = new Blob([content], { type: "text/plain" });
@@ -176,17 +174,10 @@ Generated: ${(/* @__PURE__ */ new Date()).toLocaleString()}
176
174
  /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "epsilon", textColor: "neutral600", children: "View your MagicMail plugin license" })
177
175
  ] }),
178
176
  /* @__PURE__ */ jsxRuntime.jsx(
179
- designSystem.Button,
177
+ StyledButtons.SecondaryButton,
180
178
  {
181
- startIcon: /* @__PURE__ */ jsxRuntime.jsx(outline.ArrowPathIcon, { style: { width: 20, height: 20 } }),
179
+ startIcon: /* @__PURE__ */ jsxRuntime.jsx(outline.ArrowPathIcon, { style: { width: 18, height: 18 } }),
182
180
  onClick: fetchLicenseStatus,
183
- size: "L",
184
- style: {
185
- background: "linear-gradient(135deg, #0EA5E9 0%, #A855F7 100%)",
186
- color: "white",
187
- fontWeight: "600",
188
- border: "none"
189
- },
190
181
  children: "Refresh Status"
191
182
  }
192
183
  )
@@ -199,34 +190,20 @@ Generated: ${(/* @__PURE__ */ new Date()).toLocaleString()}
199
190
  /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { style: { color: "white", fontFamily: "monospace", fontSize: "28px", fontWeight: "bold", wordBreak: "break-all", marginBottom: "16px" }, children: data.licenseKey }),
200
191
  /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 2, children: [
201
192
  /* @__PURE__ */ jsxRuntime.jsx(
202
- designSystem.Button,
193
+ StyledButtons.WhiteOutlineButton,
203
194
  {
204
195
  onClick: handleCopyLicenseKey,
205
196
  startIcon: /* @__PURE__ */ jsxRuntime.jsx(outline.DocumentDuplicateIcon, { style: { width: 16, height: 16 } }),
206
197
  size: "S",
207
- variant: "secondary",
208
- style: {
209
- backgroundColor: "rgba(255,255,255,0.2)",
210
- color: "white",
211
- border: "1px solid rgba(255,255,255,0.3)",
212
- fontWeight: "600"
213
- },
214
198
  children: "Copy Key"
215
199
  }
216
200
  ),
217
201
  /* @__PURE__ */ jsxRuntime.jsx(
218
- designSystem.Button,
202
+ StyledButtons.WhiteOutlineButton,
219
203
  {
220
204
  onClick: handleDownloadLicenseKey,
221
205
  startIcon: /* @__PURE__ */ jsxRuntime.jsx(outline.ArrowDownTrayIcon, { style: { width: 16, height: 16 } }),
222
206
  size: "S",
223
- variant: "secondary",
224
- style: {
225
- backgroundColor: "rgba(255,255,255,0.2)",
226
- color: "white",
227
- border: "1px solid rgba(255,255,255,0.3)",
228
- fontWeight: "600"
229
- },
230
207
  children: "Download as TXT"
231
208
  }
232
209
  )
@@ -286,15 +263,10 @@ Generated: ${(/* @__PURE__ */ new Date()).toLocaleString()}
286
263
  {
287
264
  backgroundColor: data.features?.premium ? "success100" : "neutral100",
288
265
  textColor: data.features?.premium ? "success700" : "neutral600",
289
- style: {
290
- fontSize: "13px",
291
- fontWeight: "700",
292
- padding: "8px 16px",
293
- border: data.features?.premium ? "2px solid #dcfce7" : "2px solid #e5e7eb"
294
- },
266
+ style: { fontSize: "13px", fontWeight: "700", padding: "8px 16px" },
295
267
  children: [
296
- data.features?.premium ? "" : "",
297
- " PREMIUM FEATURES"
268
+ data.features?.premium ? "[OK]" : "[X]",
269
+ " PREMIUM"
298
270
  ]
299
271
  }
300
272
  ),
@@ -303,15 +275,10 @@ Generated: ${(/* @__PURE__ */ new Date()).toLocaleString()}
303
275
  {
304
276
  backgroundColor: data.features?.advanced ? "primary100" : "neutral100",
305
277
  textColor: data.features?.advanced ? "primary700" : "neutral600",
306
- style: {
307
- fontSize: "13px",
308
- fontWeight: "700",
309
- padding: "8px 16px",
310
- border: data.features?.advanced ? "2px solid #bae6fd" : "2px solid #e5e7eb"
311
- },
278
+ style: { fontSize: "13px", fontWeight: "700", padding: "8px 16px" },
312
279
  children: [
313
- data.features?.advanced ? "" : "",
314
- " ADVANCED FEATURES"
280
+ data.features?.advanced ? "[OK]" : "[X]",
281
+ " ADVANCED"
315
282
  ]
316
283
  }
317
284
  ),
@@ -320,48 +287,37 @@ Generated: ${(/* @__PURE__ */ new Date()).toLocaleString()}
320
287
  {
321
288
  backgroundColor: data.features?.enterprise ? "secondary100" : "neutral100",
322
289
  textColor: data.features?.enterprise ? "secondary700" : "neutral600",
323
- style: {
324
- fontSize: "13px",
325
- fontWeight: "700",
326
- padding: "8px 16px",
327
- border: data.features?.enterprise ? "2px solid #ddd6fe" : "2px solid #e5e7eb"
328
- },
290
+ style: { fontSize: "13px", fontWeight: "700", padding: "8px 16px" },
329
291
  children: [
330
- data.features?.enterprise ? "" : "",
331
- " ENTERPRISE FEATURES"
292
+ data.features?.enterprise ? "[OK]" : "[X]",
293
+ " ENTERPRISE"
332
294
  ]
333
295
  }
334
296
  )
335
297
  ] }),
336
- data.features?.premium && /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { marginBottom: 5, padding: 5, background: "success50", hasRadius: true, style: { border: "2px solid #dcfce7" }, children: [
337
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", textColor: "success700", style: { marginBottom: "16px", display: "flex", alignItems: "center", gap: "8px" }, children: "Premium Features Active" }),
298
+ data.features?.premium && /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { marginBottom: 5, padding: 5, background: "success50", hasRadius: true, children: [
299
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", textColor: "success700", style: { marginBottom: "16px" }, children: "Premium Features Active" }),
338
300
  /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", gap: 2, children: [
339
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Gmail OAuth 2.0 (Unlimited accounts)" }),
340
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Microsoft 365 OAuth Integration" }),
341
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Yahoo Mail OAuth" }),
342
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " SendGrid & Mailgun Integration" }),
343
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: "✓ Smart Routing Rules (Unlimited)" }),
344
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: "✓ Email Analytics Dashboard" })
301
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", children: "[OK] Gmail OAuth 2.0" }),
302
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", children: "[OK] Microsoft 365 OAuth" }),
303
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", children: "[OK] Smart Routing Rules" }),
304
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "success700", children: "[OK] Email Analytics" })
345
305
  ] })
346
306
  ] }),
347
- data.features?.advanced && /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { marginBottom: 5, padding: 5, background: "primary50", hasRadius: true, style: { border: "2px solid #bae6fd" }, children: [
348
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", textColor: "primary700", style: { marginBottom: "16px", display: "flex", alignItems: "center", gap: "8px" }, children: "🚀 Advanced Features Active" }),
307
+ data.features?.advanced && /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { marginBottom: 5, padding: 5, background: "primary50", hasRadius: true, children: [
308
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", textColor: "primary700", style: { marginBottom: "16px" }, children: "Advanced Features Active" }),
349
309
  /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", gap: 2, children: [
350
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " DKIM Signing for SMTP" }),
351
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Email Designer Integration" }),
352
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Priority Email Headers" }),
353
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: "✓ List-Unsubscribe Headers (GDPR)" }),
354
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: "✓ Enhanced Security Validation" })
310
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", children: "[OK] DKIM Signing" }),
311
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", children: "[OK] Email Designer" }),
312
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "primary700", children: "[OK] List-Unsubscribe Headers" })
355
313
  ] })
356
314
  ] }),
357
- data.features?.enterprise && /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { padding: 5, background: "secondary50", hasRadius: true, style: { border: "2px solid #ddd6fe" }, children: [
358
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", textColor: "secondary700", style: { marginBottom: "16px", display: "flex", alignItems: "center", gap: "8px" }, children: "🏢 Enterprise Features Active" }),
315
+ data.features?.enterprise && /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { padding: 5, background: "secondary50", hasRadius: true, children: [
316
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", fontWeight: "bold", textColor: "secondary700", style: { marginBottom: "16px" }, children: "Enterprise Features Active" }),
359
317
  /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", gap: 2, children: [
360
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Multi-tenant Email Management" }),
361
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Compliance Reports (GDPR, CAN-SPAM)" }),
362
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: " Custom Routing Rules Engine" }),
363
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: "✓ Advanced Rate Limiting" }),
364
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", style: { fontSize: "14px", display: "flex", alignItems: "center", gap: "8px" }, children: "✓ Priority Support" })
318
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", children: "[OK] Multi-tenant Management" }),
319
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", children: "[OK] Compliance Reports" }),
320
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "secondary700", children: "[OK] Priority Support" })
365
321
  ] })
366
322
  ] })
367
323
  ] }) })
@@ -395,4 +351,4 @@ Generated: ${(/* @__PURE__ */ new Date()).toLocaleString()}
395
351
  ] })
396
352
  ] });
397
353
  };
398
- exports.default = LicensePage;
354
+ exports.default = LicenseDetailsPage;