[lib] add farcaster outline icon
ClosedPublic
Actions

Authored by varun on Sep 18 2024, 6:12 AM.

Details

Reviewers

ashoat
tomek

Commits

rCOMM6d96bb6fe2f9: [lib] add farcaster outline icon

Summary

later in stack i use this icon on web in the "edit user avatar" menu

Depends on D13377

Test Plan

icon looks right

Diff Detail

Repository

rCOMM Comm

Lint

Lint Not Applicable

Unit

Tests Not Applicable

Event Timeline

varun created this revision.Sep 18 2024, 6:12 AM

varun added a child revision: D13379: [keyserver] return default avatar to old clients when avatar type is "farcaster".Sep 18 2024, 6:14 AM

varun edited the test plan for this revision. (Show Details)Sep 18 2024, 6:27 AM

varun edited the test plan for this revision. (Show Details)

varun attached a referenced file: F2745631: Edit avatar selection menu.png. (Show Details)

Harbormaster completed remote builds in B31687: Diff 44297.Sep 18 2024, 6:29 AM

varun requested review of this revision.Sep 18 2024, 6:29 AM

used the ethereum-outline icon as reference

lib/shared/comm-icon-config.json
7–9 ↗	(On Diff #44297)	https://github.com/vrypan/farcaster-brand/blob/main/icons/icon-transparent/transparent-white.svg i used the paths from this SVG

ashoat accepted this revision.Sep 18 2024, 7:52 AM

This revision is now accepted and ready to land.Sep 18 2024, 7:52 AM

Closed by commit rCOMM6d96bb6fe2f9: [lib] add farcaster outline icon (authored by varun). · Explain WhySep 25 2024, 7:24 AM

This revision was automatically updated to reflect the committed changes.

varun added a commit: rCOMM6d96bb6fe2f9: [lib] add farcaster outline icon.

Revision Contents
Changeset List

Path

Size

lib/

shared/

comm-icon-config.json

25 lines

web/

comm-icon.react.js

3 lines

Diff 44547

View Options

lib/shared/comm-icon-config.json

	// @flow			// @flow

	import * as React from 'react';			import * as React from 'react';

	import {			import {
	getAvatarForUser,			getAvatarForUser,
	useResolvedAvatar,			useResolvedAvatar,
	} from 'lib/shared/avatar-utils.js';			} from 'lib/shared/avatar-utils.js';
	import type { AvatarSize } from 'lib/types/avatar-types.js';			import type { AvatarSize } from 'lib/types/avatar-types.js';
				import { useCurrentUserFID } from 'lib/utils/farcaster-utils.js';

	import Avatar from './avatar.react.js';			import Avatar from './avatar.react.js';
	import { useSelector } from '../redux/redux-utils.js';			import { useSelector } from '../redux/redux-utils.js';

	type Props = {			type Props = {
	+userID: ?string,			+userID: ?string,
	+size: AvatarSize,			+size: AvatarSize,
	+showSpinner?: boolean,			+showSpinner?: boolean,
	};			};

	function UserAvatar(props: Props): React.Node {			function UserAvatar(props: Props): React.Node {
	const { userID, size, showSpinner } = props;			const { userID, size, showSpinner } = props;

	const userInfo = useSelector(state =>			const currentUserFID = useCurrentUserFID();
	userID ? state.userStore.userInfos[userID] : null,			const userAvatarInfo = useSelector(state => {
	);			if (!userID) {
	const avatarInfo = getAvatarForUser(userInfo);			return null;
				} else if (userID === state.currentUserInfo?.id) {
				return {
				...state.currentUserInfo,
				farcasterID: currentUserFID,
				};
				} else {
				return {
				...state.userStore.userInfos[userID],
				farcasterID: state.auxUserStore.auxUserInfos[userID]?.fid,
				};
				}
				});

				const avatar = getAvatarForUser(userAvatarInfo);

	const resolvedUserAvatar = useResolvedAvatar(avatarInfo, userInfo);			const resolvedUserAvatar = useResolvedAvatar(avatar, userAvatarInfo);

	return (			return (
	<Avatar			<Avatar
	size={size}			size={size}
	avatarInfo={resolvedUserAvatar}			avatarInfo={resolvedUserAvatar}
	showSpinner={showSpinner}			showSpinner={showSpinner}
	/>			/>
	);			);
	}			}

	export default UserAvatar;			export default UserAvatar;