банан яблоко сожрал

officialdakari · Sep 16, 2024 · be23798 · be23798
1 parent d3f8b0b
commit be23798
Show file tree

Hide file tree

Showing 11 changed files with 259 additions and 225 deletions.
diff --git a/src/app/atoms/button/Button.jsx b/src/app/atoms/button/Button.jsx
@@ -10,6 +10,7 @@ import Icon from '@mdi/react';
 const Button = React.forwardRef(({
     id, className, variant, iconSrc,
     type, onClick, children, disabled,
+    onMouseDown
 }, ref) => {
     const iconClass = (iconSrc === null) ? '' : `btn-${variant}--icon`;
     return (
@@ -18,6 +19,7 @@ const Button = React.forwardRef(({
             id={id === '' ? undefined : id}
             className={`${className ? `${className} ` : ''}btn-${variant} ${iconClass} noselect`}
             onMouseUp={(e) => blurOnBubbling(e, `.btn-${variant}`)}
+            onMouseDown={onMouseDown}
             onClick={onClick}
             // eslint-disable-next-line react/button-has-type
             type={type}

diff --git a/src/app/atoms/context-menu/ContextMenu.jsx b/src/app/atoms/context-menu/ContextMenu.jsx
@@ -10,106 +10,107 @@ import Button from '../button/Button';
 import ScrollView from '../scroll/ScrollView';
 
 function ContextMenu({
-  content, placement, maxWidth, render, afterToggle,
+    content, placement, maxWidth, render, afterToggle,
 }) {
-  const [isVisible, setVisibility] = useState(false);
-  const showMenu = () => setVisibility(true);
-  const hideMenu = () => setVisibility(false);
+    const [isVisible, setVisibility] = useState(false);
+    const showMenu = () => setVisibility(true);
+    const hideMenu = () => setVisibility(false);
 
-  useEffect(() => {
-    if (afterToggle !== null) afterToggle(isVisible);
-  }, [isVisible]);
+    useEffect(() => {
+        if (afterToggle !== null) afterToggle(isVisible);
+    }, [isVisible]);
 
-  return (
-    <Tippy
-      animation="scale-extreme"
-      className="context-menu"
-      visible={isVisible}
-      onClickOutside={hideMenu}
-      content={<ScrollView invisible>{typeof content === 'function' ? content(hideMenu) : content}</ScrollView>}
-      placement={placement}
-      interactive
-      arrow={false}
-      maxWidth={maxWidth}
-      duration={200}
-    >
-      {render(isVisible ? hideMenu : showMenu)}
-    </Tippy>
-  );
+    return (
+        <Tippy
+            animation="scale-extreme"
+            className="context-menu"
+            visible={isVisible}
+            onClickOutside={hideMenu}
+            content={<ScrollView invisible>{typeof content === 'function' ? content(hideMenu) : content}</ScrollView>}
+            placement={placement}
+            interactive
+            arrow={false}
+            maxWidth={maxWidth}
+            duration={200}
+        >
+            {render(isVisible ? hideMenu : showMenu)}
+        </Tippy>
+    );
 }
 
 ContextMenu.defaultProps = {
-  maxWidth: 'unset',
-  placement: 'right',
-  afterToggle: null,
+    maxWidth: 'unset',
+    placement: 'right',
+    afterToggle: null,
 };
 
 ContextMenu.propTypes = {
-  content: PropTypes.oneOfType([
-    PropTypes.node,
-    PropTypes.func,
-  ]).isRequired,
-  placement: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
-  maxWidth: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.number,
-  ]),
-  render: PropTypes.func.isRequired,
-  afterToggle: PropTypes.func,
+    content: PropTypes.oneOfType([
+        PropTypes.node,
+        PropTypes.func,
+    ]).isRequired,
+    placement: PropTypes.oneOf(['top', 'right', 'bottom', 'left']),
+    maxWidth: PropTypes.oneOfType([
+        PropTypes.string,
+        PropTypes.number,
+    ]),
+    render: PropTypes.func.isRequired,
+    afterToggle: PropTypes.func,
 };
 
 function MenuHeader({ children }) {
-  return (
-    <div className="context-menu__header">
-      <Text variant="b3">{ children }</Text>
-    </div>
-  );
+    return (
+        <div className="context-menu__header">
+            <Text variant="b3">{children}</Text>
+        </div>
+    );
 }
 
 MenuHeader.propTypes = {
-  children: PropTypes.node.isRequired,
+    children: PropTypes.node.isRequired,
 };
 
 function MenuItem({
-  variant, iconSrc, type,
-  onClick, children, disabled,
+    variant, iconSrc, type,
+    onClick, children, disabled,
 }) {
-  return (
-    <div className="context-menu__item">
-      <Button
-        variant={variant}
-        iconSrc={iconSrc}
-        type={type}
-        onClick={onClick}
-        disabled={disabled}
-      >
-        { children }
-      </Button>
-    </div>
-  );
+    return (
+        <div className="context-menu__item">
+            <Button
+                variant={variant}
+                iconSrc={iconSrc}
+                type={type}
+                onClick={onClick}
+                disabled={disabled}
+                onMouseDown={(evt) => { evt.stopPropagation(); evt.preventDefault(); }}
+            >
+                {children}
+            </Button>
+        </div>
+    );
 }
 
 MenuItem.defaultProps = {
-  variant: 'surface',
-  iconSrc: null,
-  type: 'button',
-  disabled: false,
-  onClick: null,
+    variant: 'surface',
+    iconSrc: null,
+    type: 'button',
+    disabled: false,
+    onClick: null,
 };
 
 MenuItem.propTypes = {
-  variant: PropTypes.oneOf(['surface', 'positive', 'caution', 'danger']),
-  iconSrc: PropTypes.string,
-  type: PropTypes.oneOf(['button', 'submit']),
-  onClick: PropTypes.func,
-  children: PropTypes.node.isRequired,
-  disabled: PropTypes.bool,
+    variant: PropTypes.oneOf(['surface', 'positive', 'caution', 'danger']),
+    iconSrc: PropTypes.string,
+    type: PropTypes.oneOf(['button', 'submit']),
+    onClick: PropTypes.func,
+    children: PropTypes.node.isRequired,
+    disabled: PropTypes.bool,
 };
 
 function MenuBorder() {
-  return <div style={{ borderBottom: '1px solid var(--bg-surface-border)' }}> </div>;
+    return <div style={{ borderBottom: '1px solid var(--bg-surface-border)' }}> </div>;
 }
 
 export {
-  ContextMenu as default, MenuHeader, MenuItem, MenuBorder,
+    ContextMenu as default, MenuHeader, MenuItem, MenuBorder,
 };
diff --git a/src/app/features/room/RoomInput.tsx b/src/app/features/room/RoomInput.tsx
@@ -790,7 +790,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
                                                                 setEmojiBoardTab(showStickerButton ? EmojiBoardTab.Sticker : EmojiBoardTab.Emoji)
                                                             }
                                                         }}
-                                                        //onMouseDown={dontHideKeyboard}
+                                                        onMouseDown={dontHideKeyboard}
                                                         variant="SurfaceVariant"
                                                         size="300"
                                                         radii="300"

diff --git a/src/app/pages/client/ClientNonUIFeatures.tsx b/src/app/pages/client/ClientNonUIFeatures.tsx
@@ -37,6 +37,8 @@ import { Permissions } from '../../state/widgetPermissions';
 import { randomNumberBetween } from '../../utils/common';
 import { removeNotifications, roomIdToHash } from '../../utils/notifications';
 import { markAsRead } from '../../../client/action/notifications';
+import cons from '../../../client/state/cons';
+import { getText } from '../../../lang';
 
 function FaviconUpdater() {
     const roomToUnread = useAtomValue(roomToUnreadAtom);
@@ -301,10 +303,10 @@ export function ClientNonUIFeatures({ children }: ClientNonUIFeaturesProps) {
 
     useEffect(() => {
         const clickHandler = async (ev: any) => {
+            const href = ev.target.getAttribute('data-mention-href') ?? ev.target.getAttribute('href');
+            if (typeof href !== 'string') return;
+            const url = parse(href as string);
             if (ev.target.tagName?.toLowerCase() === 'a' || ev.target.tagName?.toLowerCase() === 'span') {
-                const href = ev.target.getAttribute('data-mention-href') ?? ev.target.getAttribute('href');
-                if (!href) return;
-                const url = parse(href as string);
                 console.log(url);
                 if (url.hostname === 'matrix.to' && typeof url.hash === 'string' && url.hash.length > 3) {
                     ev.preventDefault();
@@ -329,14 +331,23 @@ export function ClientNonUIFeatures({ children }: ClientNonUIFeaturesProps) {
                     } else if (type == '#') {
                         openJoinAlias(id);
                     }
+                    return;
+                }
+            }
+            if (ev.target.tagName?.toLowerCase() === 'a') {
+                if (!cons.trustedDomains.includes(url.host!) && !cons.trustedDomains.includes(url.hostname!)) {
+                    ev.preventDefault();
+                    if (await confirmDialog(getText('go_link.title'), `${getText('go_link.desc')}\n\n${href}`, getText('go_link.yes'), 'danger')) {
+                        window.open(href, '_blank');
+                    }
                 }
             }
         };
         addEventListener('click', clickHandler);
         return () => {
             removeEventListener('click', clickHandler);
         };
-    }, []);
+    }, [roomId]);
 
     // todo refactor that shit
     // TODO means I will never do that
@@ -437,6 +448,7 @@ export function ClientNonUIFeatures({ children }: ClientNonUIFeaturesProps) {
                     if (!event) return respond({ error: { message: 'No state event' } });
                     respond(event.getContent());
                 } else if (data.action === 'set_bot_options') {
+                    //@ts-ignore
                     mx?.sendStateEvent(data.room_id, 'm.room.bot.options', data.content)
                         .then(() => {
                             respond({ success: true });
@@ -469,6 +481,7 @@ export function ClientNonUIFeatures({ children }: ClientNonUIFeaturesProps) {
                         join_rule: room.getJoinRule()
                     });
                 } else if (data.action === 'set_plumbing_state') {
+                    //@ts-ignore
                     mx?.sendStateEvent(data.room_id, 'm.room.plumbing', { status: data.status })
                         .then(() => {
                             respond({ success: true });
@@ -511,6 +524,7 @@ export function ClientNonUIFeatures({ children }: ClientNonUIFeaturesProps) {
                     respond(widgetsEvents.map(s => s.getEffectiveEvent()));
                 } else if (data.action === 'set_widget') {
                     if (data.url) {
+                        //@ts-ignore
                         mx?.sendStateEvent(data.room_id, 'im.vector.modular.widgets', {
                             widget_id: data.widget_id,
                             type: data.type,

diff --git a/src/app/plugins/markdown.ts b/src/app/plugins/markdown.ts
@@ -155,7 +155,7 @@ const LinkRule: InlineMDRule = {
     },
 };
 
-const ESCAPE_REG_1 = /\\(\*|`|_)/;
+const ESCAPE_REG_1 = /\\(\*|`|_|>|&gt;)/;
 const EscapeRule: InlineMDRule = {
     match: (text) => text.match(ESCAPE_REG_1),
     html: (parse, match) => {
@@ -283,15 +283,15 @@ const CodeBlockRule: BlockMDRule = {
 };
 
 const BLOCKQUOTE_MD_1 = '>';
-const QUOTE_LINE_PREFIX = /^> */;
+const QUOTE_LINE_PREFIX = /^(&gt;|>)((&amp;|&)(#[a-f0-9]{6}))? */;
+const COLOR_PREFIX = /^(&gt;|>)(&amp;|&)(#[a-f0-9]{6})/;
 const BLOCKQUOTE_TRAILING_NEWLINE = /\n$/;
-const BLOCKQUOTE_REG_1 = /(^>.*\n?)+/m;
+const BLOCKQUOTE_REG_1 = /((^&gt;|^>)((&amp;|&)(#[a-f0-9]+))?.*\n?)+/m;
 const BlockQuoteRule: BlockMDRule = {
     match: (text) => text.match(BLOCKQUOTE_REG_1),
     html: (match, parseInline) => {
         const [blockquoteText] = match;
-        console.log(`blockquote`, match);
-
+        console.log(`!!! blockquote`, match);
         const lines = blockquoteText
             .replace(BLOCKQUOTE_TRAILING_NEWLINE, '')
             .split('\n')
@@ -301,7 +301,12 @@ const BlockQuoteRule: BlockMDRule = {
                 return `${line}<br/>`;
             })
             .join('');
-        return `<blockquote data-md="${BLOCKQUOTE_MD_1}">${lines}</blockquote>`;
+        const arr = blockquoteText.match(COLOR_PREFIX);
+        var color;
+        if (arr) {
+            if (typeof arr[3] === 'string') color = arr[3];
+        }
+        return `<blockquote data-md="${BLOCKQUOTE_MD_1}" ${color ? `data-blockquote-color="${color}"` : ''}>${lines}</blockquote>`;
     },
 };
 

diff --git a/src/app/plugins/react-custom-html-parser.tsx b/src/app/plugins/react-custom-html-parser.tsx
@@ -87,6 +87,7 @@ export const getReactCustomHtmlParser = (
         replace: (domNode) => {
             if (domNode instanceof Element && 'name' in domNode) {
                 const { name, attribs, children, parent } = domNode;
+                if (name === 'blockquote') console.debug(`!!! ${name}`, domNode);
                 const props = attributesToProps(attribs);
 
                 if (name === 'h1') {
@@ -163,7 +164,7 @@ export const getReactCustomHtmlParser = (
 
                 if (name === 'blockquote') {
                     return (
-                        <Text {...props} size="Inherit" as="blockquote" className={css.BlockQuote} style={props['data-mx-color'] ? { borderColor: props['data-mx-color'] } : undefined}>
+                        <Text {...props} size="Inherit" as="blockquote" className={css.BlockQuote} style={props['data-blockquote-color'] ? { borderColor: props['data-blockquote-color'] } : undefined}>
                             {domToReact(children, opts)}
                         </Text>
                     );

diff --git a/src/app/styles/CustomHtml.css.ts b/src/app/styles/CustomHtml.css.ts
@@ -66,7 +66,7 @@ export const Spoiler = recipe({
         DefaultReset,
         {
             padding: `0 ${config.space.S100}`,
-            backgroundColor: color.SurfaceVariant.ContainerActive,
+            backgroundColor: color.SurfaceVariant.ContainerLine,
             borderRadius: config.radii.R300,
             selectors: {
                 '&[aria-pressed=true]': {