apps/BareRTC
1
0
Fork 0
Code Issues 14 Pull Requests Packages Projects Releases Wiki Activity

Google Translate Links + Scam Warnings on Messages

Browse Source
This commit is contained in:
Noah 2024-12-30 12:44:21 -08:00
parent 7a25ee3091
commit 81a3567c6c
2 changed files with 102 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/components/MessageBox.vue
View File

@ -1,6 +1,7 @@
<script>
import EmojiPicker from 'vue3-emoji-picker';
import LocalStorage from '../lib/LocalStorage';
import ScamDetection from './ScamDetection.vue';
import 'vue3-emoji-picker/css';
export default {
@ -23,6 +24,7 @@ export default {
},
components: {
EmojiPicker,
ScamDetection,
},
data() {
return {
@ -163,6 +165,13 @@ export default {
return false;
},
// Google Translate link.
translate() {
let message = this.message?.message.replace(/<(.|\n)+?>/g, "");
let url = `https://translate.google.com/?sl=auto&tl=en&text=${encodeURIComponent(message)}&op=translate`;
window.open(url);
},
// TODO: DRY
prettyDate(date) {
if (date == undefined) return '';
@ -317,12 +326,21 @@ export default {
<!-- Report & Emoji buttons -->
<div v-if="message.msgID && !noButtons" class="emoji-button columns is-mobile is-gapless mb-0">
<!-- Translate message button -->
<div class="column">
<button class="button is-small mr-1 py-2 has-text-success"
title="Translate this message using Google Translate"
@click.prevent="translate()">
<i class="fab fa-google"></i>
</button>
</div>
<!-- Report message button -->
<div class="column" v-if="reportEnabled && message.username !== username">
<button class="button is-small is-outlined mr-1 py-2" :class="{
'is-danger': !message.reported,
'has-text-grey': message.reported
}" title="Report this message" @click="reportMessage()">
}" title="Report this message" @click.prevent="reportMessage()">
<i class="fa fa-flag"></i>
<i class="fa fa-check ml-1" v-if="message.reported"></i>
</button>
@ -333,7 +351,7 @@ export default {
@click="showEmojiPicker = true">
<div class="dropdown-trigger">
<button type="button" class="button is-small px-2" aria-haspopup="true"
:aria-controls="`react-menu-${message.msgID}`" @click="hideEmojiPicker()">
:aria-controls="`react-menu-${message.msgID}`" @click.prevent="hideEmojiPicker()">
<span>
<i class="fa fa-heart has-text-grey"></i>
<i class="fa fa-plus has-text-grey pl-1"></i>
@ -356,6 +374,12 @@ export default {
<em v-if="message.action === 'presence'">{{ message.message }}</em>
<div v-else v-html="message.message"></div>
<!-- Possible scam message disclaimer -->
<ScamDetection v-if="message.username !== username"
:username="message.username"
:message="message.message">
</ScamDetection>
<!-- Reactions so far? -->
<div v-if="hasReactions" class="mt-1">
<span v-for="(users, emoji) in reactions" v-bind:key="emoji" class="tag mr-1 cursor-pointer"
@ -424,6 +448,12 @@ export default {
</strong>
<span v-html="compactMessage"></span>
<!-- Possible scam message disclaimer -->
<ScamDetection v-if="message.username !== username"
:username="message.username"
:message="message.message">
</ScamDetection>
</div>
<!-- Reactions so far? -->
@ -495,6 +525,13 @@ export default {
Hide message
</a>
<!-- Google Translate -->
<a href="#" class="dropdown-item"
@click.prevent="translate()">
<i class="fab fa-google mr-1"></i>
Google Translate <i class="fa fa-external-link ml-1"></i>
</a>
<!-- Report button -->
<a href="#" class="dropdown-item" v-if="reportEnabled && message.username !== username"
@click.prevent="reportMessage()">

63
src/components/ScamDetection.vue Normal file
View File

@ -0,0 +1,63 @@
<script>
export default {
props: {
username: String,
message: String,
},
data() {
return {
};
},
computed: {
// Scam/spam detection and warning.
maybeWhatsAppScam() {
return this.message.match(/whats\s*app/i);
},
maybePhoneNumberScam() {
return this.message.match(/\b(phone number|phone|digits|cell number|your number|ur number|text me)\b/i);
},
maybeOffPlatformScam() {
return this.message.match(/\b(telegram|signal|kik|session)\b/i);
},
},
methods: {
}
}
</script>
<template>
<div v-if="maybeWhatsAppScam" class="notification is-danger is-light px-3 py-2 my-2">
<strong class="has-text-danger">
<i class="fa fa-exclamation-triangle mr-1"></i>
Be careful about possible scams!
</strong>
It sounds like @{{ username }} is talking about moving this conversation to <i class="fab fa-whatsapp"></i> WhatsApp.
If this happened within the first couple of messages, be wary! It is a well-known tactic for con artists to move your
conversation away to another platform as soon as possible, in order to evade detection from the website.
<br><br>
<strong>Be especially skeptical of <i class="fab fa-whatsapp"></i> WhatsApp</strong> or trading phone numbers. Scammers
can do <strong>a lot</strong> of harm with just your phone number, e.g. by plugging it into a people search website
and bringing up lots of personal information about you.
</div>
<div v-else-if="maybeOffPlatformScam" class="notification is-danger is-light px-3 py-2 my-2">
<strong class="has-text-danger">
<i class="fa fa-exclamation-triangle mr-1"></i>
Be careful about possible scams!
</strong>
It sounds like @{{ username }} is talking about moving this conversation to another messenger platform.
If this happened within the first couple of messages, be wary! It is a well-known tactic for con artists to move your
conversation away to another platform as soon as possible, in order to evade detection from the website.
</div>
<div v-else-if="maybePhoneNumberScam" class="notification is-danger is-light px-3 py-2 my-2">
<strong class="has-text-danger">
<i class="fa fa-exclamation-triangle mr-1"></i>
Be careful about possible scams!
</strong>
It sounds like @{{ username }} may want to get your phone number. If this happened within the first couple of messages,
be wary! Scammers can do <strong>a lot</strong> of harm with just your phone number, e.g. by plugging it into a people
search website and bringing up lots of personal information about you.
</div>
</template>
<style scoped>
</style>