feat: add support for sharing via WhatsApp Messenger and WhatsApp Business
Some checks are pending
linter / quality (push) Waiting to run
tests / ci (8.3) (push) Waiting to run
tests / ci (8.4) (push) Waiting to run
tests / ci (8.5) (push) Waiting to run

This commit is contained in:
Yoga Pangestu 2026-07-16 22:39:39 +07:00
parent b3184de155
commit 76c24dc909

View File

@ -1,5 +1,5 @@
<script setup lang="ts">
import { Copy, MessageCircle, Share2 } from '@lucide/vue';
import { Briefcase, Copy, MessageCircle, Share2 } from '@lucide/vue';
import { computed, ref } from 'vue';
import { toast } from 'vue-sonner';
import { Button } from '@/components/ui/button';
@ -67,12 +67,26 @@ async function copyLink() {
}
}
function shareViaWhatsApp() {
const encodedText = encodeURIComponent(whatsappText.value);
const url = `https://wa.me/?text=${encodedText}`;
function openWALink(url: string) {
window.open(url, '_blank');
open.value = false;
}
function shareViaWhatsAppMessenger() {
const text = encodeURIComponent(whatsappText.value);
const webUrl = `https://wa.me/?text=${text}`;
const intentUrl = `intent://send?text=${text}#Intent;scheme=whatsapp;package=com.whatsapp;end`;
const url = /android/i.test(navigator.userAgent) ? intentUrl : webUrl;
openWALink(url);
}
function shareViaWhatsAppBusiness() {
const text = encodeURIComponent(whatsappText.value);
const webUrl = `https://wa.me/?text=${text}`;
const intentUrl = `intent://send?text=${text}#Intent;scheme=whatsapp;package=com.whatsapp.w4b;end`;
const url = /android/i.test(navigator.userAgent) ? intentUrl : webUrl;
openWALink(url);
}
</script>
<template>
@ -94,9 +108,13 @@ function shareViaWhatsApp() {
<Copy class="size-4" />
{{ copied ? 'Tersalin!' : 'Salin Link' }}
</Button>
<Button variant="ghost" size="sm" class="w-full justify-start gap-2" @click="shareViaWhatsApp">
<Button variant="ghost" size="sm" class="w-full justify-start gap-2" @click="shareViaWhatsAppMessenger">
<MessageCircle class="size-4" />
WhatsApp
WhatsApp Messenger
</Button>
<Button variant="ghost" size="sm" class="w-full justify-start gap-2" @click="shareViaWhatsAppBusiness">
<Briefcase class="size-4" />
WhatsApp Business
</Button>
</PopoverContent>
</Popover>