diff --git a/__app/component/WhatsappShare/README.md b/__app/component/WhatsappShare/README.md
new file mode 100644
index 0000000..ee8a906
--- /dev/null
+++ b/__app/component/WhatsappShare/README.md
@@ -0,0 +1,43 @@
+## 1. Happy Flow
+#### a) Passing child
+
+
+
+
+## 2. Success: successCb callBack Fn along with success msg
+
+
+
+
+
+> [!Note]
+> **successCb** will get an object contains the property **msgType**, **msg**, **data**
+
+## 3. Failure: failureCb callBack Fn along with failure msg
+
+
+
+
+
+> [!Note]
+> **failureCb** will get an object contains the property **msgType**, **msg**
+
+> [!Important]
+Failure can happend due to multiple reasons, due to that reason **failureMsg** is an object having different kind of error property according to the error can occur in component
+
+## 4. Failure: Device don't support the feature and you want to hide the feauture from User
+
+
+
+
+
+> [!Note]
+> if **showForever** props value is false, feature will be hidden in case of unSupported by the device
+
+## 5. Combine with all props
+
+
+
+
+
+  
\ No newline at end of file
diff --git a/__app/component/WhatsappShare/WhatsappShare.js b/__app/component/WhatsappShare/WhatsappShare.js
new file mode 100644
index 0000000..b44feaf
--- /dev/null
+++ b/__app/component/WhatsappShare/WhatsappShare.js
@@ -0,0 +1,69 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { handleSuccess, handleError } from '../services/handlerService';
+import Wrapper from '../Wrapper/Wrapper';
+
+const failureMsgDefault = {
+  unSupported: 'WhatsappShare is not supporting in your device',
+  badRequest: 'msg is missing',
+  error: 'Unable to fetch details from WhatsappShare',
+};
+
+function WhatsappShare({
+  successCb,
+  failureCb,
+  successMsg,
+  failureMsg: failureMsgProps,
+  children,
+  mobile,
+  msg,
+}) {
+  const failureMsg = { ...failureMsgDefault, ...failureMsgProps };
+
+  const getWhatsappShare = () => {
+    if (mobile) {
+      window.location.href = `https://wa.me/${mobile}/?text=${msg}`;
+      handleSuccess({ msgType: 'SUCCESSFUL', msg: successMsg, successCb, data: msg });
+    } else if (msg) {
+      window.location.href = `https://wa.me/?text=${msg}`;
+      handleSuccess({ msgType: 'SUCCESSFUL', msg: successMsg, successCb, data: msg });
+    } else {
+      return handleError({ msgType: 'BAD_REQUEST', msg: failureMsg.badRequest, failureCb });
+    }
+
+    return true;
+  };
+
+  return (
+    <div>
+      {React.Children.map(children || 'Whatsapp Share', (child) => React.cloneElement(
+        typeof child === 'string' ? <span>{child}</span> : child,
+        {
+          onClick: getWhatsappShare,
+        },
+      ))}
+    </div>
+  );
+}
+
+WhatsappShare.isBrowserSupport = () => globalThis && true;
+
+WhatsappShare.propTypes = {
+  successCb: PropTypes.func,
+  failureCb: PropTypes.func,
+  successMsg: PropTypes.string,
+  failureMsg: PropTypes.object,
+  mobile: PropTypes.number,
+  msg: PropTypes.string,
+};
+
+WhatsappShare.defaultProps = {
+  successCb: () => {},
+  failureCb: () => {},
+  successMsg: 'WhatsappShare details fetch Successfully',
+  failureMsg: { ...failureMsgDefault },
+  mobile: '',
+  msg: '',
+};
+
+export default Wrapper(WhatsappShare);
diff --git a/__app/component/WhatsappShare/index.js b/__app/component/WhatsappShare/index.js
new file mode 100644
index 0000000..d0e29f0
--- /dev/null
+++ b/__app/component/WhatsappShare/index.js
@@ -0,0 +1,5 @@
+import WhatsappShare from './WhatsappShare';
+
+export { WhatsappShare };
+
+export default WhatsappShare;
diff --git a/package.json b/package.json
index 44e73ed..f94e3e8 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,7 @@
     "detectmylocation",
     "colorpicker",
     "wakelock",
-    "ABCKEFG"
+    "WhatsappShare"
   ],
   "config": {
     "commitizen": {
@@ -98,7 +98,8 @@
     "TextToSpeech/",
     "VoiceRecognition/",
     "Vibrate/",
-    "ColorPicker/"
+    "ColorPicker/",
+    "WhatsappShare/"
   ],
   "devDependencies": {
     "@babel/cli": "^7.23.9",