PlatformIndicators: make size same as other memberlist icons (#1789)
Co-authored-by: V <vendicated@riseup.net>
This commit is contained in:
parent
f659c46031
commit
fada76ec81
1 changed files with 8 additions and 7 deletions
|
@ -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")
|
||||||
|
|
Loading…
Reference in a new issue