imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use forwardRef in Avatar components to allow use with Compound Tooltips (#12063)

Browse source 
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2023-12-19 14:39:34 +00:00 • committed by GitHub
parent 3acd648ed3
commit 22c511414b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/views/avatars/BaseAvatar.tsx
View file

@ -17,7 +17,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { useCallback, useContext, useEffect, useState } from "react";
import React, { forwardRef, useCallback, useContext, useEffect, useState } from "react";
import classNames from "classnames";
import { ClientEvent } from "matrix-js-sdk/src/matrix";
import { Avatar } from "@vector-im/compound-web";
@ -38,7 +38,6 @@ interface IProps {
type?: React.ComponentProps<typeof Avatar>["type"];
size: string;
onClick?: (ev: ButtonEvent) => void;
inputRef?: React.RefObject<HTMLSpanElement>;
className?: string;
tabIndex?: number;
altText?: string;
@ -95,7 +94,7 @@ const useImageUrl = ({ url, urls }: { url?: string | null; urls?: string[] }): [
return [imageUrl, onError];
};
const BaseAvatar: React.FC<IProps> = (props) => {
const BaseAvatar = forwardRef<HTMLElement, IProps>((props, ref) => {
const {
name,
idName,
@ -104,7 +103,6 @@ const BaseAvatar: React.FC<IProps> = (props) => {
urls,
size = "40px",
onClick,
inputRef,
className,
type = "round",
altText = _t("common|avatar"),
@ -127,7 +125,7 @@ const BaseAvatar: React.FC<IProps> = (props) => {
return (
<Avatar
ref={inputRef}
ref={ref}
src={imageUrl}
id={idName ?? ""}
name={name ?? ""}
@ -143,7 +141,7 @@ const BaseAvatar: React.FC<IProps> = (props) => {
data-testid="avatar-img"
/>
);
};
});
export default BaseAvatar;
export type BaseAvatarType = React.FC<IProps>;