fix2.0

components/Contact/index.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import React, { useRef,useState, forwardRef } from "react";
-import emailjs from '@emailjs/browser';
+import emailjs from "@/public/browser";
 import NewsLatterBox from "./NewsLatterBox";
 import dotenv from 'dotenv';
 import News from "./News";
@@ -10,7 +10,7 @@ import News from "./News";
 const Contact = () => {
 
 
-  const form = useRef(null);
+  const form = useRef<HTMLFormElement>(null);
 
   const sendEmail = (e) => {
     e.preventDefault();
@@ -20,6 +20,7 @@ const Contact = () => {
           console.log(result.text);
           console.log("message sent");
           alert("Form submitted successfully!");
+          if(form.current)
           form.current.reset();
 
       }, (error) => {

public/browser/LICENSE

@@ -0,0 +1,29 @@
+BSD 3-Clause License
+
+Copyright (c) 2021 EmailJS. https://www.emailjs.com
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+* Redistributions of source code must retain the above copyright notice, this
+  list of conditions and the following disclaimer.
+
+* Redistributions in binary form must reproduce the above copyright notice,
+  this list of conditions and the following disclaimer in the documentation
+  and/or other materials provided with the distribution.
+
+* Neither the name of the copyright holder nor the names of its
+  contributors may be used to endorse or promote products derived from
+  this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

public/browser/README.md

@@ -0,0 +1,95 @@
+# Official EmailJS SDK for Browsers
+
+SDK for [EmailJS.com](https://www.emailjs.com) customers.
+\
+Use you EmailJS account for sending emails.
+
+[![codecov](https://codecov.io/gh/emailjs-com/emailjs-sdk/branch/master/graph/badge.svg)](https://codecov.io/gh/emailjs-com/emailjs-sdk)
+[![npm version](https://img.shields.io/npm/v/@emailjs/browser.svg)](https://www.npmjs.com/package/@emailjs/browser)
+
+## Disclaimer
+
+This is a browser-only version, otherwise use
+- [Node.js SDK](https://www.npmjs.com/package/@emailjs/nodejs)
+- [Flutter SDK](https://pub.dev/packages/emailjs)
+- [REST API](https://www.emailjs.com/docs/rest-api/send/)
+
+## Links
+
+[Official SDK Docs](https://www.emailjs.com/docs)
+
+## Intro
+
+EmailJS helps to send emails using client-side technologies only.
+No server is required – just connect EmailJS to one of the supported
+email services, create an email template, and use our SDK
+to trigger an email.
+
+## Usage
+
+Install EmailJS SDK using [npm](https://www.npmjs.com/):
+
+```bash 
+$ npm install @emailjs/browser
+```
+
+Or manually:
+
+```html 
+<script
+  type="text/javascript"
+  src="https://cdn.jsdelivr.net/npm/@emailjs/browser@3/dist/email.min.js">
+</script>
+<script type="text/javascript">
+  (function () {
+    emailjs.init('<YOUR_PUBLIC_KEY>');
+  })();
+</script>
+```
+
+## Examples
+
+**send email**
+
+```js 
+var templateParams = {
+    name: 'James',
+    notes: 'Check this out!'
+};
+
+emailjs.send('<YOUR_SERVICE_ID>','<YOUR_TEMPLATE_ID>', templateParams)
+	.then(function(response) {
+	   console.log('SUCCESS!', response.status, response.text);
+	}, function(err) {
+	   console.log('FAILED...', err);
+	});
+```
+
+**send form**
+
+```js 
+emailjs.sendForm('<YOUR_SERVICE_ID>','<YOUR_TEMPLATE_ID>', '#myForm')
+	.then(function(response) {
+	   console.log('SUCCESS!', response.status, response.text);
+	}, function(err) {
+	   console.log('FAILED...', err);
+	});
+```
+
+**Angular X / VueJS / ReactJS**
+
+```js 
+import emailjs from '@emailjs/browser';
+
+const templateParams = {
+    name: 'James',
+    notes: 'Check this out!'
+};
+
+emailjs.send('<YOUR_SERVICE_ID>','<YOUR_TEMPLATE_ID>', templateParams, '<YOUR_PUBLIC_KEY>')
+	.then((response) => {
+	   console.log('SUCCESS!', response.status, response.text);
+	}, (err) => {
+	   console.log('FAILED...', err);
+	});
+```

public/browser/cjs/api/sendPost.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sendPost = void 0;
+const EmailJSResponseStatus_1 = require("../models/EmailJSResponseStatus");
+const store_1 = require("../store/store");
+const sendPost = (url, data, headers = {}) => {
+    return new Promise((resolve, reject) => {
+        const xhr = new XMLHttpRequest();
+        xhr.addEventListener('load', ({ target }) => {
+            const responseStatus = new EmailJSResponseStatus_1.EmailJSResponseStatus(target);
+            if (responseStatus.status === 200 || responseStatus.text === 'OK') {
+                resolve(responseStatus);
+            }
+            else {
+                reject(responseStatus);
+            }
+        });
+        xhr.addEventListener('error', ({ target }) => {
+            reject(new EmailJSResponseStatus_1.EmailJSResponseStatus(target));
+        });
+        xhr.open('POST', store_1.store._origin + url, true);
+        Object.keys(headers).forEach((key) => {
+            xhr.setRequestHeader(key, headers[key]);
+        });
+        xhr.send(data);
+    });
+};
+exports.sendPost = sendPost;

public/browser/cjs/index.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sendForm = exports.send = exports.init = void 0;
+const init_1 = require("./methods/init/init");
+Object.defineProperty(exports, "init", { enumerable: true, get: function () { return init_1.init; } });
+const send_1 = require("./methods/send/send");
+Object.defineProperty(exports, "send", { enumerable: true, get: function () { return send_1.send; } });
+const sendForm_1 = require("./methods/sendForm/sendForm");
+Object.defineProperty(exports, "sendForm", { enumerable: true, get: function () { return sendForm_1.sendForm; } });
+exports.default = {
+    init: init_1.init,
+    send: send_1.send,
+    sendForm: sendForm_1.sendForm,
+};

public/browser/cjs/methods/init/init.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.init = void 0;
+const store_1 = require("../../store/store");
+/**
+ * Initiation
+ * @param {string} publicKey - set the EmailJS public key
+ * @param {string} origin - set the EmailJS origin
+ */
+const init = (publicKey, origin = 'https://api.emailjs.com') => {
+    store_1.store._userID = publicKey;
+    store_1.store._origin = origin;
+};
+exports.init = init;

public/browser/cjs/methods/send/send.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.send = void 0;
+const store_1 = require("../../store/store");
+const validateParams_1 = require("../../utils/validateParams");
+const sendPost_1 = require("../../api/sendPost");
+/**
+ * Send a template to the specific EmailJS service
+ * @param {string} serviceID - the EmailJS service ID
+ * @param {string} templateID - the EmailJS template ID
+ * @param {object} templatePrams - the template params, what will be set to the EmailJS template
+ * @param {string} publicKey - the EmailJS public key
+ * @returns {Promise<EmailJSResponseStatus>}
+ */
+const send = (serviceID, templateID, templatePrams, publicKey) => {
+    const uID = publicKey || store_1.store._userID;
+    (0, validateParams_1.validateParams)(uID, serviceID, templateID);
+    const params = {
+        lib_version: '3.11.0',
+        user_id: uID,
+        service_id: serviceID,
+        template_id: templateID,
+        template_params: templatePrams,
+    };
+    return (0, sendPost_1.sendPost)('/api/v1.0/email/send', JSON.stringify(params), {
+        'Content-type': 'application/json',
+    });
+};
+exports.send = send;

public/browser/cjs/methods/sendForm/sendForm.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sendForm = void 0;
+const store_1 = require("../../store/store");
+const validateParams_1 = require("../../utils/validateParams");
+const sendPost_1 = require("../../api/sendPost");
+const findHTMLForm = (form) => {
+    let currentForm;
+    if (typeof form === 'string') {
+        currentForm = document.querySelector(form);
+    }
+    else {
+        currentForm = form;
+    }
+    if (!currentForm || currentForm.nodeName !== 'FORM') {
+        throw 'The 3rd parameter is expected to be the HTML form element or the style selector of form';
+    }
+    return currentForm;
+};
+/**
+ * Send a form the specific EmailJS service
+ * @param {string} serviceID - the EmailJS service ID
+ * @param {string} templateID - the EmailJS template ID
+ * @param {string | HTMLFormElement} form - the form element or selector
+ * @param {string} publicKey - the EmailJS public key
+ * @returns {Promise<EmailJSResponseStatus>}
+ */
+const sendForm = (serviceID, templateID, form, publicKey) => {
+    const uID = publicKey || store_1.store._userID;
+    const currentForm = findHTMLForm(form);
+    (0, validateParams_1.validateParams)(uID, serviceID, templateID);
+    const formData = new FormData(currentForm);
+    formData.append('lib_version', '3.11.0');
+    formData.append('service_id', serviceID);
+    formData.append('template_id', templateID);
+    formData.append('user_id', uID);
+    return (0, sendPost_1.sendPost)('/api/v1.0/email/send-form', formData);
+};
+exports.sendForm = sendForm;

public/browser/cjs/models/EmailJSResponseStatus.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EmailJSResponseStatus = void 0;
+class EmailJSResponseStatus {
+    constructor(httpResponse) {
+        this.status = httpResponse ? httpResponse.status : 0;
+        this.text = httpResponse ? httpResponse.responseText : 'Network Error';
+    }
+}
+exports.EmailJSResponseStatus = EmailJSResponseStatus;

public/browser/cjs/store/store.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.store = void 0;
+exports.store = {
+    _origin: 'https://api.emailjs.com',
+};

public/browser/cjs/utils/validateParams.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateParams = void 0;
+const validateParams = (publicKey, serviceID, templateID) => {
+    if (!publicKey) {
+        throw 'The public key is required. Visit https://dashboard.emailjs.com/admin/account';
+    }
+    if (!serviceID) {
+        throw 'The service ID is required. Visit https://dashboard.emailjs.com/admin';
+    }
+    if (!templateID) {
+        throw 'The template ID is required. Visit https://dashboard.emailjs.com/admin/templates';
+    }
+    return true;
+};
+exports.validateParams = validateParams;