oxen-io/session-desktop
1
0
Fork 0
mirror of https://github.com/oxen-io/session-desktop.git synced 2023-12-14 02:12:57 +01:00
Code Issues Projects Releases Wiki Activity

WIP. Adding confirmation to show link preview on pasting into composition box.

Browse source
This commit is contained in:
Warrick Corfe-Tan 2021-06-18 15:02:55 +10:00
parent eb2e60b2eb
commit 4f8e455b38
2 changed files with 45 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
ts/components/session/SessionToggle.tsx
View file

@ -5,15 +5,6 @@ import { updateConfirmModal } from '../../state/ducks/modalDialog';
interface Props {
active: boolean;
onClick: any;
// If you require the toggle to be confirmed, use
// a confirmation dialog. The parameters needed in the
// setting item in SessionSettings.tsx are like such:
// confirmationDialogParams: {
// shouldShowConfirm: false,
// title: window.i18n('linkPreviewsTitle'),
// message: window.i18n('linkPreviewsConfirmMessage'),
// okTheme: 'danger',
// }
confirmationDialogParams?: any | undefined;
updateConfirmModal?: any;

55
ts/components/session/conversation/SessionCompositionBox.tsx
View file

@ -1,5 +1,5 @@
import React from 'react';
import _, { debounce } from 'lodash';
import _, { debounce, update } from 'lodash';
import { Attachment, AttachmentType } from '../../../types/Attachment';
import * as MIME from '../../../types/MIME';
@ -38,6 +38,9 @@ import {
updateMentionsMembers,
} from '../../../state/ducks/mentionsInput';
import { getMentionsInput } from '../../../state/selectors/mentionsInput';
import { useDispatch } from 'react-redux';
import { updateConfirmModal } from '../../../state/ducks/modalDialog';
import { SessionButtonColor } from '../SessionButton';
export interface ReplyingToMessageProps {
convoId: string;
@ -209,9 +212,32 @@ export class SessionCompositionBox extends React.Component<Props, State> {
const { items } = e.clipboardData;
let imgBlob = null;
for (const item of items) {
if (item.type.split('/')[0] === 'image') {
const pasteType = item.type.split('/')[0]
if (pasteType === 'image') {
imgBlob = item.getAsFile();
}
switch (pasteType) {
case ('image'):
imgBlob = item.getAsFile();
break;
case ('text'):
// check for links
console.log('is a text');
let x = e.clipboardData.getData('text');
console.log({ x });
if (this.isURL(x)) {
console.log('IS A URL!');
// const dispatch = useDispatch();
// dispatch(updateConfirmModal({
// shouldShowConfirm: () => !window.getSettingValue('link-preview-setting'),
// title: window.i18n('linkPreviewsTitle'),
// message: window.i18n('linkPreviewsConfirmMessage'),
// okTheme: SessionButtonColor.Danger,
// }))
}
}
}
if (imgBlob !== null) {
const file = imgBlob;
@ -223,6 +249,17 @@ export class SessionCompositionBox extends React.Component<Props, State> {
}
}
/**
*
* @param str String to evaluate
* @returns boolean if the string is true or false
*/
private isURL(str: string) {
var urlRegex = '^(?!mailto:)(?:(?:http|https|ftp)://)(?:\\S+(?::\\S*)?@)?(?:(?:(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}(?:\\.(?:[0-9]\\d?|1\\d\\d|2[0-4]\\d|25[0-4]))|(?:(?:[a-z\\u00a1-\\uffff0-9]+-?)*[a-z\\u00a1-\\uffff0-9]+)(?:\\.(?:[a-z\\u00a1-\\uffff0-9]+-?)*[a-z\\u00a1-\\uffff0-9]+)*(?:\\.(?:[a-z\\u00a1-\\uffff]{2,})))|localhost)(?::\\d{2,5})?(?:(/|\\?|#)[^\\s]*)?$';
var url = new RegExp(urlRegex, 'i');
return str.length < 2083 && url.test(str);
}
private showEmojiPanel() {
document.addEventListener('mousedown', this.handleClick, false);
@ -344,12 +381,12 @@ export class SessionCompositionBox extends React.Component<Props, State> {
const messagePlaceHolder = isKickedFromGroup
? i18n('youGotKickedFromGroup')
: left
? i18n('youLeftTheGroup')
: isBlocked && isPrivate
? i18n('unblockToSend')
: isBlocked && !isPrivate
? i18n('unblockGroupToSend')
: i18n('sendMessage');
? i18n('youLeftTheGroup')
: isBlocked && isPrivate
? i18n('unblockToSend')
: isBlocked && !isPrivate
? i18n('unblockGroupToSend')
: i18n('sendMessage');
const typingEnabled = this.isTypingEnabled();
let index = 0;
@ -516,8 +553,6 @@ export class SessionCompositionBox extends React.Component<Props, State> {
}}
/>
);
return <></>;
}
private fetchLinkPreview(firstLink: string) {