Add previewMode
This commit is contained in:
parent
e0688afdfc
commit
bc4dfaf62f
3 changed files with 24 additions and 19 deletions
|
@ -633,7 +633,7 @@ function Compose({
|
||||||
</div>
|
</div>
|
||||||
{!!replyToStatus && (
|
{!!replyToStatus && (
|
||||||
<div class="status-preview">
|
<div class="status-preview">
|
||||||
<Status status={replyToStatus} size="s" />
|
<Status status={replyToStatus} size="s" previewMode />
|
||||||
<div class="status-preview-legend reply-to">
|
<div class="status-preview-legend reply-to">
|
||||||
Replying to @
|
Replying to @
|
||||||
{replyToStatus.account.acct || replyToStatus.account.username}
|
{replyToStatus.account.acct || replyToStatus.account.username}
|
||||||
|
@ -643,7 +643,7 @@ function Compose({
|
||||||
)}
|
)}
|
||||||
{!!editStatus && (
|
{!!editStatus && (
|
||||||
<div class="status-preview">
|
<div class="status-preview">
|
||||||
<Status status={editStatus} size="s" />
|
<Status status={editStatus} size="s" previewMode />
|
||||||
<div class="status-preview-legend">Editing source status</div>
|
<div class="status-preview-legend">Editing source status</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
|
@ -70,6 +70,7 @@ function Status({
|
||||||
readOnly,
|
readOnly,
|
||||||
contentTextWeight,
|
contentTextWeight,
|
||||||
enableTranslate,
|
enableTranslate,
|
||||||
|
previewMode,
|
||||||
}) {
|
}) {
|
||||||
if (skeleton) {
|
if (skeleton) {
|
||||||
return (
|
return (
|
||||||
|
@ -578,6 +579,7 @@ function Status({
|
||||||
onContextMenu={(e) => {
|
onContextMenu={(e) => {
|
||||||
if (size === 'l') return;
|
if (size === 'l') return;
|
||||||
if (e.metaKey) return;
|
if (e.metaKey) return;
|
||||||
|
if (previewMode) return;
|
||||||
// console.log('context menu', e);
|
// console.log('context menu', e);
|
||||||
const link = e.target.closest('a');
|
const link = e.target.closest('a');
|
||||||
if (link && /^https?:\/\//.test(link.getAttribute('href'))) return;
|
if (link && /^https?:\/\//.test(link.getAttribute('href'))) return;
|
||||||
|
@ -662,7 +664,7 @@ function Status({
|
||||||
)} */}
|
)} */}
|
||||||
{/* </span> */}{' '}
|
{/* </span> */}{' '}
|
||||||
{size !== 'l' &&
|
{size !== 'l' &&
|
||||||
(url ? (
|
(url && !previewMode ? (
|
||||||
<Menu
|
<Menu
|
||||||
instanceRef={menuInstanceRef}
|
instanceRef={menuInstanceRef}
|
||||||
portal={{
|
portal={{
|
||||||
|
@ -788,7 +790,7 @@ function Status({
|
||||||
lang={language}
|
lang={language}
|
||||||
ref={contentRef}
|
ref={contentRef}
|
||||||
data-read-more={readMoreText}
|
data-read-more={readMoreText}
|
||||||
onClick={handleContentLinks({ mentions, instance })}
|
onClick={handleContentLinks({ mentions, instance, previewMode })}
|
||||||
dangerouslySetInnerHTML={{
|
dangerouslySetInnerHTML={{
|
||||||
__html: enhanceContent(content, {
|
__html: enhanceContent(content, {
|
||||||
emojis,
|
emojis,
|
||||||
|
@ -801,6 +803,7 @@ function Status({
|
||||||
a.removeAttribute('target');
|
a.removeAttribute('target');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
if (previewMode) return;
|
||||||
// Unfurl Mastodon links
|
// Unfurl Mastodon links
|
||||||
dom
|
dom
|
||||||
.querySelectorAll(
|
.querySelectorAll(
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import states from './states';
|
import states from './states';
|
||||||
|
|
||||||
function handleContentLinks(opts) {
|
function handleContentLinks(opts) {
|
||||||
const { mentions = [], instance } = opts || {};
|
const { mentions = [], instance, previewMode } = opts || {};
|
||||||
return (e) => {
|
return (e) => {
|
||||||
let { target } = e;
|
let { target } = e;
|
||||||
target = target.closest('a');
|
target = target.closest('a');
|
||||||
|
@ -35,20 +35,22 @@ function handleContentLinks(opts) {
|
||||||
instance,
|
instance,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
} else if (target.classList.contains('hashtag')) {
|
} else if (!previewMode) {
|
||||||
e.preventDefault();
|
if (target.classList.contains('hashtag')) {
|
||||||
e.stopPropagation();
|
e.preventDefault();
|
||||||
const tag = target.innerText.replace(/^#/, '').trim();
|
e.stopPropagation();
|
||||||
const hashURL = instance ? `#/${instance}/t/${tag}` : `#/t/${tag}`;
|
const tag = target.innerText.replace(/^#/, '').trim();
|
||||||
console.log({ hashURL });
|
const hashURL = instance ? `#/${instance}/t/${tag}` : `#/t/${tag}`;
|
||||||
location.hash = hashURL;
|
console.log({ hashURL });
|
||||||
} else if (states.unfurledLinks[target.href]?.url) {
|
location.hash = hashURL;
|
||||||
e.preventDefault();
|
} else if (states.unfurledLinks[target.href]?.url) {
|
||||||
e.stopPropagation();
|
e.preventDefault();
|
||||||
states.prevLocation = {
|
e.stopPropagation();
|
||||||
pathname: location.hash.replace(/^#/, ''),
|
states.prevLocation = {
|
||||||
};
|
pathname: location.hash.replace(/^#/, ''),
|
||||||
location.hash = `#${states.unfurledLinks[target.href].url}`;
|
};
|
||||||
|
location.hash = `#${states.unfurledLinks[target.href].url}`;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue