docs: fix material-icons after SSR

It looks like `Object.entries` had a different order between node and
the browser which caused the icons to not match correctly after SSR.

Closes #1423

Author: mlaursen

packages/documentation/src/components/Demos/MaterialIcons/AllIcons.tsx

@@ -6,9 +6,14 @@ import Code from "components/Code";
 
 import styles from "./AllIcons.module.scss";
 
-const allIcons = Object.entries(MaterialIcons).filter(([name]) =>
-  name.endsWith("SVGIcon")
-);
+const compare = new Intl.Collator("en-US", {
+  caseFirst: "upper",
+  numeric: true,
+}).compare;
+
+const allIcons = Object.entries(MaterialIcons)
+  .filter(([name]) => name.endsWith("SVGIcon"))
+  .sort(([a], [b]) => compare(a, b));
 
 function TooltippedName({ name }: { name: string }): ReactElement {
   const { elementProps, tooltipProps } = useTooltip({