remove density mentions

Summary: removing dead code

Reviewed By: lblasa

Differential Revision: D50495989

fbshipit-source-id: 769f853b50bf6ec48705dbcec03977ec6a5bffa3

desktop/app/src/utils/__tests__/icons.node.tsx

@@ -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);

desktop/app/src/utils/icons.tsx

@@ -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)) {

desktop/flipper-frontend-core/src/RenderHost.tsx

@@ -20,7 +20,6 @@ type Icon = {
   name: string;
   variant: 'outline' | 'filled';
   size: number;
-  density: number;
 };
 
 interface NotificationAction {

desktop/flipper-ui-core/src/ui/components/Glyph.tsx

@@ -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} = props;
-    const {
-      name,
-      size = 16,
-      variant,
-      color,
-      className,
-      style,
-      title,
-    } = this.props;
 
-    return (
+  return (
-      <ColoredIcon
+    <ColoredIcon
-        name={name}
+      name={name}
-        className={className}
+      className={className}
-        color={color}
+      color={color}
-        size={size}
+      size={size}
-        title={title}
+      title={title}
-        src={getIconURL({
+      src={getIconURL({
-          name,
+        name,
-          variant: variant ?? 'filled',
+        variant: variant ?? 'filled',
-          size,
+        size,
-          density: typeof window !== 'undefined' ? window.devicePixelRatio : 1,
+      })}
-        })}
+      style={style}
-        style={style}
+    />
-      />
+  );
-    );
-  }
 }

desktop/flipper-ui-core/src/utils/icons.tsx

@@ -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 = icon.size as number;
-  let requestedSize = size as number;
+  if (!AVAILABLE_SIZES.includes(icon.size as any)) {
-  if (!AVAILABLE_SIZES.includes(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,
   };
 }