Dec 20, 2025 · Dec 20, 2025
diff --git a/site/src/components/IconField/EmojiPicker.tsx b/site/src/components/IconField/EmojiPicker.tsx
 import data from "@emoji-mart/data/sets/15/apple.json";
 import EmojiMart from "@emoji-mart/react";
 import { type ComponentProps, type FC, useEffect } from "react";
 import { DEPRECATED_ICONS } from "theme/deprecatedIcons";
 import icons from "theme/icons.json";

 const custom = [
 {
 id: "icons",
 name: "Icons",
 emojis: icons.map((icon) => {
 const id = icon.split(".")[0];
 emojis: icons
 .filter((icon) => !DEPRECATED_ICONS.includes(icon))
 .map((icon) => {
 const id = icon.split(".")[0];

 return {
 id,
 name: id,
 keywords: id.split("-"),
 skins: [{ src: `/icon/${icon}` }],
 };
 }),
 return {
 id,
 name: id,
 keywords: id.split("-"),
 skins: [{ src: `/icon/${icon}` }],
 };
 }),
 },
 ];

diff --git a/site/src/pages/IconsPage/IconsPage.tsx b/site/src/pages/IconsPage/IconsPage.tsx
 } from "components/Tooltip/Tooltip";
 import { SearchIcon, XIcon } from "lucide-react";
 import { type FC, type ReactNode, useMemo, useState } from "react";
 import { DEPRECATED_ICONS } from "theme/deprecatedIcons";
 import {
 defaultParametersForBuiltinIcons,
 parseImageParameters,
 import uFuzzy from "ufuzzy";
 import { pageTitle } from "utils/page";

 const iconsWithoutSuffix = icons.map((icon) => icon.split(".")[0]);
 const filteredIcons = icons.filter((icon) => !DEPRECATED_ICONS.includes(icon));
 const iconsWithoutSuffix = filteredIcons.map((icon) => icon.split(".")[0]);
 const fuzzyFinder = new uFuzzy({
 intraMode: 1,
 intraIns: 1,

 const searchedIcons = useMemo(() => {
 if (!searchText) {
 return icons.map((icon) => ({ url: `/icon/${icon}`, description: icon }));
 return filteredIcons.map((icon) => ({
 url: `/icon/${icon}`,
 description: icon,
 }));
 }

 const [map, info, sorted] = fuzzyFinder.search(
 }

 return sorted.map((i) => {
 const iconName =icons[info.idx[i]];
 const iconName =filteredIcons[info.idx[i]];
 const ranges = info.ranges[i];

 const nodes: ReactNode[] = [];
diff --git a/site/src/theme/deprecatedIcons.ts b/site/src/theme/deprecatedIcons.ts
 /**
 * Deprecated icons are icons that are no longer maintained.
 * They are kept here for backward compatibility, however they
 * are not displayed in the emoji picker and are not included in
 * the icon list.
 */

 export const DEPRECATED_ICONS = [
 // we have alternatives in `apple-black.svg`.
 "apple-grey.svg",
 // we have alternatives in `aws.svg`.
 "aws-monochrome.svg",
 // we already serve this in `aws.svg`.
 "aws.png",
 // we already serve this in `azure.svg`.
 "azure.png",
 // we already serve this in `docker.svg`.
 "docker.png",
 // we have alternatives in `docker.svg`.
 "docker-white.svg",
 // we already serve this in `k8s.svg`.
 "k8s.png",
 ] satisfies string[];
Original file line number	Diff line number	Diff line change
		@@ -1,22 +1,25 @@
		import data from "@emoji-mart/data/sets/15/apple.json";
		import EmojiMart from "@emoji-mart/react";
		import { type ComponentProps, type FC, useEffect } from "react";
		import { DEPRECATED_ICONS } from "theme/deprecatedIcons";
		import icons from "theme/icons.json";

		const custom = [
		{
		id: "icons",
		name: "Icons",
		emojis: icons.map((icon) => {
		const id = icon.split(".")[0];
		emojis: icons
		.filter((icon) => !DEPRECATED_ICONS.includes(icon))
		.map((icon) => {
		const id = icon.split(".")[0];

		return {
		id,
		name: id,
		keywords: id.split("-"),
		skins: [{ src: `/icon/${icon}` }],
		};
		}),
		return {
		id,
		name: id,
		keywords: id.split("-"),
		skins: [{ src: `/icon/${icon}` }],
		};
		}),
		},
		];

Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -18,6 +18,7 @@ import {
		} from "components/Tooltip/Tooltip";
		import { SearchIcon, XIcon } from "lucide-react";
		import { type FC, type ReactNode, useMemo, useState } from "react";
		import { DEPRECATED_ICONS } from "theme/deprecatedIcons";
		import {
		defaultParametersForBuiltinIcons,
		parseImageParameters,
Expand All		@@ -26,7 +27,8 @@ import icons from "theme/icons.json";
		import uFuzzy from "ufuzzy";
		import { pageTitle } from "utils/page";

		const iconsWithoutSuffix = icons.map((icon) => icon.split(".")[0]);
		const filteredIcons = icons.filter((icon) => !DEPRECATED_ICONS.includes(icon));
		const iconsWithoutSuffix = filteredIcons.map((icon) => icon.split(".")[0]);
		const fuzzyFinder = new uFuzzy({
		intraMode: 1,
		intraIns: 1,
Expand All		@@ -42,7 +44,10 @@ const IconsPage: FC = () => {

		const searchedIcons = useMemo(() => {
		if (!searchText) {
		return icons.map((icon) => ({ url: `/icon/${icon}`, description: icon }));
		return filteredIcons.map((icon) => ({
		url: `/icon/${icon}`,
		description: icon,
		}));
		}

		const [map, info, sorted] = fuzzyFinder.search(
Expand All		@@ -56,7 +61,7 @@ const IconsPage: FC = () => {
		}

		return sorted.map((i) => {
		const iconName =icons[info.idx[i]];
		const iconName =filteredIcons[info.idx[i]];
		const ranges = info.ranges[i];

		const nodes: ReactNode[] = [];
Expand Down
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,23 @@
		/**
		* Deprecated icons are icons that are no longer maintained.
		* They are kept here for backward compatibility, however they
		* are not displayed in the emoji picker and are not included in
		* the icon list.
		*/

		export const DEPRECATED_ICONS = [
		// we have alternatives in `apple-black.svg`.
		"apple-grey.svg",
		// we have alternatives in `aws.svg`.
		"aws-monochrome.svg",
		// we already serve this in `aws.svg`.
		"aws.png",
		// we already serve this in `azure.svg`.
		"azure.png",
		// we already serve this in `docker.svg`.
		"docker.png",
		// we have alternatives in `docker.svg`.
		"docker-white.svg",
		// we already serve this in `k8s.svg`.
		"k8s.png",
		] satisfies string[];