remove density mentions
Summary: removing dead code Reviewed By: lblasa Differential Revision: D50495989 fbshipit-source-id: 769f853b50bf6ec48705dbcec03977ec6a5bffa3
This commit is contained in:
committed by
Facebook GitHub Bot
parent
a978c96987
commit
fd774a2d52
@@ -19,7 +19,6 @@ test('filled icons get correct local path', () => {
|
||||
name: 'star',
|
||||
variant: 'filled',
|
||||
size: 12,
|
||||
density: 2,
|
||||
});
|
||||
expect(iconPath).toBe(path.join('icons', 'star-filled_d.png'));
|
||||
});
|
||||
@@ -29,7 +28,6 @@ test('outline icons get correct local path', () => {
|
||||
name: 'star',
|
||||
variant: 'outline',
|
||||
size: 12,
|
||||
density: 2,
|
||||
});
|
||||
expect(iconPath).toBe(path.join('icons', 'star-outline_d.png'));
|
||||
});
|
||||
@@ -39,11 +37,10 @@ test('filled icons get correct URL', async () => {
|
||||
name: 'star',
|
||||
variant: 'filled',
|
||||
size: 12,
|
||||
density: 2,
|
||||
} as const;
|
||||
const iconUrl = getPublicIconUrl(icon);
|
||||
expect(iconUrl).toBe(
|
||||
'https://facebook.com/images/assets_DO_NOT_HARDCODE/facebook_icons/star_filled_12.png', // TODO: support density?
|
||||
'https://facebook.com/images/assets_DO_NOT_HARDCODE/facebook_icons/star_filled_12.png',
|
||||
);
|
||||
const staticPath = getRenderHostInstance().serverConfig.paths.staticPath;
|
||||
const localUrl = getLocalIconUrl(icon, iconUrl, staticPath, false);
|
||||
|
||||
@@ -65,7 +65,7 @@ function tryRegisterIcon(icon: Icon, url: string, staticPath: string) {
|
||||
if (res.status !== 200) {
|
||||
throw new Error(
|
||||
// eslint-disable-next-line prettier/prettier
|
||||
`Trying to use icon '${entryName}' with size ${size} and density ${icon.density}, however the icon doesn't seem to exists at ${url}: ${res.status}`,
|
||||
`Trying to use icon '${entryName}' with size ${size}, however the icon doesn't seem to exists at ${url}: ${res.status}`,
|
||||
);
|
||||
}
|
||||
if (!existing.includes(size)) {
|
||||
|
||||
@@ -20,7 +20,6 @@ type Icon = {
|
||||
name: string;
|
||||
variant: 'outline' | 'filled';
|
||||
size: number;
|
||||
density: number;
|
||||
};
|
||||
|
||||
interface NotificationAction {
|
||||
|
||||
@@ -94,7 +94,7 @@ function ColoredIcon(
|
||||
}
|
||||
ColoredIcon.displayName = 'Glyph:ColoredIcon';
|
||||
|
||||
export default class Glyph extends React.PureComponent<{
|
||||
export default function Glyph(props: {
|
||||
name: string;
|
||||
size?: IconSize;
|
||||
variant?: 'filled' | 'outline';
|
||||
@@ -102,33 +102,22 @@ export default class Glyph extends React.PureComponent<{
|
||||
color?: string;
|
||||
style?: React.CSSProperties;
|
||||
title?: string;
|
||||
}> {
|
||||
render() {
|
||||
const {
|
||||
name,
|
||||
size = 16,
|
||||
variant,
|
||||
color,
|
||||
className,
|
||||
style,
|
||||
title,
|
||||
} = this.props;
|
||||
}) {
|
||||
const {name, size = 16, variant, color, className, style, title} = props;
|
||||
|
||||
return (
|
||||
<ColoredIcon
|
||||
name={name}
|
||||
className={className}
|
||||
color={color}
|
||||
size={size}
|
||||
title={title}
|
||||
src={getIconURL({
|
||||
name,
|
||||
variant: variant ?? 'filled',
|
||||
size,
|
||||
density: typeof window !== 'undefined' ? window.devicePixelRatio : 1,
|
||||
})}
|
||||
style={style}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<ColoredIcon
|
||||
name={name}
|
||||
className={className}
|
||||
color={color}
|
||||
size={size}
|
||||
title={title}
|
||||
src={getIconURL({
|
||||
name,
|
||||
variant: variant ?? 'filled',
|
||||
size,
|
||||
})}
|
||||
style={style}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -11,19 +11,16 @@ import {getRenderHostInstance} from 'flipper-frontend-core';
|
||||
import {IconSize} from '../ui/components/Glyph';
|
||||
|
||||
const AVAILABLE_SIZES: IconSize[] = [8, 10, 12, 16, 18, 20, 24, 28, 32, 48];
|
||||
const DENSITIES = [1, 1.5, 2, 3, 4];
|
||||
|
||||
export type Icon = {
|
||||
name: string;
|
||||
variant: 'outline' | 'filled';
|
||||
size: IconSize;
|
||||
density: number;
|
||||
};
|
||||
|
||||
function normalizeIcon(icon: Icon): Icon {
|
||||
let {size, density} = icon;
|
||||
let requestedSize = size as number;
|
||||
if (!AVAILABLE_SIZES.includes(size as any)) {
|
||||
let requestedSize = icon.size as number;
|
||||
if (!AVAILABLE_SIZES.includes(icon.size as any)) {
|
||||
// find the next largest size
|
||||
const possibleSize = AVAILABLE_SIZES.find((size) => {
|
||||
return size > requestedSize;
|
||||
@@ -37,24 +34,9 @@ function normalizeIcon(icon: Icon): Icon {
|
||||
}
|
||||
}
|
||||
|
||||
if (!DENSITIES.includes(density)) {
|
||||
// find the next largest size
|
||||
const possibleDensity = DENSITIES.find((scale) => {
|
||||
return scale > density;
|
||||
});
|
||||
|
||||
// set to largest size if the real size is larger than what we have
|
||||
if (possibleDensity == null) {
|
||||
density = Math.max(...DENSITIES);
|
||||
} else {
|
||||
density = possibleDensity;
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
...icon,
|
||||
size: requestedSize as IconSize,
|
||||
density,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user