PlatformIndicators: make size same as other memberlist icons (#1789)

Co-authored-by: V <vendicated@riseup.net>
This commit is contained in:
Macintosh II 2023-10-21 19:41:56 +03:00 committed by GitHub
parent f659c46031
commit fada76ec81
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -30,13 +30,13 @@ import { User } from "discord-types/general";
const SessionsStore = findStoreLazy("SessionsStore"); const SessionsStore = findStoreLazy("SessionsStore");
function Icon(path: string, opts?: { viewBox?: string; width?: number; height?: number; }) { function Icon(path: string, opts?: { viewBox?: string; width?: number; height?: number; }) {
return ({ color, tooltip }: { color: string; tooltip: string; }) => ( return ({ color, tooltip, small }: { color: string; tooltip: string; small: boolean; }) => (
<Tooltip text={tooltip} > <Tooltip text={tooltip} >
{(tooltipProps: any) => ( {(tooltipProps: any) => (
<svg <svg
{...tooltipProps} {...tooltipProps}
height={opts?.height ?? 20} height={(opts?.height ?? 20) - (small ? 3 : 0)}
width={opts?.width ?? 20} width={(opts?.width ?? 20) - (small ? 3 : 0)}
viewBox={opts?.viewBox ?? "0 0 24 24"} viewBox={opts?.viewBox ?? "0 0 24 24"}
fill={color} fill={color}
> >
@ -57,16 +57,16 @@ type Platform = keyof typeof Icons;
const getStatusColor = findByCodeLazy(".TWITCH", ".STREAMING", ".INVISIBLE"); const getStatusColor = findByCodeLazy(".TWITCH", ".STREAMING", ".INVISIBLE");
const PlatformIcon = ({ platform, status }: { platform: Platform, status: string; }) => { const PlatformIcon = ({ platform, status, small }: { platform: Platform, status: string; small: boolean; }) => {
const tooltip = platform[0].toUpperCase() + platform.slice(1); const tooltip = platform[0].toUpperCase() + platform.slice(1);
const Icon = Icons[platform] ?? Icons.desktop; const Icon = Icons[platform] ?? Icons.desktop;
return <Icon color={`var(--${getStatusColor(status)}`} tooltip={tooltip} />; return <Icon color={`var(--${getStatusColor(status)}`} tooltip={tooltip} small={small} />;
}; };
const getStatus = (id: string): Record<Platform, string> => PresenceStore.getState()?.clientStatuses?.[id]; const getStatus = (id: string): Record<Platform, string> => PresenceStore.getState()?.clientStatuses?.[id];
const PlatformIndicator = ({ user, wantMargin = true, wantTopMargin = false }: { user: User; wantMargin?: boolean; wantTopMargin?: boolean; }) => { const PlatformIndicator = ({ user, wantMargin = true, wantTopMargin = false, small = false }: { user: User; wantMargin?: boolean; wantTopMargin?: boolean; small?: boolean; }) => {
if (!user || user.bot) return null; if (!user || user.bot) return null;
if (user.id === UserStore.getCurrentUser().id) { if (user.id === UserStore.getCurrentUser().id) {
@ -99,6 +99,7 @@ const PlatformIndicator = ({ user, wantMargin = true, wantTopMargin = false }: {
key={platform} key={platform}
platform={platform as Platform} platform={platform as Platform}
status={status} status={status}
small={small}
/> />
)); ));
@ -137,7 +138,7 @@ const indicatorLocations = {
description: "In the member list", description: "In the member list",
onEnable: () => addDecorator("platform-indicator", props => onEnable: () => addDecorator("platform-indicator", props =>
<ErrorBoundary noop> <ErrorBoundary noop>
<PlatformIndicator user={props.user} /> <PlatformIndicator user={props.user} small={true} />
</ErrorBoundary> </ErrorBoundary>
), ),
onDisable: () => removeDecorator("platform-indicator") onDisable: () => removeDecorator("platform-indicator")