strapi-plugin-magic-mail 2.4.0 → 2.6.0

package/dist/_chunks/{App-58t1-H0G.js → App-BTKgUbIs.js}

@@ -7632,11 +7632,79 @@ const InfoBox = styled__default.default(designSystem.Box)`
   margin: 20px 0;
 `;
 const TestSection = styled__default.default(designSystem.Box)`
-  background: ${(props) => props.theme.colors.neutral100};
-  border-radius: 12px;
+  background: linear-gradient(135deg, ${colors.whatsappLight} 0%, #E8F5E9 100%);
+  border: 1px solid ${colors.whatsapp}40;
+  border-radius: 16px;
   padding: 24px;
   margin-top: 24px;
 `;
+const WhatsAppInput = styled__default.default.input`
+  width: 100%;
+  padding: 14px 16px;
+  border: 2px solid ${(props) => props.theme.colors.neutral200};
+  border-radius: 12px;
+  font-size: 15px;
+  background: white;
+  color: ${(props) => props.theme.colors.neutral800};
+  transition: all 0.2s ease;
+  box-sizing: border-box;
+  
+  &:focus {
+    outline: none;
+    border-color: ${colors.whatsapp};
+    box-shadow: 0 0 0 3px ${colors.whatsapp}20;
+  }
+  
+  &::placeholder {
+    color: ${(props) => props.theme.colors.neutral400};
+  }
+`;
+const WhatsAppTextarea = styled__default.default.textarea`
+  width: 100%;
+  padding: 14px 16px;
+  border: 2px solid ${(props) => props.theme.colors.neutral200};
+  border-radius: 12px;
+  font-size: 15px;
+  background: white;
+  color: ${(props) => props.theme.colors.neutral800};
+  transition: all 0.2s ease;
+  box-sizing: border-box;
+  resize: vertical;
+  min-height: 80px;
+  font-family: inherit;
+  
+  &:focus {
+    outline: none;
+    border-color: ${colors.whatsapp};
+    box-shadow: 0 0 0 3px ${colors.whatsapp}20;
+  }
+  
+  &::placeholder {
+    color: ${(props) => props.theme.colors.neutral400};
+  }
+`;
+const InputLabel = styled__default.default.label`
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 14px;
+  font-weight: 600;
+  color: ${colors.whatsappDark};
+  margin-bottom: 8px;
+`;
+const InputHint = styled__default.default.span`
+  font-size: 12px;
+  color: ${(props) => props.theme.colors.neutral500};
+  margin-top: 6px;
+  display: block;
+`;
+const PhoneSymbol = styled__default.default.span`
+  font-size: 16px;
+  font-weight: 700;
+`;
+const MessageSymbol = styled__default.default.span`
+  font-size: 16px;
+`;
 const UseCaseCard = styled__default.default(designSystem.Box)`
   background: linear-gradient(135deg, ${colors.whatsappLight}, ${theme$3.colors.primary[50]});
   border: 2px solid ${colors.whatsapp};
@@ -8073,27 +8141,34 @@ const WhatsAppPage = () => {
       /* @__PURE__ */ jsxRuntime.jsxs(ContentCard, { style: { marginTop: "24px" }, children: [
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Send Test Message" }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "24px" }, children: "Test your WhatsApp connection by sending a message." }),
-        /* @__PURE__ */ jsxRuntime.jsx(TestSection, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", gap: 4, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Phone Number" }),
+        /* @__PURE__ */ jsxRuntime.jsxs(TestSection, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { style: { marginBottom: "20px" }, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(InputLabel, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(PhoneSymbol, { children: "+" }),
+              "Phone Number"
+            ] }),
             /* @__PURE__ */ jsxRuntime.jsx(
-              designSystem.TextInput,
+              WhatsAppInput,
               {
-                placeholder: "49123456789 (with country code, no +)",
+                placeholder: "49123456789",
                 value: testPhone,
                 onChange: (e) => setTestPhone(e.target.value)
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Hint, { children: "Enter phone number with country code (e.g., 49 for Germany)" })
+            /* @__PURE__ */ jsxRuntime.jsx(InputHint, { children: "Enter with country code, without + (e.g., 49 for Germany, 1 for USA)" })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: "Message (optional)" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Box, { style: { marginBottom: "24px" }, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(InputLabel, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(MessageSymbol, { children: "@" }),
+              "Message (optional)"
+            ] }),
             /* @__PURE__ */ jsxRuntime.jsx(
-              designSystem.TextInput,
+              WhatsAppTextarea,
               {
-                placeholder: "Leave empty for default test message",
+                placeholder: "Type your message here... or leave empty for default test message",
                 value: testMessage,
-                onChange: (e) => setTestMessage(e.target.value)
+                onChange: (e) => setTestMessage(e.target.value),
+                rows: 3
               }
             )
           ] }),
@@ -8102,10 +8177,12 @@ const WhatsAppPage = () => {
             {
               onClick: handleSendTest,
               loading: sendingTest,
+              disabled: !testPhone,
+              style: { width: "100%" },
               children: "Send Test Message"
             }
           )
-        ] }) }),
+        ] }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Divider, { style: { margin: "24px 0" } }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Using WhatsApp in Your Code" }),
         /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "16px" }, children: "Use the WhatsApp service programmatically in your Strapi code." }),

package/dist/_chunks/{App-ClJVoU2s.mjs → App-J8-8Wz0m.mjs}

@@ -7609,11 +7609,79 @@ const InfoBox = styled(Box)`
   margin: 20px 0;
 `;
 const TestSection = styled(Box)`
-  background: ${(props) => props.theme.colors.neutral100};
-  border-radius: 12px;
+  background: linear-gradient(135deg, ${colors.whatsappLight} 0%, #E8F5E9 100%);
+  border: 1px solid ${colors.whatsapp}40;
+  border-radius: 16px;
   padding: 24px;
   margin-top: 24px;
 `;
+const WhatsAppInput = styled.input`
+  width: 100%;
+  padding: 14px 16px;
+  border: 2px solid ${(props) => props.theme.colors.neutral200};
+  border-radius: 12px;
+  font-size: 15px;
+  background: white;
+  color: ${(props) => props.theme.colors.neutral800};
+  transition: all 0.2s ease;
+  box-sizing: border-box;
+  
+  &:focus {
+    outline: none;
+    border-color: ${colors.whatsapp};
+    box-shadow: 0 0 0 3px ${colors.whatsapp}20;
+  }
+  
+  &::placeholder {
+    color: ${(props) => props.theme.colors.neutral400};
+  }
+`;
+const WhatsAppTextarea = styled.textarea`
+  width: 100%;
+  padding: 14px 16px;
+  border: 2px solid ${(props) => props.theme.colors.neutral200};
+  border-radius: 12px;
+  font-size: 15px;
+  background: white;
+  color: ${(props) => props.theme.colors.neutral800};
+  transition: all 0.2s ease;
+  box-sizing: border-box;
+  resize: vertical;
+  min-height: 80px;
+  font-family: inherit;
+  
+  &:focus {
+    outline: none;
+    border-color: ${colors.whatsapp};
+    box-shadow: 0 0 0 3px ${colors.whatsapp}20;
+  }
+  
+  &::placeholder {
+    color: ${(props) => props.theme.colors.neutral400};
+  }
+`;
+const InputLabel = styled.label`
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 14px;
+  font-weight: 600;
+  color: ${colors.whatsappDark};
+  margin-bottom: 8px;
+`;
+const InputHint = styled.span`
+  font-size: 12px;
+  color: ${(props) => props.theme.colors.neutral500};
+  margin-top: 6px;
+  display: block;
+`;
+const PhoneSymbol = styled.span`
+  font-size: 16px;
+  font-weight: 700;
+`;
+const MessageSymbol = styled.span`
+  font-size: 16px;
+`;
 const UseCaseCard = styled(Box)`
   background: linear-gradient(135deg, ${colors.whatsappLight}, ${theme$3.colors.primary[50]});
   border: 2px solid ${colors.whatsapp};
@@ -8050,27 +8118,34 @@ const WhatsAppPage = () => {
       /* @__PURE__ */ jsxs(ContentCard, { style: { marginTop: "24px" }, children: [
         /* @__PURE__ */ jsx(Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Send Test Message" }),
         /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "24px" }, children: "Test your WhatsApp connection by sending a message." }),
-        /* @__PURE__ */ jsx(TestSection, { children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 4, children: [
-          /* @__PURE__ */ jsxs(Field.Root, { children: [
-            /* @__PURE__ */ jsx(Field.Label, { children: "Phone Number" }),
+        /* @__PURE__ */ jsxs(TestSection, { children: [
+          /* @__PURE__ */ jsxs(Box, { style: { marginBottom: "20px" }, children: [
+            /* @__PURE__ */ jsxs(InputLabel, { children: [
+              /* @__PURE__ */ jsx(PhoneSymbol, { children: "+" }),
+              "Phone Number"
+            ] }),
             /* @__PURE__ */ jsx(
-              TextInput,
+              WhatsAppInput,
               {
-                placeholder: "49123456789 (with country code, no +)",
+                placeholder: "49123456789",
                 value: testPhone,
                 onChange: (e) => setTestPhone(e.target.value)
               }
             ),
-            /* @__PURE__ */ jsx(Field.Hint, { children: "Enter phone number with country code (e.g., 49 for Germany)" })
+            /* @__PURE__ */ jsx(InputHint, { children: "Enter with country code, without + (e.g., 49 for Germany, 1 for USA)" })
           ] }),
-          /* @__PURE__ */ jsxs(Field.Root, { children: [
-            /* @__PURE__ */ jsx(Field.Label, { children: "Message (optional)" }),
+          /* @__PURE__ */ jsxs(Box, { style: { marginBottom: "24px" }, children: [
+            /* @__PURE__ */ jsxs(InputLabel, { children: [
+              /* @__PURE__ */ jsx(MessageSymbol, { children: "@" }),
+              "Message (optional)"
+            ] }),
             /* @__PURE__ */ jsx(
-              TextInput,
+              WhatsAppTextarea,
               {
-                placeholder: "Leave empty for default test message",
+                placeholder: "Type your message here... or leave empty for default test message",
                 value: testMessage,
-                onChange: (e) => setTestMessage(e.target.value)
+                onChange: (e) => setTestMessage(e.target.value),
+                rows: 3
               }
             )
           ] }),
@@ -8079,10 +8154,12 @@ const WhatsAppPage = () => {
             {
               onClick: handleSendTest,
               loading: sendingTest,
+              disabled: !testPhone,
+              style: { width: "100%" },
               children: "Send Test Message"
             }
           )
-        ] }) }),
+        ] }),
         /* @__PURE__ */ jsx(Divider, { style: { margin: "24px 0" } }),
         /* @__PURE__ */ jsx(Typography, { variant: "beta", fontWeight: "bold", style: { display: "block", marginBottom: "8px" }, children: "Using WhatsApp in Your Code" }),
         /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "neutral600", style: { display: "block", marginBottom: "16px" }, children: "Use the WhatsApp service programmatically in your Strapi code." }),

package/dist/admin/index.js

@@ -1,5 +1,6 @@
 "use strict";
 const React = require("react");
+const admin = require("@strapi/strapi/admin");
 const jsxRuntime = require("react/jsx-runtime");
 const outline = require("@heroicons/react/24/outline");
 const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
@@ -25,9 +26,25 @@ const pluginPkg = {
 const pluginId = "magic-mail";
 const Initializer = ({ setPlugin }) => {
   const ref = React.useRef(setPlugin);
+  const { get } = admin.useFetchClient();
   React.useEffect(() => {
     ref.current(pluginId);
   }, []);
+  React.useEffect(() => {
+    const HEARTBEAT_INTERVAL = 4 * 60 * 1e3;
+    const heartbeat = async () => {
+      try {
+        await get(`/${pluginId}/license/status`);
+      } catch (error) {
+      }
+    };
+    const initialTimeout = setTimeout(heartbeat, 60 * 1e3);
+    const interval = setInterval(heartbeat, HEARTBEAT_INTERVAL);
+    return () => {
+      clearTimeout(initialTimeout);
+      clearInterval(interval);
+    };
+  }, [get]);
   return null;
 };
 const PluginIcon = () => /* @__PURE__ */ jsxRuntime.jsx(outline.EnvelopeIcon, { style: { width: 24, height: 24 } });
@@ -48,7 +65,7 @@ const index = {
         id: `${pluginId}.plugin.name`,
         defaultMessage: "MagicMail"
       },
-      Component: () => Promise.resolve().then(() => require("../_chunks/App-58t1-H0G.js"))
+      Component: () => Promise.resolve().then(() => require("../_chunks/App-BTKgUbIs.js"))
     });
     app.createSettingSection(
       {

package/dist/admin/index.mjs

@@ -1,4 +1,5 @@
 import { useRef, useEffect } from "react";
+import { useFetchClient } from "@strapi/strapi/admin";
 import { jsx } from "react/jsx-runtime";
 import { EnvelopeIcon } from "@heroicons/react/24/outline";
 const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
@@ -24,9 +25,25 @@ const pluginPkg = {
 const pluginId = "magic-mail";
 const Initializer = ({ setPlugin }) => {
   const ref = useRef(setPlugin);
+  const { get } = useFetchClient();
   useEffect(() => {
     ref.current(pluginId);
   }, []);
+  useEffect(() => {
+    const HEARTBEAT_INTERVAL = 4 * 60 * 1e3;
+    const heartbeat = async () => {
+      try {
+        await get(`/${pluginId}/license/status`);
+      } catch (error) {
+      }
+    };
+    const initialTimeout = setTimeout(heartbeat, 60 * 1e3);
+    const interval = setInterval(heartbeat, HEARTBEAT_INTERVAL);
+    return () => {
+      clearTimeout(initialTimeout);
+      clearInterval(interval);
+    };
+  }, [get]);
   return null;
 };
 const PluginIcon = () => /* @__PURE__ */ jsx(EnvelopeIcon, { style: { width: 24, height: 24 } });
@@ -47,7 +64,7 @@ const index = {
         id: `${pluginId}.plugin.name`,
         defaultMessage: "MagicMail"
       },
-      Component: () => import("../_chunks/App-ClJVoU2s.mjs")
+      Component: () => import("../_chunks/App-J8-8Wz0m.mjs")
     });
     app.createSettingSection(
       {

package/dist/server/index.js

@@ -5649,7 +5649,7 @@ function requireOauth() {
   });
   return oauth;
 }
-const version = "2.4.0";
+const version = "2.5.0";
 const require$$2 = {
   version
 };

package/dist/server/index.mjs

@@ -5639,7 +5639,7 @@ function requireOauth() {
   });
   return oauth;
 }
-const version = "2.4.0";
+const version = "2.5.0";
 const require$$2 = {
   version
 };

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "2.4.0",
+  "version": "2.6.0",
   "keywords": [
     "strapi",
     "strapi-plugin",
@@ -48,14 +48,14 @@
   },
   "dependencies": {
     "@heroicons/react": "^2.2.0",
-    "@strapi/design-system": "^2.0.2",
-    "@strapi/icons": "^2.0.2",
+    "@strapi/design-system": "^2.1.2",
+    "@strapi/icons": "^2.1.2",
     "baileys": "^7.0.0-rc.9",
     "decode-html": "^2.0.0",
     "form-data": "^4.0.4",
     "html-to-text": "^9.0.5",
     "mustache": "^4.2.0",
-    "nodemailer": "^7.0.10",
+    "nodemailer": "^7.0.12",
     "pino": "^9.5.0",
     "qrcode": "^1.5.4",
     "react-email-editor": "^1.7.11",
@@ -70,7 +70,7 @@
     "@semantic-release/github": "^11.0.2",
     "@semantic-release/npm": "^13.1.2",
     "@semantic-release/release-notes-generator": "^14.0.1",
-    "@strapi/sdk-plugin": "^5.3.2",
+    "@strapi/sdk-plugin": "^5.4.0",
     "@strapi/strapi": "^5.33.4",
     "prettier": "^3.6.2",
     "react": "^18.3.1",
@@ -80,7 +80,7 @@
     "styled-components": "^6.3.8"
   },
   "peerDependencies": {
-    "@strapi/sdk-plugin": "^5.3.2",
+    "@strapi/sdk-plugin": "^5.4.0",
     "@strapi/strapi": "^5.33.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",