Unverified Commit ac2b0839 authored by Nev Angelova's avatar Nev Angelova Committed by GitHub
Browse files

[MM-22129] - Remove post link modal and copy permalink directly (#4930)

* [MM-22129] - Remove post link modal and copy permalink directly

* Remove redundant translations

* Change Permalink text

* Fix test
parent 32c15beb
......@@ -142,14 +142,6 @@ export function showChannelNameUpdateModal(channel) {
});
}
export function showGetPostLinkModal(post) {
AppDispatcher.handleViewAction({
type: ActionTypes.TOGGLE_GET_POST_LINK_MODAL,
value: true,
post,
});
}
export function showGetPublicLinkModal(fileId) {
AppDispatcher.handleViewAction({
type: ActionTypes.TOGGLE_GET_PUBLIC_LINK_MODAL,
......
......@@ -10,7 +10,7 @@ import AnnouncementBarController from 'components/announcement_bar';
import Pluggable from 'plugins/pluggable';
import SystemNotice from 'components/system_notice';
import EditPostModal from 'components/edit_post_modal';
import GetPostLinkModal from 'components/get_post_link_modal';
import GetPublicLinkModal from 'components/get_public_link_modal';
import LeavePrivateChannelModal from 'components/leave_private_channel_modal';
import ResetStatusModal from 'components/reset_status_modal';
......@@ -76,7 +76,6 @@ export default class ChannelController extends React.Component {
{!this.props.fetchingChannels && <Route component={CenterChannel}/>}
{this.props.fetchingChannels && <LoadingScreen/>}
<Pluggable pluggableName='Root'/>
<GetPostLinkModal/>
<GetPublicLinkModal/>
<ImportThemeModal/>
<EditPostModal/>
......
......@@ -75,7 +75,7 @@ exports[`components/dot_menu/DotMenu should match snapshot, canDelete 1`] = `
id="permalink_post_id_1"
onClick={[Function]}
show={true}
text="Permalink"
text="Copy Link"
/>
<MenuItemAction
onClick={[Function]}
......@@ -200,7 +200,7 @@ exports[`components/dot_menu/DotMenu should match snapshot, on Center 1`] = `
id="permalink_post_id_1"
onClick={[Function]}
show={true}
text="Permalink"
text="Copy Link"
/>
<MenuItemAction
onClick={[Function]}
......
......@@ -8,7 +8,6 @@ import {Tooltip} from 'react-bootstrap';
import Permissions from 'mattermost-redux/constants/permissions';
import {showGetPostLinkModal} from 'actions/global_actions.jsx';
import {Locations, ModalIdentifiers, Constants} from 'utils/constants';
import DeletePostModal from 'components/delete_post_modal';
import OverlayTrigger from 'components/overlay_trigger';
......@@ -42,6 +41,7 @@ export default class DotMenu extends React.PureComponent {
postEditTimeLimit: PropTypes.string.isRequired,
enableEmojiPicker: PropTypes.bool.isRequired,
channelIsArchived: PropTypes.bool.isRequired,
currentTeamUrl: PropTypes.string.isRequired,
/*
* Components for overriding provided by plugins
......@@ -162,9 +162,22 @@ export default class DotMenu extends React.PureComponent {
}
}
handlePermalinkMenuItemActivated = (e) => {
copyLink = (e) => {
e.preventDefault();
showGetPostLinkModal(this.props.post);
const postUrl = `${this.props.currentTeamUrl}/pl/${this.props.post.id}`;
const clipboard = navigator.clipboard;
if (clipboard) {
clipboard.writeText(postUrl);
} else {
const hiddenInput = document.createElement('textarea');
hiddenInput.value = postUrl;
document.body.appendChild(hiddenInput);
hiddenInput.focus();
hiddenInput.select();
document.execCommand('copy');
document.body.removeChild(hiddenInput);
}
}
handlePinMenuItemActivated = () => {
......@@ -337,8 +350,8 @@ export default class DotMenu extends React.PureComponent {
<Menu.ItemAction
id={`permalink_${this.props.post.id}`}
show={!isSystemMessage}
text={Utils.localizeMessage('post_info.permalink', 'Permalink')}
onClick={this.handlePermalinkMenuItemActivated}
text={Utils.localizeMessage('post_info.permalink', 'Copy Link')}
onClick={this.copyLink}
/>
<Menu.ItemAction
show={isMobile && !isSystemMessage && this.props.isFlagged}
......
......@@ -35,6 +35,7 @@ describe('components/dot_menu/DotMenu', () => {
enableEmojiPicker: true,
components: {},
channelIsArchived: false,
currentTeamUrl: '',
actions: {
flagPost: jest.fn(),
unflagPost: jest.fn(),
......
......@@ -30,6 +30,7 @@ describe('components/dot_menu/DotMenu returning empty ("")', () => {
enableEmojiPicker: true,
components: {},
channelIsArchived: false,
currentTeamUrl: '',
actions: {
flagPost: jest.fn(),
unflagPost: jest.fn(),
......
......@@ -30,6 +30,7 @@ describe('components/dot_menu/DotMenu on mobile view', () => {
enableEmojiPicker: true,
components: {},
channelIsArchived: false,
currentTeamUrl: '',
actions: {
flagPost: jest.fn(),
unflagPost: jest.fn(),
......
......@@ -6,7 +6,7 @@ import {bindActionCreators} from 'redux';
import {getChannel} from 'mattermost-redux/selectors/entities/channels';
import {getLicense, getConfig} from 'mattermost-redux/selectors/entities/general';
import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
import {getCurrentTeamId, getCurrentTeam} from 'mattermost-redux/selectors/entities/teams';
import {openModal} from 'actions/views/modals';
import {
......@@ -19,11 +19,14 @@ import {
} from 'actions/post_actions.jsx';
import {isArchivedChannel} from 'utils/channel_utils';
import {getSiteURL} from 'utils/url';
import DotMenu from './dot_menu.jsx';
function mapStateToProps(state, ownProps) {
const channel = getChannel(state, ownProps.post.channel_id);
const currentTeam = getCurrentTeam(state) || {};
const currentTeamUrl = `${getSiteURL()}/${currentTeam.name}`;
return {
channelIsArchived: isArchivedChannel(channel),
......@@ -32,6 +35,7 @@ function mapStateToProps(state, ownProps) {
isLicensed: getLicense(state).IsLicensed === 'true',
teamId: getCurrentTeamId(state),
pluginMenuItems: state.plugins.components.PostDropdownMenu,
currentTeamUrl,
};
}
......
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`components/GetPostLinkModal should match snapshot with currentTeamUrl and post's id present 1`] = `
<GetLinkModal
helpText="The link below allows authorized users to see your post."
link="http://localhost:8065/current-team/pl/sample_post_id"
onHide={[Function]}
show={false}
title="Copy Permalink"
/>
`;
exports[`components/GetPostLinkModal should not render any model when no post's id is present 1`] = `""`;
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import {shallow, ReactWrapper} from 'enzyme';
import {mountWithIntl} from 'tests/helpers/intl-test-helper';
import GetPostLinkModal from 'components/get_post_link_modal/get_post_link_modal';
import GetLinkModal from 'components/get_link_modal';
describe('components/GetPostLinkModal', () => {
const requiredProps = {
currentTeamUrl: 'http://localhost:8065/current-team',
};
test('should not render any model when no post\'s id is present', () => {
const wrapper = shallow(<GetPostLinkModal {...requiredProps}/>);
expect(wrapper).toEqual({});
expect(wrapper).toMatchSnapshot();
});
test('should not render any model when no post\'s id is invalid', () => {
const wrapper = shallow(<GetPostLinkModal {...requiredProps}/>);
// if post id is undefined
wrapper.setState({postId: undefined});
expect(wrapper).toEqual({});
// if post id is empty
wrapper.setState({postId: ''});
expect(wrapper).toEqual({});
// if post id is number
wrapper.setState({postId: 12345});
expect(wrapper).toEqual({});
});
test('should match snapshot with currentTeamUrl and post\'s id present', () => {
const wrapper = shallow(
<GetPostLinkModal {...requiredProps}/>
);
wrapper.setState({postId: 'sample_post_id'});
expect(wrapper.find(GetLinkModal).prop('link')).toEqual(requiredProps.currentTeamUrl + '/pl/sample_post_id');
const helpText = 'The link below allows authorized users to see your post.';
expect(wrapper.find(GetLinkModal).prop('helpText')).toEqual(helpText);
expect(wrapper.find(GetLinkModal).prop('show')).toEqual(false);
expect(wrapper.find(GetLinkModal).prop('title')).toEqual('Copy Permalink');
expect(wrapper).toMatchSnapshot();
});
test('should call hide on GetLinkModal\'s onHide', () => {
const wrapper = shallow(
<GetPostLinkModal {...requiredProps}/>
);
// Showing the modal initially to close it later onHide
wrapper.setState({postId: 'sample_post_id', show: true});
wrapper.find(GetLinkModal).first().props().onHide();
expect(wrapper.state('show')).toBe(false);
});
test('should pass handleToggle', () => {
const wrapper = mountWithIntl(<GetPostLinkModal {...requiredProps}/>) as unknown as ReactWrapper<{}, {}, GetPostLinkModal>;
const args = {post: {id: 'sample_post_id', message: 'some post message'}};
// Opening the model with handleToggle
wrapper.instance().handleToggle(true, args);
expect(wrapper.state('show')).toEqual(true);
expect(wrapper.state('postId')).toEqual(args.post.id);
// Closing the model with handleToggle
wrapper.instance().handleToggle(false, args);
expect(wrapper.state('show')).toEqual(false);
expect(wrapper.state('postId')).toEqual(args.post.id);
});
});
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import ModalStore from 'stores/modal_store.jsx';
import Constants from 'utils/constants';
import * as Utils from 'utils/utils.jsx';
import GetLinkModal from 'components/get_link_modal';
type Props = {
currentTeamUrl: string;
}
type State = {
show: boolean;
postId?: string;
}
type Post = {
id: string;
message?: string;
}
export default class GetPostLinkModal extends React.PureComponent<Props, State> {
public constructor(props: Props) {
super(props);
this.state = {
show: false,
};
}
public componentDidMount(): void {
ModalStore.addModalListener(Constants.ActionTypes.TOGGLE_GET_POST_LINK_MODAL, this.handleToggle);
}
public componentWillUnmount(): void {
ModalStore.removeModalListener(Constants.ActionTypes.TOGGLE_GET_POST_LINK_MODAL, this.handleToggle);
}
public handleToggle = (value: boolean, args: {post: Post}): void => {
const {post, post: {id}} = args;
const postId = post && id && typeof id === 'string' && id.length !== 0 ? id : '';
this.setState({
show: value,
postId,
});
}
private hide = (): void => {
this.setState({
show: false,
});
}
public render(): JSX.Element|null {
const {postId, show} = this.state;
const {currentTeamUrl} = this.props;
if (postId && typeof postId === 'string' && postId.length !== 0) {
const postUrl = `${currentTeamUrl}/pl/${postId}`;
return (
<GetLinkModal
show={show}
onHide={this.hide}
title={Utils.localizeMessage('get_post_link_modal.title', 'Copy Permalink')}
helpText={Utils.localizeMessage('get_post_link_modal.help', 'The link below allows authorized users to see your post.')}
link={postUrl}
/>
);
}
// Dont show model if ID of post doesnt exists
return null;
}
}
\ No newline at end of file
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import {connect} from 'react-redux';
import {getCurrentTeam} from 'mattermost-redux/selectors/entities/teams';
import {GlobalState} from 'mattermost-redux/types/store';
import {getSiteURL} from 'utils/url';
import GetPostLinkModal from './get_post_link_modal';
function mapStateToProps(state: GlobalState) {
const currentTeam = getCurrentTeam(state) || {};
const currentTeamUrl = `${getSiteURL()}/${currentTeam.name}`;
return {
currentTeamUrl,
};
}
export default connect(mapStateToProps)(GetPostLinkModal);
......@@ -2002,8 +2002,6 @@
"get_link.clipboard": " Link kopiert",
"get_link.close": "Schließen",
"get_link.copy": "Link kopieren",
"get_post_link_modal.help": "Der Link erlaubt berechtigten Benutzern diese Nachricht zu sehen.",
"get_post_link_modal.title": "Kopiere Permalink",
"get_public_link_modal.help": "Der unten stehende Link erlaubt jedem diese Datei zu sehen ohne auf diesem Server registriert zu sein.",
"get_public_link_modal.title": "Öffentlichen Link kopieren",
"get_team_invite_link_modal.help": "Senden Sie Teammitgliedern den unten stehenden Link, damit diese sich für dieses Team registrieren können. Der Team-Einladungslink kann mit mehreren Teammitgliedern geteilt werden, da er sich nicht ändert, sofern er nicht in den Teameinstellungen durch den Teamadmin geändert wird.",
......
......@@ -2391,8 +2391,6 @@
"get_link.clipboard": " Link copied",
"get_link.close": "Close",
"get_link.copy": "Copy Link",
"get_post_link_modal.help": "The link below allows authorized users to see your post.",
"get_post_link_modal.title": "Copy Permalink",
"get_public_link_modal.help": "The link below allows anyone to see this file without being registered on this server.",
"get_public_link_modal.title": "Copy Public Link",
"gif_picker.gfycat": "Search Gfycat",
......@@ -2959,7 +2957,7 @@
"post_info.message.show_more": "Show More",
"post_info.message.visible": "(Only visible to you)",
"post_info.message.visible.compact": " (Only visible to you)",
"post_info.permalink": "Permalink",
"post_info.permalink": "Copy Link",
"post_info.pin": "Pin to Channel",
"post_info.pinned": "Pinned",
"post_info.reply": "Reply",
......
......@@ -2005,8 +2005,6 @@
"get_link.clipboard": " Enlace copiado",
"get_link.close": "Cerrar",
"get_link.copy": "Copiar Enlace",
"get_post_link_modal.help": "En enlace de abajo permite a los usuarios autorizados a ver tu mensaje.",
"get_post_link_modal.title": "Copiar enlace Permanente",
"get_public_link_modal.help": "El siguiente enlace permite a cualquier persona visualizar este archivo sin necesidad de estar registrado en este servidor.",
"get_public_link_modal.title": "Copiar Enlace Público",
"get_team_invite_link_modal.help": "Envía el siguiente enlace a tus compañeros para que se registren a este equipo. El enlace de invitación al equipo puede ser compartido con multiples compañeros y el mismo no cambiará a menos que sea regenerado en la Configuración del Equipo por un Administrador del Equipo.",
......
......@@ -2002,8 +2002,6 @@
"get_link.clipboard": " Lien copié",
"get_link.close": "Fermer",
"get_link.copy": "Copier le lien",
"get_post_link_modal.help": "Le lien ci-dessous permet aux utilisateurs autorisés de voir votre message.",
"get_post_link_modal.title": "Copier le lien permanent",
"get_public_link_modal.help": "Le lien ci-dessous permet à quiconque de voir ce fichier, sans être inscrit sur ce serveur.",
"get_public_link_modal.title": "Obtenir le lien public",
"get_team_invite_link_modal.help": "Envoyez à vos collègues le lien ci-dessous pour leur permettre de s'inscrire à votre équipe. Le lien d'invitation peut être partagé par plusieurs personnes et ne change pas tant qu'il n'a pas été regénéré dans les paramètres de l'équipe par un responsable d'équipe.",
......
......@@ -2002,8 +2002,6 @@
"get_link.clipboard": " Collegamento copiato",
"get_link.close": "Chiudi",
"get_link.copy": "Copia collegamento",
"get_post_link_modal.help": "Il collegamento sottostante permette agli utenti autorizzati di vedere le tue pubblicazioni.",
"get_post_link_modal.title": "Copia permalink",
"get_public_link_modal.help": "Il collegamento sottostante permette a chiunque di vedere questo file senza essere registrato su questo server.",
"get_public_link_modal.title": "Copia collegamento pubblico",
"get_team_invite_link_modal.help": "Invia ai colleghi il collegamento sottostante per farli aggiungere a questo gruppo. Il collegamento di invito al gruppo può essere condiviso con più colleghi dal momento che non cambia se non viene rigenerato nelle Impostazioni del Gruppo da un Amministratore di Gruppo.",
......
......@@ -2002,8 +2002,6 @@
"get_link.clipboard": " リンクがコピーされました",
"get_link.close": "閉じる",
"get_link.copy": "リンクをコピーする",
"get_post_link_modal.help": "以下のリンクから、ログインしているユーザーは、あなたの投稿を確認できます。",
"get_post_link_modal.title": "パーマリンクをコピーする",
"get_public_link_modal.help": "以下のリンクにより、このサーバーにアカウントを登録することなく誰でもファイルを閲覧できるようになります。",
"get_public_link_modal.title": "公開リンクをコピーする",
"get_team_invite_link_modal.help": "チームメイトに以下のリンクを送ることで、このチームサイトへの利用登録をしてもらえます。チーム招待リンクは、チーム管理者が再生成しない限り、複数のチームメイトで共有して使うことができます。",
......
......@@ -2002,8 +2002,6 @@
"get_link.clipboard": " Link copied",
"get_link.close": "닫기",
"get_link.copy": "링크 복사",
"get_post_link_modal.help": "아래 링크를 통해 허용된 사용자가 내 글을 볼 수 있습니다.",
"get_post_link_modal.title": "바로가기 링크 복사",
"get_public_link_modal.help": "The link below allows anyone to see this file without being registered on this server.",
"get_public_link_modal.title": "공개 링크 복사",
"get_team_invite_link_modal.help": "아래 링크를 통해 팀에 가입할 수 있습니다. 가입 링크는 여러 사람들에게 공유될 수 있고, 팀 관리자에 의해 변경될 수 있습니다.",
......
......@@ -2002,8 +2002,6 @@
"get_link.clipboard": " Link copied",
"get_link.close": "Afsluiten",
"get_link.copy": "Kopieer link",
"get_post_link_modal.help": "De link hieronder staat geautoriseerde gebruikers toe om jouw bericht te bekijken.",
"get_post_link_modal.title": "Kopieer permanente link",
"get_public_link_modal.help": "The link below allows anyone to see this file without being registered on this server.",
"get_public_link_modal.title": "Openbare link ophalen",
"get_team_invite_link_modal.help": "Stuur teamleden de link hieronder om zichzelf in te schrijven bij dit team. De Team Uitnodigings Link kan worden gedeeld met zoveel teamleden als nodig is en zal niet veranderen tenzij het is hergenereerd in de Team Instellingen door een Team Admin. ",
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment