feat: implement dedicated share model component for sharing links 🚀🔥

[0xabdulkhalid]

Related Issue

Closes #1558

Description

• Enhanced the user experience by adding a new feature that enables users to copy shareable links for products in both the GridView and ListView components.
• Implemented a share button behavior that copies the link to the clipboard when clicked.
• Introduced user feedback for successful link copying by displaying a "Copied" tooltip on the Share Model component after clicking the copy icon.
• Integrated an accessible and adaptable Share Model component for presenting the copied link in a visually appealing manner.
• The Share Model component now seamlessly adapts to the dark and light modes of the website, ensuring optimal visibility and experience for users.
• This change significantly improves the user experience by streamlining link sharing and providing a user-friendly interface for link presentation.

Demonstrating Video

Capture_2023-08-09-22-02-13.mp4

Checklist

• My code adheres to the established style guidelines of the project.
• I have included comments in areas that may be difficult to understand.
• My changes have not introduced any new warnings.
• I have conducted a self-review of my code.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
free-hit	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 9, 2023 4:46pm

[github-actions]

Great job, @0xabdulkhalid! 🎉 Thank you for submitting your first pull request. Your contribution is valuable and we appreciate your efforts to improve our project.

We will promptly review your changes and offer feedback. Keep up the excellent work! Kindly remember to check our contributing guidelines

[0xabdulkhalid]

Exciting update @JasonDsouza212, @VenomFate-619!!

Implemented a seamless Share Model component enabling users to swiftly copy links, Dark/light mode adaptation included.

Please make sure to review this PR ⭐

[JasonDsouza212]

@0xabdulkhalid can you also add the video of it in mobile view

[0xabdulkhalid]

@JasonDsouza212 👋🏻

$\textcolor{yellow}{\textsf{For mobile, the sharing component will use }}$

$\textcolor{yellow}{\textsf{native Web Share API. If there's no API Support}}$

$\textcolor{yellow}{\textsf{and if it fails then only it will fallback}}$

$\textcolor{yellow}{\textsf{to use the dedicated share model component.}}$

$\textcolor{yellow}{\textsf{Let me know if any other doubts you may have!}}$

[0xabdulkhalid]

$\textcolor{yellow}{\textsf{If the Mobile device didn't have support for}}$

$\textcolor{yellow}{\textsf{Web Share API then it will look like this}}$

$\textcolor{yellow}{\textsf{for those devices.}}$