From f4190ccae206e68c3e4cbd4c4611e101e94182e3 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sun, 27 Dec 2020 21:01:51 +0000 Subject: [PATCH 1/4] Fix mini avatar uploader "working" even without permissions --- src/components/views/elements/MiniAvatarUploader.tsx | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/components/views/elements/MiniAvatarUploader.tsx b/src/components/views/elements/MiniAvatarUploader.tsx index 8517da6dfb9..51b55601f72 100644 --- a/src/components/views/elements/MiniAvatarUploader.tsx +++ b/src/components/views/elements/MiniAvatarUploader.tsx @@ -15,6 +15,7 @@ limitations under the License. */ import React, {useContext, useRef, useState} from 'react'; +import {EventType} from 'matrix-js-sdk/src/@types/event'; import classNames from 'classnames'; import AccessibleButton from "./AccessibleButton"; @@ -23,6 +24,7 @@ import MatrixClientContext from "../../../contexts/MatrixClientContext"; import {useTimeout} from "../../../hooks/useTimeout"; import Analytics from "../../../Analytics"; import CountlyAnalytics from '../../../CountlyAnalytics'; +import RoomContext from "../../../contexts/RoomContext"; export const AVATAR_SIZE = 52; @@ -50,6 +52,10 @@ const MiniAvatarUploader: React.FC = ({ hasAvatar, hasAvatarLabel, noAva const label = (hasAvatar || busy) ? hasAvatarLabel : noAvatarLabel; + const {room} = useContext(RoomContext); + const canSetAvatar = room?.currentState.maySendStateEvent(EventType.RoomAvatar, cli.getUserId()); + if (!canSetAvatar) return children; + return Date: Sun, 27 Dec 2020 21:13:01 +0000 Subject: [PATCH 2/4] Unfloat the MiniAvatarUploader "tooltip" --- res/css/views/elements/_MiniAvatarUploader.scss | 10 ++++++++++ .../views/elements/MiniAvatarUploader.tsx | 14 ++++++++------ 2 files changed, 18 insertions(+), 6 deletions(-) diff --git a/res/css/views/elements/_MiniAvatarUploader.scss b/res/css/views/elements/_MiniAvatarUploader.scss index 25029773312..698184a0950 100644 --- a/res/css/views/elements/_MiniAvatarUploader.scss +++ b/res/css/views/elements/_MiniAvatarUploader.scss @@ -18,6 +18,16 @@ limitations under the License. position: relative; width: min-content; + // this isn't a floating tooltip so override some things to not need to bother with z-index and floating + .mx_Tooltip { + display: inline-block; + position: absolute; + z-index: unset; + width: max-content; + left: 72px; + top: 0; + } + &::before, &::after { content: ''; position: absolute; diff --git a/src/components/views/elements/MiniAvatarUploader.tsx b/src/components/views/elements/MiniAvatarUploader.tsx index 51b55601f72..1802bcd3dd9 100644 --- a/src/components/views/elements/MiniAvatarUploader.tsx +++ b/src/components/views/elements/MiniAvatarUploader.tsx @@ -19,7 +19,6 @@ import {EventType} from 'matrix-js-sdk/src/@types/event'; import classNames from 'classnames'; import AccessibleButton from "./AccessibleButton"; -import Tooltip from './Tooltip'; import MatrixClientContext from "../../../contexts/MatrixClientContext"; import {useTimeout} from "../../../hooks/useTimeout"; import Analytics from "../../../Analytics"; @@ -56,6 +55,7 @@ const MiniAvatarUploader: React.FC = ({ hasAvatar, hasAvatarLabel, noAva const canSetAvatar = room?.currentState.maySendStateEvent(EventType.RoomAvatar, cli.getUserId()); if (!canSetAvatar) return children; + const visible = !!label && (hover || show); return = ({ hasAvatar, hasAvatarLabel, noAva > { children } - +
+
+ { label } +
; }; From ce5b244a246e16725009d9f9f5938de517e23958 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sun, 27 Dec 2020 21:25:48 +0000 Subject: [PATCH 3/4] delint --- src/components/views/elements/MiniAvatarUploader.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/views/elements/MiniAvatarUploader.tsx b/src/components/views/elements/MiniAvatarUploader.tsx index 1802bcd3dd9..77c4e402ebc 100644 --- a/src/components/views/elements/MiniAvatarUploader.tsx +++ b/src/components/views/elements/MiniAvatarUploader.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React, {useContext, useRef, useState} from 'react'; +import React, {ReactChildren, ReactNode, useContext, useRef, useState} from 'react'; import {EventType} from 'matrix-js-sdk/src/@types/event'; import classNames from 'classnames'; @@ -53,7 +53,7 @@ const MiniAvatarUploader: React.FC = ({ hasAvatar, hasAvatarLabel, noAva const {room} = useContext(RoomContext); const canSetAvatar = room?.currentState.maySendStateEvent(EventType.RoomAvatar, cli.getUserId()); - if (!canSetAvatar) return children; + if (!canSetAvatar) return { children }; const visible = !!label && (hover || show); return From 7af147105266ce559e840178a70d01ce2318c4a6 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Sun, 27 Dec 2020 21:46:56 +0000 Subject: [PATCH 4/4] delint2 --- src/components/views/elements/MiniAvatarUploader.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/elements/MiniAvatarUploader.tsx b/src/components/views/elements/MiniAvatarUploader.tsx index 77c4e402ebc..b2609027d49 100644 --- a/src/components/views/elements/MiniAvatarUploader.tsx +++ b/src/components/views/elements/MiniAvatarUploader.tsx @@ -14,7 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import React, {ReactChildren, ReactNode, useContext, useRef, useState} from 'react'; +import React, {useContext, useRef, useState} from 'react'; import {EventType} from 'matrix-js-sdk/src/@types/event'; import classNames from 'classnames';