Page MenuHomePhabricator
Files F2897209

D8841.id30161.diff
No OneTemporary
Actions

D8841.id30161.diff
View Options

diff --git a/web/avatars/edit-thread-avatar-menu.react.js b/web/avatars/edit-thread-avatar-menu.react.js
--- a/web/avatars/edit-thread-avatar-menu.react.js
+++ b/web/avatars/edit-thread-avatar-menu.react.js
@@ -7,9 +7,11 @@
import SWMansionIcon from 'lib/components/SWMansionIcon.react.js';
import type { RawThreadInfo, ThreadInfo } from 'lib/types/thread-types.js';
+import { useUploadAvatarMedia } from './avatar-hooks.react.js';
import css from './edit-avatar-menu.css';
import MenuItem from '../components/menu-item.react.js';
import Menu from '../components/menu.react.js';
+import { allowedMimeTypeString } from '../media/file-utils.js';
const editIcon = (
<div className={css.editAvatarBadge}>
@@ -45,10 +47,52 @@
[removeThreadAvatar],
);
- const menuItems = React.useMemo(() => [removeMenuItem], [removeMenuItem]);
+ const imageInputRef = React.useRef();
+ const onImageMenuItemClicked = React.useCallback(
+ () => imageInputRef.current?.click(),
+ [],
+ );
+
+ const uploadAvatarMedia = useUploadAvatarMedia();
+ const onImageSelected = React.useCallback(
+ async event => {
+ const uploadResult = await uploadAvatarMedia(event.target.files[0]);
+ baseSetThreadAvatar(threadInfo.id, {
+ type: 'image',
+ uploadID: uploadResult.id,
+ });
+ },
+ [baseSetThreadAvatar, threadInfo.id, uploadAvatarMedia],
+ );
+
+ const imageMenuItem = React.useMemo(
+ () => (
+ <MenuItem
+ key="image"
+ text="Select image"
+ icon="image-1"
+ onClick={onImageMenuItemClicked}
+ />
+ ),
+ [onImageMenuItemClicked],
+ );
+
+ const menuItems = React.useMemo(() => {
+ const items = [imageMenuItem];
+ if (threadInfo.avatar) {
+ items.push(removeMenuItem);
+ }
+ return items;
+ }, [imageMenuItem, removeMenuItem, threadInfo.avatar]);
return (
<div>
+ <input
+ type="file"
+ onChange={onImageSelected}
+ ref={imageInputRef}
+ accept={allowedMimeTypeString}
+ />
<Menu icon={editIcon}>{menuItems}</Menu>
</div>
);

File Metadata

Mime Type
text/plain
Expires
Sat, Oct 5, 10:23 PM (21 h, 56 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2246668
Default Alt Text
D8841.id30161.diff (2 KB)

Event Timeline